@nylas/web-elements 1.1.0-canary.15 → 1.1.0-canary.17

package/dist/nylas-web-elements/nylas-customize-booking-settings.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, i as createEvent, h, a as Host, e as getElement } from './index-8362ce5c.js';
-import { R as RegisterComponent } from './register-component-8e4e394f.js';
-import { a as debug } from './utils-49a1d17b.js';
+import { r as registerInstance, a as createEvent, h, e as Host, i as getElement } from './index-582cfc93.js';
+import { R as RegisterComponent } from './register-component-aef40ec4.js';
+import { a as debug } from './utils-04c10cbd.js';
 import './buffer-es6-5510d761.js';
 import './_commonjsHelpers-6cbf8316.js';
 
@@ -32,7 +32,7 @@ const NylasCustomizeBookingSettings = class {
             hostRef.$hostElement$["s-ei"] = this.internals;
         }
         this.selectedConfiguration = undefined;
-        this.defaultAdditionalGuestsHidden = this.selectedConfiguration?.scheduler?.additional_guests_hidden ?? false;
+        this.defaultAdditionalGuestsHidden = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;
         this.defaultHideCancellationOptions = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;
         this.defaultHideReschedulingOptions = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;
         this.name = 'customize-booking-settings';
@@ -46,7 +46,7 @@ const NylasCustomizeBookingSettings = class {
     }
     selectedConfigurationChangedHandler(newValue) {
         debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);
-        this.allowGuestsToInvite = !newValue?.scheduler?.additional_guests_hidden;
+        this.allowGuestsToInvite = !newValue?.scheduler?.hide_additional_guests;
         this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;
         this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;
     }
@@ -78,7 +78,7 @@ const NylasCustomizeBookingSettings = class {
     checkboxToggledHandler(event) {
         const { name, checked } = event.detail;
         switch (name) {
-            case 'additional_guests_hidden':
+            case 'hide_additional_guests':
                 this.allowGuestsToInvite = checked;
                 break;
             case 'hide_cancellation_options':
@@ -103,7 +103,7 @@ const NylasCustomizeBookingSettings = class {
         }), this.name);
     }
     render() {
-        return (h(Host, { key: '992ccff7eab4869bf8b845713417b95e3389fd4e' }, h("div", { key: 'b6ef35657d2bbad229988c0b49583230db54161f', class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { key: 'ff4e03f5c0e9f7d0dae8e231aecc051e6c4c0e19', class: "header", part: "ncbs__header" }, h("h3", { key: 'd2bec3aa510726cbf74972eb88adf5f138ba0b1e' }, "Additional settings"), h("p", { key: 'd77ad0ca1cad6ee54fc7324732d54a8b4a3b8169' }, "Booking settings for the event.")), h("div", { key: '24e2811534d1ecf7fa8581e9fc55c34ceb3ef6d2', class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { key: '61a22cc50cdc6e625d25c5970cf853e5dd8187ab', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { key: '79b6079f75f2fd1b1c850a29ab5b0c15a8ed7d18', name: "additional_guests_hidden", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { key: '11955e5ef0d789692ccb6c4657eaa4c45da26706', slot: "label", class: "label" }, h("p", { key: '9b968109bbabf45eab71c2c44534983138f04f23', class: "label-contents" }, "Allow guests to invite additional guests to the booking."), h("tooltip-component", { key: 'a07a91c34ae38dda51d598fb4468df21adb3f7be', id: "guests" }, h("info-icon", { key: '007977190eff2a79fe50de5f46b8fd51ce331cbe', slot: "tooltip-icon" }), h("span", { key: '10f385796d8872f4a2568192ec707268defe89e9', slot: "tooltip-content" }, "Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses."))))), h("div", { key: 'a134a6ac8b3908c6fa9c512ee110bcd577aac029', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { key: '5ad8ad1c3fb1c937335dd8e0d82a0dd3d5a635dd', name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { key: '40c94ef2bf663ac961eb7aec4bc39691ac6b0818', slot: "label", class: "label" }, h("p", { key: 'd3417ba815f5ab78e503ae6cf9fc7bffcc12d111', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: '7b1c6e8327f76fa552ff9f285bb7d7e88d601a0b' }, "Reschedule"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '4c9acdacae74c069b6d9c4f2bab65f2f2a8bd3f7', id: "reschedule" }, h("info-icon", { key: '2a16cac01e270b0383377692de9ae13717a2d3d0', slot: "tooltip-icon" }), h("span", { key: '17b130ce1be45cce38f72450bc4e6f63aa0bad41', slot: "tooltip-content" }, "Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking."))))), h("div", { key: '1ab5fe25b44eae2f53b2018b6f68f14f1845cf77', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { key: '48502f280cdc6bd9dd4ddfd3b56ee91209b7dec5', name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { key: '4a71756f70076e96ed5eb109f54b679f2267bf69', slot: "label", class: "label" }, h("p", { key: '838fdd1635b8f0ce3f3918adbdd70f516d0fa6bc', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: '85529b0715b538ac7f783d599269bb47bcc5634c' }, "Cancel"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: '748342d43b711d3e3dc28424fe404195c1857c38', id: "cancel" }, h("info-icon", { key: '96e121ef01d79273cd6d170271caadc0aab5e821', slot: "tooltip-icon" }), h("span", { key: '13c99611d0f63cda85aafaf09f29ae283bf52fd5', slot: "tooltip-content" }, "Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.")))))))));
+        return (h(Host, { key: '98e7ab408f5d7dff71321819cbc2a5e336ca52de' }, h("div", { key: 'ea73803234b4843cf7e58dc2570171e0237ea7d1', class: "nylas-customize-booking-settings", part: "ncbs" }, h("div", { key: '9b081de7e2d2152b874a5a4713a5313c6e021409', class: "header", part: "ncbs__header" }, h("h3", { key: '976be7412b4f8d70269c3b429652fa1091da1457' }, "Additional settings"), h("p", { key: 'f580ed5fd9c29773715bf26f5dc0c466c56ba43f' }, "Booking settings for the event.")), h("div", { key: '9e694bcf133167fa12efbd46bee02158b56e9777', class: "nylas-customize-booking-settings__settings", part: "ncbs__settings" }, h("div", { key: '39d4154e12c7f5cf96f04ca3fc3e0f17d0e8b2ec', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__additional_guests" }, h("checkbox-component", { key: '61f11b632388d036622078f76f2d90370458b152', name: "hide_additional_guests", label: "Allow guests to invite additional guests.", checked: this.allowGuestsToInvite }, h("span", { key: '14573cca344d64ddfddebe6f402321a52fcce6ee', slot: "label", class: "label" }, h("p", { key: '64790dee39a090a778479a7eb3b1efcd14054bb9', class: "label-contents" }, "Allow guests to invite additional guests to the booking."), h("tooltip-component", { key: '564c56d4f159e11bf82b02eaab43b36ef9dd7117', id: "guests" }, h("info-icon", { key: 'a442aac8c9d930dc6be00a07fb6cd32b39cbd24b', slot: "tooltip-icon" }), h("span", { key: '6a9eff50392213a42be00c99f0f78d5e2d8eb0f4', slot: "tooltip-content" }, "Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses."))))), h("div", { key: 'e7d58c8c04cd715bd02fd4dcc14073ce1f6aaf08', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__rescheduling_options" }, h("checkbox-component", { key: '3f5c22d363bb11012b8514f5a33871a3f054fc80', name: "hide_rescheduling_options", label: "Hide 'Reschedule' option on booking page and emails.", checked: this.hideReschedulingOptions }, h("span", { key: '2ed45b907aa847c41da5a0e394b0b5ddb91a3e26', slot: "label", class: "label" }, h("p", { key: 'a1fc109c7211d387426d66ac9129fad25032565b', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: 'ac79eec03a85d1963ac4e75b0fbf678f4a063776' }, "Reschedule"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: 'd8f41e37b915c0be9154a475da07d5ed343d96b4', id: "reschedule" }, h("info-icon", { key: 'fbb3f300f4276bd249f9cf12d11c4b6467c82247', slot: "tooltip-icon" }), h("span", { key: '689b3c36070c26e6d6bac530a56008404354e43b', slot: "tooltip-content" }, "Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking."))))), h("div", { key: 'f21aeca85fbb63da4d844d37cf87ff1e8d48f001', class: "nylas-customize-booking-settings__settings-div", part: "ncbs__settings-div , ncbs__cancellation_options" }, h("checkbox-component", { key: 'be80ca87a198de83451085fceca77b4d2455357d', name: "hide_cancellation_options", label: "Hide 'Cancel' option on booking page and emails.", checked: this.hideCancellationOptions }, h("span", { key: '80e718e75b94562d3b8c4a3d9f170ee2de0c2c1b', slot: "label", class: "label" }, h("p", { key: 'd46dfe25aa86b112f5c57abe3337de6d88a79c90', class: "label-contents" }, "Hide the\u00A0", h("strong", { key: 'ac243fbb7a3c85c8ab3af28b61ae2724c428ac3e' }, "Cancel"), "\u00A0button on the Scheduling Page and in the email notifications."), h("tooltip-component", { key: 'b720fc3becba6ca2cc71d01bb77c19ec154b1aa1', id: "cancel" }, h("info-icon", { key: '5ab491a0734fe525ad2be3e2ad067cb292cce182', slot: "tooltip-icon" }), h("span", { key: '4621e731c10b515294641be4f9ee60142b46f9c6', slot: "tooltip-content" }, "Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.")))))))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }

