@nylas/web-elements 2.2.3 → 2.2.4

package/dist/components/{p-D-2UWdRa.js → p-BKk2JkBe.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p--4oNPYSm.js';
-import { a as debug, i as isValidImage } from './p-2BdSZySU.js';
-import { d as defineCustomElement$1 } from './p-DcoRpHVy.js';
+import { R as RegisterComponent } from './p-DtDGPXZR.js';
+import { a as debug, i as isValidImage } from './p-CULO8bTo.js';
+import { d as defineCustomElement$1 } from './p-cT1Q8Q-G.js';
 
 const inputImageUrlCss = ":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}.logo-container{display:flex;flex-direction:row;gap:2rem}.logo-container .input-container{flex:1}.logo-container .input-container span.error-message{color:var(--nylas-error)}.logo-container .logo{display:flex;justify-content:center;align-items:center;width:200px;height:100px;border:var(--nylas-base-200) solid 1px;border-radius:var(--nylas-border-radius-2x);overflow:hidden;padding:10px}.logo-container .logo img{max-height:100%;max-width:100%;object-fit:contain;object-position:center}";
 
@@ -175,6 +175,6 @@ function defineCustomElement() {
 }
 
 export { InputImageUrl as I, defineCustomElement as d };
-//# sourceMappingURL=p-D-2UWdRa.js.map
+//# sourceMappingURL=p-BKk2JkBe.js.map
 
-//# sourceMappingURL=p-D-2UWdRa.js.map
+//# sourceMappingURL=p-BKk2JkBe.js.map

package/dist/components/{p-D-2UWdRa.js.map → p-BKk2JkBe.js.map}

@@ -1 +1 @@
-{"file":"p-D-2UWdRa.js","mappings":";;;;;AAAA,MAAM,gBAAgB,GAAG,uqFAAuqF;;;;;;;;;;;;;;;;MCkBnrF,aAAa,GAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;AAN1B,IAAA,WAAA,GAAA;;;;;;;AAQmB,QAAA,IAAa,CAAA,aAAA,GAAW,WAAW;AAKlB,QAAA,IAAQ,CAAA,QAAA,GAAW,EAAE;AAM/C,QAAA,IAAY,CAAA,YAAA,GAAW,EAAE;AAIzB,QAAA,IAAI,CAAA,IAAA,GAAW,iBAAiB;AAU/B,QAAA,IAAA,CAAA,eAAe,GAAW,IAAI,CAAC,QAAQ;AAKvC,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AAwK5B;IAxJC,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,mBAAmB,EAAE,mBAAmB,CAAC;;IAGjD,oBAAoB,GAAA;AAClB,QAAA,KAAK,CAAC,mBAAmB,EAAE,sBAAsB,CAAC;;IAGpD,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,mBAAmB,EAAE,mBAAmB,CAAC;QAE/C,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC;QACzC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,gBAAgB,EAAE,IAAI,CAAC,aAAa,CAAC;;IAG9D,gBAAgB,GAAA;AACd,QAAA,KAAK,CAAC,mBAAmB,EAAE,kBAAkB,CAAC;AAC9C,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ;QACpC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;AACnC,QAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;;IAGzC,mBAAmB,GAAA;AACjB,QAAA,KAAK,CAAC,mBAAmB,EAAE,qBAAqB,CAAC;;IAGnD,kBAAkB,GAAA;AAChB,QAAA,KAAK,CAAC,mBAAmB,EAAE,oBAAoB,CAAC;;IAGlD,mBAAmB,GAAA;AACjB,QAAA,KAAK,CAAC,mBAAmB,EAAE,qBAAqB,CAAC;;IAGnD,kBAAkB,GAAA;AAChB,QAAA,KAAK,CAAC,mBAAmB,EAAE,oBAAoB,CAAC;;AASlD,IAAA,yBAAyB,CAAC,QAAgB,EAAA;AACxC,QAAA,KAAK,CAAC,mBAAmB,EAAE,2BAA2B,EAAE,QAAQ,CAAC;QACjE,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC;;AAI1C,IAAA,0BAA0B,CAAC,QAAgB,EAAA;AACzC,QAAA,KAAK,CAAC,mBAAmB,EAAE,4BAA4B,EAAE,QAAQ,CAAC;AAClE,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,KAAK,GAAG,QAAQ;;;IAKzB,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;AAG/B,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;IAMlD,MAAM,4BAA4B,CAAC,KAAmD,EAAA;QACpF,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,MAAM;AAEpC,QAAA,IAAI,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;AACtB,YAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;;;IAKxB,MAAM,yBAAyB,CAAC,KAAmD,EAAA;QACjF,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,MAAM;AAEpC,QAAA,IAAI,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;AACtB,YAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;;;AAIxB,IAAA,QAAQ,CAAC,KAAa,EAAE,YAAA,GAAwB,IAAI,EAAA;AAClD,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;QAEf,YAAY,CAAC,KAAK;aACf,IAAI,CAAC,MAAK;AACT,YAAA,IAAI,CAAC,eAAe,GAAG,KAAK;AAE5B,YAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC;AAC9B,YAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,IAAI,CAAC;YAC5D,IAAI,YAAY,EAAE;AAChB,gBAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;AAE5E,SAAC;aACA,KAAK,CAAC,MAAK;YACV,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,IAAI,oBAAoB;AACtD,YAAA,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;YAC/E,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU,EAAE;AACpD,gBAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC;;AAEjE,SAAC,CAAC;;IAkBN,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,IAAI,CAAC,IAAI,EACb,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,WAAW,EAAC,qCAAqC,EACjD,YAAY,EAAE,IAAI,CAAC,QAAQ,IAAI,EAAE,EACjC,CAAA,EACD,IAAI,CAAC,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,eAAe,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CAC1D,EAEL,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,KAAK,KAClC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,MAAM,EAAA,EACf,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,GAAG,EAAE,IAAI,CAAC,eAAe,EAAE,GAAG,EAAC,MAAM,GAAG,CACzC,CACP,CACG,CACD;;;;;;;;;;;;;;;;;;;;;;AAvBX,UAAA,CAAA;AAfC,IAAA,iBAAiB,CAAmG;AACnH,QAAA,IAAI,EAAE,mBAAmB;AACzB,QAAA,YAAY,EAAE;AACZ,YAAA,YAAY,EAAE,OACZ,KAAiI,EACjI,8BAA6D,KAC3D;AACF,gBAAA,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC,MAAM;gBAErC,IAAI,YAAY,EAAE;oBAChB,YAAY,CAAC,KAAK,CAAC;;aAEtB;AACF,SAAA;KACF,CAAC;;;;CA0BD,EAAA,aAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/input-image-url/input-image-url.scss?tag=input-image-url&encapsulation=shadow","src/components/design-system/input-image-url/input-image-url.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.logo-container {\n  display: flex;\n  flex-direction: row;\n  gap: 2rem;\n\n  .input-container {\n    flex: 1;\n\n    span.error-message {\n      color: var(--nylas-error);\n    }\n  }\n\n  .logo {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 200px;\n    height: 100px;\n    border: var(--nylas-base-200) solid 1px;\n    border-radius: var(--nylas-border-radius-2x);\n    overflow: hidden;\n    padding: 10px;\n\n    img {\n      max-height: 100%;\n      max-width: 100%;\n      object-fit: contain;\n      object-position: center;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, isValidImage } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../../scheduler-editor/nylas-scheduler-editor/nylas-scheduler-editor';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-image-input` component is a UI component that allows users input an image URL and see a preview of the image.\n *\n * @part iiu__logo-input-textfield - The image input textfield\n */\n@Component({\n  tag: 'input-image-url',\n  styleUrl: 'input-image-url.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class InputImageUrl {\n  @Element() host!: HTMLInputImageUrlElement;\n  private readonly componentType: string = 'image-url';\n\n  /**\n   * Image\n   */\n  @Prop({ attribute: 'image-url' }) imageUrl: string = '';\n  /** */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * Error message to display when the image URL is invalid.\n   */\n  @Prop() errorMessage: string = '';\n  /**\n   * The name of the component\n   */\n  @Prop() name: string = 'input-image-url';\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current image URL state.\n   */\n  @State() currentImageUrl: string = this.imageUrl;\n\n  /**\n   * The error message\n   */\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the image url is changed and the image is invalid.\n   */\n  @Event() readonly nylasFormInputImageUrlInvalid!: EventEmitter<{ value: string; name: string }>;\n  /**\n   * This event is fired when the image URL is changed\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-image-input', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-image-input', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-image-input', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n    this.host.setAttribute('component-type', this.componentType);\n  }\n\n  componentDidLoad() {\n    debug('nylas-image-input', 'componentDidLoad');\n    this.currentImageUrl = this.imageUrl;\n    this.setImage(this.imageUrl, false);\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  componentWillUpdate() {\n    debug('nylas-image-input', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-image-input', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-image-input', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-image-input', 'componentDidRender');\n  }\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-image-input', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('errorMessage')\n  errorMessageChangedHandler(newValue: string) {\n    debug('nylas-image-input', 'errorMessageChangedHandler', newValue);\n    if (this.error) {\n      this.error = newValue;\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @Listen('nylasFormInputChanged')\n  async nylasFormInputChangedHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === this.name) {\n      this.setImage(value);\n    }\n  }\n\n  @Listen('nylasFormInputBlurred')\n  async nylasFormInputBlurHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === this.name) {\n      this.setImage(value);\n    }\n  }\n\n  setImage(value: string, valueChanged: boolean = true) {\n    this.error = '';\n\n    isValidImage(value)\n      .then(() => {\n        this.currentImageUrl = value;\n\n        this.internals.setValidity({});\n        this.internals.setFormValue(this.currentImageUrl, this.name);\n        if (valueChanged) {\n          this.valueChanged.emit({ value: this.currentImageUrl, name: this.name });\n        }\n      })\n      .catch(() => {\n        this.error = this.errorMessage || 'Invalid image URL.';\n        this.nylasFormInputImageUrlInvalid.emit({ value: this.error, name: this.name });\n        if (typeof this.internals.setValidity === 'function') {\n          this.internals.setValidity({ customError: true }, this.error);\n        }\n      });\n  }\n\n  @RegisterComponent<InputImageUrl, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-image-input',\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"logo-container\">\n          <div class=\"input-container\">\n            <input-component\n              name={this.name}\n              id={this.name}\n              type=\"text\"\n              required={false}\n              themeConfig={this.themeConfig}\n              exportparts=\"ic_input: iiu__logo-input-textfield\"\n              defaultValue={this.imageUrl ?? ''}\n            />\n            {this.error && <span class=\"error-message\">{this.error}</span>}\n          </div>\n\n          {this.currentImageUrl && !this.error && (\n            <div class=\"logo\">\n              <img src={this.currentImageUrl} alt=\"Logo\" />\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BKk2JkBe.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/input-image-url/input-image-url.scss?tag=input-image-url&encapsulation=shadow","src/components/design-system/input-image-url/input-image-url.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.logo-container {\n  display: flex;\n  flex-direction: row;\n  gap: 2rem;\n\n  .input-container {\n    flex: 1;\n\n    span.error-message {\n      color: var(--nylas-error);\n    }\n  }\n\n  .logo {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 200px;\n    height: 100px;\n    border: var(--nylas-base-200) solid 1px;\n    border-radius: var(--nylas-border-radius-2x);\n    overflow: hidden;\n    padding: 10px;\n\n    img {\n      max-height: 100%;\n      max-width: 100%;\n      object-fit: contain;\n      object-position: center;\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, isValidImage } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../../scheduler-editor/nylas-scheduler-editor/nylas-scheduler-editor';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-image-input` component is a UI component that allows users input an image URL and see a preview of the image.\n *\n * @part iiu__logo-input-textfield - The image input textfield\n */\n@Component({\n  tag: 'input-image-url',\n  styleUrl: 'input-image-url.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class InputImageUrl {\n  @Element() host!: HTMLInputImageUrlElement;\n  private readonly componentType: string = 'image-url';\n\n  /**\n   * Image\n   */\n  @Prop({ attribute: 'image-url' }) imageUrl: string = '';\n  /** */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * Error message to display when the image URL is invalid.\n   */\n  @Prop() errorMessage: string = '';\n  /**\n   * The name of the component\n   */\n  @Prop() name: string = 'input-image-url';\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current image URL state.\n   */\n  @State() currentImageUrl: string = this.imageUrl;\n\n  /**\n   * The error message\n   */\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the image url is changed and the image is invalid.\n   */\n  @Event() readonly nylasFormInputImageUrlInvalid!: EventEmitter<{ value: string; name: string }>;\n  /**\n   * This event is fired when the image URL is changed\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-image-input', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-image-input', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-image-input', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n    this.host.setAttribute('component-type', this.componentType);\n  }\n\n  componentDidLoad() {\n    debug('nylas-image-input', 'componentDidLoad');\n    this.currentImageUrl = this.imageUrl;\n    this.setImage(this.imageUrl, false);\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  componentWillUpdate() {\n    debug('nylas-image-input', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-image-input', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-image-input', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-image-input', 'componentDidRender');\n  }\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-image-input', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('errorMessage')\n  errorMessageChangedHandler(newValue: string) {\n    debug('nylas-image-input', 'errorMessageChangedHandler', newValue);\n    if (this.error) {\n      this.error = newValue;\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.host.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  @Listen('nylasFormInputChanged')\n  async nylasFormInputChangedHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === this.name) {\n      this.setImage(value);\n    }\n  }\n\n  @Listen('nylasFormInputBlurred')\n  async nylasFormInputBlurHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n\n    if (name === this.name) {\n      this.setImage(value);\n    }\n  }\n\n  setImage(value: string, valueChanged: boolean = true) {\n    this.error = '';\n\n    isValidImage(value)\n      .then(() => {\n        this.currentImageUrl = value;\n\n        this.internals.setValidity({});\n        this.internals.setFormValue(this.currentImageUrl, this.name);\n        if (valueChanged) {\n          this.valueChanged.emit({ value: this.currentImageUrl, name: this.name });\n        }\n      })\n      .catch(() => {\n        this.error = this.errorMessage || 'Invalid image URL.';\n        this.nylasFormInputImageUrlInvalid.emit({ value: this.error, name: this.name });\n        if (typeof this.internals.setValidity === 'function') {\n          this.internals.setValidity({ customError: true }, this.error);\n        }\n      });\n  }\n\n  @RegisterComponent<InputImageUrl, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-image-input',\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"logo-container\">\n          <div class=\"input-container\">\n            <input-component\n              name={this.name}\n              id={this.name}\n              type=\"text\"\n              required={false}\n              themeConfig={this.themeConfig}\n              exportparts=\"ic_input: iiu__logo-input-textfield\"\n              defaultValue={this.imageUrl ?? ''}\n            />\n            {this.error && <span class=\"error-message\">{this.error}</span>}\n          </div>\n\n          {this.currentImageUrl && !this.error && (\n            <div class=\"logo\">\n              <img src={this.currentImageUrl} alt=\"Logo\" />\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-C1-hLcxk.js → p-BQ1_MrWH.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, e as createEvent, h } from './p-Bht9ktsW.js';
-import { s as sanitize } from './p-2BdSZySU.js';
+import { s as sanitize } from './p-CULO8bTo.js';
 
 const nylasDateComponentCss = ":host{display:block;height:auto;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:\"Inter\", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff;width:100%}label{display:flex;color:var(--nylas-base-800, #293056);font-size:14px;font-style:normal;font-weight:400;line-height:150%;flex-direction:column;gap:4px;font-family:var(--nylas-font-family);font-size:16px;color:var(--nylas-base-800)}label.error{color:var(--nylas-error)}label span.required{color:var(--nylas-error);padding:0 0.25rem}label p{margin:0}label .error{color:var(--nylas-error);border-color:var(--nylas-error)}.input_wrapper{display:flex;align-items:center;gap:1rem}input[type=date]{display:flex;height:48px;padding-left:16px;align-items:center;gap:8px;align-self:stretch;border-radius:var(--nylas-border-radius-2x);border:1px solid var(--nylas-base-300);background:var(--nylas-base-0);width:-webkit-fill-available;color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:400;line-height:150%;width:100%;width:-moz-available;width:-webkit-fill-available;font-family:var(--nylas-font-family);padding:0 8px;cursor:pointer}input[type=date]:focus{outline-color:var(--nylas-primary)}input[type=date].error{border-radius:var(--nylas-border-radius-2x);font-weight:600;border-color:var(--nylas-error);border-width:2px}input[type=date].error::placeholder{font-weight:400}input[type=date]::placeholder{color:var(--nylas-base-300)}input[type=date]::-webkit-calendar-picker-indicator{filter:invert(37%) sepia(51%) saturate(6324%) hue-rotate(215deg) brightness(94%) contrast(95%);cursor:pointer}input:read-only{background-color:var(--nylas-base-100);cursor:not-allowed}";
 
@@ -163,6 +163,6 @@ function defineCustomElement() {
 }
 
 export { NylasDateComponent as N, defineCustomElement as d };
-//# sourceMappingURL=p-C1-hLcxk.js.map
+//# sourceMappingURL=p-BQ1_MrWH.js.map
 
-//# sourceMappingURL=p-C1-hLcxk.js.map
+//# sourceMappingURL=p-BQ1_MrWH.js.map

package/dist/components/{p-C1-hLcxk.js.map → p-BQ1_MrWH.js.map}

@@ -1 +1 @@
-{"file":"p-C1-hLcxk.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n@use '../../../common/mixins/inputs' as *;\n\n:host {\n  display: block;\n  height: auto;\n  @include default-css-variables;\n  width: 100%;\n}\n\nlabel {\n  @include input-label;\n  flex-direction: column;\n  gap: 4px;\n  font-family: var(--nylas-font-family);\n  font-size: 16px;\n  color: var(--nylas-base-800);\n\n  p {\n    margin: 0;\n  }\n\n  .error {\n    color: var(--nylas-error);\n    border-color: var(--nylas-error);\n  }\n}\n\n.input_wrapper {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\ninput[type='date'] {\n  @include textfield;\n  width: 100%;\n  width: -moz-available;\n  width: -webkit-fill-available;\n  font-family: var(--nylas-font-family);\n  padding: 0 8px;\n  cursor: pointer;\n  &::-webkit-calendar-picker-indicator {\n    filter: invert(37%) sepia(51%) saturate(6324%) hue-rotate(215deg) brightness(94%) contrast(95%);\n    cursor: pointer;\n  }\n}\n\ninput:read-only {\n  background-color: var(--nylas-base-100);\n  cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\nimport { ThemeConfig } from '@nylas/core';\n\nconst DefaultPlaceholder = {\n  date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n  tag: 'nylas-date-component',\n  styleUrl: 'nylas-date-component.scss',\n  shadow: true,\n})\nexport class NylasDateComponent {\n  /**\n   * The host element\n   */\n  @Element() el!: HTMLElement;\n  /**\n   * The name of the input. This is used to identify the input when submitting a form.\n   */\n  @Prop() name: string = 'input';\n  /**\n   * The default value of the input. This is the value that is displayed when the input is rendered.\n   */\n  @Prop() defaultValue?: string;\n  /**\n   * The label of the input. This is displayed above the input.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * The placeholder of the input. This is displayed when the input is empty.\n   */\n  @Prop() placeholder: string = DefaultPlaceholder['date'];\n  /**\n   * Whether the input is required. If true, the input must have a value when submitting a form.\n   * Default is false. If the input is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * Whether the input is read-only. If true, the input cannot be edited.\n   * Default is false.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * Whether the input should be focused when rendered.\n   * Default is false. If true, the input is focused when rendered.\n   * Use this to set the focus on the first input in a form.\n   */\n  @Prop() autoFocus: boolean = false;\n  /**\n   * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n   * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n   */\n  @Prop() pattern?: RegExp;\n  /**\n   * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n   * Default is 255.\n   */\n  @Prop() maxLength: number = 255;\n  /**\n   * The error message to display when the value does not match the pattern.\n   * Default is 'Invalid <field> format.' where <field> is the input label.\n   */\n  @Prop() patternError: string = '';\n\n  /**\n   * This error message is displayed when the input value is empty and the input is required.\n   */\n  @Prop() requiredError: string = '';\n\n  /**\n   * Error message to display when the date input is required and empty.\n   */\n  @Prop() errorMessage: string = '';\n\n  /**\n   * The minimum date that can be selected.\n   */\n  @Prop() minDate?: string;\n\n  /**\n   * The flag to indicate if the date input is in error state.\n   */\n  @Prop() hasError: boolean = false;\n\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The input value state.\n   */\n  @State() value!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n\n  /**\n   * State to track the validity of the date input.\n   */\n  @State() isDateValid: boolean = true;\n\n  /**\n   * This event is fired when the input value is changed.\n   * The scheduling form listens for this event to validate the input value and submit the form.\n   * If using outside of the scheduling form, listen for this event to validate the input value\n   * and handle the input value change.\n   */\n  @Event() nylasFormInputChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label: string;\n    type: string;\n    error: string;\n  }>;\n\n  @Event() nylasFormInputFocused!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  @Event() nylasFormInputBlurred!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  // Lifecycle methods\n  @Watch('defaultValue')\n  handleDefaultValueChange(newValue: string) {\n    this.value = sanitize(newValue);\n    if (this.value) {\n      this.validatePattern(this.value, true);\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.el.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.value = sanitize(this.defaultValue || '');\n    if (this.value) {\n      this.validatePattern(this.value, true);\n    }\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  // Event listeners\n  /**\n   * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n   */\n  @Listen('bookingFormSubmitted', { target: 'document' })\n  handleBookingFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  @Listen('formSubmitted', { target: 'document' })\n  async handleFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  // Methods\n  handleInput(e: Event) {\n    this.error = '';\n    const target = e.target as HTMLInputElement;\n    this.value = sanitize(target.value);\n    this.isDateValid = target.validity.valid;\n    this.nylasFormInputChanged.emit({\n      value: this.value,\n      name: this.name,\n      label: this.label,\n      error: this.error,\n      type: 'date',\n    });\n  }\n\n  handleBlur() {\n    this.nylasFormInputBlurred.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  handleFocus() {\n    this.nylasFormInputFocused.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  validatePattern(value: string, onLoad: boolean = false) {\n    // Reset error\n    this.error = '';\n    if (!onLoad && ((this.required && !this.isDateValid) || (this.minDate && new Date(this.minDate) > new Date(value)))) {\n      this.error = this.errorMessage || 'Please enter a valid date';\n      this.nylasFormInputChanged.emit({\n        value: this.value,\n        name: this.name,\n        label: this.label,\n        error: this.error,\n        type: 'date',\n      });\n      return;\n    }\n    // Check if the field is required and value is empty\n    if (this.required && !value) {\n      this.error = this.requiredError || 'This field is required.';\n      return;\n    }\n    // Check if value matches pattern\n    if (!this.pattern || (!value && !this.required)) return;\n\n    if (this.pattern.test(value)) {\n      this.error = '';\n    } else {\n      this.error = this.patternError || 'Invalid format.';\n    }\n  }\n\n  render() {\n    return (\n      <label part=\"ic__label\" class={{ error: !!this.error || this.hasError }}>\n        {this.label && (\n          <p>\n            <span class=\"label\">{this.label}</span>\n            {this.required && <span class=\"required\">*</span>}\n          </p>\n        )}\n        <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n          <input\n            type=\"date\"\n            name={this.name}\n            part=\"ic__date\"\n            title={this.readOnly ? 'read-only field' : undefined}\n            readOnly={this.readOnly}\n            autoFocus={this.autoFocus}\n            value={this.value}\n            min={this.minDate}\n            maxLength={this.maxLength}\n            placeholder={this.placeholder}\n            class={{ error: !!this.error || this.hasError }}\n            onInput={e => this.handleInput(e)}\n            onFocus={() => this.handleFocus()}\n            onBlur={() => this.handleBlur()}\n          />\n          <slot name=\"additional-input\"></slot>\n        </div>\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </label>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BQ1_MrWH.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/design-system/nylas-date-component/nylas-date-component.scss?tag=nylas-date-component&encapsulation=shadow","src/components/design-system/nylas-date-component/nylas-date-component.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n@use '../../../common/mixins/inputs' as *;\n\n:host {\n  display: block;\n  height: auto;\n  @include default-css-variables;\n  width: 100%;\n}\n\nlabel {\n  @include input-label;\n  flex-direction: column;\n  gap: 4px;\n  font-family: var(--nylas-font-family);\n  font-size: 16px;\n  color: var(--nylas-base-800);\n\n  p {\n    margin: 0;\n  }\n\n  .error {\n    color: var(--nylas-error);\n    border-color: var(--nylas-error);\n  }\n}\n\n.input_wrapper {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\ninput[type='date'] {\n  @include textfield;\n  width: 100%;\n  width: -moz-available;\n  width: -webkit-fill-available;\n  font-family: var(--nylas-font-family);\n  padding: 0 8px;\n  cursor: pointer;\n  &::-webkit-calendar-picker-indicator {\n    filter: invert(37%) sepia(51%) saturate(6324%) hue-rotate(215deg) brightness(94%) contrast(95%);\n    cursor: pointer;\n  }\n}\n\ninput:read-only {\n  background-color: var(--nylas-base-100);\n  cursor: not-allowed;\n}\n","import { Component, h, Prop, State, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\nimport { sanitize } from '@/utils/utils';\nimport { ThemeConfig } from '@nylas/core';\n\nconst DefaultPlaceholder = {\n  date: 'YYYY-MM-DD',\n};\n\n/**\n * The `nylas-date-component` component is a UI component that allows users to input text, email, or phone number values.\n * This component is used in the scheduling form to input text, email and phone number type inputs.\n */\n\n@Component({\n  tag: 'nylas-date-component',\n  styleUrl: 'nylas-date-component.scss',\n  shadow: true,\n})\nexport class NylasDateComponent {\n  /**\n   * The host element\n   */\n  @Element() el!: HTMLElement;\n  /**\n   * The name of the input. This is used to identify the input when submitting a form.\n   */\n  @Prop() name: string = 'input';\n  /**\n   * The default value of the input. This is the value that is displayed when the input is rendered.\n   */\n  @Prop() defaultValue?: string;\n  /**\n   * The label of the input. This is displayed above the input.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * The placeholder of the input. This is displayed when the input is empty.\n   */\n  @Prop() placeholder: string = DefaultPlaceholder['date'];\n  /**\n   * Whether the input is required. If true, the input must have a value when submitting a form.\n   * Default is false. If the input is required and the value is empty, an error message is displayed.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * Whether the input is read-only. If true, the input cannot be edited.\n   * Default is false.\n   */\n  @Prop() readOnly: boolean = false;\n  /**\n   * Whether the input should be focused when rendered.\n   * Default is false. If true, the input is focused when rendered.\n   * Use this to set the focus on the first input in a form.\n   */\n  @Prop() autoFocus: boolean = false;\n  /**\n   * The pattern to validate the input value. If the value does not match the pattern, an error message is displayed.\n   * Default is null. If the pattern is not set, the pattern is determined by the input type for 'email' and 'phone_number'.\n   */\n  @Prop() pattern?: RegExp;\n  /**\n   * The maximum length of the input value. If the value is longer than the maximum length, an error message is displayed.\n   * Default is 255.\n   */\n  @Prop() maxLength: number = 255;\n  /**\n   * The error message to display when the value does not match the pattern.\n   * Default is 'Invalid <field> format.' where <field> is the input label.\n   */\n  @Prop() patternError: string = '';\n\n  /**\n   * This error message is displayed when the input value is empty and the input is required.\n   */\n  @Prop() requiredError: string = '';\n\n  /**\n   * Error message to display when the date input is required and empty.\n   */\n  @Prop() errorMessage: string = '';\n\n  /**\n   * The minimum date that can be selected.\n   */\n  @Prop() minDate?: string;\n\n  /**\n   * The flag to indicate if the date input is in error state.\n   */\n  @Prop() hasError: boolean = false;\n\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The input value state.\n   */\n  @State() value!: string;\n  /**\n   * The error message state.\n   */\n  @State() error: string = '';\n\n  /**\n   * State to track the validity of the date input.\n   */\n  @State() isDateValid: boolean = true;\n\n  /**\n   * This event is fired when the input value is changed.\n   * The scheduling form listens for this event to validate the input value and submit the form.\n   * If using outside of the scheduling form, listen for this event to validate the input value\n   * and handle the input value change.\n   */\n  @Event() nylasFormInputChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    label: string;\n    type: string;\n    error: string;\n  }>;\n\n  @Event() nylasFormInputFocused!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  @Event() nylasFormInputBlurred!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  // Lifecycle methods\n  @Watch('defaultValue')\n  handleDefaultValueChange(newValue: string) {\n    this.value = sanitize(newValue);\n    if (this.value) {\n      this.validatePattern(this.value, true);\n    }\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  applyThemeConfig(themeConfig?: ThemeConfig) {\n    if (themeConfig) {\n      for (const [key, value] of Object.entries(themeConfig)) {\n        this.el.style.setProperty(`${key}`, value);\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.value = sanitize(this.defaultValue || '');\n    if (this.value) {\n      this.validatePattern(this.value, true);\n    }\n    this.applyThemeConfig(this.themeConfig);\n  }\n\n  // Event listeners\n  /**\n   * Listen for the bookingFormSubmitted event to validate the input value when the form is submitted.\n   */\n  @Listen('bookingFormSubmitted', { target: 'document' })\n  handleBookingFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  @Listen('formSubmitted', { target: 'document' })\n  async handleFormSubmitted(event: CustomEvent) {\n    this.validatePattern(this.value);\n    if (this.error) {\n      event.preventDefault();\n    }\n  }\n\n  // Methods\n  handleInput(e: Event) {\n    this.error = '';\n    const target = e.target as HTMLInputElement;\n    this.value = sanitize(target.value);\n    this.isDateValid = target.validity.valid;\n    this.nylasFormInputChanged.emit({\n      value: this.value,\n      name: this.name,\n      label: this.label,\n      error: this.error,\n      type: 'date',\n    });\n  }\n\n  handleBlur() {\n    this.nylasFormInputBlurred.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  handleFocus() {\n    this.nylasFormInputFocused.emit({\n      value: this.value,\n      name: this.name,\n    });\n  }\n\n  validatePattern(value: string, onLoad: boolean = false) {\n    // Reset error\n    this.error = '';\n    if (!onLoad && ((this.required && !this.isDateValid) || (this.minDate && new Date(this.minDate) > new Date(value)))) {\n      this.error = this.errorMessage || 'Please enter a valid date';\n      this.nylasFormInputChanged.emit({\n        value: this.value,\n        name: this.name,\n        label: this.label,\n        error: this.error,\n        type: 'date',\n      });\n      return;\n    }\n    // Check if the field is required and value is empty\n    if (this.required && !value) {\n      this.error = this.requiredError || 'This field is required.';\n      return;\n    }\n    // Check if value matches pattern\n    if (!this.pattern || (!value && !this.required)) return;\n\n    if (this.pattern.test(value)) {\n      this.error = '';\n    } else {\n      this.error = this.patternError || 'Invalid format.';\n    }\n  }\n\n  render() {\n    return (\n      <label part=\"ic__label\" class={{ error: !!this.error || this.hasError }}>\n        {this.label && (\n          <p>\n            <span class=\"label\">{this.label}</span>\n            {this.required && <span class=\"required\">*</span>}\n          </p>\n        )}\n        <div part=\"ic__input_wrapper\" class=\"input_wrapper\">\n          <input\n            type=\"date\"\n            name={this.name}\n            part=\"ic__date\"\n            title={this.readOnly ? 'read-only field' : undefined}\n            readOnly={this.readOnly}\n            autoFocus={this.autoFocus}\n            value={this.value}\n            min={this.minDate}\n            maxLength={this.maxLength}\n            placeholder={this.placeholder}\n            class={{ error: !!this.error || this.hasError }}\n            onInput={e => this.handleInput(e)}\n            onFocus={() => this.handleFocus()}\n            onBlur={() => this.handleBlur()}\n          />\n          <slot name=\"additional-input\"></slot>\n        </div>\n        {this.error && <span class=\"error help-text\">{this.error}</span>}\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-D_R3qufs.js → p-BQIvfRRF.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, e as createEvent, h } from './p-Bht9ktsW.js';
-import { s as sanitize } from './p-2BdSZySU.js';
+import { s as sanitize } from './p-CULO8bTo.js';
 import { d as defineCustomElement$2 } from './p-7S1M5IE9.js';
 import { d as defineCustomElement$1 } from './p-C6fgjGAL.js';
 
@@ -129,6 +129,6 @@ function defineCustomElement() {
 }
 
 export { TextareaComponent as T, defineCustomElement as d };
-//# sourceMappingURL=p-D_R3qufs.js.map
+//# sourceMappingURL=p-BQIvfRRF.js.map
 
-//# sourceMappingURL=p-D_R3qufs.js.map
+//# sourceMappingURL=p-BQIvfRRF.js.map

package/dist/components/{p-D_R3qufs.js.map → p-BQIvfRRF.js.map}

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

package/dist/components/{p-mN6J_IWv.js → p-BV55-Kie.js}

@@ -1,11 +1,11 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p--4oNPYSm.js';
-import { a as debug, b as instance } from './p-2BdSZySU.js';
+import { R as RegisterComponent } from './p-DtDGPXZR.js';
+import { a as debug, b as instance } from './p-CULO8bTo.js';
 import { d as defineCustomElement$5 } from './p-PeEnpB8P.js';
 import { d as defineCustomElement$4 } from './p-CEoh34h7.js';
 import { d as defineCustomElement$3 } from './p-ClTk9Ttz.js';
 import { d as defineCustomElement$2 } from './p-D7lRYhTx.js';
-import { d as defineCustomElement$1 } from './p-Ci-3P4oO.js';
+import { d as defineCustomElement$1 } from './p-Ce1kG2WA.js';
 
 const nylasReminderTimeCss = ":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}.nylas-reminder-time{display:flex;flex-direction:column;gap:4px}.nylas-reminder-time label{display:flex;align-items:center;color:var(--nylas-base-800);font-size:16px;font-style:normal;font-weight:400;line-height:150%;}.nylas-reminder-time label span.required{color:var(--nylas-error, #cc4841)}.nylas-reminder-time label span.label-icon{margin-left:4px}.nylas-reminder-time label span.label-icon tooltip-component{display:flex}.nylas-reminder-time__wrapper{display:flex;align-items:center;justify-content:flex-end;gap:0.5rem}.nylas-reminder-time__wrapper input{padding:12px 16px;border-width:1;border-radius:8px;border:1px solid var(--nylas-base-200);font-family:var(--nylas-font-family);font-size:16px;line-height:24px;width:48px}.nylas-reminder-time__wrapper input-dropdown{width:80px}.nylas-reminder-time__wrapper input-dropdown::part(id_dropdown-input){border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x);padding:14px 16px}.nylas-reminder-time__wrapper input-dropdown::part(id_dropdown-content){width:100%;min-width:unset;height:160px}.nylas-reminder-time__wrapper select-dropdown{width:120px}@media screen and (max-width: 768px){.nylas-reminder-time__wrapper select-dropdown{width:100%}}.nylas-reminder-time__wrapper select-dropdown::part(sd_dropdown-button){border:1px solid var(--nylas-base-200)}";
 
@@ -233,6 +233,6 @@ function defineCustomElement() {
 }
 
 export { NylasReminderTime as N, defineCustomElement as d };
-//# sourceMappingURL=p-mN6J_IWv.js.map
+//# sourceMappingURL=p-BV55-Kie.js.map
 
-//# sourceMappingURL=p-mN6J_IWv.js.map
+//# sourceMappingURL=p-BV55-Kie.js.map

package/dist/components/{p-mN6J_IWv.js.map → p-BV55-Kie.js.map}

@@ -1 +1 @@
-{"file":"p-mN6J_IWv.js","mappings":";;;;;;;;;AAAA,MAAM,oBAAoB,GAAG,u+GAAu+G;;;;;;;;;;;;;;;;MC0Bv/G,iBAAiB,GAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAN9B,IAAA,WAAA,GAAA;;;;;;AAcU,QAAA,IAAI,CAAA,IAAA,GAAW,eAAe;AA0B7B,QAAA,IAAU,CAAA,UAAA,GAAY,KAAK;AAkMrC;AArLC,IAAA,yBAAyB,CAAC,QAAgB,EAAA;AACxC,QAAA,KAAK,CAAC,qBAAqB,EAAE,2BAA2B,EAAE,QAAQ,CAAC;QACnE,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC;;IAI1C,sCAAsC,CAAC,QAAgB,EAAE,SAAiB,EAAA;AACxE,QAAA,KAAK,CAAC,qBAAqB,EAAE,wCAAwC,EAAE,QAAQ,CAAC;AAChF,QAAA,IAAI,CAAC,gCAAgC,CAAC,QAAQ,CAAC;AAC/C,QAAA,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC;;IAI3F,8BAA8B,CAAC,MAAqB,EAAE,MAAqB,EAAA;QACzE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAAC,QAAO,CAAC,cAAc,CAAC,MAAM,CAAC;;IAIhC,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;IAW/B,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,qBAAqB,EAAE,mBAAmB,CAAC;;IAGnD,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,qBAAqB,EAAE,mBAAmB,CAAC;QACjD,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC;;IAG3C,gBAAgB,GAAA;AACd,QAAA,KAAK,CAAC,qBAAqB,EAAE,kBAAkB,CAAC;QAChD,IAAI,CAAC,gCAAgC,CAAC,IAAI,CAAC,wBAAwB,IAAI,EAAE,CAAC;;IAG5E,oBAAoB,GAAA;AAClB,QAAA,KAAK,CAAC,qBAAqB,EAAE,sBAAsB,CAAC;;AAGtD,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;AAMlD,IAAA,kCAAkC,CAAC,KAAuC,EAAA;AACxE,QAAA,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,MAAM;AAChC,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;QACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,OAAO,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;AACtE,QAAA,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC;AAIvF,QAAA,IAAI,CAAC,gCAAgC,CAAC,OAAO,GAAG,CAAC,CAAC;QAClD,UAAU,CAAC,MAAK;AACd,YAAA,IAAI,CAAC,gCAAgC,CAAC,OAAO,CAAC;SAC/C,EAAE,EAAE,CAAC;;AAIR,IAAA,wBAAwB,CACtB,KAGE,EAAA;QAEF,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM;AACvC,QAAA,IAAI,YAAY;QAChB,MAAM,aAAa,GAAG,EAAE;AACxB,QAAA,MAAM,YAAY,GAAG,aAAa,GAAG,EAAE;AACvC,QAAA,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC;AACtC,QAAA,MAAM,cAAc,GAAG,YAAY,GAAG,EAAE;AAExC,QAAA,IAAI,MAAM,KAAK,QAAQ,EAAE;YACvB,YAAY,GAAG,MAAM;;AAChB,aAAA,IAAI,MAAM,KAAK,MAAM,EAAE;AAC5B,YAAA,YAAY,GAAG,MAAM,GAAG,aAAa;;AAChC,aAAA,IAAI,MAAM,KAAK,KAAK,EAAE;AAC3B,YAAA,YAAY,GAAG,MAAM,GAAG,YAAY;;AAC/B,aAAA,IAAI,MAAM,KAAK,MAAM,EAAE;AAC5B,YAAA,YAAY,GAAG,MAAM,GAAG,aAAa;;AAChC,aAAA,IAAI,MAAM,KAAK,OAAO,EAAE;AAC7B,YAAA,YAAY,GAAG,MAAM,GAAG,cAAc;;aACjC;YACL,YAAY,GAAG,CAAC;;QAElB,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,CAAC,KAAK,CAAC;AACxC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;AAChE,QAAA,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC;;AAGtF,IAAA,gCAAgC,CAAC,OAAe,EAAA;QACtD,MAAM,aAAa,GAAG,EAAE;AACxB,QAAA,MAAM,YAAY,GAAG,aAAa,GAAG,EAAE;AACvC,QAAA,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC;AACtC,QAAA,MAAM,cAAc,GAAG,YAAY,GAAG,EAAE;QACxC,IAAI,MAAM,EAAE,MAAM;AAElB,QAAA,IAAI,OAAO,KAAK,CAAC,EAAE;YACjB,MAAM,GAAG,CAAC;YACV,MAAM,GAAG,QAAQ;;aACZ,IAAI,OAAO,IAAI,cAAc,IAAI,OAAO,GAAG,cAAc,KAAK,CAAC,EAAE;YACtE,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAC;YAC7C,MAAM,GAAG,OAAO;;aACX,IAAI,OAAO,IAAI,aAAa,IAAI,OAAO,GAAG,aAAa,KAAK,CAAC,EAAE;YACpE,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,aAAa,CAAC;YAC5C,MAAM,GAAG,MAAM;;aACV,IAAI,OAAO,IAAI,YAAY,IAAI,OAAO,GAAG,YAAY,KAAK,CAAC,EAAE;YAClE,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC;YAC3C,MAAM,GAAG,KAAK;;aACT,IAAI,OAAO,IAAI,aAAa,IAAI,OAAO,GAAG,aAAa,KAAK,CAAC,EAAE;YACpE,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,aAAa,CAAC;YAC5C,MAAM,GAAG,MAAM;;aACV;YACL,MAAM,GAAG,OAAO;YAChB,MAAM,GAAG,QAAQ;;AAGnB,QAAA,IAAI,CAAC,cAAc,GAAG,MAAM;AAC5B,QAAA,IAAI,CAAC,cAAc,GAAG,MAAM;;AAQ9B,IAAA,IAAI,oBAAoB,GAAA;QACtB,OAAO,IAAI,CAAC,SAAS,KAAK,SAAS,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,YAAY,KAAK,UAAU,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU;;IAY9I,MAAM,GAAA;AACJ,QAAA,MAAM,sBAAsB,GAAG,OAAO,IAAI,CAAC,cAAc,IAAI,QAAQ,IAAI,OAAO,IAAI,CAAC,cAAc,IAAI,QAAQ;AAC/G,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qBAAqB,EAAC,IAAI,EAAC,KAAK,EAAA,EACzC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACtC,sBAAsB,KACrB,CACE,CAAA,sBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,uBAAuB,EAC1B,IAAI,EAAC,2BAA2B,EAChC,QAAQ,EAAE,IAAI,CAAC,UAAU,EACzB,WAAW,EAAE;AACX,gBAAA,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAEA,QAAO,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,EAAE;AAC5E,gBAAA,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAEA,QAAO,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE;AACxE,gBAAA,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAEA,QAAO,CAAC,CAAC,CAAC,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE;AACrE,aAAA,EACD,WAAW,EAAC,oUAAoU,EAChV,qBAAqB,EAAE,IAAI,CAAC,cAAc,EAC1C,qBAAqB,EAAE,IAAI,CAAC,cAAc,EAC1C,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,CAAA,CACH,CACG,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;AAxBX,UAAA,CAAA;AATC,IAAA,iBAAiB,CAAuG;AACvH,QAAA,IAAI,EAAE,qBAAqB;QAC3B,YAAY,EAAE,IAAI,GAAG,CAAC;YACpB,CAAC,kCAAkC,EAAE,kBAAkB,CAAC;YACxD,CAAC,6BAA6B,EAAE,aAAa,CAAC;SAC/C,CAAC;AACF,QAAA,YAAY,EAAE,EAAE;AAChB,QAAA,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;CA2BD,EAAA,iBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-reminder-time/nylas-reminder-time.scss?tag=nylas-reminder-time&encapsulation=shadow","src/components/scheduler-editor/nylas-reminder-time/nylas-reminder-time.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n}\n\n.nylas-reminder-time {\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.required {\n      color: var(--nylas-error, #cc4841);\n    }\n\n    span.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n  }\n}\n\n.nylas-reminder-time__wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.5rem;\n\n  input {\n    padding: 12px 16px;\n    border-width: 1;\n    border-radius: 8px;\n    border: 1px solid var(--nylas-base-200);\n    font-family: var(--nylas-font-family);\n    font-size: 16px;\n    line-height: 24px;\n    width: 48px;\n  }\n\n  input-dropdown {\n    width: 80px;\n  }\n\n  input-dropdown::part(id_dropdown-input) {\n    border: 1px solid var(--nylas-base-200);\n    border-radius: var(--nylas-border-radius-2x);\n    padding: 14px 16px;\n  }\n\n  input-dropdown::part(id_dropdown-content) {\n    width: 100%;\n    min-width: unset;\n    height: 160px;\n  }\n\n  select-dropdown {\n    width: 120px;\n\n    @media #{$mobile} {\n      width: 100%;\n    }\n  }\n\n  select-dropdown::part(sd_dropdown-button) {\n    border: 1px solid var(--nylas-base-200);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, Listen, State, h, Element, Prop, Watch, Event, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-reminder-time` component is a form input for the reminder time before an event.\n *\n * @part nrt - The event reminder container\n * @part nrt__number-dropdown - The number dropdown container\n * @part nrt__number-dropdown-button - The number dropdown button\n * @part nrt__number-dropdown-content - The number dropdown content\n * @part nrt__period-dropdown - The period dropdown container\n * @part nrt__period-dropdown-button - The period dropdown button\n * @part nrt__period-dropdown-content - The period dropdown content\n * @part nrt__time-period-selector - The time period selector\n */\n@Component({\n  tag: 'nylas-reminder-time',\n  styleUrl: 'nylas-reminder-time.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasReminderTime {\n  /**\n   * The host element <nylas-reminder-time>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The name of the reminder time. Default is 'reminder time'.\n   */\n  @Prop() name: string = 'reminder-time';\n  /**\n   * The event reminder time in minutes as set in the configuration.\n   */\n  @Prop() eventReminderTimeMinutes?: number;\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * The selected number for the reminder time.\n   */\n  @State() selectedNumber;\n\n  /**\n   * The selected period for the reminder time.\n   */\n  @State() selectedPeriod;\n\n  /**\n   * The error state to show the error message when the minutes selected is invalid (not divisible by 5).\n   */\n  @State() errorState: boolean = false;\n\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-reminder-time', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('eventReminderTimeMinutes')\n  eventReminderTimeMinutesChangedHandler(newValue: number, _oldValue: number) {\n    debug('nylas-reminder-time', 'eventReminderTimeMinutesChangedHandler', newValue);\n    this.updateNumberAndPeriodFromMinutes(newValue);\n    this.isInternalsAvailable && this.internals.setFormValue(newValue?.toString(), this.name);\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 event reminder time changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-reminder-time', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-reminder-time', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-reminder-time', 'componentDidLoad');\n    this.updateNumberAndPeriodFromMinutes(this.eventReminderTimeMinutes || 30);\n  }\n\n  disconnectedCallback() {\n    debug('nylas-reminder-time', 'disconnectedCallback');\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('nylasSuggestReminderMinutes', { target: 'document' })\n  nylasSuggestReminderMinutesHandler(event: CustomEvent<{ minutes: number }>) {\n    const { minutes } = event.detail;\n    this.errorState = false;\n    this.valueChanged.emit({ value: minutes.toString(), name: this.name });\n    this.isInternalsAvailable && this.internals.setFormValue(minutes.toString(), this.name);\n    // Workaround: Force the time-period-selector to the next rounded multiple of 5\n    // instead of the current rounded multiple. This handles cases where the user re-enters\n    // the same number, ensuring the selector correctly updates to the intended rounded value.\n    this.updateNumberAndPeriodFromMinutes(minutes + 7);\n    setTimeout(() => {\n      this.updateNumberAndPeriodFromMinutes(minutes);\n    }, 10);\n  }\n\n  @Listen('timePeriodChanged')\n  timePeriodChangedHandler(\n    event: CustomEvent<{\n      number: number;\n      period: string;\n    }>,\n  ) {\n    const { number, period } = event.detail;\n    let totalMinutes;\n    const minutesInHour = 60;\n    const minutesInDay = minutesInHour * 24;\n    const minutesInWeek = minutesInDay * 7;\n    const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n\n    if (period === 'minute') {\n      totalMinutes = number;\n    } else if (period === 'hour') {\n      totalMinutes = number * minutesInHour;\n    } else if (period === 'day') {\n      totalMinutes = number * minutesInDay;\n    } else if (period === 'week') {\n      totalMinutes = number * minutesInWeek;\n    } else if (period === 'month') {\n      totalMinutes = number * minutesInMonth;\n    } else {\n      totalMinutes = 0;\n    }\n    this.errorState = totalMinutes % 5 !== 0;\n    this.valueChanged.emit({ value: totalMinutes, name: this.name });\n    this.isInternalsAvailable && this.internals.setFormValue(totalMinutes.toString(), this.name);\n  }\n\n  private updateNumberAndPeriodFromMinutes(minutes: number): void {\n    const minutesInHour = 60;\n    const minutesInDay = minutesInHour * 24;\n    const minutesInWeek = minutesInDay * 7;\n    const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n    let number, period;\n\n    if (minutes === 0) {\n      number = 0;\n      period = 'minute';\n    } else if (minutes >= minutesInMonth && minutes % minutesInMonth === 0) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek && minutes % minutesInWeek === 0) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay && minutes % minutesInDay === 0) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour && minutes % minutesInHour === 0) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  /**\n   * The unit tests in stencil does not support the internals API.\n   * This method checks if the internals API is available.\n   * @returns boolean\n   */\n  get isInternalsAvailable() {\n    return this.internals !== undefined && typeof this.internals.setFormValue === 'function' && typeof this.internals.setValidity === 'function';\n  }\n\n  @RegisterComponent<NylasReminderTime, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-reminder-time',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    const showTimePeriodSelector = typeof this.selectedNumber == 'number' && typeof this.selectedPeriod == 'string';\n    return (\n      <Host>\n        <div class=\"nylas-reminder-time\" part=\"nrt\">\n          <div class=\"nylas-reminder-time__wrapper\">\n            {showTimePeriodSelector && (\n              <time-period-selector\n                id=\"limit-future-bookings\"\n                part=\"nrt__time-period-selector\"\n                hasError={this.errorState}\n                timePeriods={[\n                  { value: 'minute', label: i18next.t('timeDuration', { context: 'minute' }) },\n                  { value: 'hour', label: i18next.t('timeDuration', { context: 'hour' }) },\n                  { value: 'day', label: i18next.t('timePeriod', { context: 'day' }) },\n                ]}\n                exportparts=\"tps__number-dropdown: nrt__number-dropdown, tps__number-dropdown-button: nrt__number-dropdown-button, tps__number-dropdown-content: nrt__number-dropdown-content, tps__period-dropdown: nrt__period-dropdown, tps__period-dropdown-button: nrt__period-dropdown-button, tps__period-dropdown-content: nrt__period-dropdown-content\"\n                defaultSelectedNumber={this.selectedNumber}\n                defaultSelectedPeriod={this.selectedPeriod}\n                themeConfig={this.themeConfig}\n              />\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BV55-Kie.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-reminder-time/nylas-reminder-time.scss?tag=nylas-reminder-time&encapsulation=shadow","src/components/scheduler-editor/nylas-reminder-time/nylas-reminder-time.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n}\n\n.nylas-reminder-time {\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.required {\n      color: var(--nylas-error, #cc4841);\n    }\n\n    span.label-icon {\n      margin-left: 4px;\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n  }\n}\n\n.nylas-reminder-time__wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.5rem;\n\n  input {\n    padding: 12px 16px;\n    border-width: 1;\n    border-radius: 8px;\n    border: 1px solid var(--nylas-base-200);\n    font-family: var(--nylas-font-family);\n    font-size: 16px;\n    line-height: 24px;\n    width: 48px;\n  }\n\n  input-dropdown {\n    width: 80px;\n  }\n\n  input-dropdown::part(id_dropdown-input) {\n    border: 1px solid var(--nylas-base-200);\n    border-radius: var(--nylas-border-radius-2x);\n    padding: 14px 16px;\n  }\n\n  input-dropdown::part(id_dropdown-content) {\n    width: 100%;\n    min-width: unset;\n    height: 160px;\n  }\n\n  select-dropdown {\n    width: 120px;\n\n    @media #{$mobile} {\n      width: 100%;\n    }\n  }\n\n  select-dropdown::part(sd_dropdown-button) {\n    border: 1px solid var(--nylas-base-200);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, Listen, State, h, Element, Prop, Watch, Event, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n/**\n * The `nylas-reminder-time` component is a form input for the reminder time before an event.\n *\n * @part nrt - The event reminder container\n * @part nrt__number-dropdown - The number dropdown container\n * @part nrt__number-dropdown-button - The number dropdown button\n * @part nrt__number-dropdown-content - The number dropdown content\n * @part nrt__period-dropdown - The period dropdown container\n * @part nrt__period-dropdown-button - The period dropdown button\n * @part nrt__period-dropdown-content - The period dropdown content\n * @part nrt__time-period-selector - The time period selector\n */\n@Component({\n  tag: 'nylas-reminder-time',\n  styleUrl: 'nylas-reminder-time.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasReminderTime {\n  /**\n   * The host element <nylas-reminder-time>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The name of the reminder time. Default is 'reminder time'.\n   */\n  @Prop() name: string = 'reminder-time';\n  /**\n   * The event reminder time in minutes as set in the configuration.\n   */\n  @Prop() eventReminderTimeMinutes?: number;\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n  /**\n   * The selected number for the reminder time.\n   */\n  @State() selectedNumber;\n\n  /**\n   * The selected period for the reminder time.\n   */\n  @State() selectedPeriod;\n\n  /**\n   * The error state to show the error message when the minutes selected is invalid (not divisible by 5).\n   */\n  @State() errorState: boolean = false;\n\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-reminder-time', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('eventReminderTimeMinutes')\n  eventReminderTimeMinutesChangedHandler(newValue: number, _oldValue: number) {\n    debug('nylas-reminder-time', 'eventReminderTimeMinutesChangedHandler', newValue);\n    this.updateNumberAndPeriodFromMinutes(newValue);\n    this.isInternalsAvailable && this.internals.setFormValue(newValue?.toString(), this.name);\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 event reminder time changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-reminder-time', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-reminder-time', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-reminder-time', 'componentDidLoad');\n    this.updateNumberAndPeriodFromMinutes(this.eventReminderTimeMinutes || 30);\n  }\n\n  disconnectedCallback() {\n    debug('nylas-reminder-time', 'disconnectedCallback');\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('nylasSuggestReminderMinutes', { target: 'document' })\n  nylasSuggestReminderMinutesHandler(event: CustomEvent<{ minutes: number }>) {\n    const { minutes } = event.detail;\n    this.errorState = false;\n    this.valueChanged.emit({ value: minutes.toString(), name: this.name });\n    this.isInternalsAvailable && this.internals.setFormValue(minutes.toString(), this.name);\n    // Workaround: Force the time-period-selector to the next rounded multiple of 5\n    // instead of the current rounded multiple. This handles cases where the user re-enters\n    // the same number, ensuring the selector correctly updates to the intended rounded value.\n    this.updateNumberAndPeriodFromMinutes(minutes + 7);\n    setTimeout(() => {\n      this.updateNumberAndPeriodFromMinutes(minutes);\n    }, 10);\n  }\n\n  @Listen('timePeriodChanged')\n  timePeriodChangedHandler(\n    event: CustomEvent<{\n      number: number;\n      period: string;\n    }>,\n  ) {\n    const { number, period } = event.detail;\n    let totalMinutes;\n    const minutesInHour = 60;\n    const minutesInDay = minutesInHour * 24;\n    const minutesInWeek = minutesInDay * 7;\n    const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n\n    if (period === 'minute') {\n      totalMinutes = number;\n    } else if (period === 'hour') {\n      totalMinutes = number * minutesInHour;\n    } else if (period === 'day') {\n      totalMinutes = number * minutesInDay;\n    } else if (period === 'week') {\n      totalMinutes = number * minutesInWeek;\n    } else if (period === 'month') {\n      totalMinutes = number * minutesInMonth;\n    } else {\n      totalMinutes = 0;\n    }\n    this.errorState = totalMinutes % 5 !== 0;\n    this.valueChanged.emit({ value: totalMinutes, name: this.name });\n    this.isInternalsAvailable && this.internals.setFormValue(totalMinutes.toString(), this.name);\n  }\n\n  private updateNumberAndPeriodFromMinutes(minutes: number): void {\n    const minutesInHour = 60;\n    const minutesInDay = minutesInHour * 24;\n    const minutesInWeek = minutesInDay * 7;\n    const minutesInMonth = minutesInDay * 30; // Assuming 30 days in a month for simplification\n    let number, period;\n\n    if (minutes === 0) {\n      number = 0;\n      period = 'minute';\n    } else if (minutes >= minutesInMonth && minutes % minutesInMonth === 0) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek && minutes % minutesInWeek === 0) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay && minutes % minutesInDay === 0) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour && minutes % minutesInHour === 0) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  /**\n   * The unit tests in stencil does not support the internals API.\n   * This method checks if the internals API is available.\n   * @returns boolean\n   */\n  get isInternalsAvailable() {\n    return this.internals !== undefined && typeof this.internals.setFormValue === 'function' && typeof this.internals.setValidity === 'function';\n  }\n\n  @RegisterComponent<NylasReminderTime, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-reminder-time',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    const showTimePeriodSelector = typeof this.selectedNumber == 'number' && typeof this.selectedPeriod == 'string';\n    return (\n      <Host>\n        <div class=\"nylas-reminder-time\" part=\"nrt\">\n          <div class=\"nylas-reminder-time__wrapper\">\n            {showTimePeriodSelector && (\n              <time-period-selector\n                id=\"limit-future-bookings\"\n                part=\"nrt__time-period-selector\"\n                hasError={this.errorState}\n                timePeriods={[\n                  { value: 'minute', label: i18next.t('timeDuration', { context: 'minute' }) },\n                  { value: 'hour', label: i18next.t('timeDuration', { context: 'hour' }) },\n                  { value: 'day', label: i18next.t('timePeriod', { context: 'day' }) },\n                ]}\n                exportparts=\"tps__number-dropdown: nrt__number-dropdown, tps__number-dropdown-button: nrt__number-dropdown-button, tps__number-dropdown-content: nrt__number-dropdown-content, tps__period-dropdown: nrt__period-dropdown, tps__period-dropdown-button: nrt__period-dropdown-button, tps__period-dropdown-content: nrt__period-dropdown-content\"\n                defaultSelectedNumber={this.selectedNumber}\n                defaultSelectedPeriod={this.selectedPeriod}\n                themeConfig={this.themeConfig}\n              />\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CKuq2LL7.js → p-B_imcHCC.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p--4oNPYSm.js';
-import { b as instance, a as debug, c as checkForMissingSlots } from './p-2BdSZySU.js';
-import { d as defineCustomElement$1 } from './p-CFOX1cL3.js';
+import { R as RegisterComponent } from './p-DtDGPXZR.js';
+import { b as instance, a as debug, c as checkForMissingSlots } from './p-CULO8bTo.js';
+import { d as defineCustomElement$1 } from './p-DjX1ll1V.js';
 
 const nylasCustomBookingFlowCss = ":host{display:block;margin:1rem;--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-custom-booking-flow__title{color:var(--nylas-base-900);font-size:16px;font-style:normal;font-weight:600;line-height:20px;margin:0;text-align:left}.nylas-custom-booking-flow__subtitle{color:var(--nylas-base-600);font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0.25rem 0px 0px;text-align:left}.nylas-custom-booking-flow__content{padding:1rem;display:flex;flex-direction:column;gap:1rem;background-color:var(--nylas-base-25)}.nylas-custom-booking-flow__block{display:flex;justify-content:space-between;gap:0.5rem}";
 
@@ -107,6 +107,6 @@ function defineCustomElement() {
 }
 
 export { NylasCustomBookingFlow as N, defineCustomElement as d };
-//# sourceMappingURL=p-CKuq2LL7.js.map
+//# sourceMappingURL=p-B_imcHCC.js.map
 
-//# sourceMappingURL=p-CKuq2LL7.js.map
+//# sourceMappingURL=p-B_imcHCC.js.map

package/dist/components/{p-CKuq2LL7.js.map → p-B_imcHCC.js.map}

@@ -1 +1 @@
-{"file":"p-CKuq2LL7.js","mappings":";;;;;AAAA,MAAM,yBAAyB,GAAG,4tFAA4tF;;;;;;;;;;;;;;;;MC8BjvF,sBAAsB,GAAAA,kBAAA,CAAA,MAAA,sBAAA,SAAAC,CAAA,CAAA;;;;;;;IAoBjC,8BAA8B,CAAC,MAAqB,EAAE,MAAqB,EAAA;QACzE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAAC,QAAO,CAAC,cAAc,CAAC,MAAM,CAAC;;IAIhC,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;IAI/B,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC;;IAEzD,oBAAoB,GAAA;AAClB,QAAA,KAAK,CAAC,2BAA2B,EAAE,sBAAsB,CAAC;;IAG5D,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC;;IAGzD,gBAAgB,GAAA;AACd,QAAA,KAAK,CAAC,2BAA2B,EAAE,kBAAkB,CAAC;QACtD,oBAAoB,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC;;AAG3C,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;IAchD,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAA,EAClB,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,8BAA8B,EAAA,EACzD,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,gBAAgB,IACnFA,QAAO,CAAC,CAAC,CAAC,oCAAoC,CAAC,CAC7C,EACL,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,oCAAoC,EAAC,IAAI,EAAC,kBAAkB,EAAA,EACpF,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,CAAQ,CACvB,CACU,CACb;;;;;;;;;;;;;;;;AAXX,UAAA,CAAA;AATC,IAAA,iBAAiB,CAA4G;AAC5H,QAAA,IAAI,EAAE,2BAA2B;AACjC,QAAA,YAAY,EAAE,EAAE;QAChB,YAAY,EAAE,IAAI,GAAG,CAAC;YACpB,CAAC,kCAAkC,EAAE,kBAAkB,CAAC;YACxD,CAAC,6BAA6B,EAAE,aAAa,CAAC;SAC/C,CAAC;AACF,QAAA,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;CAcD,EAAA,sBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.scss?tag=nylas-custom-booking-flow&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  margin: 1rem;\n  @include default-css-variables;\n}\n\n.nylas-custom-booking-flow__title {\n  color: var(--nylas-base-900);\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  /* 125% */\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-custom-booking-flow__subtitle {\n  color: var(--nylas-base-600);\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  /* 142.857% */\n  margin: 0.25rem 0px 0px;\n  text-align: left;\n}\n\n.nylas-custom-booking-flow__content {\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  background-color: var(--nylas-base-25);\n}\n\n.nylas-custom-booking-flow__block {\n  display: flex;\n  justify-content: space-between;\n  gap: 0.5rem;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { checkForMissingSlots, debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Host, Prop, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-custom-booking-flow` component is an input form for booking type (automatically or manually accept bookings) and confirmation redirect URL (default or custom).\n * This component is a container for the `nylas-booking-confirmation-type`, `nylas-booking-confirmation-redirect` components.\n *\n * ```html\n * <nylas-custom-booking-flow>\n *   <div slot=\"inputs\">\n *     <nylas-booking-confirmation-type></nylas-booking-confirmation-type>\n *     <nylas-booking-confirmation-redirect></nylas-booking-confirmation-redirect>\n *   </div>\n * </nylas-custom-booking-flow>\n * ```\n *\n * @slot inputs - The custom booking flow inputs. This includes the booking type, confirmation redirect type, and custom redirect URL components.\n */\n@Component({\n  tag: 'nylas-custom-booking-flow',\n  styleUrl: 'nylas-custom-booking-flow.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCustomBookingFlow {\n  @Element() el!: HTMLElement;\n\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  @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  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-custom-booking-flow', 'connectedCallback');\n  }\n  disconnectedCallback() {\n    debug('nylas-custom-booking-flow', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-custom-booking-flow', 'componentWillLoad');\n  }\n\n  componentDidLoad() {\n    debug('nylas-custom-booking-flow', 'componentDidLoad');\n    checkForMissingSlots(['inputs'], this.el);\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  @RegisterComponent<NylasCustomBookingFlow, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-custom-booking-flow',\n    eventToProps: {},\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"ncbflow\">\n        <nylas-form-card exportparts=\"nfc__header: ncbflow__header\">\n          <h1 slot=\"header-title\" class=\"nylas-custom-booking-flow__title\" part=\"ncbflow__title\">\n            {i18next.t('nylasCustomBookingFlow.headerTitle')}\n          </h1>\n          <div slot=\"content\" class=\"nylas-custom-booking-flow__content\" part=\"ncbflow__content\">\n            <slot name=\"inputs\"></slot>\n          </div>\n        </nylas-form-card>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-B_imcHCC.js","mappings":";;;;;AAAA,MAAM,yBAAyB,GAAG,4tFAA4tF;;;;;;;;;;;;;;;;MC8BjvF,sBAAsB,GAAAA,kBAAA,CAAA,MAAA,sBAAA,SAAAC,CAAA,CAAA;;;;;;;IAoBjC,8BAA8B,CAAC,MAAqB,EAAE,MAAqB,EAAA;QACzE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAAC,QAAO,CAAC,cAAc,CAAC,MAAM,CAAC;;IAIhC,yBAAyB,CAAC,MAAmB,EAAE,MAAmB,EAAA;QAChE,IAAI,MAAM,KAAK,MAAM;YAAE;AACvB,QAAA,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;;IAI/B,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC;;IAEzD,oBAAoB,GAAA;AAClB,QAAA,KAAK,CAAC,2BAA2B,EAAE,sBAAsB,CAAC;;IAG5D,iBAAiB,GAAA;AACf,QAAA,KAAK,CAAC,2BAA2B,EAAE,mBAAmB,CAAC;;IAGzD,gBAAgB,GAAA;AACd,QAAA,KAAK,CAAC,2BAA2B,EAAE,kBAAkB,CAAC;QACtD,oBAAoB,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC;;AAG3C,IAAA,gBAAgB,CAAC,WAAyB,EAAA;QACxC,IAAI,WAAW,EAAE;AACf,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE;AACtD,gBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA,EAAG,GAAG,CAAA,CAAE,EAAE,KAAK,CAAC;;;;IAchD,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAA,EAClB,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAW,EAAC,8BAA8B,EAAA,EACzD,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,gBAAgB,IACnFA,QAAO,CAAC,CAAC,CAAC,oCAAoC,CAAC,CAC7C,EACL,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,oCAAoC,EAAC,IAAI,EAAC,kBAAkB,EAAA,EACpF,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,CAAQ,CACvB,CACU,CACb;;;;;;;;;;;;;;;;AAXX,UAAA,CAAA;AATC,IAAA,iBAAiB,CAA4G;AAC5H,QAAA,IAAI,EAAE,2BAA2B;AACjC,QAAA,YAAY,EAAE,EAAE;QAChB,YAAY,EAAE,IAAI,GAAG,CAAC;YACpB,CAAC,kCAAkC,EAAE,kBAAkB,CAAC;YACxD,CAAC,6BAA6B,EAAE,aAAa,CAAC;SAC/C,CAAC;AACF,QAAA,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;CAcD,EAAA,sBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.scss?tag=nylas-custom-booking-flow&encapsulation=shadow","src/components/scheduler-editor/nylas-custom-booking-flow/nylas-custom-booking-flow.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  margin: 1rem;\n  @include default-css-variables;\n}\n\n.nylas-custom-booking-flow__title {\n  color: var(--nylas-base-900);\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  /* 125% */\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-custom-booking-flow__subtitle {\n  color: var(--nylas-base-600);\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  /* 142.857% */\n  margin: 0.25rem 0px 0px;\n  text-align: left;\n}\n\n.nylas-custom-booking-flow__content {\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  background-color: var(--nylas-base-25);\n}\n\n.nylas-custom-booking-flow__block {\n  display: flex;\n  justify-content: space-between;\n  gap: 0.5rem;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { checkForMissingSlots, debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Host, Prop, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\nimport { ThemeConfig } from '@nylas/core';\n\n/**\n * The `nylas-custom-booking-flow` component is an input form for booking type (automatically or manually accept bookings) and confirmation redirect URL (default or custom).\n * This component is a container for the `nylas-booking-confirmation-type`, `nylas-booking-confirmation-redirect` components.\n *\n * ```html\n * <nylas-custom-booking-flow>\n *   <div slot=\"inputs\">\n *     <nylas-booking-confirmation-type></nylas-booking-confirmation-type>\n *     <nylas-booking-confirmation-redirect></nylas-booking-confirmation-redirect>\n *   </div>\n * </nylas-custom-booking-flow>\n * ```\n *\n * @slot inputs - The custom booking flow inputs. This includes the booking type, confirmation redirect type, and custom redirect URL components.\n */\n@Component({\n  tag: 'nylas-custom-booking-flow',\n  styleUrl: 'nylas-custom-booking-flow.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCustomBookingFlow {\n  @Element() el!: HTMLElement;\n\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  @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  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-custom-booking-flow', 'connectedCallback');\n  }\n  disconnectedCallback() {\n    debug('nylas-custom-booking-flow', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-custom-booking-flow', 'componentWillLoad');\n  }\n\n  componentDidLoad() {\n    debug('nylas-custom-booking-flow', 'componentDidLoad');\n    checkForMissingSlots(['inputs'], this.el);\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  @RegisterComponent<NylasCustomBookingFlow, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-custom-booking-flow',\n    eventToProps: {},\n    stateToProps: new Map([\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"ncbflow\">\n        <nylas-form-card exportparts=\"nfc__header: ncbflow__header\">\n          <h1 slot=\"header-title\" class=\"nylas-custom-booking-flow__title\" part=\"ncbflow__title\">\n            {i18next.t('nylasCustomBookingFlow.headerTitle')}\n          </h1>\n          <div slot=\"content\" class=\"nylas-custom-booking-flow__content\" part=\"ncbflow__content\">\n            <slot name=\"inputs\"></slot>\n          </div>\n        </nylas-form-card>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CuHnb1-_.js → p-Bb0z-pD8.js}

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p--4oNPYSm.js';
-import { a as debug, b as instance, p as isValidUrl } from './p-2BdSZySU.js';
+import { R as RegisterComponent } from './p-DtDGPXZR.js';
+import { a as debug, b as instance, p as isValidUrl } from './p-CULO8bTo.js';
 import { d as defineCustomElement$6 } from './p-PeEnpB8P.js';
 import { d as defineCustomElement$5 } from './p-7S1M5IE9.js';
-import { d as defineCustomElement$4 } from './p-DcoRpHVy.js';
+import { d as defineCustomElement$4 } from './p-cT1Q8Q-G.js';
 import { d as defineCustomElement$3 } from './p-ClTk9Ttz.js';
 import { d as defineCustomElement$2 } from './p-D7lRYhTx.js';
 import { d as defineCustomElement$1 } from './p-C6fgjGAL.js';
@@ -253,6 +253,6 @@ function defineCustomElement() {
 }
 
 export { NylasBookingConfirmationRedirect as N, defineCustomElement as d };
-//# sourceMappingURL=p-CuHnb1-_.js.map
+//# sourceMappingURL=p-Bb0z-pD8.js.map
 
-//# sourceMappingURL=p-CuHnb1-_.js.map
+//# sourceMappingURL=p-Bb0z-pD8.js.map

package/dist/components/{p-CuHnb1-_.js.map → p-Bb0z-pD8.js.map}

@@ -1 +1 @@
-{"file":"p-CuHnb1-_.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-booking-confirmation-redirect/nylas-booking-confirmation-redirect.scss?tag=nylas-booking-confirmation-redirect&encapsulation=shadow","src/components/scheduler-editor/nylas-booking-confirmation-redirect/nylas-booking-confirmation-redirect.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-booking-confirmation-redirect {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n\n  .nylas-booking-confirmation-redirect__dropdown {\n    span.label {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      margin-bottom: 4px;\n      color: var(--nylas-base-800);\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    select-dropdown::part(sd_dropdown) {\n      width: 100%;\n    }\n\n    select-dropdown::part(sd_dropdown-button) {\n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n      padding: 1rem;\n    }\n\n    select-dropdown::part(sd_dropdown-content) {\n      width: 100%;\n      max-width: unset;\n    }\n\n    select-dropdown::part(sd_dropdown-button-selected-label) {\n      max-width: calc(100% - 2rem);\n      font-family: var(--nylas-font-family);\n      font-size: 16px;\n      line-height: 24px;\n    }\n\n    input-component::part(ic__input_wrapper) {\n      margin-top: 1rem;\n    }\n\n    span.error-message {\n      color: var(--nylas-error);\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { isValidUrl } from '@/utils/utils';\nimport { Configuration, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\n\n/**\n * The `nylas-booking-confirmation-redirect` component is a UI component that allows the user to choose a custom redirect URL after a booking is confirmed.\n * @part nbcr - The booking redirect container\n * @part nbcr__header - The header of the booking redirect\n * @part nbcr__dropdown - The dropdown container\n * @part nbcr__dropdown-button - The dropdown button\n * @part nbcr__dropdown-content - The dropdown content\n * @part nbcr__input-textfield - The input field content\n */\n@Component({\n  tag: 'nylas-booking-confirmation-redirect',\n  styleUrl: 'nylas-booking-confirmation-redirect.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasBookingConfirmationRedirect {\n  @Element() host!: HTMLNylasBookingConfirmationRedirectElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The name of the confirmation redirect link.\n   */\n  @Prop() name: string = 'confirmation-redirect';\n  /**\n   * @standalone\n   * The custom redirect URL.\n   */\n  @Prop() redirectUrl: string = '';\n  /**\n   * @standalone\n   * The custom redirect URL error message\n   */\n  @Prop() redirectUrlErrorMessage: string = '';\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current redirect URL.\n   */\n  @State() currentRedirectUrl: string = '';\n  /**\n   * The state for whether a custom URL can be added.\n   */\n  @State() acceptUrl!: boolean;\n\n  @State() componentLoaded: boolean = false;\n\n  @State() requiredError: string = '';\n  @State() patternError: string = '';\n\n  /**\n   * This event is fired when the current redirect URL changes and is valid.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-booking-confirmation-redirect', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-booking-confirmation-redirect', 'selectedConfigurationChangedHandler', newValue);\n    if (newValue?.scheduler?.confirmation_redirect_url) {\n      this.currentRedirectUrl = newValue?.scheduler?.confirmation_redirect_url;\n      this.acceptUrl = newValue?.scheduler?.confirmation_redirect_url !== '';\n    }\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n    this.requiredError = i18next.t('fieldRequired', { field: i18next.t('redirectUrl') });\n    this.patternError = i18next.t('invalidInputFormat', { field: i18next.t('redirectUrl') });\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-booking-confirmation-redirect', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-booking-confirmation-redirect', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.currentRedirectUrl = this.redirectUrl;\n      this.acceptUrl = this.redirectUrl !== '';\n    }\n    this.componentLoaded = true;\n    if (typeof this.internals.setFormValue === 'function') {\n      this.internals.setFormValue(this.currentRedirectUrl.toString(), this.name);\n    }\n  }\n\n  componentWillUpdate() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidRender');\n  }\n\n  @Listen('nylasFormDropdownChanged')\n  nylasFormDropdownChangedHandler(event: CustomEvent<{ value: string; name: string }>) {\n    debug('nylas-booking-confirmation-redirect', 'nylasFormDropdownChangedHandler', event.detail);\n\n    const { name, value } = event.detail;\n\n    if (name === 'confirmation-redirect-dropdown') {\n      if (value === 'custom') {\n        this.acceptUrl = true;\n      } else {\n        this.acceptUrl = false;\n\n        // Submit empty string to clear redirect URL\n        this.internals.setFormValue('', this.name);\n        this.valueChanged.emit({ name: this.name, value: '' });\n      }\n    }\n  }\n\n  @Listen('nylasFormInputBlurred')\n  nylasFormInputBlurHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n    this.currentRedirectUrl = value;\n\n    if (this.acceptUrl && name === 'confirmation-redirect') {\n      this.redirectUrlErrorMessage = '';\n\n      if (!isValidUrl(this.currentRedirectUrl)) {\n        this.internals.setValidity({ customError: true }, i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage'));\n        this.redirectUrlErrorMessage = i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage');\n        return;\n      }\n      this.internals.setValidity({});\n\n      // Pass as handler so that if event.defaultPrevented by parent app, this will be skipped.\n      const valueChanged = (event: CustomEvent<{ value: string; name: string }>) => {\n        const { value } = event.detail;\n        this.internals.setFormValue(value.toString(), this.name);\n      };\n      this.valueChanged.emit({ ...event.detail, valueChanged });\n    }\n  }\n\n  @Listen('formSubmitted', { target: 'document' })\n  formSubmittedHandler(_event: CustomEvent) {\n    if (this.acceptUrl && !isValidUrl(this.currentRedirectUrl)) {\n      this.internals.setValidity({ customError: true }, i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage'));\n      this.redirectUrlErrorMessage = i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage');\n    } else {\n      this.internals.setValidity({});\n    }\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<NylasBookingConfirmationRedirect, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-booking-confirmation-redirect',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const redirectOptions = [\n      {\n        label: i18next.t('nylasBookingConfirmationRedirect.redirectOption', { context: 'default' }),\n        value: 'default',\n      },\n      {\n        label: i18next.t('nylasBookingConfirmationRedirect.redirectOption', { context: 'custom' }),\n        value: 'custom',\n      },\n    ];\n\n    return (\n      <Host>\n        <div class=\"nylas-booking-confirmation-redirect\" part=\"nbcr\">\n          {redirectOptions.length > 0 && (\n            <div class=\"nylas-booking-confirmation-redirect__dropdown\">\n              <span class=\"label\">\n                {i18next.t('nylasBookingConfirmationRedirect.dropdownLabel')}\n                <tooltip-component>\n                  <info-icon slot=\"tooltip-icon\" />\n                  <span slot=\"tooltip-content\">{i18next.t('nylasBookingConfirmationRedirect.tooltip.desc')}</span>\n                </tooltip-component>\n              </span>\n              {this.componentLoaded && (\n                <select-dropdown\n                  name=\"confirmation-redirect-dropdown\"\n                  options={redirectOptions}\n                  withSearch={false}\n                  defaultSelectedOption={redirectOptions.find(option => option.value === (this.acceptUrl ? 'custom' : 'default'))}\n                  exportparts=\"sd_dropdown: nbcr__dropdown, sd_dropdown-button: nbcr__dropdown-button, sd_dropdown-content: nbcr__dropdown-content\"\n                  themeConfig={this.themeConfig}\n                />\n              )}\n              {this.acceptUrl && (\n                <div>\n                  <input-component\n                    name=\"confirmation-redirect\"\n                    id=\"confirmation-redirect\"\n                    type=\"text\"\n                    placeholder={i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlPlaceholder')}\n                    required={false}\n                    part=\"ic__input_wrapper: nbcr__input-textfield\"\n                    requiredError={this.requiredError}\n                    patternError={this.patternError}\n                    defaultValue={this.currentRedirectUrl}\n                    themeConfig={this.themeConfig}\n                  />\n                  {this.redirectUrlErrorMessage && <span class=\"error-message\">{this.redirectUrlErrorMessage}</span>}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-Bb0z-pD8.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","i18next"],"sources":["src/components/scheduler-editor/nylas-booking-confirmation-redirect/nylas-booking-confirmation-redirect.scss?tag=nylas-booking-confirmation-redirect&encapsulation=shadow","src/components/scheduler-editor/nylas-booking-confirmation-redirect/nylas-booking-confirmation-redirect.tsx"],"sourcesContent":["@use '../../../common/styles/variables' as *;\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-booking-confirmation-redirect {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n\n  .nylas-booking-confirmation-redirect__dropdown {\n    span.label {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      margin-bottom: 4px;\n      color: var(--nylas-base-800);\n\n      tooltip-component {\n        display: flex;\n      }\n    }\n\n    select-dropdown::part(sd_dropdown) {\n      width: 100%;\n    }\n\n    select-dropdown::part(sd_dropdown-button) {\n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      border: 1px solid var(--nylas-base-200);\n      border-radius: var(--nylas-border-radius-2x);\n      padding: 1rem;\n    }\n\n    select-dropdown::part(sd_dropdown-content) {\n      width: 100%;\n      max-width: unset;\n    }\n\n    select-dropdown::part(sd_dropdown-button-selected-label) {\n      max-width: calc(100% - 2rem);\n      font-family: var(--nylas-font-family);\n      font-size: 16px;\n      line-height: 24px;\n    }\n\n    input-component::part(ic__input_wrapper) {\n      margin-top: 1rem;\n    }\n\n    span.error-message {\n      color: var(--nylas-error);\n    }\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { isValidUrl } from '@/utils/utils';\nimport { Configuration, ThemeConfig } from '@nylas/core';\nimport i18next from '@/utils/i18n';\nimport { LANGUAGE_CODE } from '@/common/constants';\n\n/**\n * The `nylas-booking-confirmation-redirect` component is a UI component that allows the user to choose a custom redirect URL after a booking is confirmed.\n * @part nbcr - The booking redirect container\n * @part nbcr__header - The header of the booking redirect\n * @part nbcr__dropdown - The dropdown container\n * @part nbcr__dropdown-button - The dropdown button\n * @part nbcr__dropdown-content - The dropdown content\n * @part nbcr__input-textfield - The input field content\n */\n@Component({\n  tag: 'nylas-booking-confirmation-redirect',\n  styleUrl: 'nylas-booking-confirmation-redirect.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasBookingConfirmationRedirect {\n  @Element() host!: HTMLNylasBookingConfirmationRedirectElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The name of the confirmation redirect link.\n   */\n  @Prop() name: string = 'confirmation-redirect';\n  /**\n   * @standalone\n   * The custom redirect URL.\n   */\n  @Prop() redirectUrl: string = '';\n  /**\n   * @standalone\n   * The custom redirect URL error message\n   */\n  @Prop() redirectUrlErrorMessage: string = '';\n  /**\n   * The selected language.\n   */\n  @Prop() selectedLanguage?: LANGUAGE_CODE;\n  /**\n   * @standalone\n   * The theme configuration.\n   */\n  @Prop({ attribute: 'theme-config' }) readonly themeConfig?: ThemeConfig;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * The current redirect URL.\n   */\n  @State() currentRedirectUrl: string = '';\n  /**\n   * The state for whether a custom URL can be added.\n   */\n  @State() acceptUrl!: boolean;\n\n  @State() componentLoaded: boolean = false;\n\n  @State() requiredError: string = '';\n  @State() patternError: string = '';\n\n  /**\n   * This event is fired when the current redirect URL changes and is valid.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-booking-confirmation-redirect', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-booking-confirmation-redirect', 'selectedConfigurationChangedHandler', newValue);\n    if (newValue?.scheduler?.confirmation_redirect_url) {\n      this.currentRedirectUrl = newValue?.scheduler?.confirmation_redirect_url;\n      this.acceptUrl = newValue?.scheduler?.confirmation_redirect_url !== '';\n    }\n  }\n\n  @Watch('selectedLanguage')\n  selectedLanguageChangedHandler(newVal: LANGUAGE_CODE, oldVal: LANGUAGE_CODE) {\n    if (newVal === oldVal) return;\n    i18next.changeLanguage(newVal);\n    this.requiredError = i18next.t('fieldRequired', { field: i18next.t('redirectUrl') });\n    this.patternError = i18next.t('invalidInputFormat', { field: i18next.t('redirectUrl') });\n  }\n\n  @Watch('themeConfig')\n  themeConfigChangedHandler(newVal: ThemeConfig, oldVal: ThemeConfig) {\n    if (newVal === oldVal) return;\n    this.applyThemeConfig(newVal);\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-booking-confirmation-redirect', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-booking-confirmation-redirect', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.currentRedirectUrl = this.redirectUrl;\n      this.acceptUrl = this.redirectUrl !== '';\n    }\n    this.componentLoaded = true;\n    if (typeof this.internals.setFormValue === 'function') {\n      this.internals.setFormValue(this.currentRedirectUrl.toString(), this.name);\n    }\n  }\n\n  componentWillUpdate() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-booking-confirmation-redirect', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-booking-confirmation-redirect', 'componentDidRender');\n  }\n\n  @Listen('nylasFormDropdownChanged')\n  nylasFormDropdownChangedHandler(event: CustomEvent<{ value: string; name: string }>) {\n    debug('nylas-booking-confirmation-redirect', 'nylasFormDropdownChangedHandler', event.detail);\n\n    const { name, value } = event.detail;\n\n    if (name === 'confirmation-redirect-dropdown') {\n      if (value === 'custom') {\n        this.acceptUrl = true;\n      } else {\n        this.acceptUrl = false;\n\n        // Submit empty string to clear redirect URL\n        this.internals.setFormValue('', this.name);\n        this.valueChanged.emit({ name: this.name, value: '' });\n      }\n    }\n  }\n\n  @Listen('nylasFormInputBlurred')\n  nylasFormInputBlurHandler(event: CustomEvent<{ value: string; name: string }>) {\n    const { name, value } = event.detail;\n    this.currentRedirectUrl = value;\n\n    if (this.acceptUrl && name === 'confirmation-redirect') {\n      this.redirectUrlErrorMessage = '';\n\n      if (!isValidUrl(this.currentRedirectUrl)) {\n        this.internals.setValidity({ customError: true }, i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage'));\n        this.redirectUrlErrorMessage = i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage');\n        return;\n      }\n      this.internals.setValidity({});\n\n      // Pass as handler so that if event.defaultPrevented by parent app, this will be skipped.\n      const valueChanged = (event: CustomEvent<{ value: string; name: string }>) => {\n        const { value } = event.detail;\n        this.internals.setFormValue(value.toString(), this.name);\n      };\n      this.valueChanged.emit({ ...event.detail, valueChanged });\n    }\n  }\n\n  @Listen('formSubmitted', { target: 'document' })\n  formSubmittedHandler(_event: CustomEvent) {\n    if (this.acceptUrl && !isValidUrl(this.currentRedirectUrl)) {\n      this.internals.setValidity({ customError: true }, i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage'));\n      this.redirectUrlErrorMessage = i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlErrorMessage');\n    } else {\n      this.internals.setValidity({});\n    }\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<NylasBookingConfirmationRedirect, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-booking-confirmation-redirect',\n    stateToProps: new Map([\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.selectedLanguage', 'selectedLanguage'],\n      ['schedulerConfig.themeConfig', 'themeConfig'],\n    ]),\n    eventToProps: {\n      valueChanged: async (\n        event: CustomEvent<{ value: string; name: string; valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void }>,\n        _nylasSchedulerConfigConnector: NylasSchedulerConfigConnector,\n      ) => {\n        const { valueChanged } = event.detail;\n        // If a handler is passed, call it.\n        if (valueChanged) {\n          valueChanged(event);\n        }\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    const redirectOptions = [\n      {\n        label: i18next.t('nylasBookingConfirmationRedirect.redirectOption', { context: 'default' }),\n        value: 'default',\n      },\n      {\n        label: i18next.t('nylasBookingConfirmationRedirect.redirectOption', { context: 'custom' }),\n        value: 'custom',\n      },\n    ];\n\n    return (\n      <Host>\n        <div class=\"nylas-booking-confirmation-redirect\" part=\"nbcr\">\n          {redirectOptions.length > 0 && (\n            <div class=\"nylas-booking-confirmation-redirect__dropdown\">\n              <span class=\"label\">\n                {i18next.t('nylasBookingConfirmationRedirect.dropdownLabel')}\n                <tooltip-component>\n                  <info-icon slot=\"tooltip-icon\" />\n                  <span slot=\"tooltip-content\">{i18next.t('nylasBookingConfirmationRedirect.tooltip.desc')}</span>\n                </tooltip-component>\n              </span>\n              {this.componentLoaded && (\n                <select-dropdown\n                  name=\"confirmation-redirect-dropdown\"\n                  options={redirectOptions}\n                  withSearch={false}\n                  defaultSelectedOption={redirectOptions.find(option => option.value === (this.acceptUrl ? 'custom' : 'default'))}\n                  exportparts=\"sd_dropdown: nbcr__dropdown, sd_dropdown-button: nbcr__dropdown-button, sd_dropdown-content: nbcr__dropdown-content\"\n                  themeConfig={this.themeConfig}\n                />\n              )}\n              {this.acceptUrl && (\n                <div>\n                  <input-component\n                    name=\"confirmation-redirect\"\n                    id=\"confirmation-redirect\"\n                    type=\"text\"\n                    placeholder={i18next.t('nylasBookingConfirmationRedirect.customRedirectUrlPlaceholder')}\n                    required={false}\n                    part=\"ic__input_wrapper: nbcr__input-textfield\"\n                    requiredError={this.requiredError}\n                    patternError={this.patternError}\n                    defaultValue={this.currentRedirectUrl}\n                    themeConfig={this.themeConfig}\n                  />\n                  {this.redirectUrlErrorMessage && <span class=\"error-message\">{this.redirectUrlErrorMessage}</span>}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-5XVfomzJ.js → p-BdOvTsvK.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, e as createEvent, h, i as Host } from './p-Bht9ktsW.js';
-import { R as RegisterComponent } from './p--4oNPYSm.js';
-import { b as instance, a as debug } from './p-2BdSZySU.js';
+import { R as RegisterComponent } from './p-DtDGPXZR.js';
+import { b as instance, a as debug } from './p-CULO8bTo.js';
 import { d as defineCustomElement$3 } from './p-Captxtpo.js';
 import { d as defineCustomElement$2 } from './p-888hFf13.js';
 import { d as defineCustomElement$1 } from './p-S2TOEjUD.js';
@@ -160,6 +160,6 @@ function defineCustomElement() {
 }
 
 export { NylasOrganizerConfirmationCard as N, defineCustomElement as d };
-//# sourceMappingURL=p-5XVfomzJ.js.map
+//# sourceMappingURL=p-BdOvTsvK.js.map
 
-//# sourceMappingURL=p-5XVfomzJ.js.map
+//# sourceMappingURL=p-BdOvTsvK.js.map