@nylas/web-elements 0.0.0-canary-20241008193213 → 0.0.0-canary-20241015194719

package/dist/collection/components/scheduler-editor/nylas-limit-future-bookings/nylas-limit-future-bookings.js.map

@@ -1 +1 @@
-{"version":3,"file":"nylas-limit-future-bookings.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-limit-future-bookings/nylas-limit-future-bookings.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-limit-future-bookings` component is a form input for the number of days in the future a guest is allowed to book an event.\n *\n * @part nlfb - The limit future bookings container\n * @part nlfb__number-dropdown - The number dropdown container\n * @part nlfb__number-dropdown-button - The number dropdown button\n * @part nlfb__number-dropdown-content - The number dropdown content\n * @part nlfb__period-dropdown - The period dropdown container\n * @part nlfb__period-dropdown-button - The period dropdown button\n * @part nlfb__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-limit-future-bookings',\n  styleUrl: 'nylas-limit-future-bookings.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasLimitFutureBookings {\n  /**\n   * The host element <nylas-limit-future-bookings>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * The number of days into the future that invitees will see availability, as set in the configuration.\n   */\n  @Prop() availableDaysInFuture?: number;\n  /**\n   * The name of the limit future bookings input.\n   */\n  @Prop() name: string = 'limit-future-bookings';\n\n  /**\n   * The selected number for the available days in the future.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the available days in the future.\n   */\n  @State() selectedPeriod;\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-limit-future-bookings', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const daysInFuture = newVal?.scheduler?.available_days_in_future || this.availableDaysInFuture || 1;\n    if (daysInFuture) {\n      this.updateNumberAndPeriodFromDays(daysInFuture);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(daysInFuture?.toString(), this.name);\n  }\n\n  /**\n   * Event emitted when the future booking limit changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-limit-future-bookings', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-limit-future-bookings', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-limit-future-bookings', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromDays(this.availableDaysInFuture || 1);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-limit-future-bookings', 'disconnectedCallback');\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 availableDaysInFuture;\n    if (period === 'day') {\n      availableDaysInFuture = number;\n    } else if (period === 'week') {\n      availableDaysInFuture = number * 7;\n    } else {\n      availableDaysInFuture = number * 30;\n    }\n    this.valueChanged.emit({ value: availableDaysInFuture, name: 'availableDaysInFuture' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(availableDaysInFuture.toString(), this.name);\n  }\n\n  updateNumberAndPeriodFromDays(days: number): void {\n    let number, period;\n    if (days >= 30 && days % 30 === 0) {\n      number = days / 30;\n      period = 'month';\n    } else if (days >= 7 && days % 7 === 0) {\n      number = days / 7;\n      period = 'week';\n    } else {\n      number = days;\n      period = 'day';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasLimitFutureBookings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-limit-future-bookings',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-limit-future-bookings\" part=\"nlfb\">\n          <label>\n            Limit future bookings\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The limit on how far in the future bookings can be made.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTImePeriodSelector && (\n            <time-period-selector\n              id=\"limit-future-bookings\"\n              timePeriods={['day', 'week', 'month']}\n              exportparts=\"tps__number-dropdown: nlfb__number-dropdown, tps__number-dropdown-button: nlfb__number-dropdown-button, tps__number-dropdown-content: nlfb__number-dropdown-content, tps__period-dropdown: nlfb__period-dropdown, tps__period-dropdown-button: nlfb__period-dropdown-button, tps__period-dropdown-content: nlfb__period-dropdown-content\"\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"nylas-limit-future-bookings.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-limit-future-bookings/nylas-limit-future-bookings.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-limit-future-bookings` component is a form input for the number of days in the future a guest is allowed to book an event.\n *\n * @part nlfb - The limit future bookings container\n * @part nlfb__number-dropdown - The number dropdown container\n * @part nlfb__number-dropdown-button - The number dropdown button\n * @part nlfb__number-dropdown-content - The number dropdown content\n * @part nlfb__period-dropdown - The period dropdown container\n * @part nlfb__period-dropdown-button - The period dropdown button\n * @part nlfb__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-limit-future-bookings',\n  styleUrl: 'nylas-limit-future-bookings.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasLimitFutureBookings {\n  /**\n   * The host element <nylas-limit-future-bookings>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The number of days into the future that invitees will see availability, as set in the configuration.\n   */\n  @Prop() availableDaysInFuture?: number;\n  /**\n   * @standalone\n   * The name of the limit future bookings input.\n   */\n  @Prop() name: string = 'limit-future-bookings';\n\n  /**\n   * The selected number for the available days in the future.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the available days in the future.\n   */\n  @State() selectedPeriod;\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-limit-future-bookings', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const daysInFuture = newVal?.scheduler?.available_days_in_future || this.availableDaysInFuture || 1;\n    if (daysInFuture) {\n      this.updateNumberAndPeriodFromDays(daysInFuture);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(daysInFuture?.toString(), this.name);\n  }\n\n  /**\n   * Event emitted when the future booking limit changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-limit-future-bookings', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-limit-future-bookings', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-limit-future-bookings', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromDays(this.availableDaysInFuture || 1);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-limit-future-bookings', 'disconnectedCallback');\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 availableDaysInFuture;\n    if (period === 'day') {\n      availableDaysInFuture = number;\n    } else if (period === 'week') {\n      availableDaysInFuture = number * 7;\n    } else {\n      availableDaysInFuture = number * 30;\n    }\n    this.valueChanged.emit({ value: availableDaysInFuture, name: 'availableDaysInFuture' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(availableDaysInFuture.toString(), this.name);\n  }\n\n  updateNumberAndPeriodFromDays(days: number): void {\n    let number, period;\n    if (days >= 30 && days % 30 === 0) {\n      number = days / 30;\n      period = 'month';\n    } else if (days >= 7 && days % 7 === 0) {\n      number = days / 7;\n      period = 'week';\n    } else {\n      number = days;\n      period = 'day';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasLimitFutureBookings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-limit-future-bookings',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-limit-future-bookings\" part=\"nlfb\">\n          <label>\n            Limit future bookings\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The limit on how far in the future bookings can be made.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTImePeriodSelector && (\n            <time-period-selector\n              id=\"limit-future-bookings\"\n              timePeriods={['day', 'week', 'month']}\n              exportparts=\"tps__number-dropdown: nlfb__number-dropdown, tps__number-dropdown-button: nlfb__number-dropdown-button, tps__number-dropdown-content: nlfb__number-dropdown-content, tps__period-dropdown: nlfb__period-dropdown, tps__period-dropdown-button: nlfb__period-dropdown-button, tps__period-dropdown-content: nlfb__period-dropdown-content\"\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/scheduler-editor/nylas-list-configurations/nylas-list-configurations.js

@@ -136,8 +136,8 @@ export class NylasListConfigurations {
             } }, h("th", null, "Page title"), h("th", null, "Duration"), h("th", null)), this.state === 'loading' && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("h3", null, "Loading..."), h("p", null, "Please wait while we fetch the scheduling pages"))))), this.state !== 'loading' && (!this.configurations || this.configurations.length === 0) && (h("tr", { class: "no-configurations" }, h("td", { colSpan: 3 }, h("div", null, h("calendar-icon", { width: "48", height: "48" }), h("h3", null, "No scheduling pages found"), h("p", null, "Get started with creating your first scheduling page"), h("button-component", { part: "nlc__create-new-cta", clickHandler: () => {
                 this.createButtonClick.emit(this.host);
             } }, "Create new"))))), this.state !== 'loading' &&
-            this.configurations.map((config, i) => {
-                return (h("tr", { key: config.id }, h("td", null, h("div", { class: "title" }, h("div", { class: "config-event-title", title: config.event_booking.title }, config.event_booking.title), h("div", { class: 'config-event-description' }, config.event_booking.description))), h("td", null, h("div", { class: "duration" }, this.getDurationString(config.availability.duration_minutes))), h("td", null, h("div", { class: "actions" }, h("button-component", { variant: 'basic', key: `edit-${i}`, clickHandler: event => {
+            this.configurations?.map((config, i) => {
+                return (h("tr", { key: config?.id }, h("td", null, h("div", { class: "title" }, h("div", { class: "config-event-title", title: config?.event_booking?.title }, config?.event_booking?.title), h("div", { class: 'config-event-description' }, config?.event_booking?.description))), h("td", null, h("div", { class: "duration" }, this.getDurationString(config?.availability?.duration_minutes))), h("td", null, h("div", { class: "actions" }, h("button-component", { variant: 'basic', key: `edit-${i}`, clickHandler: event => {
                         event.preventDefault();
                         this.editButtonClick.emit({ host: this.host, configuration: config });
                     } }, h("edit-icon", { width: "16", height: "16" }), "Edit"), h("select-dropdown", { name: "actions", options: [

package/dist/collection/components/scheduler-editor/nylas-list-configurations/nylas-list-configurations.js.map

@@ -1 +1 @@
-{"version":3,"file":"nylas-list-configurations.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-list-configurations/nylas-list-configurations.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAcrH,MAAM,OAAO,uBAAuB;;8BASQ,EAAE;oCAMkC,EAAE;;qBAuCvB,SAAS;qBAKjC,EAAE;6BAKK,IAAI;+BAKP,EAAE;qCAKG,KAAK;;IAG/C,0CAA0C,CAAC,MAAqB,EAAE,MAAqB;QACrF,IAAI,CAAC,MAAM,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YACjC,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;gBACpB,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC;YACpC,CAAC;YACD,OAAO;QACT,CAAC;QACD,IAAI,CAAC,qBAAqB,GAAG,KAAK,CAAC;QACnC,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;IAC9B,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,6BAA6B,EAAE,mBAAmB,CAAC,CAAC;IAC5D,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,6BAA6B,EAAE,mBAAmB,CAAC,CAAC;QAG1D,IAAI,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAC1D,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;QACxB,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,KAAK,CAAC,6BAA6B,EAAE,kBAAkB,CAAC,CAAC;QAIzD,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAC/B,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC,CAAC;IACL,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,6BAA6B,EAAE,sBAAsB,CAAC,CAAC;IAC/D,CAAC;IAGD,KAAK,CAAC,8BAA8B,CAAC,KAAkB;QACrD,KAAK,CAAC,6BAA6B,EAAE,gCAAgC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACrF,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QAC/B,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACzC,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,QAAQ,MAAM,EAAE,CAAC;YACf,KAAK,QAAQ;gBACX,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;gBAC5F,MAAM;YACR,KAAK,SAAS;gBACZ,MAAM,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;gBAC/F,MAAM;YACR,KAAK,MAAM;gBACT,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBAC7G,MAAM;YACR;gBACE,MAAM;QACV,CAAC;IACH,CAAC;IAGD,KAAK,CAAC,QAAQ;QACZ,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAGD,KAAK,CAAC,QAAQ,CAAC,KAAqC;QAClD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;IAGD,KAAK,CAAC,QAAQ,CAAC,KAAa;QAC1B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;IAEO,iBAAiB,CAAC,QAAgB;QACxC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC;QACxC,MAAM,OAAO,GAAG,QAAQ,GAAG,EAAE,CAAC;QAC9B,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,IAAI,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;IACjK,CAAC;IAED,kBAAkB,CAAC,MAAc;QAC/B,MAAM,WAAW,GAAG;YAClB,OAAO,EAAE,aAAa;YACtB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,QAAQ;SACd,CAAC;QACF,MAAM,WAAW,GAAG;YAClB,KAAK,EAAE,oBAAoB;SAC5B,CAAC;QACF,QAAQ,MAAM,EAAE,CAAC;YACf,KAAK,SAAS;gBACZ,OAAO,CACL,YAAM,KAAK,EAAE,WAAW;oBACtB,gBAAU,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAY;8BAEvC,CACR,CAAC;YACJ,KAAK,MAAM;gBACT,OAAO,CACL,YAAM,KAAK,EAAE,WAAW;oBACtB,iBAAW,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG;2BAE/B,CACR,CAAC;YACJ,KAAK,QAAQ;gBACX,OAAO,CACL,YAAM,KAAK,EAAE,EAAE,GAAG,WAAW,EAAE,GAAG,WAAW,EAAE;oBAC7C,mBAAa,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAe;6BAE7C,CACR,CAAC;YACJ;gBACE,OAAO,EAAE,CAAC;QACd,CAAC;IACH,CAAC;IAED,0BAA0B;QACxB,IAAI,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO;QAE9C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC;QACxD,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,SAAS,CAAC;QACtF,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAC/B,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,MAAM,EAAE,UAAU;SACnB,CAAC,CAAC;IACL,CAAC;IAED,sBAAsB;QACpB,IAAI,CAAC,IAAI,CAAC,aAAa;YAAE,OAAO;QAEhC,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACrE,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAC/B,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,MAAM,EAAE,IAAI,CAAC,aAAa;SAC3B,CAAC,CAAC;IACL,CAAC;IA0CD,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,WAAK,KAAK,EAAC,QAAQ;gBACjB,WAAK,KAAK,EAAC,aAAa;oBACtB,qCAA6B;oBAC7B,wDAA+C,CAC3C;gBACL,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,CACxD,WAAK,KAAK,EAAC,SAAS;oBAClB,wBACE,IAAI,EAAC,qBAAqB,EAC1B,YAAY,EAAE,GAAG,EAAE;4BACjB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;wBACzC,CAAC,iBAGgB,CACf,CACP,CACG;YACN,WAAK,KAAK,EAAC,gBAAgB;gBACzB,WAAK,KAAK,EAAC,iBAAiB;oBAC1B,aACE,KAAK,EAAE;4BACL,mBAAmB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,CAAC;yBAC5G;wBAED,UACE,KAAK,EAAE;gCACL,IAAI,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,CAAC;6BAC5F;4BAED,2BAAmB;4BACnB,yBAAiB;4BACjB,aAAS,CACN;wBACJ,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAC3B,UAAI,KAAK,EAAC,mBAAmB;4BAC3B,UAAI,OAAO,EAAE,CAAC;gCACZ;oCACE,2BAAmB;oCACnB,+DAAsD,CAClD,CACH,CACF,CACN;wBACA,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,CAAC,IAAI,CACzF,UAAI,KAAK,EAAC,mBAAmB;4BAC3B,UAAI,OAAO,EAAE,CAAC;gCACZ;oCACE,qBAAe,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAiB;oCACtD,0CAAkC;oCAClC,oEAA2D;oCAC3D,wBACE,IAAI,EAAC,qBAAqB,EAC1B,YAAY,EAAE,GAAG,EAAE;4CACjB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;wCACzC,CAAC,iBAGgB,CACf,CACH,CACF,CACN;wBACA,IAAI,CAAC,KAAK,KAAK,SAAS;4BACvB,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gCACpC,OAAO,CACL,UAAI,GAAG,EAAE,MAAM,CAAC,EAAE;oCAChB;wCACE,WAAK,KAAK,EAAC,OAAO;4CAChB,WAAK,KAAK,EAAC,oBAAoB,EAAC,KAAK,EAAE,MAAM,CAAC,aAAa,CAAC,KAAK,IAC9D,MAAM,CAAC,aAAa,CAAC,KAAK,CACvB;4CACN,WAAK,KAAK,EAAE,0BAA0B,IAAG,MAAM,CAAC,aAAa,CAAC,WAAW,CAAO,CAC5E,CACH;oCACL;wCACE,WAAK,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAO,CACvF;oCACL;wCACE,WAAK,KAAK,EAAC,SAAS;4CAClB,wBACE,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,QAAQ,CAAC,EAAE,EAChB,YAAY,EAAE,KAAK,CAAC,EAAE;oDACpB,KAAK,CAAC,cAAc,EAAE,CAAC;oDACvB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC;gDACxE,CAAC;gDAED,iBAAW,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAa;uDAE7B;4CACnB,uBACE,IAAI,EAAC,SAAS,EACd,OAAO,EAAE;oDACP,EAAE,KAAK,EAAE,WAAW,CAAC,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,SAAS,CAAC,EAAE;oDAC1F,EAAE,KAAK,EAAE,QAAQ,CAAC,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAE;oDACtF,EAAE,KAAK,EAAE,UAAU,CAAC,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,EAAE;iDACxF,EACD,qBAAqB,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAC/C,kBAAkB,EAAC,KAAK,EACxB,UAAU,EAAE,KAAK,EACjB,WAAW,EAAE,KAAK,EAClB,WAAW,EAAC,8HAA8H,GACzH,CACf,CACH,CACF,CACN,CAAC;4BACJ,CAAC,CAAC,CACE,CACJ;gBACN,WAAK,KAAK,EAAC,YAAY;oBACrB,cAAQ,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,0BAA0B,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,MAAM,IAAI,CAAC;wBACrH,uBAAgB,CACT;oBACT,cAAQ,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,qBAAqB;wBAC5G,uBAAgB,CACT,CACL,CACF;YACL,IAAI,CAAC,KAAK,KAAK,OAAO,IAAI,CACzB,WAAK,KAAK,EAAC,iBAAiB;gBAC1B,SAAG,KAAK,EAAE,OAAO,IAAG,IAAI,CAAC,KAAK,CAAK,CAC/B,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAnIC;IAxCC,iBAAiB,CAA6G;QAC7H,IAAI,EAAE,2BAA2B;QACjC,YAAY,EAAE,IAAI,GAAG,CAAC;YACpB,CAAC,gCAAgC,EAAE,gBAAgB,CAAC;YACpD,CAAC,8CAA8C,EAAE,8BAA8B,CAAC;SACjF,CAAC;QACF,gBAAgB,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,sBAAsB,EAAE,sBAAsB,CAAC,CAAC,CAAC;QAC7E,YAAY,EAAE;YACZ,sBAAsB,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;gBACjD,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBACtC,MAAM,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;gBAC/B,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,MAAM,SAAS,CAAC,eAAe,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;gBAChF,IAAI,CAAC,IAAI,IAAI,KAAK,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;oBACpC,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;oBAC7B,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;oBACnC,OAAO;gBACT,CAAC;gBACD,MAAM,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;YAEhC,CAAC;YACD,iBAAiB,EAAE,KAAK,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE;gBACxC,SAAS,CAAC,oBAAoB,CAAC,0BAA0B,EAAE,CAAC;gBAC5D,SAAS,CAAC,oBAAoB,CAAC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC;YACzD,CAAC;YACD,iBAAiB,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;gBAC5C,MAAM,EAAE,IAAI,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBAC7C,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,MAAM,SAAS,CAAC,eAAe,CAAC,mBAAmB,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;gBAC5F,IAAI,CAAC,IAAI,IAAI,KAAK,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;oBACpC,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;oBAC7B,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;gBACrC,CAAC;YACH,CAAC;YACD,eAAe,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;gBAC1C,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBACvC,SAAS,CAAC,oBAAoB,CAAC,KAAK,CAAC,qBAAqB,GAAG,aAAa,CAAC;gBAC3E,SAAS,CAAC,oBAAoB,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YACvD,CAAC;SACF;QACD,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;qDAmID","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, parsePreviewLink } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-list-configurations` component displays a list of scheduling pages.\n *\n * @part nlc__create-new-cta - The create new configuration CTA.\n */\n@Component({\n  tag: 'nylas-list-configurations',\n  styleUrl: 'nylas-list-configurations.scss',\n  shadow: true,\n})\nexport class NylasListConfigurations {\n  /**\n   * The host element.\n   */\n  @Element() host!: HTMLNylasListConfigurationsElement;\n\n  /**\n   * The list of configurations to display.\n   */\n  @Prop() configurations: Configuration[] = [];\n\n  /**\n   * The scheduler preview link to use when the user clicks on the preview button.\n   * You can use a placeholder `{config.id}` to replace the configuration id anywhere in the link.\n   */\n  @Prop({ attribute: 'scheduler-preview-link' }) schedulerPreviewLink: string = '';\n\n  /**\n   * The next cursor for list configurations, if any.\n   */\n  @Prop() listConfigurationsNextCursor?: string | null;\n\n  /**\n   * Event emitted when the component is initialized.\n   */\n  @Event() initListConfigurations!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    cursor?: string;\n  }>;\n\n  /**\n   * Event emitted when the user clicks the create event button.\n   */\n  @Event() createButtonClick!: EventEmitter<HTMLNylasListConfigurationsElement>;\n\n  /**\n   * Event emitted when the user clicks the edit event button.\n   */\n  @Event() editButtonClick!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    configuration: Configuration;\n  }>;\n\n  /**\n   * Event emitted when the user clicks the delete event button.\n   */\n  @Event() deleteButtonClick!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    configuration: Configuration;\n  }>;\n\n  /**\n   * The current state of the component.\n   */\n  @State() private state: 'loading' | 'loaded' | 'error' = 'loading';\n\n  /**\n   * The error message to display.\n   */\n  @State() private error: string = '';\n\n  /**\n   * Current cursor for list configurations\n   */\n  @State() currentCursor: string | null = null;\n\n  /**\n   * The list of previous cursors for list configurations\n   */\n  @State() previousCursors: string[] = [];\n\n  /**\n   * State to identiy if the next button should be disabled\n   */\n  @State() disableNextPageButton: boolean = false;\n\n  @Watch('listConfigurationsNextCursor')\n  listConfigurationsNextCursorChangedHandler(newVal: string | null, oldVal: string | null) {\n    if (!newVal || newVal === oldVal) {\n      if (newVal === null) {\n        this.disableNextPageButton = true;\n      }\n      return;\n    }\n    this.disableNextPageButton = false;\n    this.currentCursor = newVal;\n  }\n\n  connectedCallback() {\n    debug('[nylas-list-configurations]', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('[nylas-list-configurations]', 'componentWillLoad');\n\n    // If we have configurations, we will set the state to loaded.\n    if (this.configurations && this.configurations.length > 0) {\n      this.state = 'loaded';\n    }\n  }\n\n  componentDidLoad() {\n    debug('[nylas-list-configurations]', 'componentDidLoad');\n\n    // Fire the init event. By default, we will fetch the configurations.\n    // This is defined in the eventToProps object in the RegisterComponent decorator.\n    this.initListConfigurations.emit({\n      host: this.host,\n    });\n  }\n\n  disconnectedCallback() {\n    debug('[nylas-list-configurations]', 'disconnectedCallback');\n  }\n\n  @Listen('nylasFormDropdownChanged')\n  async handleNylasFormDropdownChanged(event: CustomEvent) {\n    debug('[nylas-list-configurations]', 'handleNylasFormDropdownChanged', event.detail);\n    const { value } = event.detail;\n    const [action, index] = value.split('-');\n    event.preventDefault();\n    switch (action) {\n      case 'delete':\n        this.deleteButtonClick.emit({ host: this.host, configuration: this.configurations[index] });\n        break;\n      case 'preview':\n        window.open(parsePreviewLink(this.schedulerPreviewLink, this.configurations[index]), '_blank');\n        break;\n      case 'copy':\n        await navigator.clipboard.writeText(parsePreviewLink(this.schedulerPreviewLink, this.configurations[index]));\n        break;\n      default:\n        break;\n    }\n  }\n\n  @Method()\n  async getState() {\n    return this.state;\n  }\n\n  @Method()\n  async setState(state: 'loading' | 'loaded' | 'error') {\n    this.state = state;\n  }\n\n  @Method()\n  async setError(error: string) {\n    this.error = error;\n  }\n\n  private getDurationString(duration: number) {\n    const hours = Math.floor(duration / 60);\n    const minutes = duration % 60;\n    return `${hours ? hours : ''} ${hours ? `${hours > 1 ? 'hours' : 'hour'}` : ''} ${minutes ? minutes : ''} ${minutes ? `${minutes > 1 ? 'mins' : 'min'}` : ''}`;\n  }\n\n  getActionLabelHTML(action: string) {\n    const actionStyle = {\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: '0.5rem',\n    };\n    const dangerStyle = {\n      color: 'var(--nylas-error)',\n    };\n    switch (action) {\n      case 'preview':\n        return (\n          <span style={actionStyle}>\n            <eye-icon width=\"16\" height=\"16\"></eye-icon>\n            Preview\n          </span>\n        );\n      case 'copy':\n        return (\n          <span style={actionStyle}>\n            <copy-icon width=\"16\" height=\"16\" />\n            Copy\n          </span>\n        );\n      case 'delete':\n        return (\n          <span style={{ ...actionStyle, ...dangerStyle }}>\n            <delete-icon width=\"15\" height=\"17\"></delete-icon>\n            Delete\n          </span>\n        );\n      default:\n        return '';\n    }\n  }\n\n  previousPageClickedHandler() {\n    if (this.previousCursors.length === 0) return;\n\n    this.currentCursor = this.previousCursors.pop() || null;\n    const prevCursor = this.previousCursors[this.previousCursors.length - 1] || undefined;\n    this.initListConfigurations.emit({\n      host: this.host,\n      cursor: prevCursor,\n    });\n  }\n\n  nextPageClickedHandler() {\n    if (!this.currentCursor) return;\n\n    this.previousCursors = [...this.previousCursors, this.currentCursor];\n    this.initListConfigurations.emit({\n      host: this.host,\n      cursor: this.currentCursor,\n    });\n  }\n\n  @RegisterComponent<NylasListConfigurations, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-list-configurations',\n    stateToProps: new Map([\n      ['schedulerConfig.configurations', 'configurations'],\n      ['schedulerConfig.listConfigurationsNextCursor', 'listConfigurationsNextCursor'],\n    ]),\n    localPropsToProp: new Map([['schedulerPreviewLink', 'schedulerPreviewLink']]),\n    eventToProps: {\n      initListConfigurations: async (event, connector) => {\n        const { host, cursor } = event.detail;\n        await host.setState('loading');\n        const [data, error] = await connector.schedulerConfig.getConfigurations(cursor);\n        if (!data && error && error.message) {\n          await host.setState('error');\n          await host.setError(error.message);\n          return;\n        }\n        await host.setState('loaded');\n        // setCursor here\n      },\n      createButtonClick: async (_, connector) => {\n        connector.schedulerConfigStore.resetSelectedConfiguration();\n        connector.schedulerConfigStore.state.action = 'create';\n      },\n      deleteButtonClick: async (event, connector) => {\n        const { host, configuration } = event.detail;\n        const [data, error] = await connector.schedulerConfig.deleteConfiguration(configuration.id);\n        if (!data && error && error.message) {\n          await host.setState('error');\n          await host.setError(error.message);\n        }\n      },\n      editButtonClick: async (event, connector) => {\n        const { configuration } = event.detail;\n        connector.schedulerConfigStore.state.selectedConfiguration = configuration;\n        connector.schedulerConfigStore.state.action = 'edit';\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"header\">\n          <div class=\"description\">\n            <h2>All Scheduling Pages</h2>\n            <p>Create and manage your Scheduling Pages.</p>\n          </div>\n          {this.configurations && this.configurations.length > 0 && (\n            <div class=\"actions\">\n              <button-component\n                part=\"nlc__create-new-cta\"\n                clickHandler={() => {\n                  this.createButtonClick.emit(this.host);\n                }}\n              >\n                Create new\n              </button-component>\n            </div>\n          )}\n        </div>\n        <div class=\"configurations\">\n          <div class=\"table-container\">\n            <table\n              class={{\n                'no-configurations': this.state !== 'loading' && (!this.configurations || this.configurations.length === 0),\n              }}\n            >\n              <tr\n                class={{\n                  hide: this.state === 'loading' || (this.configurations && this.configurations.length === 0),\n                }}\n              >\n                <th>Page title</th>\n                <th>Duration</th>\n                <th></th>\n              </tr>\n              {this.state === 'loading' && (\n                <tr class=\"no-configurations\">\n                  <td colSpan={3}>\n                    <div>\n                      <h3>Loading...</h3>\n                      <p>Please wait while we fetch the scheduling pages</p>\n                    </div>\n                  </td>\n                </tr>\n              )}\n              {this.state !== 'loading' && (!this.configurations || this.configurations.length === 0) && (\n                <tr class=\"no-configurations\">\n                  <td colSpan={3}>\n                    <div>\n                      <calendar-icon width=\"48\" height=\"48\"></calendar-icon>\n                      <h3>No scheduling pages found</h3>\n                      <p>Get started with creating your first scheduling page</p>\n                      <button-component\n                        part=\"nlc__create-new-cta\"\n                        clickHandler={() => {\n                          this.createButtonClick.emit(this.host);\n                        }}\n                      >\n                        Create new\n                      </button-component>\n                    </div>\n                  </td>\n                </tr>\n              )}\n              {this.state !== 'loading' &&\n                this.configurations.map((config, i) => {\n                  return (\n                    <tr key={config.id}>\n                      <td>\n                        <div class=\"title\">\n                          <div class=\"config-event-title\" title={config.event_booking.title}>\n                            {config.event_booking.title}\n                          </div>\n                          <div class={'config-event-description'}>{config.event_booking.description}</div>\n                        </div>\n                      </td>\n                      <td>\n                        <div class=\"duration\">{this.getDurationString(config.availability.duration_minutes)}</div>\n                      </td>\n                      <td>\n                        <div class=\"actions\">\n                          <button-component\n                            variant={'basic'}\n                            key={`edit-${i}`}\n                            clickHandler={event => {\n                              event.preventDefault();\n                              this.editButtonClick.emit({ host: this.host, configuration: config });\n                            }}\n                          >\n                            <edit-icon width=\"16\" height=\"16\"></edit-icon>\n                            Edit\n                          </button-component>\n                          <select-dropdown\n                            name=\"actions\"\n                            options={[\n                              { value: `preview-${i}`, label: 'Preview', labelHTML: this.getActionLabelHTML('preview') },\n                              { value: `copy-${i}`, label: 'Copy link', labelHTML: this.getActionLabelHTML('copy') },\n                              { value: `delete-${i}`, label: 'Delete', labelHTML: this.getActionLabelHTML('delete') },\n                            ]}\n                            defaultSelectedOption={{ value: '', label: '' }}\n                            dropdownButtonText=\"...\"\n                            withSearch={false}\n                            withChevron={false}\n                            exportparts=\"sd_dropdown: actions__dropdown, sd_dropdown-button: actions__dropdown-button, sd_dropdown-content: actions__dropdown-content\"\n                          ></select-dropdown>\n                        </div>\n                      </td>\n                    </tr>\n                  );\n                })}\n            </table>\n          </div>\n          <div class=\"pagination\">\n            <button class=\"arrow left\" onClick={() => this.previousPageClickedHandler()} disabled={this.previousCursors.length <= 0}>\n              <chevron-icon />\n            </button>\n            <button class=\"arrow right\" onClick={() => this.nextPageClickedHandler()} disabled={this.disableNextPageButton}>\n              <chevron-icon />\n            </button>\n          </div>\n        </div>\n        {this.state === 'error' && (\n          <div class=\"error-container\">\n            <p class={'error'}>{this.error}</p>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"nylas-list-configurations.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-list-configurations/nylas-list-configurations.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug, parsePreviewLink } from '@/utils/utils';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-list-configurations` component displays a list of scheduling pages.\n *\n * @part nlc__create-new-cta - The create new configuration CTA.\n */\n@Component({\n  tag: 'nylas-list-configurations',\n  styleUrl: 'nylas-list-configurations.scss',\n  shadow: true,\n})\nexport class NylasListConfigurations {\n  /**\n   * The host element.\n   */\n  @Element() host!: HTMLNylasListConfigurationsElement;\n\n  /**\n   * The list of configurations to display.\n   */\n  @Prop() configurations: Configuration[] = [];\n\n  /**\n   * The scheduler preview link to use when the user clicks on the preview button.\n   * You can use a placeholder `{config.id}` to replace the configuration id anywhere in the link.\n   */\n  @Prop({ attribute: 'scheduler-preview-link' }) schedulerPreviewLink: string = '';\n\n  /**\n   * The next cursor for list configurations, if any.\n   */\n  @Prop() listConfigurationsNextCursor?: string | null;\n\n  /**\n   * Event emitted when the component is initialized.\n   */\n  @Event() initListConfigurations!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    cursor?: string;\n  }>;\n\n  /**\n   * Event emitted when the user clicks the create event button.\n   */\n  @Event() createButtonClick!: EventEmitter<HTMLNylasListConfigurationsElement>;\n\n  /**\n   * Event emitted when the user clicks the edit event button.\n   */\n  @Event() editButtonClick!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    configuration: Configuration;\n  }>;\n\n  /**\n   * Event emitted when the user clicks the delete event button.\n   */\n  @Event() deleteButtonClick!: EventEmitter<{\n    host: HTMLNylasListConfigurationsElement;\n    configuration: Configuration;\n  }>;\n\n  /**\n   * The current state of the component.\n   */\n  @State() private state: 'loading' | 'loaded' | 'error' = 'loading';\n\n  /**\n   * The error message to display.\n   */\n  @State() private error: string = '';\n\n  /**\n   * Current cursor for list configurations\n   */\n  @State() currentCursor: string | null = null;\n\n  /**\n   * The list of previous cursors for list configurations\n   */\n  @State() previousCursors: string[] = [];\n\n  /**\n   * State to identiy if the next button should be disabled\n   */\n  @State() disableNextPageButton: boolean = false;\n\n  @Watch('listConfigurationsNextCursor')\n  listConfigurationsNextCursorChangedHandler(newVal: string | null, oldVal: string | null) {\n    if (!newVal || newVal === oldVal) {\n      if (newVal === null) {\n        this.disableNextPageButton = true;\n      }\n      return;\n    }\n    this.disableNextPageButton = false;\n    this.currentCursor = newVal;\n  }\n\n  connectedCallback() {\n    debug('[nylas-list-configurations]', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('[nylas-list-configurations]', 'componentWillLoad');\n\n    // If we have configurations, we will set the state to loaded.\n    if (this.configurations && this.configurations.length > 0) {\n      this.state = 'loaded';\n    }\n  }\n\n  componentDidLoad() {\n    debug('[nylas-list-configurations]', 'componentDidLoad');\n\n    // Fire the init event. By default, we will fetch the configurations.\n    // This is defined in the eventToProps object in the RegisterComponent decorator.\n    this.initListConfigurations.emit({\n      host: this.host,\n    });\n  }\n\n  disconnectedCallback() {\n    debug('[nylas-list-configurations]', 'disconnectedCallback');\n  }\n\n  @Listen('nylasFormDropdownChanged')\n  async handleNylasFormDropdownChanged(event: CustomEvent) {\n    debug('[nylas-list-configurations]', 'handleNylasFormDropdownChanged', event.detail);\n    const { value } = event.detail;\n    const [action, index] = value.split('-');\n    event.preventDefault();\n    switch (action) {\n      case 'delete':\n        this.deleteButtonClick.emit({ host: this.host, configuration: this.configurations[index] });\n        break;\n      case 'preview':\n        window.open(parsePreviewLink(this.schedulerPreviewLink, this.configurations[index]), '_blank');\n        break;\n      case 'copy':\n        await navigator.clipboard.writeText(parsePreviewLink(this.schedulerPreviewLink, this.configurations[index]));\n        break;\n      default:\n        break;\n    }\n  }\n\n  @Method()\n  async getState() {\n    return this.state;\n  }\n\n  @Method()\n  async setState(state: 'loading' | 'loaded' | 'error') {\n    this.state = state;\n  }\n\n  @Method()\n  async setError(error: string) {\n    this.error = error;\n  }\n\n  private getDurationString(duration: number) {\n    const hours = Math.floor(duration / 60);\n    const minutes = duration % 60;\n    return `${hours ? hours : ''} ${hours ? `${hours > 1 ? 'hours' : 'hour'}` : ''} ${minutes ? minutes : ''} ${minutes ? `${minutes > 1 ? 'mins' : 'min'}` : ''}`;\n  }\n\n  getActionLabelHTML(action: string) {\n    const actionStyle = {\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: '0.5rem',\n    };\n    const dangerStyle = {\n      color: 'var(--nylas-error)',\n    };\n    switch (action) {\n      case 'preview':\n        return (\n          <span style={actionStyle}>\n            <eye-icon width=\"16\" height=\"16\"></eye-icon>\n            Preview\n          </span>\n        );\n      case 'copy':\n        return (\n          <span style={actionStyle}>\n            <copy-icon width=\"16\" height=\"16\" />\n            Copy\n          </span>\n        );\n      case 'delete':\n        return (\n          <span style={{ ...actionStyle, ...dangerStyle }}>\n            <delete-icon width=\"15\" height=\"17\"></delete-icon>\n            Delete\n          </span>\n        );\n      default:\n        return '';\n    }\n  }\n\n  previousPageClickedHandler() {\n    if (this.previousCursors.length === 0) return;\n\n    this.currentCursor = this.previousCursors.pop() || null;\n    const prevCursor = this.previousCursors[this.previousCursors.length - 1] || undefined;\n    this.initListConfigurations.emit({\n      host: this.host,\n      cursor: prevCursor,\n    });\n  }\n\n  nextPageClickedHandler() {\n    if (!this.currentCursor) return;\n\n    this.previousCursors = [...this.previousCursors, this.currentCursor];\n    this.initListConfigurations.emit({\n      host: this.host,\n      cursor: this.currentCursor,\n    });\n  }\n\n  @RegisterComponent<NylasListConfigurations, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-list-configurations',\n    stateToProps: new Map([\n      ['schedulerConfig.configurations', 'configurations'],\n      ['schedulerConfig.listConfigurationsNextCursor', 'listConfigurationsNextCursor'],\n    ]),\n    localPropsToProp: new Map([['schedulerPreviewLink', 'schedulerPreviewLink']]),\n    eventToProps: {\n      initListConfigurations: async (event, connector) => {\n        const { host, cursor } = event.detail;\n        await host.setState('loading');\n        const [data, error] = await connector.schedulerConfig.getConfigurations(cursor);\n        if (!data && error && error.message) {\n          await host.setState('error');\n          await host.setError(error.message);\n          return;\n        }\n        await host.setState('loaded');\n        // setCursor here\n      },\n      createButtonClick: async (_, connector) => {\n        connector.schedulerConfigStore.resetSelectedConfiguration();\n        connector.schedulerConfigStore.state.action = 'create';\n      },\n      deleteButtonClick: async (event, connector) => {\n        const { host, configuration } = event.detail;\n        const [data, error] = await connector.schedulerConfig.deleteConfiguration(configuration.id);\n        if (!data && error && error.message) {\n          await host.setState('error');\n          await host.setError(error.message);\n        }\n      },\n      editButtonClick: async (event, connector) => {\n        const { configuration } = event.detail;\n        connector.schedulerConfigStore.state.selectedConfiguration = configuration;\n        connector.schedulerConfigStore.state.action = 'edit';\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"header\">\n          <div class=\"description\">\n            <h2>All Scheduling Pages</h2>\n            <p>Create and manage your Scheduling Pages.</p>\n          </div>\n          {this.configurations && this.configurations.length > 0 && (\n            <div class=\"actions\">\n              <button-component\n                part=\"nlc__create-new-cta\"\n                clickHandler={() => {\n                  this.createButtonClick.emit(this.host);\n                }}\n              >\n                Create new\n              </button-component>\n            </div>\n          )}\n        </div>\n        <div class=\"configurations\">\n          <div class=\"table-container\">\n            <table\n              class={{\n                'no-configurations': this.state !== 'loading' && (!this.configurations || this.configurations.length === 0),\n              }}\n            >\n              <tr\n                class={{\n                  hide: this.state === 'loading' || (this.configurations && this.configurations.length === 0),\n                }}\n              >\n                <th>Page title</th>\n                <th>Duration</th>\n                <th></th>\n              </tr>\n              {this.state === 'loading' && (\n                <tr class=\"no-configurations\">\n                  <td colSpan={3}>\n                    <div>\n                      <h3>Loading...</h3>\n                      <p>Please wait while we fetch the scheduling pages</p>\n                    </div>\n                  </td>\n                </tr>\n              )}\n              {this.state !== 'loading' && (!this.configurations || this.configurations.length === 0) && (\n                <tr class=\"no-configurations\">\n                  <td colSpan={3}>\n                    <div>\n                      <calendar-icon width=\"48\" height=\"48\"></calendar-icon>\n                      <h3>No scheduling pages found</h3>\n                      <p>Get started with creating your first scheduling page</p>\n                      <button-component\n                        part=\"nlc__create-new-cta\"\n                        clickHandler={() => {\n                          this.createButtonClick.emit(this.host);\n                        }}\n                      >\n                        Create new\n                      </button-component>\n                    </div>\n                  </td>\n                </tr>\n              )}\n              {this.state !== 'loading' &&\n                this.configurations?.map((config, i) => {\n                  return (\n                    <tr key={config?.id}>\n                      <td>\n                        <div class=\"title\">\n                          <div class=\"config-event-title\" title={config?.event_booking?.title}>\n                            {config?.event_booking?.title}\n                          </div>\n                          <div class={'config-event-description'}>{config?.event_booking?.description}</div>\n                        </div>\n                      </td>\n                      <td>\n                        <div class=\"duration\">{this.getDurationString(config?.availability?.duration_minutes)}</div>\n                      </td>\n                      <td>\n                        <div class=\"actions\">\n                          <button-component\n                            variant={'basic'}\n                            key={`edit-${i}`}\n                            clickHandler={event => {\n                              event.preventDefault();\n                              this.editButtonClick.emit({ host: this.host, configuration: config });\n                            }}\n                          >\n                            <edit-icon width=\"16\" height=\"16\"></edit-icon>\n                            Edit\n                          </button-component>\n                          <select-dropdown\n                            name=\"actions\"\n                            options={[\n                              { value: `preview-${i}`, label: 'Preview', labelHTML: this.getActionLabelHTML('preview') },\n                              { value: `copy-${i}`, label: 'Copy link', labelHTML: this.getActionLabelHTML('copy') },\n                              { value: `delete-${i}`, label: 'Delete', labelHTML: this.getActionLabelHTML('delete') },\n                            ]}\n                            defaultSelectedOption={{ value: '', label: '' }}\n                            dropdownButtonText=\"...\"\n                            withSearch={false}\n                            withChevron={false}\n                            exportparts=\"sd_dropdown: actions__dropdown, sd_dropdown-button: actions__dropdown-button, sd_dropdown-content: actions__dropdown-content\"\n                          ></select-dropdown>\n                        </div>\n                      </td>\n                    </tr>\n                  );\n                })}\n            </table>\n          </div>\n          <div class=\"pagination\">\n            <button class=\"arrow left\" onClick={() => this.previousPageClickedHandler()} disabled={this.previousCursors.length <= 0}>\n              <chevron-icon />\n            </button>\n            <button class=\"arrow right\" onClick={() => this.nextPageClickedHandler()} disabled={this.disableNextPageButton}>\n              <chevron-icon />\n            </button>\n          </div>\n        </div>\n        {this.state === 'error' && (\n          <div class=\"error-container\">\n            <p class={'error'}>{this.error}</p>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/scheduler-editor/nylas-min-booking-notice/nylas-min-booking-notice.js

@@ -18,8 +18,8 @@ import { Host, h } from "@stencil/core";
 export class NylasMinBookingNotice {
     constructor() {
         this.selectedConfiguration = undefined;
-        this.minBookingNotice = undefined;
         this.name = 'min-booking-notice';
+        this.minBookingNotice = undefined;
         this.selectedNumber = undefined;
         this.selectedPeriod = undefined;
     }
@@ -118,7 +118,7 @@ export class NylasMinBookingNotice {
     }
     render() {
         const showTImePeriodSelector = typeof this.selectedNumber == 'number' && typeof this.selectedPeriod == 'string';
-        return (h(Host, { key: 'b51f14edfe66462ce3822dcd9ea299820dfef96b' }, h("div", { key: '578505fefc4132f45ac21d6ab1d59cb409145536', class: "nylas-min-booking-notice", part: "nmbn" }, h("label", { key: '5226af32996ae771f65ed4dce017bbba7e26193a' }, "Minimum booking notice", h("span", { key: '37dcf44405e2cfe10bc652d35715936f41d78685', class: "label-icon" }, h("tooltip-component", { key: '52a11ccbcddb918341c7cad983fb9bdf65b1c86d' }, h("info-icon", { key: 'c941288bee95958b40a825944ba2316709f307a1', slot: "tooltip-icon" }), h("span", { key: '7d3a9c1f538b1e16c094d78daf4eea1f84084bd7', slot: "tooltip-content" }, "The minimum amount of time in the future that a new booking can be made.")))), showTImePeriodSelector && (h("time-period-selector", { id: "min-booking-notice", exportparts: "tps__number-dropdown: nmbn__number-dropdown, tps__number-dropdown-button: nmbn__number-dropdown-button, tps__number-dropdown-content: nmbn__number-dropdown-content, tps__period-dropdown: nmbn__period-dropdown, tps__period-dropdown-button: nmbn__period-dropdown-button, tps__period-dropdown-content: nmbn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod })))));
+        return (h(Host, { key: '058d282534c52f53706462ac1d683ec578f6d3a8' }, h("div", { key: '9ea1537dac50fd2376b36be39b9018e4ea72f6b6', class: "nylas-min-booking-notice", part: "nmbn" }, h("label", { key: 'a36bfe20366c6da7a87714dec15fa2d0d99306bc' }, "Minimum booking notice", h("span", { key: 'c0b3c66b4da42c78cae762889dd24f0201827184', class: "label-icon" }, h("tooltip-component", { key: '012dad9e26ec2dd6c82da843741e2aee8ea4d327' }, h("info-icon", { key: '4cbf03a96564d428a06b2a0faf11a353ded5a6c1', slot: "tooltip-icon" }), h("span", { key: '4ab57c8815064edb2fb06f8f10b5ccde022a9b90', slot: "tooltip-content" }, "The minimum amount of time in the future that a new booking can be made.")))), showTImePeriodSelector && (h("time-period-selector", { id: "min-booking-notice", exportparts: "tps__number-dropdown: nmbn__number-dropdown, tps__number-dropdown-button: nmbn__number-dropdown-button, tps__number-dropdown-content: nmbn__number-dropdown-content, tps__period-dropdown: nmbn__period-dropdown, tps__period-dropdown-button: nmbn__period-dropdown-button, tps__period-dropdown-content: nmbn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod })))));
     }
     static get is() { return "nylas-min-booking-notice"; }
     static get encapsulation() { return "shadow"; }
@@ -152,27 +152,13 @@ export class NylasMinBookingNotice {
                 "required": false,
                 "optional": true,
                 "docs": {
-                    "tags": [],
-                    "text": "The selected config"
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The selected config"
+                        }],
+                    "text": ""
                 }
             },
-            "minBookingNotice": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The minimum booking notice (minutes) stored in the configuration"
-                },
-                "attribute": "min-booking-notice",
-                "reflect": false
-            },
             "name": {
                 "type": "string",
                 "mutable": false,
@@ -184,12 +170,35 @@ export class NylasMinBookingNotice {
                 "required": false,
                 "optional": false,
                 "docs": {
-                    "tags": [],
-                    "text": "The name of the min booking notice input."
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The name of the min booking notice input."
+                        }],
+                    "text": ""
                 },
                 "attribute": "name",
                 "reflect": false,
                 "defaultValue": "'min-booking-notice'"
+            },
+            "minBookingNotice": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The minimum booking notice (minutes) stored in the configuration"
+                        }],
+                    "text": ""
+                },
+                "attribute": "min-booking-notice",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/scheduler-editor/nylas-min-booking-notice/nylas-min-booking-notice.js.map

@@ -1 +1 @@
-{"version":3,"file":"nylas-min-booking-notice.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-min-booking-notice/nylas-min-booking-notice.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-min-booking-notice` component is a form input for the minimum period of notice (minutes) that a guest must\n * provide to book an event.\n *\n * @part nmbn - The minimum booking notice container\n * @part nmbn__number-dropdown - The number dropdown container\n * @part nmbn__number-dropdown-button - The number dropdown button\n * @part nmbn__number-dropdown-content - The number dropdown content\n * @part nmbn__period-dropdown - The period dropdown container\n * @part nmbn__period-dropdown-button - The period dropdown button\n * @part nmbn__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-min-booking-notice',\n  styleUrl: 'nylas-min-booking-notice.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasMinBookingNotice {\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * The minimum booking notice (minutes) stored in the configuration\n   */\n  @Prop() minBookingNotice?: number;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n  /**\n   * The host element <nylas-min-booking-notice>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The name of the min booking notice input.\n   */\n  @Prop() name: string = 'min-booking-notice';\n\n  /**\n   * The selected number of minutes for the min booking notice.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the min booking notice.\n   */\n  @State() selectedPeriod;\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-min-booking-notice', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const minBookingNotice = newVal?.scheduler?.min_booking_notice || this.minBookingNotice || 1;\n    if (minBookingNotice) {\n      this.updateNumberAndPeriodFromMinutes(minBookingNotice);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(minBookingNotice?.toString(), this.name);\n  }\n\n  /**\n   * This event is fired when the value of the min booking notice changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-min-booking-notice', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-min-booking-notice', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-min-booking-notice', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromMinutes(this.minBookingNotice || 1);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-min-booking-notice', 'disconnectedCallback');\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.valueChanged.emit({ value: totalMinutes, name: 'minBookingNotice' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    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    if (minutes >= minutesInMonth) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasMinBookingNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-min-booking-notice',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-min-booking-notice\" part=\"nmbn\">\n          <label>\n            Minimum booking notice\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The minimum amount of time in the future that a new booking can be made.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTImePeriodSelector && (\n            <time-period-selector\n              id=\"min-booking-notice\"\n              exportparts=\"tps__number-dropdown: nmbn__number-dropdown, tps__number-dropdown-button: nmbn__number-dropdown-button, tps__number-dropdown-content: nmbn__number-dropdown-content, tps__period-dropdown: nmbn__period-dropdown, tps__period-dropdown-button: nmbn__period-dropdown-button, tps__period-dropdown-content: nmbn__period-dropdown-content\"\n              timePeriods={['minute', 'hour', 'day', 'week']}\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"nylas-min-booking-notice.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-min-booking-notice/nylas-min-booking-notice.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-min-booking-notice` component is a form input for the minimum period of notice (minutes) that a guest must\n * provide to book an event.\n *\n * @part nmbn - The minimum booking notice container\n * @part nmbn__number-dropdown - The number dropdown container\n * @part nmbn__number-dropdown-button - The number dropdown button\n * @part nmbn__number-dropdown-content - The number dropdown content\n * @part nmbn__period-dropdown - The period dropdown container\n * @part nmbn__period-dropdown-button - The period dropdown button\n * @part nmbn__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-min-booking-notice',\n  styleUrl: 'nylas-min-booking-notice.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasMinBookingNotice {\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The name of the min booking notice input.\n   */\n  @Prop() name: string = 'min-booking-notice';\n  /**\n   * @standalone\n   * The minimum booking notice (minutes) stored in the configuration\n   */\n  @Prop() minBookingNotice?: number;\n  /**\n   *\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n  /**\n   * The host element <nylas-min-booking-notice>\n   */\n  @Element() host!: HTMLElement;\n\n  /**\n   * The selected number of minutes for the min booking notice.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the min booking notice.\n   */\n  @State() selectedPeriod;\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-min-booking-notice', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const minBookingNotice = newVal?.scheduler?.min_booking_notice || this.minBookingNotice || 1;\n    if (minBookingNotice) {\n      this.updateNumberAndPeriodFromMinutes(minBookingNotice);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(minBookingNotice?.toString(), this.name);\n  }\n\n  /**\n   * This event is fired when the value of the min booking notice changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-min-booking-notice', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-min-booking-notice', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-min-booking-notice', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromMinutes(this.minBookingNotice || 1);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-min-booking-notice', 'disconnectedCallback');\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.valueChanged.emit({ value: totalMinutes, name: 'minBookingNotice' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    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    if (minutes >= minutesInMonth) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasMinBookingNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-min-booking-notice',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-min-booking-notice\" part=\"nmbn\">\n          <label>\n            Minimum booking notice\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The minimum amount of time in the future that a new booking can be made.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTImePeriodSelector && (\n            <time-period-selector\n              id=\"min-booking-notice\"\n              exportparts=\"tps__number-dropdown: nmbn__number-dropdown, tps__number-dropdown-button: nmbn__number-dropdown-button, tps__number-dropdown-content: nmbn__number-dropdown-content, tps__period-dropdown: nmbn__period-dropdown, tps__period-dropdown-button: nmbn__period-dropdown-button, tps__period-dropdown-content: nmbn__period-dropdown-content\"\n              timePeriods={['minute', 'hour', 'day', 'week']}\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.js

@@ -18,8 +18,8 @@ import { Host, h } from "@stencil/core";
 export class NylasMinCancellationNotice {
     constructor() {
         this.selectedConfiguration = undefined;
-        this.minCancellationNotice = undefined;
         this.name = 'min-cancellation-notice';
+        this.minCancellationNotice = undefined;
         this.selectedNumber = undefined;
         this.selectedPeriod = undefined;
     }
@@ -122,7 +122,7 @@ export class NylasMinCancellationNotice {
     }
     render() {
         const showTimePeriodSelector = typeof this.selectedNumber == 'number' && typeof this.selectedPeriod == 'string';
-        return (h(Host, { key: 'd80cbfef8c0ff087260d12c9268f8dc0d123dc05' }, h("div", { key: 'c3fa79ad8c539373d02b267bf6bb710788be0d96', class: "nylas-min-cancellation-notice", part: "nmcn" }, h("label", { key: 'cd3e89c32f7800ba68e2d4e4122a3eb46fbd84c1' }, "Minimum cancellation notice", h("span", { key: '1520d76b2ba656db1a23a672423e7a7723ae4934', class: "label-icon" }, h("tooltip-component", { key: 'c784ffeeabefece6962cd906edd576f7009cb350' }, h("info-icon", { key: '1194ce9c6d216b4538bdc7ab7aedcf489dd55db8', slot: "tooltip-icon" }), h("span", { key: '72b32290edf7eab29032986d6e041017ae140df8', slot: "tooltip-content" }, "The minimum amount of time required to cancel a booking.")))), showTimePeriodSelector && (h("time-period-selector", { id: "min-cancellation-notice", exportparts: "tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod })))));
+        return (h(Host, { key: 'b3d5eab0c7f826b60f8d88dbcd2de20b8aa05953' }, h("div", { key: 'df62baa3bd558066cea96bd86f2b4594b7eae613', class: "nylas-min-cancellation-notice", part: "nmcn" }, h("label", { key: '7bab73f950ee0529feef61c32750488ee8e3d816' }, "Minimum cancellation notice", h("span", { key: '71856612ca18403cc95642ad22f7fea40c93163e', class: "label-icon" }, h("tooltip-component", { key: '3961109385d524c08115a98bd8e303d573529884' }, h("info-icon", { key: '60053a1ff74768ab53e903b52c0028b5c04aa5c7', slot: "tooltip-icon" }), h("span", { key: 'af42bbed9685aa44d11ad4dd3cd35a156ba245a4', slot: "tooltip-content" }, "The minimum amount of time required to cancel a booking.")))), showTimePeriodSelector && (h("time-period-selector", { id: "min-cancellation-notice", exportparts: "tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content", timePeriods: ['minute', 'hour', 'day', 'week'], defaultSelectedNumber: this.selectedNumber, defaultSelectedPeriod: this.selectedPeriod })))));
     }
     static get is() { return "nylas-min-cancellation-notice"; }
     static get encapsulation() { return "shadow"; }
@@ -156,27 +156,13 @@ export class NylasMinCancellationNotice {
                 "required": false,
                 "optional": true,
                 "docs": {
-                    "tags": [],
-                    "text": "The selected config"
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The selected config"
+                        }],
+                    "text": ""
                 }
             },
-            "minCancellationNotice": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The minimum cancellation notice (minutes) stored in the configuration"
-                },
-                "attribute": "min-cancellation-notice",
-                "reflect": false
-            },
             "name": {
                 "type": "string",
                 "mutable": false,
@@ -188,12 +174,35 @@ export class NylasMinCancellationNotice {
                 "required": false,
                 "optional": false,
                 "docs": {
-                    "tags": [],
-                    "text": "The name of the min cancellation notice input."
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The name of the min cancellation notice input."
+                        }],
+                    "text": ""
                 },
                 "attribute": "name",
                 "reflect": false,
                 "defaultValue": "'min-cancellation-notice'"
+            },
+            "minCancellationNotice": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [{
+                            "name": "standalone",
+                            "text": "The minimum cancellation notice (minutes) stored in the configuration"
+                        }],
+                    "text": ""
+                },
+                "attribute": "min-cancellation-notice",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.js.map

@@ -1 +1 @@
-{"version":3,"file":"nylas-min-cancellation-notice.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-min-cancellation-notice` component is a form input for the minimum period of notice (minutes) that a guest must\n * provide to cancel a booked event.\n *\n * @part nmcn - The minimum cancellation notice container\n * @part nmcn__number-dropdown - The number dropdown container\n * @part nmcn__number-dropdown-button - The number dropdown button\n * @part nmcn__number-dropdown-content - The number dropdown content\n * @part nmcn__period-dropdown - The period dropdown container\n * @part nmcn__period-dropdown-button - The period dropdown button\n * @part nmcn__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-min-cancellation-notice',\n  styleUrl: 'nylas-min-cancellation-notice.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasMinCancellationNotice {\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * The minimum cancellation notice (minutes) stored in the configuration\n   */\n  @Prop() minCancellationNotice?: number;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n  /**\n   * The host element <nylas-min-cancellation-notice>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The name of the min cancellation notice input.\n   */\n  @Prop() name: string = 'min-cancellation-notice';\n\n  /**\n   * The selected number of minutes for the min cancellation notice.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the min cancellation notice.\n   */\n  @State() selectedPeriod;\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-min-cancellation-notice', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const minCancellationNotice = typeof newVal?.scheduler?.min_cancellation_notice !== 'undefined' ? newVal?.scheduler?.min_cancellation_notice : this.minCancellationNotice || 0;\n    if (typeof minCancellationNotice === 'number') {\n      this.updateNumberAndPeriodFromMinutes(minCancellationNotice);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(minCancellationNotice?.toString(), this.name);\n  }\n\n  /**\n   * This event is fired when the value of the min cancellation notice changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-min-cancellation-notice', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-min-cancellation-notice', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-min-cancellation-notice', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromMinutes(this.minCancellationNotice || 0);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-min-cancellation-notice', 'disconnectedCallback');\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.valueChanged.emit({ value: totalMinutes, name: 'minCancellationNotice' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    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    if (minutes == 0) {\n      number = 0;\n      period = 'minute';\n    } else if (minutes >= minutesInMonth) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasMinCancellationNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-min-cancellation-notice',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-min-cancellation-notice\" part=\"nmcn\">\n          <label>\n            Minimum cancellation notice\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The minimum amount of time required to cancel a booking.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTimePeriodSelector && (\n            <time-period-selector\n              id=\"min-cancellation-notice\"\n              exportparts=\"tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content\"\n              timePeriods={['minute', 'hour', 'day', 'week']}\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"nylas-min-cancellation-notice.js","sourceRoot":"","sources":["../../../../src/components/scheduler-editor/nylas-min-cancellation-notice/nylas-min-cancellation-notice.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,EAAE,MAAM,eAAe,CAAC;AAsB9H,MAAM,OAAO,0BAA0B;;;oBAUd,yBAAyB;;;;;IA6BhD,yBAAyB,CAAC,QAAgB;QACxC,KAAK,CAAC,+BAA+B,EAAE,2BAA2B,EAAE,QAAQ,CAAC,CAAC;QAC9E,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAC3C,CAAC;IAGD,mCAAmC,CAAC,MAAqB;QACvD,MAAM,qBAAqB,GAAG,OAAO,MAAM,EAAE,SAAS,EAAE,uBAAuB,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,EAAE,SAAS,EAAE,uBAAuB,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,IAAI,CAAC,CAAC;QAC/K,IAAI,OAAO,qBAAqB,KAAK,QAAQ,EAAE,CAAC;YAC9C,IAAI,CAAC,gCAAgC,CAAC,qBAAqB,CAAC,CAAC;QAC/D,CAAC;QACD,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,YAAY,KAAK,UAAU,EAAE,CAAC;YACtD,OAAO;QACT,CAAC;QACD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,qBAAqB,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5E,CAAC;IAUD,iBAAiB;QACf,KAAK,CAAC,+BAA+B,EAAE,mBAAmB,CAAC,CAAC;IAC9D,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,+BAA+B,EAAE,mBAAmB,CAAC,CAAC;QAC5D,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5C,CAAC;IAED,gBAAgB;QACd,KAAK,CAAC,+BAA+B,EAAE,kBAAkB,CAAC,CAAC;QAC3D,IAAI,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC/B,IAAI,CAAC,mCAAmC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACvE,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,gCAAgC,CAAC,IAAI,CAAC,qBAAqB,IAAI,CAAC,CAAC,CAAC;QACzE,CAAC;IACH,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,+BAA+B,EAAE,sBAAsB,CAAC,CAAC;IACjE,CAAC;IAGD,wBAAwB,CACtB,KAGE;QAEF,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QACxC,IAAI,YAAY,CAAC;QACjB,MAAM,aAAa,GAAG,EAAE,CAAC;QACzB,MAAM,YAAY,GAAG,aAAa,GAAG,EAAE,CAAC;QACxC,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC,CAAC;QACvC,MAAM,cAAc,GAAG,YAAY,GAAG,EAAE,CAAC;QAEzC,IAAI,MAAM,KAAK,QAAQ,EAAE,CAAC;YACxB,YAAY,GAAG,MAAM,CAAC;QACxB,CAAC;aAAM,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YAC7B,YAAY,GAAG,MAAM,GAAG,aAAa,CAAC;QACxC,CAAC;aAAM,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;YAC5B,YAAY,GAAG,MAAM,GAAG,YAAY,CAAC;QACvC,CAAC;aAAM,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YAC7B,YAAY,GAAG,MAAM,GAAG,aAAa,CAAC;QACxC,CAAC;aAAM,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;YAC9B,YAAY,GAAG,MAAM,GAAG,cAAc,CAAC;QACzC,CAAC;aAAM,CAAC;YACN,YAAY,GAAG,CAAC,CAAC;QACnB,CAAC;QACD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,uBAAuB,EAAE,CAAC,CAAC;QAC/E,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,YAAY,KAAK,UAAU,EAAE,CAAC;YACtD,OAAO;QACT,CAAC;QACD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IAClE,CAAC;IAEO,gCAAgC,CAAC,OAAe;QACtD,MAAM,aAAa,GAAG,EAAE,CAAC;QACzB,MAAM,YAAY,GAAG,aAAa,GAAG,EAAE,CAAC;QACxC,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC,CAAC;QACvC,MAAM,cAAc,GAAG,YAAY,GAAG,EAAE,CAAC;QACzC,IAAI,MAAM,EAAE,MAAM,CAAC;QACnB,IAAI,OAAO,IAAI,CAAC,EAAE,CAAC;YACjB,MAAM,GAAG,CAAC,CAAC;YACX,MAAM,GAAG,QAAQ,CAAC;QACpB,CAAC;aAAM,IAAI,OAAO,IAAI,cAAc,EAAE,CAAC;YACrC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAC,CAAC;YAC9C,MAAM,GAAG,OAAO,CAAC;QACnB,CAAC;aAAM,IAAI,OAAO,IAAI,aAAa,EAAE,CAAC;YACpC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,aAAa,CAAC,CAAC;YAC7C,MAAM,GAAG,MAAM,CAAC;QAClB,CAAC;aAAM,IAAI,OAAO,IAAI,YAAY,EAAE,CAAC;YACnC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC,CAAC;YAC5C,MAAM,GAAG,KAAK,CAAC;QACjB,CAAC;aAAM,IAAI,OAAO,IAAI,aAAa,EAAE,CAAC;YACpC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,aAAa,CAAC,CAAC;YAC7C,MAAM,GAAG,MAAM,CAAC;QAClB,CAAC;aAAM,CAAC;YACN,MAAM,GAAG,OAAO,CAAC;YACjB,MAAM,GAAG,QAAQ,CAAC;QACpB,CAAC;QACD,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;QAC7B,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;IAC/B,CAAC;IAQD,MAAM;QACJ,MAAM,sBAAsB,GAAG,OAAO,IAAI,CAAC,cAAc,IAAI,QAAQ,IAAI,OAAO,IAAI,CAAC,cAAc,IAAI,QAAQ,CAAC;QAChH,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,+BAA+B,EAAC,IAAI,EAAC,MAAM;gBACpD;;oBAEE,6DAAM,KAAK,EAAC,YAAY;wBACtB;4BACE,kEAAW,IAAI,EAAC,cAAc,GAAG;4BACjC,6DAAM,IAAI,EAAC,iBAAiB,+DAAgE,CAC1E,CACf,CACD;gBACP,sBAAsB,IAAI,CACzB,4BACE,EAAE,EAAC,yBAAyB,EAC5B,WAAW,EAAC,0UAA0U,EACtV,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,EAC9C,qBAAqB,EAAE,IAAI,CAAC,cAAc,EAC1C,qBAAqB,EAAE,IAAI,CAAC,cAAc,GAC1C,CACH,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AA3BC;IANC,iBAAiB,CAAgH;QAChI,IAAI,EAAE,+BAA+B;QACrC,YAAY,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,uCAAuC,EAAE,uBAAuB,CAAC,CAAC,CAAC;QAC3F,YAAY,EAAE,EAAE;QAChB,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;wDA2BD","sourcesContent":["import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, State, h, Element, Prop, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-min-cancellation-notice` component is a form input for the minimum period of notice (minutes) that a guest must\n * provide to cancel a booked event.\n *\n * @part nmcn - The minimum cancellation notice container\n * @part nmcn__number-dropdown - The number dropdown container\n * @part nmcn__number-dropdown-button - The number dropdown button\n * @part nmcn__number-dropdown-content - The number dropdown content\n * @part nmcn__period-dropdown - The period dropdown container\n * @part nmcn__period-dropdown-button - The period dropdown button\n * @part nmcn__period-dropdown-content - The period dropdown content\n */\n@Component({\n  tag: 'nylas-min-cancellation-notice',\n  styleUrl: 'nylas-min-cancellation-notice.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasMinCancellationNotice {\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The name of the min cancellation notice input.\n   */\n  @Prop() name: string = 'min-cancellation-notice';\n  /**\n   * @standalone\n   * The minimum cancellation notice (minutes) stored in the configuration\n   */\n  @Prop() minCancellationNotice?: number;\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n  /**\n   * The host element <nylas-min-cancellation-notice>\n   */\n  @Element() host!: HTMLElement;\n  /**\n   * The selected number of minutes for the min cancellation notice.\n   */\n  @State() selectedNumber;\n  /**\n   * The selected period for the min cancellation notice.\n   */\n  @State() selectedPeriod;\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-min-cancellation-notice', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newVal: Configuration) {\n    const minCancellationNotice = typeof newVal?.scheduler?.min_cancellation_notice !== 'undefined' ? newVal?.scheduler?.min_cancellation_notice : this.minCancellationNotice || 0;\n    if (typeof minCancellationNotice === 'number') {\n      this.updateNumberAndPeriodFromMinutes(minCancellationNotice);\n    }\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    this.internals.setFormValue(minCancellationNotice?.toString(), this.name);\n  }\n\n  /**\n   * This event is fired when the value of the min cancellation notice changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n  }>;\n\n  connectedCallback() {\n    debug('nylas-min-cancellation-notice', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-min-cancellation-notice', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-min-cancellation-notice', 'componentDidLoad');\n    if (this.selectedConfiguration) {\n      this.selectedConfigurationChangedHandler(this.selectedConfiguration);\n    } else {\n      this.updateNumberAndPeriodFromMinutes(this.minCancellationNotice || 0);\n    }\n  }\n\n  disconnectedCallback() {\n    debug('nylas-min-cancellation-notice', 'disconnectedCallback');\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.valueChanged.emit({ value: totalMinutes, name: 'minCancellationNotice' });\n    if (typeof this.internals.setFormValue !== 'function') {\n      return;\n    }\n    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    if (minutes == 0) {\n      number = 0;\n      period = 'minute';\n    } else if (minutes >= minutesInMonth) {\n      number = Math.floor(minutes / minutesInMonth);\n      period = 'month';\n    } else if (minutes >= minutesInWeek) {\n      number = Math.floor(minutes / minutesInWeek);\n      period = 'week';\n    } else if (minutes >= minutesInDay) {\n      number = Math.floor(minutes / minutesInDay);\n      period = 'day';\n    } else if (minutes >= minutesInHour) {\n      number = Math.floor(minutes / minutesInHour);\n      period = 'hour';\n    } else {\n      number = minutes;\n      period = 'minute';\n    }\n    this.selectedNumber = number;\n    this.selectedPeriod = period;\n  }\n\n  @RegisterComponent<NylasMinCancellationNotice, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-min-cancellation-notice',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\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-min-cancellation-notice\" part=\"nmcn\">\n          <label>\n            Minimum cancellation notice\n            <span class=\"label-icon\">\n              <tooltip-component>\n                <info-icon slot=\"tooltip-icon\" />\n                <span slot=\"tooltip-content\">The minimum amount of time required to cancel a booking.</span>\n              </tooltip-component>\n            </span>\n          </label>\n          {showTimePeriodSelector && (\n            <time-period-selector\n              id=\"min-cancellation-notice\"\n              exportparts=\"tps__number-dropdown: nmcn__number-dropdown, tps__number-dropdown-button: nmcn__number-dropdown-button, tps__number-dropdown-content: nmcn__number-dropdown-content, tps__period-dropdown: nmcn__period-dropdown, tps__period-dropdown-button: nmcn__period-dropdown-button, tps__period-dropdown-content: nmcn__period-dropdown-content\"\n              timePeriods={['minute', 'hour', 'day', 'week']}\n              defaultSelectedNumber={this.selectedNumber}\n              defaultSelectedPeriod={this.selectedPeriod}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}