package/dist/nylas-web-elements/nylas-customize-booking-settings.entry.js.map

@@ -1 +1 @@
-{"file":"nylas-customize-booking-settings.entry.esm.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.scss?tag=nylas-customize-booking-settings&encapsulation=shadow","src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-customize-booking-settings {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n  .header {\n    padding: 1rem;\n    border-bottom: 1px solid var(--nylas-base-200);\n    h3 {\n      margin: 0;\n      font-size: 1rem;\n      font-weight: 600;\n      line-height: 20px;\n      color: var(--nylas-base-900);\n      text-align: left;\n    }\n    p {\n      margin: 0.25rem 0 0 0;\n      font-size: 0.875rem;\n      font-weight: 400;\n      line-height: 20px;\n      color: var(--nylas-base-600);\n      text-align: left;\n    }\n  }\n  .nylas-customize-booking-settings__settings {\n    display: flex;\n    flex-direction: column;\n    gap: 1.5rem;\n    padding: 1rem;\n    margin: 1rem 0;\n    .nylas-customize-booking-settings__settings-div {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n  }\n}\n\n.label {\n  margin-left: 32px;\n  font-size: 16px;\n  font-weight: 400;\n  color: var(--nylas-base-800);\n  line-height: 24px;\n  .label-contents {\n    margin: 0;\n    display: inline-block;\n    @media #{$mobile} {\n      display: block;\n    }\n  }\n  tooltip-component {\n    display: inline-block;\n  }\n}\n\ntooltip-component#guests::part(tc__content) {\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n\ntooltip-component#reschedule::part(tc__content) {\n  left: 58px;\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n\ntooltip-component#cancel::part(tc__content) {\n  left: -58px;\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-customize-booking-settings` component is a UI component that displays the booking calendar picker.\n * @part ncbs - The booking calendar picker container\n * @part ncbs__header - The header of the booking calendar picker\n * @part ncbs__settings - The settings container\n * @part ncbs__settings-div - The div inside the settings container that contains the checkbox and tooltip for each setting\n * @part ncbs__additional_guests - The additional guests setting\n * @part ncbs__cancellation_options - The cancellation options setting\n * @part ncbs__rescheduling_options - The rescheduling options setting\n */\n@Component({\n  tag: 'nylas-customize-booking-settings',\n  styleUrl: 'nylas-customize-booking-settings.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCustomizeBookingSettings {\n  @Element() host!: HTMLNylasCustomizeBookingSettingsElement;\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * The default additional guests hidden setting as set in the configuration.\n   */\n  @Prop() defaultAdditionalGuestsHidden: boolean = this.selectedConfiguration?.scheduler?.additional_guests_hidden ?? false;\n\n  /**\n   * The default hide cancellation options setting as set in the configuration.\n   */\n  @Prop() defaultHideCancellationOptions: boolean = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;\n\n  /**\n   * The default hide rescheduling options setting as set in the configuration.\n   */\n  @Prop() defaultHideReschedulingOptions: boolean = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;\n\n  /**\n   * The name of the calendar picker.\n   */\n  @Prop() name: string = 'customize-booking-settings';\n\n  /**\n   * State to store the allowed additional guests setting.\n   */\n  @State() allowGuestsToInvite: boolean = this.defaultAdditionalGuestsHidden;\n\n  /**\n   * State to store the hide cancel booking setting.\n   */\n  @State() hideCancellationOptions: boolean = this.defaultHideCancellationOptions;\n\n  /**\n   * State to store the hide reschedule booking setting.\n   */\n  @State() hideReschedulingOptions: boolean = this.defaultHideReschedulingOptions;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * This event is fired when the selected booking calendar changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-customize-booking-settings', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);\n    this.allowGuestsToInvite = !newValue?.scheduler?.additional_guests_hidden;\n    this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;\n    this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-customize-booking-settings', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-customize-booking-settings', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-customize-booking-settings', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-customize-booking-settings', 'componentDidLoad');\n  }\n\n  componentWillUpdate() {\n    debug('nylas-customize-booking-settings', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-customize-booking-settings', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-customize-booking-settings', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-customize-booking-settings', 'componentDidRender');\n  }\n\n  @Listen('nylasFormCheckboxToggled')\n  checkboxToggledHandler(event: CustomEvent<{ name: string; checked: boolean }>) {\n    const { name, checked } = event.detail;\n    switch (name) {\n      case 'additional_guests_hidden':\n        this.allowGuestsToInvite = checked;\n        break;\n      case 'hide_cancellation_options':\n        this.hideCancellationOptions = checked;\n        break;\n      case 'hide_rescheduling_options':\n        this.hideReschedulingOptions = checked;\n        break;\n    }\n    this.valueChanged.emit({\n      value: JSON.stringify({\n        additionalGuestsHidden: !this.allowGuestsToInvite,\n        hideCancellationOptions: this.hideCancellationOptions,\n        hideReschedulingOptions: this.hideReschedulingOptions,\n      }),\n      name: this.name,\n    });\n    this.internals.setFormValue(\n      JSON.stringify({\n        additionalGuestsHidden: !this.allowGuestsToInvite,\n        hideCancellationOptions: this.hideCancellationOptions,\n        hideReschedulingOptions: this.hideReschedulingOptions,\n      }),\n      this.name,\n    );\n  }\n\n  @RegisterComponent<NylasCustomizeBookingSettings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-customize-booking-settings',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-customize-booking-settings\" part=\"ncbs\">\n          <div class=\"header\" part=\"ncbs__header\">\n            <h3>Additional settings</h3>\n            <p>Booking settings for the event.</p>\n          </div>\n\n          <div class=\"nylas-customize-booking-settings__settings\" part=\"ncbs__settings\">\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__additional_guests\">\n              <checkbox-component name=\"additional_guests_hidden\" label=\"Allow guests to invite additional guests.\" checked={this.allowGuestsToInvite}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">Allow guests to invite additional guests to the booking.</p>\n                  <tooltip-component id=\"guests\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__rescheduling_options\">\n              <checkbox-component name=\"hide_rescheduling_options\" label=\"Hide 'Reschedule' option on booking page and emails.\" checked={this.hideReschedulingOptions}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">\n                    Hide the&nbsp;<strong>Reschedule</strong>&nbsp;button on the Scheduling Page and in the email notifications.\n                  </p>\n                  <tooltip-component id=\"reschedule\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__cancellation_options\">\n              <checkbox-component name=\"hide_cancellation_options\" label=\"Hide 'Cancel' option on booking page and emails.\" checked={this.hideCancellationOptions}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">\n                    Hide the&nbsp;<strong>Cancel</strong>&nbsp;button on the Scheduling Page and in the email notifications.\n                  </p>\n                  <tooltip-component id=\"cancel\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nylas-customize-booking-settings.entry.esm.js","mappings":";;;;;;AAAA,MAAM,gCAAgC,GAAG,iqEAAiqE;;;;;;;;;;;;;;;;MCuB7rE,6BAA6B;;;;;;;;;;;;6CAUS,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,sBAAsB,IAAI,KAAK;8CAKrE,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK;8CAKzE,IAAI,CAAC,qBAAqB,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK;oBAKpG,4BAA4B;mCAKX,IAAI,CAAC,6BAA6B;uCAK9B,IAAI,CAAC,8BAA8B;uCAKnC,IAAI,CAAC,8BAA8B;;IAsB/E,yBAAyB,CAAC,QAAgB;QACxC,KAAK,CAAC,kCAAkC,EAAE,2BAA2B,EAAE,QAAQ,CAAC,CAAC;QACjF,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KAC1C;IAGD,mCAAmC,CAAC,QAAuB;QACzD,KAAK,CAAC,kCAAkC,EAAE,qCAAqC,EAAE,QAAQ,CAAC,CAAC;QAC3F,IAAI,CAAC,mBAAmB,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,sBAAsB,CAAC;QACxE,IAAI,CAAC,uBAAuB,GAAG,QAAQ,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK,CAAC;QACvF,IAAI,CAAC,uBAAuB,GAAG,QAAQ,EAAE,SAAS,EAAE,yBAAyB,IAAI,KAAK,CAAC;KACxF;IAGD,iBAAiB;QACf,KAAK,CAAC,kCAAkC,EAAE,mBAAmB,CAAC,CAAC;KAChE;IAED,oBAAoB;QAClB,KAAK,CAAC,kCAAkC,EAAE,sBAAsB,CAAC,CAAC;KACnE;IAED,iBAAiB;QACf,KAAK,CAAC,kCAAkC,EAAE,mBAAmB,CAAC,CAAC;QAE/D,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;KAC3C;IAED,gBAAgB;QACd,KAAK,CAAC,kCAAkC,EAAE,kBAAkB,CAAC,CAAC;KAC/D;IAED,mBAAmB;QACjB,KAAK,CAAC,kCAAkC,EAAE,qBAAqB,CAAC,CAAC;KAClE;IAED,kBAAkB;QAChB,KAAK,CAAC,kCAAkC,EAAE,oBAAoB,CAAC,CAAC;KACjE;IAED,mBAAmB;QACjB,KAAK,CAAC,kCAAkC,EAAE,qBAAqB,CAAC,CAAC;KAClE;IAED,kBAAkB;QAChB,KAAK,CAAC,kCAAkC,EAAE,oBAAoB,CAAC,CAAC;KACjE;IAGD,sBAAsB,CAAC,KAAsD;QAC3E,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QACvC,QAAQ,IAAI;YACV,KAAK,wBAAwB;gBAC3B,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC;gBACnC,MAAM;YACR,KAAK,2BAA2B;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,OAAO,CAAC;gBACvC,MAAM;YACR,KAAK,2BAA2B;gBAC9B,IAAI,CAAC,uBAAuB,GAAG,OAAO,CAAC;gBACvC,MAAM;SACT;QACD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACrB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC;gBACpB,sBAAsB,EAAE,CAAC,IAAI,CAAC,mBAAmB;gBACjD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;gBACrD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;aACtD,CAAC;YACF,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,YAAY,CACzB,IAAI,CAAC,SAAS,CAAC;YACb,sBAAsB,EAAE,CAAC,IAAI,CAAC,mBAAmB;YACjD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;YACrD,uBAAuB,EAAE,IAAI,CAAC,uBAAuB;SACtD,CAAC,EACF,IAAI,CAAC,IAAI,CACV,CAAC;KACH;IAOD,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,kCAAkC,EAAC,IAAI,EAAC,MAAM,IACvD,4DAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,cAAc,IACrC,mFAA4B,EAC5B,8FAAsC,CAClC,EAEN,4DAAK,KAAK,EAAC,4CAA4C,EAAC,IAAI,EAAC,gBAAgB,IAC3E,4DAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,8CAA8C,IAC7G,2EAAoB,IAAI,EAAC,wBAAwB,EAAC,KAAK,EAAC,2CAA2C,EAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,IACnI,6DAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,0DAAG,KAAK,EAAC,gBAAgB,+DAA6D,EACtF,0EAAmB,EAAE,EAAC,QAAQ,IAC5B,kEAAW,IAAI,EAAC,cAAc,GAAG,EACjC,6DAAM,IAAI,EAAC,iBAAiB,2IAErB,CACW,CACf,CACY,CACjB,EACN,4DAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,iDAAiD,IAChH,2EAAoB,IAAI,EAAC,2BAA2B,EAAC,KAAK,EAAC,sDAAsD,EAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,IACrJ,6DAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,0DAAG,KAAK,EAAC,gBAAgB,sBACT,8EAA2B,wEACvC,EACJ,0EAAmB,EAAE,EAAC,YAAY,IAChC,kEAAW,IAAI,EAAC,cAAc,GAAG,EACjC,6DAAM,IAAI,EAAC,iBAAiB,4JAErB,CACW,CACf,CACY,CACjB,EACN,4DAAK,KAAK,EAAC,gDAAgD,EAAC,IAAI,EAAC,iDAAiD,IAChH,2EAAoB,IAAI,EAAC,2BAA2B,EAAC,KAAK,EAAC,kDAAkD,EAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,IACjJ,6DAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,IAC9B,0DAAG,KAAK,EAAC,gBAAgB,sBACT,0EAAuB,wEACnC,EACJ,0EAAmB,EAAE,EAAC,QAAQ,IAC5B,kEAAW,IAAI,EAAC,cAAc,GAAG,EACjC,6DAAM,IAAI,EAAC,iBAAiB,oJAErB,CACW,CACf,CACY,CACjB,CACF,CACF,CACD,EACP;KACH;;;;;;;;AAzDD;IALC,iBAAiB,CAAmH;QACnI,IAAI,EAAE,kCAAkC;QACxC,YAAY,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,uCAAuC,EAAE,uBAAuB,CAAC,CAAC,CAAC;QAC3F,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;2DA0DD;;;;;","names":[],"sources":["src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.scss?tag=nylas-customize-booking-settings&encapsulation=shadow","src/components/scheduler-editor/nylas-customize-booking-settings/nylas-customize-booking-settings.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  @include default-css-variables;\n  width: inherit;\n}\n\n.nylas-customize-booking-settings {\n  width: inherit;\n  display: flex;\n  flex-direction: column;\n  margin: 1rem;\n  border-radius: var(--nylas-border-radius-2x);\n  border: 1px solid var(--nylas-base-200);\n  .header {\n    padding: 1rem;\n    border-bottom: 1px solid var(--nylas-base-200);\n    h3 {\n      margin: 0;\n      font-size: 1rem;\n      font-weight: 600;\n      line-height: 20px;\n      color: var(--nylas-base-900);\n      text-align: left;\n    }\n    p {\n      margin: 0.25rem 0 0 0;\n      font-size: 0.875rem;\n      font-weight: 400;\n      line-height: 20px;\n      color: var(--nylas-base-600);\n      text-align: left;\n    }\n  }\n  .nylas-customize-booking-settings__settings {\n    display: flex;\n    flex-direction: column;\n    gap: 1.5rem;\n    padding: 1rem;\n    margin: 1rem 0;\n    .nylas-customize-booking-settings__settings-div {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n  }\n}\n\n.label {\n  margin-left: 32px;\n  font-size: 16px;\n  font-weight: 400;\n  color: var(--nylas-base-800);\n  line-height: 24px;\n  .label-contents {\n    margin: 0;\n    display: inline-block;\n    @media #{$mobile} {\n      display: block;\n    }\n  }\n  tooltip-component {\n    display: inline-block;\n  }\n}\n\ntooltip-component#guests::part(tc__content) {\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n\ntooltip-component#reschedule::part(tc__content) {\n  left: 58px;\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n\ntooltip-component#cancel::part(tc__content) {\n  left: -58px;\n  @media #{$mobile} {\n    left: 58px;\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Configuration } from '@nylas/core';\n\n/**\n * The `nylas-customize-booking-settings` component is a UI component that displays the booking calendar picker.\n * @part ncbs - The booking calendar picker container\n * @part ncbs__header - The header of the booking calendar picker\n * @part ncbs__settings - The settings container\n * @part ncbs__settings-div - The div inside the settings container that contains the checkbox and tooltip for each setting\n * @part ncbs__additional_guests - The additional guests setting\n * @part ncbs__cancellation_options - The cancellation options setting\n * @part ncbs__rescheduling_options - The rescheduling options setting\n */\n@Component({\n  tag: 'nylas-customize-booking-settings',\n  styleUrl: 'nylas-customize-booking-settings.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasCustomizeBookingSettings {\n  @Element() host!: HTMLNylasCustomizeBookingSettingsElement;\n  /**\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n\n  /**\n   * The default additional guests hidden setting as set in the configuration.\n   */\n  @Prop() defaultAdditionalGuestsHidden: boolean = this.selectedConfiguration?.scheduler?.hide_additional_guests ?? false;\n\n  /**\n   * The default hide cancellation options setting as set in the configuration.\n   */\n  @Prop() defaultHideCancellationOptions: boolean = this.selectedConfiguration?.scheduler?.hide_cancellation_options ?? false;\n\n  /**\n   * The default hide rescheduling options setting as set in the configuration.\n   */\n  @Prop() defaultHideReschedulingOptions: boolean = this.selectedConfiguration?.scheduler?.hide_rescheduling_options ?? false;\n\n  /**\n   * The name of the calendar picker.\n   */\n  @Prop() name: string = 'customize-booking-settings';\n\n  /**\n   * State to store the allowed additional guests setting.\n   */\n  @State() allowGuestsToInvite: boolean = this.defaultAdditionalGuestsHidden;\n\n  /**\n   * State to store the hide cancel booking setting.\n   */\n  @State() hideCancellationOptions: boolean = this.defaultHideCancellationOptions;\n\n  /**\n   * State to store the hide reschedule booking setting.\n   */\n  @State() hideReschedulingOptions: boolean = this.defaultHideReschedulingOptions;\n\n  /**\n   * The element internals.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * This event is fired when the selected booking calendar changes.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\n    valueChanged?: (event: CustomEvent<{ value: string; name: string }>) => void;\n  }>;\n\n  /**\n   * When a name prop is passed, stencil does not automatically set the name attribute on the host element.\n   * Since this component is form-associated, the name attribute is required for form submission.\n   * This is a workaround to ensure that the name attribute is set on the host element.\n   */\n  @Watch('name')\n  elementNameChangedHandler(newValue: string) {\n    debug('nylas-customize-booking-settings', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('selectedConfiguration')\n  selectedConfigurationChangedHandler(newValue: Configuration) {\n    debug('nylas-customize-booking-settings', 'selectedConfigurationChangedHandler', newValue);\n    this.allowGuestsToInvite = !newValue?.scheduler?.hide_additional_guests;\n    this.hideCancellationOptions = newValue?.scheduler?.hide_cancellation_options ?? false;\n    this.hideReschedulingOptions = newValue?.scheduler?.hide_rescheduling_options ?? false;\n  }\n\n  // Lifecycle methods\n  connectedCallback() {\n    debug('nylas-customize-booking-settings', 'connectedCallback');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-customize-booking-settings', 'disconnectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-customize-booking-settings', 'componentWillLoad');\n    // See comment in the @Watch('name') decorator for more information.\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-customize-booking-settings', 'componentDidLoad');\n  }\n\n  componentWillUpdate() {\n    debug('nylas-customize-booking-settings', 'componentWillUpdate');\n  }\n\n  componentDidUpdate() {\n    debug('nylas-customize-booking-settings', 'componentDidUpdate');\n  }\n\n  componentWillRender() {\n    debug('nylas-customize-booking-settings', 'componentWillRender');\n  }\n\n  componentDidRender() {\n    debug('nylas-customize-booking-settings', 'componentDidRender');\n  }\n\n  @Listen('nylasFormCheckboxToggled')\n  checkboxToggledHandler(event: CustomEvent<{ name: string; checked: boolean }>) {\n    const { name, checked } = event.detail;\n    switch (name) {\n      case 'hide_additional_guests':\n        this.allowGuestsToInvite = checked;\n        break;\n      case 'hide_cancellation_options':\n        this.hideCancellationOptions = checked;\n        break;\n      case 'hide_rescheduling_options':\n        this.hideReschedulingOptions = checked;\n        break;\n    }\n    this.valueChanged.emit({\n      value: JSON.stringify({\n        additionalGuestsHidden: !this.allowGuestsToInvite,\n        hideCancellationOptions: this.hideCancellationOptions,\n        hideReschedulingOptions: this.hideReschedulingOptions,\n      }),\n      name: this.name,\n    });\n    this.internals.setFormValue(\n      JSON.stringify({\n        additionalGuestsHidden: !this.allowGuestsToInvite,\n        hideCancellationOptions: this.hideCancellationOptions,\n        hideReschedulingOptions: this.hideReschedulingOptions,\n      }),\n      this.name,\n    );\n  }\n\n  @RegisterComponent<NylasCustomizeBookingSettings, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-customize-booking-settings',\n    stateToProps: new Map([['schedulerConfig.selectedConfiguration', 'selectedConfiguration']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"nylas-customize-booking-settings\" part=\"ncbs\">\n          <div class=\"header\" part=\"ncbs__header\">\n            <h3>Additional settings</h3>\n            <p>Booking settings for the event.</p>\n          </div>\n\n          <div class=\"nylas-customize-booking-settings__settings\" part=\"ncbs__settings\">\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__additional_guests\">\n              <checkbox-component name=\"hide_additional_guests\" label=\"Allow guests to invite additional guests.\" checked={this.allowGuestsToInvite}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">Allow guests to invite additional guests to the booking.</p>\n                  <tooltip-component id=\"guests\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Allow guests to invite additional guests to the event. If enabled, the guest will be able to add additional guests' email addresses.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__rescheduling_options\">\n              <checkbox-component name=\"hide_rescheduling_options\" label=\"Hide 'Reschedule' option on booking page and emails.\" checked={this.hideReschedulingOptions}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">\n                    Hide the&nbsp;<strong>Reschedule</strong>&nbsp;button on the Scheduling Page and in the email notifications.\n                  </p>\n                  <tooltip-component id=\"reschedule\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Hide the 'Reschedule' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to reschedule the booking.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n            <div class=\"nylas-customize-booking-settings__settings-div\" part=\"ncbs__settings-div , ncbs__cancellation_options\">\n              <checkbox-component name=\"hide_cancellation_options\" label=\"Hide 'Cancel' option on booking page and emails.\" checked={this.hideCancellationOptions}>\n                <span slot=\"label\" class=\"label\">\n                  <p class=\"label-contents\">\n                    Hide the&nbsp;<strong>Cancel</strong>&nbsp;button on the Scheduling Page and in the email notifications.\n                  </p>\n                  <tooltip-component id=\"cancel\">\n                    <info-icon slot=\"tooltip-icon\" />\n                    <span slot=\"tooltip-content\">\n                      Hide the 'Cancel' button on the Scheduling page and in the email notifications. If enabled, the guest will not be able to cancel the booking.\n                    </span>\n                  </tooltip-component>\n                </span>\n              </checkbox-component>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/nylas-web-elements/nylas-date-picker.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, i as createEvent, h, a as Host } from './index-8362ce5c.js';
-import { R as RegisterComponent } from './register-component-8e4e394f.js';
-import { h as addDaysToCurrentDate, l as getLastDayOfMonth, m as getFirstDayOfMonth, n as isSameDay, o as convertMinutesToHoursAndMinutes, p as isSameMonth } from './utils-49a1d17b.js';
+import { r as registerInstance, a as createEvent, h, e as Host } from './index-582cfc93.js';
+import { R as RegisterComponent } from './register-component-aef40ec4.js';
+import { h as addDaysToCurrentDate, l as getLastDayOfMonth, m as getFirstDayOfMonth, n as isSameDay, o as convertMinutesToHoursAndMinutes, p as isSameMonth } from './utils-04c10cbd.js';
 import './buffer-es6-5510d761.js';
 import './_commonjsHelpers-6cbf8316.js';
 

package/dist/nylas-web-elements/nylas-editor-tabs.entry.js

@@ -1,6 +1,6 @@
-import { h, r as registerInstance, i as createEvent, a as Host, e as getElement } from './index-8362ce5c.js';
-import { R as RegisterComponent } from './register-component-8e4e394f.js';
-import { q as mergeDeep, a as debug, r as parsePreviewLink } from './utils-49a1d17b.js';
+import { h, r as registerInstance, a as createEvent, e as Host, i as getElement } from './index-582cfc93.js';
+import { R as RegisterComponent } from './register-component-aef40ec4.js';
+import { q as mergeDeep, a as debug, r as parsePreviewLink } from './utils-04c10cbd.js';
 import { D as DEFAULT_OPEN_HOURS } from './constants-b20948c9.js';
 import './buffer-es6-5510d761.js';
 import './_commonjsHelpers-6cbf8316.js';
@@ -41,6 +41,10 @@ function TabContents({ id, formState, activeTab, calendars }) {
                         h("nylas-cancellation-policy", { name: "cancellation-policy", cancellationPolicy: formState.cancellationPolicy, exportparts: "ncpolicy, ncpolicy__textarea" }))),
                 h("nylas-timeslot-interval", { name: "timeslot-interval", eventDurationMinutes: parseInt(formState.duration), exportparts: "nti, nti__header, nti__input-label, nti__dropdown, nti__dropdown-button, nti__dropdown-content" }),
                 h("nylas-customize-booking-settings", { name: "customize-booking-settings", exportparts: "ncbs, ncbs__header, ncbs__settings, ncbs__settings-div, ncbs__additional_guests, ncbs__cancellation_options, ncbs__rescheduling_options" })));
