@nylas/web-elements 1.3.2 → 1.3.3

package/dist/nylas-web-elements/nylas-additional-participants.entry.js

@@ -60,10 +60,10 @@ const NylasAdditionalParticipants = class {
     componentWillLoad() {
         debug('nylas-additional-participants', 'componentWillLoad');
         this.host.setAttribute('name', this.name);
-        this.updateState(this.selectedConfiguration, this.currentUser);
     }
     componentDidLoad() {
         debug('nylas-additional-participants', 'componentDidLoad');
+        this.updateState(this.selectedConfiguration, this.currentUser);
     }
     disconnectedCallback() {
         debug('nylas-additional-participants', 'disconnectedCallback');

package/dist/nylas-web-elements/nylas-additional-participants.entry.js.map

@@ -1 +1 @@
-{"file":"nylas-additional-participants.entry.esm.js","mappings":";;;;AAAA,MAAM,8BAA8B,GAAG,4gHAA4gH;;;;;;;;;;;;;;;;MC2CtiH,2BAA2B;;;;;;;;;;;oBAMf,cAAc;;;;;;4BA4BE,IAAI,CAAC,iBAAiB,IAAI,EAAE;iCACX,EAAE;6CACR,IAAI;kCACf,KAAK;qBACnB,EAAE;;IAgB3B,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;KAC1C;IAID,iDAAiD,CAAC,QAAiB,EAAE,SAAkB,EAAE,QAAgB;QACvG,KAAK,CAAC,+BAA+B,EAAE,mDAAmD,EAAE,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QAExH,IAAI,QAAQ,KAAK,uBAAuB,EAAE;YACxC,IAAI,CAAC,WAAW,CAAC,QAAyB,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;SAC/D;aAAM,IAAI,QAAQ,KAAK,aAAa,EAAE;YACrC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,qBAAqB,EAAE,QAAgB,CAAC,CAAC;SAChE;KACF;IAED,iBAAiB;QACf,KAAK,CAAC,+BAA+B,EAAE,mBAAmB,CAAC,CAAC;KAC7D;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;QAC1C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,qBAAqB,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;KAChE;IAED,gBAAgB;QACd,KAAK,CAAC,+BAA+B,EAAE,kBAAkB,CAAC,CAAC;KAC5D;IAED,oBAAoB;QAClB,KAAK,CAAC,+BAA+B,EAAE,sBAAsB,CAAC,CAAC;KAChE;IAEO,WAAW,CAAC,cAA8B,EAAE,WAAkB;QACpE,IAAI,CAAC,kBAAkB,GAAG,cAAc,EAAE,YAAY,EAAE,kBAAkB,EAAE,mBAAmB;cAC3F,cAAc,EAAE,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,KAAK,YAAY;cACtF,KAAK,CAAC;QACV,IAAI,CAAC,YAAY,GAAG,cAAc,EAAE,YAAY,IAAI,EAAE,CAAC;QACvD,IAAI,CAAC,6BAA6B,GAAG,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,WAAW,EAAE,KAAK,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC;QAC3I,IAAI,CAAC,4BAA4B,EAAE,CAAC;KACrC;IAOD,IAAI,oBAAoB;QACtB,OAAO,IAAI,CAAC,SAAS,KAAK,SAAS,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,YAAY,KAAK,UAAU,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU,CAAC;KAC9I;IAGD,oBAAoB,CAAC,KAAmD;QACtE,KAAK,CAAC,+BAA+B,EAAE,sBAAsB,CAAC,CAAC;QAC/D,MAAM,WAAW,GAAG,gDAAgD,CAAC;QACrE,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;QAChC,MAAM,WAAW,GAAG,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAE3G,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,kBAAkB,EAAE;YAC3C,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,kFAAkF,CAAC,CAAC;YACnK,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,yEAAyE,CAAC;YAC1G,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC;YAC1C,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC;YAC3C,OAAO;SACR;aAAM,IAAI,CAAC,WAAW,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;YAChE,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,oCAAoC,CAAC,CAAC;YACrH,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,oCAAoC,CAAC;YACrE,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC;YAC1C,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC;YAC3C,OAAO;SACR;aAAM;YACL,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;YACnC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC;YACzC,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;SAC7D;QACD,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAEpD,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,YAAY,GAAG,WAAW,IAAI,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;QAEjJ,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,OAAO,GAAG,WAAW,IAAI,IAAI,CAAC,kBAAkB,IAAI,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;QACpK,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,WAAW,EAAE,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QACxE,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC;QAC3C,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,4BAA4B;QAC1B,MAAM,6BAA6B,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;QACvG,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,6BAA6B,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE;YACxF,MAAM,sBAAsB,GAAG,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,UAAU,CAAC,EAAE,EAAE,IAAI,IAAI,CAAC,oBAAoB,GAAG,CAAC,CAAC,EAAE,EAAE,IAAI,SAAS,CAAC;YACvJ,IAAI,CAAC,YAAY,GAAG;gBAClB;oBACE,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI;oBAC5B,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,KAAK;oBAC9B,YAAY,EAAE,IAAI;oBAClB,YAAY,EAAE;wBACZ,YAAY,EAAE,CAAC,sBAAsB,CAAC;qBACvC;oBACD,OAAO,EAAE;wBACP,WAAW,EAAE,sBAAsB;qBACpC;iBACF;gBACD,GAAG,IAAI,CAAC,YAAY;aACrB,CAAC;SACH;QACD,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,cAAc;QACZ,KAAK,CAAC,+BAA+B,EAAE,gBAAgB,CAAC,CAAC;QACzD,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC;QACzF,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IACD,iBAAiB,CAAC,KAAa;QAC7B,KAAK,CAAC,+BAA+B,EAAE,mBAAmB,CAAC,CAAC;QAC5D,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC,CAAC;QACpE,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,eAAe;QACb,KAAK,CAAC,+BAA+B,EAAE,iBAAiB,CAAC,CAAC;QAC1D,MAAM,YAAY,GAAG,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,6BAA6B,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC;QAC7K,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7B,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,qCAAqC,CAAC,CAAC;YACtH,IAAI,CAAC,KAAK,GAAG,qCAAqC,CAAC;SACpD;aAAM;YACL,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;YAC5D,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;YAClG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;SAClF;KACF;IAGD,kBAAkB,CAAC,MAA+B,EAAE,MAAqB;QACvE,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,IAAI,YAAY,CAAC,KAAK,KAAK,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC;QACxH,OAAO,QAAQ,CAAC,GAAG,CAAC,WAAW;YAC7B,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC;SAC/D,CAAC,CAAC;KACJ;IAaD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,IACd,0EACE,2DAAI,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,sCAAsC,EAAC,IAAI,EAAC,YAAY,mBAEjF,EACL,0DAAG,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,yCAAyC,EAAC,IAAI,EAAC,eAAe,iEAE1F,EACJ,4DAAK,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,wCAAwC,IAChE,8DACG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK;YACxC,QACE,WAAK,KAAK,EAAE,4CAA4C,EAAE,IAAI,EAAC,kBAAkB,IAC9E,CAAC,WAAW,CAAC,YAAY,IAAI,iBAAQ,eAAe,KAAK,EAAE,CAAS,EACrE,WACE,IAAI,EAAC,oBAAoB,EACzB,KAAK,EAAE;oBACL,8CAA8C,EAAE,IAAI;oBACpD,wDAAwD,EAAE,WAAW,EAAE,YAAY,KAAK,IAAI;oBAC5F,sDAAsD,EAAE,WAAW,CAAC,QAAQ,KAAK,KAAK;oBACtF,OAAO,EAAE,WAAW,CAAC,QAAQ,KAAK,KAAK;iBACxC,IAED,WAAK,KAAK,EAAE,EAAE,sCAAsC,EAAE,IAAI,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,KAAK,IAAI,EAAE,EAAE,IAAI,EAAC,YAAY,IAC7H,WAAW,CAAC,YAAY,IACvB,uBACE,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,GAAG,KAAK,EAAE,EAChB,GAAG,EAAE,KAAK,EACV,KAAK,EAAC,WAAW,EACjB,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,WAAW,CAAC,YAAY,EAClC,YAAY,EAAE,WAAW,CAAC,KAAK,IAE9B,IAAI,CAAC,kBAAkB,KACtB,WAAK,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,kBAAkB,IACjD,aACE,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,uBAAuB,EAC7B,EAAE,EAAE,uBAAuB,EAC3B,OAAO,EAAE;oBACP,IAAI,CAAC,6BAA6B,GAAG,CAAC,IAAI,CAAC,6BAA6B,CAAC;oBACzE,IAAI,CAAC,eAAe,EAAE,CAAC;iBACxB,EACD,OAAO,EAAE,IAAI,CAAC,6BAA6B,GAC3C,EACF,aAAO,OAAO,EAAE,uBAAuB,gBAAa,wBAAwB,mBAE1E,yBAAmB,EAAE,EAAC,+BAA+B,IACnD,iBAAW,IAAI,EAAC,cAAc,GAAG,EACjC,YAAM,IAAI,EAAC,iBAAiB,IAC1B,uCAAmC,yEAAmE,aAAM,EAC5G,uCAAmC,2EAC9B,CACW,CACd,CACJ,CACP,CACe,KAElB,sBACE,EAAE,EAAE,GAAG,KAAK,EAAE,EACd,IAAI,EAAE,GAAG,KAAK,EAAE,EAChB,UAAU,EAAE,IAAI,EAChB,UAAU,EAAE,WAAW,CAAC,KAAK,EAC7B,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,kBAAkB,IAAI,EAAE,EAAE,IAAI,CAAC,YAAY,CAAC,GAClF,CACH,EACA,CAAC,WAAW,CAAC,YAAY,KACxB,cAAQ,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,IAAI,EAAC,yBAAyB,IAClF,qBAAc,CACP,CACV,CACG,CACF,EACL,CAAC,WAAW,CAAC,QAAQ,KACpB,SAAG,KAAK,EAAC,sCAAsC,EAAC,IAAI,EAAC,YAAY,IAC9D,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAC5B,CACL,CACG,EACN;SACH,CAAC,EACF,0DAAG,KAAK,EAAC,sCAAsC,EAAC,IAAI,EAAC,YAAY,IAC9D,IAAI,CAAC,KAAK,CACT,CACA,EACN,+DAAQ,KAAK,EAAC,oCAAoC,EAAC,IAAI,EAAC,sBAAsB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE,IACjH,yEAAmB,OAAC,uEAAW,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,GAAG,SAAS,GAAG,GAAG,iBAAoB,CAC1F,CACL,CACU,CACb,EACP;KACH;;;;;;;;;AAhGD;IAXC,iBAAiB,CAAiH;QACjI,IAAI,EAAE,+BAA+B;QACrC,YAAY,EAAE,IAAI,GAAG,CAAC;YACpB,CAAC,wCAAwC,EAAE,oBAAoB,CAAC;YAChE,CAAC,uCAAuC,EAAE,uBAAuB,CAAC;YAClE,CAAC,6BAA6B,EAAE,aAAa,CAAC;YAC9C,CAAC,2BAA2B,EAAE,sBAAsB,CAAC;SACtD,CAAC;QACF,YAAY,EAAE,EAAE;QAChB,iBAAiB,EAAE,IAAI;KACxB,CAAC;;;;yDAiGD;;;;;","names":[],"sources":["src/components/scheduler-editor/nylas-additional-participants/nylas-additional-participants.scss?tag=nylas-additional-participants&encapsulation=shadow","src/components/scheduler-editor/nylas-additional-participants/nylas-additional-participants.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  margin: 1rem;\n  @include default-css-variables;\n}\n\n.nylas-additional-participants__title {\n  color: var(--nylas-base-nylas-base-900-aaa, #101323);\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  /* 125% */\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-additional-participants__subtitle {\n  color: var(--nylas-base-600);\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  /* 142.857% */\n  margin: 0.25rem 0px 0px;\n  text-align: left;\n}\n\n.nylas-additional-participants__content {\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.nylas-additional-participants__input_group {\n  padding-top: 8px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\n    color: var(--nylas-base-800);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 150%;\n  }\n}\n\n.nylas-additional-participants__error {\n  color: var(--nylas-error);\n  font-size: 14px;\n  font-family: var(--nylas-font-family);\n  font-weight: 400;\n  line-height: 16px;\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-additional-participants__input_wrapper {\n  display: flex;\n  border-width: 1;\n  border-radius: 8px;\n  border: 1px solid var(--nylas-base-300);\n\n  &.error {\n    border-color: var(--nylas-error);\n  }\n\n  button {\n    padding: 12px;\n    border: none;\n    border-left: 1px solid var(--nylas-base-300);\n    background: none;\n    cursor: pointer;\n\n    &:hover,\n    &:active {\n      color: var(--nylas-primary);\n    }\n  }\n}\n\n.nylas-additional-participants__input_wrapper_organizer {\n  border: none;\n}\n\n.nylas-additional-participants__input {\n  flex: 1;\n  display: flex;\n  justify-content: space-between;\n\n  input {\n    border: none;\n    outline: none;\n    background: none;\n    width: 100%;\n  }\n\n  input-dropdown {\n    width: 100%;\n  }\n\n  input-dropdown::part(id_dropdown) {\n    width: 100%;\n    height: 100%;\n  }\n\n  input-dropdown::part(id_dropdown-input) {\n    height: 100%;\n    border-radius: var(--nylas-border-radius-2x);\n    border: none;\n    border-top-right-radius: initial;\n    border-bottom-right-radius: initial;\n    padding-left: 16px;\n  }\n\n  input-component::part(ic__input) {\n    background: var(--nylas-base-50);\n  }\n\n  input-component::part(ic__label) {\n    font-size: 14px;\n  }\n\n  input-component {\n    div.required-input {\n      display: flex;\n      gap: 4px;\n\n      label {\n        display: flex;\n        gap: 4px;\n        align-items: center;\n\n        tooltip-component#organizer_participant_tooltip::part(tc__content) {\n          left: -84px;\n        }\n      }\n    }\n  }\n}\n\n.nylas-additional-participants__add {\n  padding: 12px;\n  display: flex;\n  align-items: center;\n  border: none;\n  background: none;\n  cursor: pointer;\n\n  span {\n    padding: 0 8px;\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 500;\n  }\n\n  &:hover,\n  &:active {\n    color: var(--nylas-primary);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, Prop, State, Watch, h, Element, Listen, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Event } from '@stencil/core';\nimport { AdditionalParticipant, Calendar, Configuration } from '@nylas/core';\nimport { User } from '@/common/nylas-api-request';\n\ntype Participant = {\n  name?: string;\n  email: string;\n  is_valid?: boolean;\n  is_organizer?: boolean;\n  availability?: Availability;\n  booking?: Booking;\n};\ntype Availability = {\n  calendar_ids: string[];\n};\ntype Booking = {\n  calendar_id: string;\n};\n\n/**\n * The `nylas-additional-participants` component is a form input for adding additional participants to an event.\n *\n * @part nap__title - The title of the component.\n * @part nap__subtitle - The subtitle of the component.\n * @part nap__content - The content of the component.\n * @part nap__input_group - The input group of the component.\n * @part nap__input_wrapper - The input wrapper of the component.\n * @part nap__input - The input of the component.\n * @part nap__remove-participant - The remove participant button of the component.\n * @part nap__add-participant - The add participant button of the component.\n *\n */\n@Component({\n  tag: 'nylas-additional-participants',\n  styleUrl: 'nylas-additional-participants.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasAdditionalParticipants {\n  @Element() host!: HTMLNylasAdditionalParticipantsElement;\n  /**\n   * @standalone\n   * The name of the component\n   */\n  @Prop() name: string = 'participants';\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The logged in user\n   */\n  @Prop() currentUser?: User;\n  /**\n   * @standalone\n   * The list of user's calendars.\n   */\n  @Prop() currentUserCalendars?: Calendar[];\n  /**\n   * @standalone\n   * The additional participants options from the config\n   */\n  @Prop() participantOptions?: AdditionalParticipant[];\n  /**\n   * @standalone\n   * The event participants\n   */\n  @Prop() eventParticipants?: Participant[];\n\n  @AttachInternals() internals!: ElementInternals;\n  @State() participants: Participant[] = this.eventParticipants ?? [];\n  @State() participantErrors: { [key: string]: string } = {};\n  @State() includeOrganizerAsParticipant: boolean = true;\n  @State() isRoundRobinConfig: boolean = false;\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the selected participants change.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\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-additional-participants', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('currentUser')\n  @Watch('selectedConfiguration')\n  selectedConfigurationAndCurrentUserChangedHandler(newValue: unknown, _oldValue: unknown, propName: string) {\n    debug('nylas-additional-participants', 'selectedConfigurationAndCurrentUserChangedHandler', newValue, this.currentUser);\n\n    if (propName === 'selectedConfiguration') {\n      this.updateState(newValue as Configuration, this.currentUser);\n    } else if (propName === 'currentUser') {\n      this.updateState(this.selectedConfiguration, newValue as User);\n    }\n  }\n\n  connectedCallback() {\n    debug('nylas-additional-participants', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-additional-participants', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n    this.updateState(this.selectedConfiguration, this.currentUser);\n  }\n\n  componentDidLoad() {\n    debug('nylas-additional-participants', 'componentDidLoad');\n  }\n\n  disconnectedCallback() {\n    debug('nylas-additional-participants', 'disconnectedCallback');\n  }\n\n  private updateState(selectedConfig?: Configuration, currentUser?: User) {\n    this.isRoundRobinConfig = selectedConfig?.availability?.availability_rules?.availability_method\n      ? selectedConfig?.availability?.availability_rules?.availability_method !== 'collective'\n      : false;\n    this.participants = selectedConfig?.participants || [];\n    this.includeOrganizerAsParticipant = this.isRoundRobinConfig && this.participants.find(p => p.email === currentUser?.email) ? true : false;\n    this.updateOrganizerAsParticipant();\n  }\n\n  /**\n   * This method is essentially a workaround to check if the internals are available because\n   * the unit tests in stencil do not support the internals.\n   * @returns boolean\n   */\n  get isInternalsAvailable() {\n    return this.internals !== undefined && typeof this.internals.setFormValue === 'function' && typeof this.internals.setValidity === 'function';\n  }\n\n  @Listen('inputOptionChanged')\n  onInputOptionChanged(event: CustomEvent<{ value: string; name: string }>) {\n    debug('nylas-additional-participants', 'onInputOptionChanged');\n    const EMAIL_REGEX = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;\n    const index = event.detail.name;\n    const participant = this.participantOptions?.find(participant => participant.email === event.detail.value);\n\n    if (!participant && this.isRoundRobinConfig) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'For round robin configuration, participant should be selected from the dropdown.');\n      this.participantErrors[index] = 'For round robin page, participant should be selected from the dropdown.';\n      this.participants[index].is_valid = false;\n      this.participants = [...this.participants];\n      return;\n    } else if (!participant && !EMAIL_REGEX.test(event.detail.value)) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'Please enter a valid email address');\n      this.participantErrors[index] = 'Please enter a valid email address';\n      this.participants[index].is_valid = false;\n      this.participants = [...this.participants];\n      return;\n    } else {\n      this.participantErrors[index] = '';\n      this.participants[index].is_valid = true;\n      this.isInternalsAvailable && this.internals.setValidity({});\n    }\n    this.participants[index].email = event.detail.value;\n    // Default to the first calendar if participant was picked from the dropdown options\n    this.participants[index].availability = participant && participant.calendars[0].id ? { calendar_ids: [participant.calendars[0].id] } : undefined;\n    // If round-robin config, set booking calendar to first calendar for all participants\n    this.participants[index].booking = participant && this.isRoundRobinConfig && participant.calendars[0].id ? { calendar_id: participant.calendars[0].id } : undefined;\n    this.participants[index].name = participant?.name || event.detail.value;\n    this.participants = [...this.participants];\n    this.updateFormValue();\n  }\n\n  updateOrganizerAsParticipant() {\n    const findCurrentUserInParticipants = this.participants.find(p => p.email === this.currentUser?.email);\n    if (this.isRoundRobinConfig && !findCurrentUserInParticipants && this.currentUser?.email) {\n      const bookingCalendarDefault = this.currentUserCalendars?.find(calendar => calendar.is_primary)?.id || this.currentUserCalendars?.[0]?.id || 'primary';\n      this.participants = [\n        {\n          name: this.currentUser?.name,\n          email: this.currentUser?.email,\n          is_organizer: true,\n          availability: {\n            calendar_ids: [bookingCalendarDefault],\n          },\n          booking: {\n            calendar_id: bookingCalendarDefault,\n          },\n        },\n        ...this.participants,\n      ];\n    }\n    this.updateFormValue();\n  }\n\n  addParticipant() {\n    debug('nylas-additional-participants', 'addParticipant');\n    this.participants = [...this.participants, { name: '', email: '', is_organizer: false }];\n    this.updateFormValue();\n  }\n  removeParticipant(index: number) {\n    debug('nylas-additional-participants', 'removeParticipant');\n    this.participants = this.participants.filter((_, i) => i !== index);\n    this.updateFormValue();\n  }\n\n  updateFormValue() {\n    debug('nylas-additional-participants', 'updateFormValue');\n    const participants = this.isRoundRobinConfig ? (this.includeOrganizerAsParticipant ? this.participants : this.participants.filter(p => !p.is_organizer)) : this.participants;\n    if (participants.length === 0) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'Please add at least one participant');\n      this.error = 'Please add at least one participant';\n    } else {\n      this.isInternalsAvailable && this.internals.setValidity({});\n      this.error = '';\n      this.isInternalsAvailable && this.internals.setFormValue(JSON.stringify(participants), this.name);\n      this.valueChanged.emit({ value: JSON.stringify(participants), name: this.name });\n    }\n  }\n\n  // Filter out the participants that are already added\n  getArrayDifference(array1: AdditionalParticipant[], array2: Participant[]) {\n    const filtered = array1.filter(participant1 => !array2.some(participant2 => participant1.email === participant2.email));\n    return filtered.map(participant => {\n      return { value: participant.email, label: participant.email };\n    });\n  }\n\n  @RegisterComponent<NylasAdditionalParticipants, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-additional-participants',\n    stateToProps: new Map([\n      ['schedulerConfig.additionalParticipants', 'participantOptions'],\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.currentUser', 'currentUser'],\n      ['schedulerConfig.calendars', 'currentUserCalendars'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"nap\">\n        <nylas-form-card>\n          <h3 slot=\"header-title\" class=\"nylas-additional-participants__title\" part=\"nap__title\">\n            Participants\n          </h3>\n          <p slot=\"header-subtitle\" class=\"nylas-additional-participants__subtitle\" part=\"nap__subtitle\">\n            Add people in your team or organization to join the event.\n          </p>\n          <div slot=\"content\" class=\"nylas-additional-participants__content\">\n            <div>\n              {this.participants.map((participant, index) => {\n                return (\n                  <div class={'nylas-additional-participants__input_group'} part=\"nap__input_group\">\n                    {!participant.is_organizer && <label>{`Participant ${index}`}</label>}\n                    <div\n                      part=\"nap__input_wrapper\"\n                      class={{\n                        'nylas-additional-participants__input_wrapper': true,\n                        'nylas-additional-participants__input_wrapper_organizer': participant?.is_organizer === true,\n                        'nylas-additional-participants__input_wrapper_invalid': participant.is_valid === false,\n                        'error': participant.is_valid === false,\n                      }}\n                    >\n                      <div class={{ 'nylas-additional-participants__input': true, 'organizer': participant?.is_organizer === true }} part=\"nap__input\">\n                        {participant.is_organizer ? (\n                          <input-component\n                            class={'label-input'}\n                            name={`${index}`}\n                            key={index}\n                            label=\"Organizer\"\n                            required={false}\n                            readOnly={participant.is_organizer}\n                            defaultValue={participant.email}\n                          >\n                            {this.isRoundRobinConfig && (\n                              <div class=\"required-input\" slot=\"additional-input\">\n                                <input\n                                  type=\"checkbox\"\n                                  name={`organizer_participant`}\n                                  id={`organizer_participant`}\n                                  onClick={() => {\n                                    this.includeOrganizerAsParticipant = !this.includeOrganizerAsParticipant;\n                                    this.updateFormValue();\n                                  }}\n                                  checked={this.includeOrganizerAsParticipant}\n                                />\n                                <label htmlFor={`organizer_participant`} aria-label=\"Include as participant\">\n                                  Participant\n                                  <tooltip-component id=\"organizer_participant_tooltip\">\n                                    <info-icon slot=\"tooltip-icon\" />\n                                    <span slot=\"tooltip-content\">\n                                      <strong>Include Organizer:</strong> The organizer (you) will be included in the round-robin rotation. <br />\n                                      <strong>Exclude Organizer:</strong> The organizer (you) will not be included in the round-robin rotation.\n                                    </span>\n                                  </tooltip-component>\n                                </label>\n                              </div>\n                            )}\n                          </input-component>\n                        ) : (\n                          <input-dropdown\n                            id={`${index}`}\n                            name={`${index}`}\n                            filterable={true}\n                            inputValue={participant.email}\n                            options={this.getArrayDifference(this.participantOptions || [], this.participants)}\n                          />\n                        )}\n                        {!participant.is_organizer && (\n                          <button onClick={() => this.removeParticipant(index)} part=\"nap__remove-participant\">\n                            <close-icon />\n                          </button>\n                        )}\n                      </div>\n                    </div>\n                    {!participant.is_valid && (\n                      <p class=\"nylas-additional-participants__error\" part=\"nap__error\">\n                        {this.participantErrors[index]}\n                      </p>\n                    )}\n                  </div>\n                );\n              })}\n              <p class=\"nylas-additional-participants__error\" part=\"nap__error\">\n                {this.error}\n              </p>\n            </div>\n            <button class=\"nylas-additional-participants__add\" part=\"nap__add-participant\" onClick={() => this.addParticipant()}>\n              <add-circle-icon /> <span>Add {this.participants.length > 1 ? 'another' : 'a'} participant</span>\n            </button>\n          </div>\n        </nylas-form-card>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nylas-additional-participants.entry.esm.js","mappings":"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","names":[],"sources":["src/components/scheduler-editor/nylas-additional-participants/nylas-additional-participants.scss?tag=nylas-additional-participants&encapsulation=shadow","src/components/scheduler-editor/nylas-additional-participants/nylas-additional-participants.tsx"],"sourcesContent":["@import '../../../common/styles/variables.scss';\n\n:host {\n  display: block;\n  margin: 1rem;\n  @include default-css-variables;\n}\n\n.nylas-additional-participants__title {\n  color: var(--nylas-base-nylas-base-900-aaa, #101323);\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  /* 125% */\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-additional-participants__subtitle {\n  color: var(--nylas-base-600);\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  /* 142.857% */\n  margin: 0.25rem 0px 0px;\n  text-align: left;\n}\n\n.nylas-additional-participants__content {\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.nylas-additional-participants__input_group {\n  padding-top: 8px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  label {\n    display: flex;\n    align-items: center;\n    color: var(--nylas-base-800);\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 150%;\n  }\n}\n\n.nylas-additional-participants__error {\n  color: var(--nylas-error);\n  font-size: 14px;\n  font-family: var(--nylas-font-family);\n  font-weight: 400;\n  line-height: 16px;\n  margin: 0;\n  text-align: left;\n}\n\n.nylas-additional-participants__input_wrapper {\n  display: flex;\n  border-width: 1;\n  border-radius: 8px;\n  border: 1px solid var(--nylas-base-300);\n\n  &.error {\n    border-color: var(--nylas-error);\n  }\n\n  button {\n    padding: 12px;\n    border: none;\n    border-left: 1px solid var(--nylas-base-300);\n    background: none;\n    cursor: pointer;\n\n    &:hover,\n    &:active {\n      color: var(--nylas-primary);\n    }\n  }\n}\n\n.nylas-additional-participants__input_wrapper_organizer {\n  border: none;\n}\n\n.nylas-additional-participants__input {\n  flex: 1;\n  display: flex;\n  justify-content: space-between;\n\n  input {\n    border: none;\n    outline: none;\n    background: none;\n    width: 100%;\n  }\n\n  input-dropdown {\n    width: 100%;\n  }\n\n  input-dropdown::part(id_dropdown) {\n    width: 100%;\n    height: 100%;\n  }\n\n  input-dropdown::part(id_dropdown-input) {\n    height: 100%;\n    border-radius: var(--nylas-border-radius-2x);\n    border: none;\n    border-top-right-radius: initial;\n    border-bottom-right-radius: initial;\n    padding-left: 16px;\n  }\n\n  input-component::part(ic__input) {\n    background: var(--nylas-base-50);\n  }\n\n  input-component::part(ic__label) {\n    font-size: 14px;\n  }\n\n  input-component {\n    div.required-input {\n      display: flex;\n      gap: 4px;\n\n      label {\n        display: flex;\n        gap: 4px;\n        align-items: center;\n\n        tooltip-component#organizer_participant_tooltip::part(tc__content) {\n          left: -84px;\n        }\n      }\n    }\n  }\n}\n\n.nylas-additional-participants__add {\n  padding: 12px;\n  display: flex;\n  align-items: center;\n  border: none;\n  background: none;\n  cursor: pointer;\n\n  span {\n    padding: 0 8px;\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 500;\n  }\n\n  &:hover,\n  &:active {\n    color: var(--nylas-primary);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasSchedulerConfigConnector } from '@/connector/nylas-scheduler-config-connector';\nimport { debug } from '@/utils/utils';\nimport { AttachInternals, Component, Host, Prop, State, Watch, h, Element, Listen, EventEmitter } from '@stencil/core';\nimport { NylasSchedulerEditor } from '../nylas-scheduler-editor/nylas-scheduler-editor';\nimport { Event } from '@stencil/core';\nimport { AdditionalParticipant, Calendar, Configuration } from '@nylas/core';\nimport { User } from '@/common/nylas-api-request';\n\ntype Participant = {\n  name?: string;\n  email: string;\n  is_valid?: boolean;\n  is_organizer?: boolean;\n  availability?: Availability;\n  booking?: Booking;\n};\ntype Availability = {\n  calendar_ids: string[];\n};\ntype Booking = {\n  calendar_id: string;\n};\n\n/**\n * The `nylas-additional-participants` component is a form input for adding additional participants to an event.\n *\n * @part nap__title - The title of the component.\n * @part nap__subtitle - The subtitle of the component.\n * @part nap__content - The content of the component.\n * @part nap__input_group - The input group of the component.\n * @part nap__input_wrapper - The input wrapper of the component.\n * @part nap__input - The input of the component.\n * @part nap__remove-participant - The remove participant button of the component.\n * @part nap__add-participant - The add participant button of the component.\n *\n */\n@Component({\n  tag: 'nylas-additional-participants',\n  styleUrl: 'nylas-additional-participants.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NylasAdditionalParticipants {\n  @Element() host!: HTMLNylasAdditionalParticipantsElement;\n  /**\n   * @standalone\n   * The name of the component\n   */\n  @Prop() name: string = 'participants';\n  /**\n   * @standalone\n   * The selected config\n   */\n  @Prop() selectedConfiguration?: Configuration;\n  /**\n   * @standalone\n   * The logged in user\n   */\n  @Prop() currentUser?: User;\n  /**\n   * @standalone\n   * The list of user's calendars.\n   */\n  @Prop() currentUserCalendars?: Calendar[];\n  /**\n   * @standalone\n   * The additional participants options from the config\n   */\n  @Prop() participantOptions?: AdditionalParticipant[];\n  /**\n   * @standalone\n   * The event participants\n   */\n  @Prop() eventParticipants?: Participant[];\n\n  @AttachInternals() internals!: ElementInternals;\n  @State() participants: Participant[] = this.eventParticipants ?? [];\n  @State() participantErrors: { [key: string]: string } = {};\n  @State() includeOrganizerAsParticipant: boolean = true;\n  @State() isRoundRobinConfig: boolean = false;\n  @State() error: string = '';\n\n  /**\n   * This event is fired when the selected participants change.\n   */\n  @Event() valueChanged!: EventEmitter<{\n    value: string;\n    name: string;\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-additional-participants', 'elementNameChangedHandler', newValue);\n    this.host.setAttribute('name', newValue);\n  }\n\n  @Watch('currentUser')\n  @Watch('selectedConfiguration')\n  selectedConfigurationAndCurrentUserChangedHandler(newValue: unknown, _oldValue: unknown, propName: string) {\n    debug('nylas-additional-participants', 'selectedConfigurationAndCurrentUserChangedHandler', newValue, this.currentUser);\n\n    if (propName === 'selectedConfiguration') {\n      this.updateState(newValue as Configuration, this.currentUser);\n    } else if (propName === 'currentUser') {\n      this.updateState(this.selectedConfiguration, newValue as User);\n    }\n  }\n\n  connectedCallback() {\n    debug('nylas-additional-participants', 'connectedCallback');\n  }\n\n  componentWillLoad() {\n    debug('nylas-additional-participants', 'componentWillLoad');\n    this.host.setAttribute('name', this.name);\n  }\n\n  componentDidLoad() {\n    debug('nylas-additional-participants', 'componentDidLoad');\n    this.updateState(this.selectedConfiguration, this.currentUser);\n  }\n\n  disconnectedCallback() {\n    debug('nylas-additional-participants', 'disconnectedCallback');\n  }\n\n  private updateState(selectedConfig?: Configuration, currentUser?: User) {\n    this.isRoundRobinConfig = selectedConfig?.availability?.availability_rules?.availability_method\n      ? selectedConfig?.availability?.availability_rules?.availability_method !== 'collective'\n      : false;\n    this.participants = selectedConfig?.participants || [];\n    this.includeOrganizerAsParticipant = this.isRoundRobinConfig && this.participants.find(p => p.email === currentUser?.email) ? true : false;\n    this.updateOrganizerAsParticipant();\n  }\n\n  /**\n   * This method is essentially a workaround to check if the internals are available because\n   * the unit tests in stencil do not support the internals.\n   * @returns boolean\n   */\n  get isInternalsAvailable() {\n    return this.internals !== undefined && typeof this.internals.setFormValue === 'function' && typeof this.internals.setValidity === 'function';\n  }\n\n  @Listen('inputOptionChanged')\n  onInputOptionChanged(event: CustomEvent<{ value: string; name: string }>) {\n    debug('nylas-additional-participants', 'onInputOptionChanged');\n    const EMAIL_REGEX = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;\n    const index = event.detail.name;\n    const participant = this.participantOptions?.find(participant => participant.email === event.detail.value);\n\n    if (!participant && this.isRoundRobinConfig) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'For round robin configuration, participant should be selected from the dropdown.');\n      this.participantErrors[index] = 'For round robin page, participant should be selected from the dropdown.';\n      this.participants[index].is_valid = false;\n      this.participants = [...this.participants];\n      return;\n    } else if (!participant && !EMAIL_REGEX.test(event.detail.value)) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'Please enter a valid email address');\n      this.participantErrors[index] = 'Please enter a valid email address';\n      this.participants[index].is_valid = false;\n      this.participants = [...this.participants];\n      return;\n    } else {\n      this.participantErrors[index] = '';\n      this.participants[index].is_valid = true;\n      this.isInternalsAvailable && this.internals.setValidity({});\n    }\n    this.participants[index].email = event.detail.value;\n    // Default to the first calendar if participant was picked from the dropdown options\n    this.participants[index].availability = participant && participant.calendars[0].id ? { calendar_ids: [participant.calendars[0].id] } : undefined;\n    // If round-robin config, set booking calendar to first calendar for all participants\n    this.participants[index].booking = participant && this.isRoundRobinConfig && participant.calendars[0].id ? { calendar_id: participant.calendars[0].id } : undefined;\n    this.participants[index].name = participant?.name || event.detail.value;\n    this.participants = [...this.participants];\n    this.updateFormValue();\n  }\n\n  updateOrganizerAsParticipant() {\n    const findCurrentUserInParticipants = this.participants.find(p => p.email === this.currentUser?.email);\n    if (this.isRoundRobinConfig && !findCurrentUserInParticipants && this.currentUser?.email) {\n      const bookingCalendarDefault = this.currentUserCalendars?.find(calendar => calendar.is_primary)?.id || this.currentUserCalendars?.[0]?.id || 'primary';\n      this.participants = [\n        {\n          name: this.currentUser?.name,\n          email: this.currentUser?.email,\n          is_organizer: true,\n          availability: {\n            calendar_ids: [bookingCalendarDefault],\n          },\n          booking: {\n            calendar_id: bookingCalendarDefault,\n          },\n        },\n        ...this.participants,\n      ];\n    }\n    this.updateFormValue();\n  }\n\n  addParticipant() {\n    debug('nylas-additional-participants', 'addParticipant');\n    this.participants = [...this.participants, { name: '', email: '', is_organizer: false }];\n    this.updateFormValue();\n  }\n  removeParticipant(index: number) {\n    debug('nylas-additional-participants', 'removeParticipant');\n    this.participants = this.participants.filter((_, i) => i !== index);\n    this.updateFormValue();\n  }\n\n  updateFormValue() {\n    debug('nylas-additional-participants', 'updateFormValue');\n    const participants = this.isRoundRobinConfig ? (this.includeOrganizerAsParticipant ? this.participants : this.participants.filter(p => !p.is_organizer)) : this.participants;\n    if (participants.length === 0) {\n      this.isInternalsAvailable && this.internals.setValidity({ customError: true }, 'Please add at least one participant');\n      this.error = 'Please add at least one participant';\n    } else {\n      this.isInternalsAvailable && this.internals.setValidity({});\n      this.error = '';\n      this.isInternalsAvailable && this.internals.setFormValue(JSON.stringify(participants), this.name);\n      this.valueChanged.emit({ value: JSON.stringify(participants), name: this.name });\n    }\n  }\n\n  // Filter out the participants that are already added\n  getArrayDifference(array1: AdditionalParticipant[], array2: Participant[]) {\n    const filtered = array1.filter(participant1 => !array2.some(participant2 => participant1.email === participant2.email));\n    return filtered.map(participant => {\n      return { value: participant.email, label: participant.email };\n    });\n  }\n\n  @RegisterComponent<NylasAdditionalParticipants, NylasSchedulerConfigConnector, Exclude<NylasSchedulerEditor['stores'], undefined>>({\n    name: 'nylas-additional-participants',\n    stateToProps: new Map([\n      ['schedulerConfig.additionalParticipants', 'participantOptions'],\n      ['schedulerConfig.selectedConfiguration', 'selectedConfiguration'],\n      ['schedulerConfig.currentUser', 'currentUser'],\n      ['schedulerConfig.calendars', 'currentUserCalendars'],\n    ]),\n    eventToProps: {},\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host part=\"nap\">\n        <nylas-form-card>\n          <h3 slot=\"header-title\" class=\"nylas-additional-participants__title\" part=\"nap__title\">\n            Participants\n          </h3>\n          <p slot=\"header-subtitle\" class=\"nylas-additional-participants__subtitle\" part=\"nap__subtitle\">\n            Add people in your team or organization to join the event.\n          </p>\n          <div slot=\"content\" class=\"nylas-additional-participants__content\">\n            <div>\n              {this.participants.map((participant, index) => {\n                return (\n                  <div class={'nylas-additional-participants__input_group'} part=\"nap__input_group\">\n                    {!participant.is_organizer && <label>{`Participant ${index}`}</label>}\n                    <div\n                      part=\"nap__input_wrapper\"\n                      class={{\n                        'nylas-additional-participants__input_wrapper': true,\n                        'nylas-additional-participants__input_wrapper_organizer': participant?.is_organizer === true,\n                        'nylas-additional-participants__input_wrapper_invalid': participant.is_valid === false,\n                        'error': participant.is_valid === false,\n                      }}\n                    >\n                      <div class={{ 'nylas-additional-participants__input': true, 'organizer': participant?.is_organizer === true }} part=\"nap__input\">\n                        {participant.is_organizer ? (\n                          <input-component\n                            class={'label-input'}\n                            name={`${index}`}\n                            key={index}\n                            label=\"Organizer\"\n                            required={false}\n                            readOnly={participant.is_organizer}\n                            defaultValue={participant.email}\n                          >\n                            {this.isRoundRobinConfig && (\n                              <div class=\"required-input\" slot=\"additional-input\">\n                                <input\n                                  type=\"checkbox\"\n                                  name={`organizer_participant`}\n                                  id={`organizer_participant`}\n                                  onClick={() => {\n                                    this.includeOrganizerAsParticipant = !this.includeOrganizerAsParticipant;\n                                    this.updateFormValue();\n                                  }}\n                                  checked={this.includeOrganizerAsParticipant}\n                                />\n                                <label htmlFor={`organizer_participant`} aria-label=\"Include as participant\">\n                                  Participant\n                                  <tooltip-component id=\"organizer_participant_tooltip\">\n                                    <info-icon slot=\"tooltip-icon\" />\n                                    <span slot=\"tooltip-content\">\n                                      <strong>Include Organizer:</strong> The organizer (you) will be included in the round-robin rotation. <br />\n                                      <strong>Exclude Organizer:</strong> The organizer (you) will not be included in the round-robin rotation.\n                                    </span>\n                                  </tooltip-component>\n                                </label>\n                              </div>\n                            )}\n                          </input-component>\n                        ) : (\n                          <input-dropdown\n                            id={`${index}`}\n                            name={`${index}`}\n                            filterable={true}\n                            inputValue={participant.email}\n                            options={this.getArrayDifference(this.participantOptions || [], this.participants)}\n                          />\n                        )}\n                        {!participant.is_organizer && (\n                          <button onClick={() => this.removeParticipant(index)} part=\"nap__remove-participant\">\n                            <close-icon />\n                          </button>\n                        )}\n                      </div>\n                    </div>\n                    {!participant.is_valid && (\n                      <p class=\"nylas-additional-participants__error\" part=\"nap__error\">\n                        {this.participantErrors[index]}\n                      </p>\n                    )}\n                  </div>\n                );\n              })}\n              <p class=\"nylas-additional-participants__error\" part=\"nap__error\">\n                {this.error}\n              </p>\n            </div>\n            <button class=\"nylas-additional-participants__add\" part=\"nap__add-participant\" onClick={() => this.addParticipant()}>\n              <add-circle-icon /> <span>Add {this.participants.length > 1 ? 'another' : 'a'} participant</span>\n            </button>\n          </div>\n        </nylas-form-card>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/nylas-web-elements/nylas-booking-form-config.entry.js

@@ -3369,6 +3369,28 @@ var __metadata = (undefined && undefined.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
         return Reflect.metadata(k, v);
 };
+const staticFields = [
+    {
+        type: 'text',
+        label: 'Your name',
+        key: 'your_name',
+        typeLabel: 'Short text',
+        readonly: true,
+        required: true,
+        isOpen: false,
+        order: 0,
+    },
+    {
+        type: 'email',
+        label: 'Your Email',
+        key: 'your_email',
+        typeLabel: 'Email',
+        readonly: true,
+        isOpen: false,
+        required: true,
+        order: 1,
+    },
+];
 const NylasBookingFormConfig = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -3389,6 +3411,9 @@ const NylasBookingFormConfig = class {
         debug('nylas-calendar-picker', 'elementNameChangedHandler', newValue);
         this.host.setAttribute('name', newValue);
     }
+    selectedConfigurationChangedHandler(newValue) {
+        this.updateFormFields(newValue);
+    }
     connectedCallback() {
         debug('nylas-booking-form-config', 'connectedCallback');
     }
@@ -3398,37 +3423,18 @@ const NylasBookingFormConfig = class {
     componentWillLoad() {
         debug('nylas-booking-form-config', 'componentWillLoad');
         this.host.setAttribute('name', this.name);
-        const staticFields = [
-            {
-                type: 'text',
-                label: 'Your name',
-                key: 'your_name',
-                typeLabel: 'Short text',
-                readonly: true,
-                required: true,
-                isOpen: false,
-                order: 0,
-            },
-            {
-                type: 'email',
-                label: 'Your Email',
-                key: 'your_email',
-                typeLabel: 'Email',
-                readonly: true,
-                isOpen: false,
-                required: true,
-                order: 1,
-            },
-        ];
         this.formFields = [...staticFields];
     }
     componentDidLoad() {
         debug('nylas-booking-form-config', 'componentDidLoad');
-        const additionalFields = Object.entries(this.selectedConfiguration?.scheduler?.additional_fields || {}).map(([id, field]) => ({ ...field, key: id })) ||
-            this.additionalFields ||
-            [];
+        if (this.selectedConfiguration) {
+            this.updateFormFields(this.selectedConfiguration);
+        }
+    }
+    updateFormFields(config) {
+        const additionalFields = Object.entries(config?.scheduler?.additional_fields || {}).map(([id, field]) => ({ ...field, key: id })) || this.additionalFields || [];
         this.formFields = [
-            ...this.formFields,
+            ...staticFields,
             ...additionalFields
                 .sort((a, b) => a.order - b.order)
                 .map((f, i) => {
@@ -3636,7 +3642,7 @@ const NylasBookingFormConfig = class {
         });
     }
     render() {
-        return (h(Host, { key: '632d9bd6cc0162efdb7e83b78b23935f04569fcb' }, h("div", { key: 'dae8d7f52a658b121a992f9cd73cd766e2c16cec', class: "nylas-booking-form-config", part: "nbfc" }, h("div", { key: '4f02c7163dfecd29df48da9b163e12e9a6c9c357', class: "header", part: "nbfc__header" }, h("div", { key: '169cfa3f8d4dd519dd0621d032d3e7a13384b8c7', class: "header_text" }, h("h3", { key: '66e50347bae8fca4c3344030d4d3caf4158244e2' }, "Booking form"), h("p", { key: '883886b2c841acdbd44e6cb1c18a860a51c52412' }, "Add custom fields to the booking form.")), h("div", { key: 'e307526fa6d75c4aaaa71c5658006d9e7417c0f0', class: "header_action" }, h("select-dropdown", { key: '4b16dd221f5740b21cde95488e2609730e08ea54', name: "add-field", exportparts: "sd_dropdown: nbfc__add_field, sd_dropdown-button: nbfc__add_field-button, sd_dropdown-content: nbfc__add_field-dropdown-content", options: DEFAULT_FORM_FIELD_TYPES, withSearch: false, withChevron: false, dropdownButtonText: "Add new field" }, h("span", { key: '5ccd949bb563f32f1682b9432759828f086b46e3', slot: "select-icon" }, h("plus-icon", { key: 'b77ac5dd297071ec6e16c3728db1a7b096e83e74', width: "15", height: "15" }))))), h("div", { key: 'a7499ce8959d027f0540b086c3393353c3993452', class: "content" }, h("div", { key: 'ff24161e13beba123ca46c814515704bf06d4259', id: "fields", class: "additional_fields", part: "nbfc__additional_fields" }, this.formFields.map((field, i) => {
+        return (h(Host, { key: 'bd832f2b9a02ce53187e4f633e4c0388e6e65a03' }, h("div", { key: 'fcf79fe131d8e0a99312286b15f228b997d8c0be', class: "nylas-booking-form-config", part: "nbfc" }, h("div", { key: '07cd086a8af8145f5a8c6676e360fa5f919040f3', class: "header", part: "nbfc__header" }, h("div", { key: 'f703982061b36b7f4b792f4deff59cc4256b7c25', class: "header_text" }, h("h3", { key: 'a7cba135c527592a000c296ceaf68bb91c9ddcf4' }, "Booking form"), h("p", { key: '62acf8b4a583145e2bc300b1b351799dec1ff438' }, "Add custom fields to the booking form.")), h("div", { key: '574ef9a02aa06ad29ac0b08c22aa749a844d32d8', class: "header_action" }, h("select-dropdown", { key: 'c2a83f721237dc1032af5e55e17438e1060b2e58', name: "add-field", exportparts: "sd_dropdown: nbfc__add_field, sd_dropdown-button: nbfc__add_field-button, sd_dropdown-content: nbfc__add_field-dropdown-content", options: DEFAULT_FORM_FIELD_TYPES, withSearch: false, withChevron: false, dropdownButtonText: "Add new field" }, h("span", { key: 'e0aaa33a3bd04b79499310c3904984269eaecbf3', slot: "select-icon" }, h("plus-icon", { key: '06bf29f2b3d0dca74d660db8791a47bc2474652b', width: "15", height: "15" }))))), h("div", { key: 'b33cfae9a876be328d795366802a1791e22ca164', class: "content" }, h("div", { key: '0df453e1fc129a13b90b33c6e267ecd9dd149c56', id: "fields", class: "additional_fields", part: "nbfc__additional_fields" }, this.formFields.map((field, i) => {
             return (h("div", { class: `form-field draggable ${field.readonly && 'fixed'}`, part: "nbfc__form_field", key: i }, h("div", { class: "form-field_header", part: "nbfc__form_field-header" }, h("span", { class: "dragable" }, h("dragable-icon", { width: "24", height: "25" })), h("div", { class: "form-field_header_text" }, h("h4", null, field.label), h("p", null, field.typeLabel)), h("div", { class: "form-field_header_actions" }, h("span", { class: `is-required` }, field.required ? 'Required' : 'Optional'), !field.readonly && (h("button", { onClick: () => {
                     this.fieldRemove(i);
                 } }, h("close-icon", null))), h("span", { class: `chevron ${field.isOpen ? 'open' : 'closed'}`, onClick: () => {
@@ -3656,6 +3662,7 @@ const NylasBookingFormConfig = class {
     get host() { return getElement(this); }
     static get watchers() { return {
         "name": ["elementNameChangedHandler"],
+        "selectedConfiguration": ["selectedConfigurationChangedHandler"],
         "formFields": ["watchHandler"]
     }; }
 };