+        case 'participants':
+            return (h("div", { key: id },
+                h("nylas-additional-participants", { name: "participants", eventParticipants: formState.participants, exportparts: "nap__title, nap__subtitle, nap__content, nap__input_group, nap__input_wrapper, nap__input, nap__remove-participant" }),
+                h("nylas-participants-custom-availability", { name: "participant-custom-availability", participants: formState.participants, exportparts: "npca, npca__header, npca__content, npca__participant-container, npca__participant-title, npca__participant-toggle--container, npca__toggle-label, npca__toggle-input, npca__toggle-slider" })));
     }
 }
 
@@ -80,8 +84,7 @@ const NylasEditorTabs = class {
             this.isLoading = true;
             this.hasUnsavedChanges = false;
             const formState = this.updateFormState();
-            const { title, description, duration, availability, calendarIds, bookingCalendar, location, bookingType, buffer, availableDaysInFuture, minCancellationNotice, minBookingNotice, cancellationPolicy, timeslotInterval, additionalGuestsHidden, hideCancellationOptions, hideReschedulingOptions, } = formState;
-            const organizer = this.selectedConfiguration?.participants?.find(p => p.is_organizer);
+            const { title, description, duration, availability, calendarIds, bookingCalendar, location, bookingType, buffer, availableDaysInFuture, minCancellationNotice, minBookingNotice, cancellationPolicy, timeslotInterval, additionalGuestsHidden, hideCancellationOptions, hideReschedulingOptions, participants, participantOpenHours, } = formState;
             const durationMinutes = duration ? parseInt(duration) : 30;
             const configObject = {
                 ...(this.selectedConfiguration?.id && { id: this.selectedConfiguration.id }),
@@ -93,23 +96,34 @@ const NylasEditorTabs = class {
                     availability_rules: {
                         availability_method: this.selectedConfiguration?.availability?.availability_rules?.availability_method ?? 'collective',
                         buffer: buffer || { before: 0, after: 0 },
-                        default_open_hours: this.selectedConfiguration?.availability?.availability_rules?.default_open_hours ?? DEFAULT_OPEN_HOURS,
+                        default_open_hours: availability?.openHours ?? this.selectedConfiguration?.availability?.availability_rules?.default_open_hours ?? DEFAULT_OPEN_HOURS,
                         round_robin_group_id: this.selectedConfiguration?.availability?.availability_rules?.round_robin_group_id ?? '',
                     },
                 },
                 participants: [
-                    {
-                        name: organizer?.name ?? organizer?.email ?? this.currentUser?.name ?? this.currentUser?.email ?? '',
-                        email: organizer?.email ?? this.currentUser?.email ?? '',
-                        is_organizer: true,
-                        availability: {
-                            calendar_ids: calendarIds?.length ? calendarIds : ['primary'],
-                            open_hours: availability?.openHours ?? [],
-                        },
-                        booking: {
-                            calendar_id: bookingCalendar && bookingCalendar !== '' ? bookingCalendar : 'primary',
-                        },
-                    },
+                    ...(participants?.map(p => {
+                        if (p.is_organizer) {
+                            return {
+                                name: p.name ?? p.email,
+                                email: p.email,
+                                is_organizer: true,
+                                availability: {
+                                    calendar_ids: calendarIds?.length ? calendarIds : ['primary'],
+                                    open_hours: participantOpenHours?.[p.email] ?? p.availability?.open_hours ?? [],
+                                },
+                                booking: {
+                                    calendar_id: bookingCalendar && bookingCalendar !== '' ? bookingCalendar : 'primary',
+                                },
+                            };
+                        }
+                        return {
+                            ...p,
+                            availability: {
+                                calendar_ids: p.availability?.calendar_ids ?? ['primary'],
+                                open_hours: participantOpenHours?.[p.email] ?? p.availability?.open_hours ?? [],
+                            },
+                        };
+                    }) ?? []),
                 ],
                 event_booking: {
                     title: title?.toString() ?? '',
@@ -123,7 +137,7 @@ const NylasEditorTabs = class {
                     available_days_in_future: availableDaysInFuture ?? 30,
                     min_cancellation_notice: minCancellationNotice ?? 0,
                     min_booking_notice: minBookingNotice ?? 60,
-                    additional_guests_hidden: additionalGuestsHidden ?? false,
+                    hide_additional_guests: additionalGuestsHidden ?? false,
                     hide_cancellation_options: hideCancellationOptions ?? false,
                     hide_rescheduling_options: hideReschedulingOptions ?? false,
                 },
@@ -180,7 +194,8 @@ const NylasEditorTabs = class {
     handleValueChanged(event) {
         debug('[nylas-editor-tabs]', 'handleValueChanged', event);
         const { name, value } = event.detail;
-        this.formState = { ...this.formState, [name]: value };
+        this.setFormState(value, name);
+        this.formState = { ...this.formState };
         this.hasUnsavedChanges = true;
         this.error = '';
     }
@@ -192,7 +207,7 @@ const NylasEditorTabs = class {
             duration: config?.availability?.duration_minutes?.toString() ?? '30',
             availability: {
                 timezone: config?.event_booking?.timezone ?? Intl.DateTimeFormat().resolvedOptions().timeZone,
-                openHours: organizerParticipant?.availability?.open_hours,
+                openHours: config?.availability?.availability_rules?.default_open_hours ?? DEFAULT_OPEN_HOURS,
             },
             calendarIds: organizerParticipant?.availability?.calendar_ids ?? [],
             participants: config?.participants ?? [],
@@ -208,67 +223,74 @@ const NylasEditorTabs = class {
                 interval: config?.availability?.interval_minutes ?? config?.availability?.duration_minutes ?? 10,
                 roundTo: config?.availability?.round_to,
             },
-            additionalGuestsHidden: config?.scheduler?.additional_guests_hidden ?? false,
+            additionalGuestsHidden: config?.scheduler?.hide_additional_guests ?? false,
             hideCancellationOptions: config?.scheduler?.hide_cancellation_options ?? false,
             hideReschedulingOptions: config?.scheduler?.hide_rescheduling_options ?? false,
         };
     }
+    setFormState(value, key) {
+        switch (key) {
+            case 'title':
+                this.formState.title = value.toString();
+                break;
+            case 'description':
+                this.formState.description = value.toString();
+                break;
+            case 'duration':
+                this.formState.duration = value.toString();
+                break;
+            case 'availability':
+                this.formState.availability = JSON.parse(value.toString());
+                break;
+            case 'participants':
+                this.formState.participants = JSON.parse(value.toString());
+                break;
+            case 'calendars':
+                this.formState.calendarIds = value.toString().split(',');
+                break;
+            case 'booking-calendar':
+                this.formState.bookingCalendar = value.toString();
+                break;
+            case 'location':
+                this.formState.location = value.toString();
+                break;
+            case 'booking-type':
+                this.formState.bookingType = value.toString();
+                break;
+            case 'buffer-time':
+                this.formState.buffer = JSON.parse(value.toString());
+                break;
+            case 'limit-future-bookings':
+                this.formState.availableDaysInFuture = parseInt(value.toString());
+                break;
+            case 'min-cancellation-notice':
+                this.formState.minCancellationNotice = parseInt(value.toString());
+                break;
+            case 'min-booking-notice':
+                this.formState.minBookingNotice = parseInt(value.toString());
+                break;
+            case 'cancellation-policy':
+                this.formState.cancellationPolicy = value.toString();
+                break;
+            case 'timeslot-interval':
+                this.formState.timeslotInterval = JSON.parse(value.toString());
+                break;
+            case 'customize-booking-settings':
+                const settings = JSON.parse(value.toString());
+                this.formState.additionalGuestsHidden = settings.additionalGuestsHidden;
+                this.formState.hideCancellationOptions = settings.hideCancellationOptions;
+                this.formState.hideReschedulingOptions = settings.hideReschedulingOptions;
+                break;
+            case 'participant-custom-availability':
+                const participantOpenHours = JSON.parse(value.toString());
+                this.formState.participantOpenHours = participantOpenHours;
+                break;
+        }
+    }
     updateFormState() {
         const formData = new FormData(this.formRef);
         formData.forEach((value, key) => {
-            switch (key) {
-                case 'title':
-                    this.formState.title = value.toString();
-                    break;
-                case 'description':
-                    this.formState.description = value.toString();
-                    break;
-                case 'duration':
-                    this.formState.duration = value.toString();
-                    break;
-                case 'availability':
-                    this.formState.availability = JSON.parse(value.toString());
-                    break;
-                case 'participants':
-                    this.formState.participants = JSON.parse(value.toString());
-                    break;
-                case 'calendars':
-                    this.formState.calendarIds = value.toString().split(',');
-                    break;
-                case 'booking-calendar':
-                    this.formState.bookingCalendar = value.toString();
-                    break;
-                case 'location':
-                    this.formState.location = value.toString();
-                    break;
-                case 'booking-type':
-                    this.formState.bookingType = value.toString();
-                    break;
-                case 'buffer-time':
-                    this.formState.buffer = JSON.parse(value.toString());
-                    break;
-                case 'limit-future-bookings':
-                    this.formState.availableDaysInFuture = parseInt(value.toString());
-                    break;
-                case 'min-cancellation-notice':
-                    this.formState.minCancellationNotice = parseInt(value.toString());
-                    break;
-                case 'min-booking-notice':
-                    this.formState.minBookingNotice = parseInt(value.toString());
-                    break;
-                case 'cancellation-policy':
-                    this.formState.cancellationPolicy = value.toString();
-                    break;
-                case 'timeslot-interval':
-                    this.formState.timeslotInterval = JSON.parse(value.toString());
-                    break;
-                case 'customize-booking-settings':
-                    const settings = JSON.parse(value.toString());
-                    this.formState.additionalGuestsHidden = settings.additionalGuestsHidden;
-                    this.formState.hideCancellationOptions = settings.hideCancellationOptions;
-                    this.formState.hideReschedulingOptions = settings.hideReschedulingOptions;
-                    break;
-            }
+            this.setFormState(value, key);
         });
         this.formState = { ...this.formState };
         return this.formState;
@@ -280,22 +302,23 @@ const NylasEditorTabs = class {
     }
     render() {
         debug('[nylas-editor-tabs]', 'render', this.formState);
-        return (h(Host, { key: 'de54edb776a03cca0c170f3e1d5f6201cd520172' }, h("form", { key: '013ba8fa3d09938c1cdb686884a035967e5dd5c5', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "form-contents" }, h("div", { class: "tabs" }, h("button", { class: { tab: true, active: this.activeTab == 'eventInfo' }, onClick: e => this.setActiveTab(e, 'eventInfo') }, h("calendar-info-icon", { width: "16", height: "16" }), "Event Info"), h("button", { class: { tab: true, active: this.activeTab == 'availability' }, onClick: e => this.setActiveTab(e, 'availability') }, h("calendar-patterns-icon", { width: "16", height: "16" }), "Availability"), h("button", { class: { tab: true, active: this.activeTab == 'bookingOptions' }, onClick: e => this.setActiveTab(e, 'bookingOptions') }, h("flow-icon", { width: "16", height: "16" }), "Booking Options")), h("div", { class: "tab-content" }, h(TabContents, { formState: this.formState, activeTab: this.activeTab, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new' })))) : (h("slot", null)), h("div", { key: 'd16cd84ad1d7fc69b700519851da428a2f15bdd3', class: "footer" }, h("div", { key: '91ac1d799dd53725041d6e12577e7186f8ddad95', class: "preview" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { type: "button", disabled: this.isLoading, clickHandler: event => {
+        const showParticipantsTab = localStorage.getItem('nylas') === 'Nylas Developer';
+        return (h(Host, { key: 'ccfd780da5c6ce1688f60384796bbaa98fe6094d' }, h("form", { key: '2e5d1c16a5373a5b623869925a7cab71f52f98ce', onSubmit: this.formSubmissionHandler, class: "scheduler-editor", ref: el => (this.formRef = el), noValidate: true }, this.mode === 'app' ? (h("div", { class: "form-contents" }, h("div", { class: "tabs" }, h("button", { class: { tab: true, active: this.activeTab == 'eventInfo' }, onClick: e => this.setActiveTab(e, 'eventInfo') }, h("calendar-info-icon", { width: "16", height: "16" }), "Event Info"), h("button", { class: { tab: true, active: this.activeTab == 'availability' }, onClick: e => this.setActiveTab(e, 'availability') }, h("calendar-patterns-icon", { width: "16", height: "16" }), "Availability"), h("button", { class: { tab: true, active: this.activeTab == 'bookingOptions' }, onClick: e => this.setActiveTab(e, 'bookingOptions') }, h("flow-icon", { width: "16", height: "16" }), "Booking Options"), showParticipantsTab && (h("button", { class: { tab: true, active: this.activeTab == 'participants' }, onClick: e => this.setActiveTab(e, 'participants') }, h("people-icon", { width: "16", height: "16" }), "Participants"))), h("div", { class: "tab-content" }, h(TabContents, { formState: this.formState, activeTab: this.activeTab, calendars: this.calendars, id: this.selectedConfiguration?.id ?? 'new' })))) : (h("slot", null)), h("div", { key: 'f11d2767c5fc65ad7a72f346e9b3940b8151d7a3', class: "footer" }, h("div", { key: '858c5dac4d006f28b05347be3feba2d6dd336b15', class: "preview" }, this.schedulerPreviewLink !== '' && this.action === 'edit' && (h("button-component", { type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 const previewEvent = this.previewButtonClicked.emit(this.host);
                 if (!previewEvent.defaultPrevented) {
                     window.open(parsePreviewLink(this.schedulerPreviewLink, this.selectedConfiguration), '_blank');
                 }
-            }, variant: 'basic' }, "Preview"))), h("div", { key: '975c3e7ebf2a11ac457785d4824d7b174a24e643', class: "buttons" }, h("p", { key: '6311d2d31ab503238a5ff98131423167aa794733', class: {
+            }, variant: 'basic' }, "Preview"))), h("div", { key: 'c5225165887e64b467570a3f90222479fb259494', class: "buttons" }, h("p", { key: '50b2861f9c99e3dc91e58f77097fa753ba02cd1b', class: {
                 'unsaved-changes': this.hasUnsavedChanges && !this.changesSaved,
                 'saved-changes': this.changesSaved,
                 'error': this.error !== '',
                 'error-full-width': this.error !== '' && this.action === 'create',
-            } }, this.error !== '' ? this.error : '', this.error == '' && this.hasUnsavedChanges && !this.changesSaved ? 'Unsaved changes' : this.error == '' && this.changesSaved ? 'Changes saved!' : ''), h("button-component", { key: '83e0a53f373b0fe78c80bcbce98b631fd105001d', type: "button", disabled: this.isLoading, clickHandler: event => {
+            } }, this.error !== '' ? this.error : '', this.error == '' && this.hasUnsavedChanges && !this.changesSaved ? 'Unsaved changes' : this.error == '' && this.changesSaved ? 'Changes saved!' : ''), h("button-component", { key: '9934c2cf6faf7e74b135add1728e3524bc29e13f', type: "button", disabled: this.isLoading, clickHandler: event => {
                 event.preventDefault();
                 this.cancelButtonClick.emit();
                 this.error = '';
-            }, variant: 'basic' }, "Cancel"), h("button-component", { key: '35c347a3e9bd1f9b54d3919e9d09135fa1ad5c70', type: "submit", disabled: this.isLoading }, this.isLoading ? (h("span", null, "Saving", h("loading-icon", null), ' ')) : this.action == 'create' ? ('Create') : ('Save changes')))))));
+            }, variant: 'basic' }, "Cancel"), h("button-component", { key: '872f1a24204c38948d484b2bf99aa72d78ba7a37', type: "submit", disabled: this.isLoading }, this.isLoading ? (h("span", null, "Saving", h("loading-icon", null), ' ')) : this.action == 'create' ? ('Create') : ('Save changes')))))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {