@verdocs/web-sdk 6.13.2 → 6.13.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/cjs/verdocs-contact-picker.cjs.entry.js +3 -3
  2. package/dist/cjs/verdocs-contact-picker.cjs.entry.js.map +1 -1
  3. package/dist/cjs/verdocs-preview_6.cjs.entry.js +8 -12
  4. package/dist/cjs/verdocs-preview_6.cjs.entry.js.map +1 -1
  5. package/dist/collection/components/embeds/verdocs-send/verdocs-send.css +26 -0
  6. package/dist/collection/components/embeds/verdocs-send/verdocs-send.js +7 -11
  7. package/dist/collection/components/embeds/verdocs-send/verdocs-send.js.map +1 -1
  8. package/dist/collection/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.js +3 -3
  9. package/dist/collection/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.js.map +1 -1
  10. package/dist/components/p-K-sDaUxS.js +2 -0
  11. package/dist/components/p-K-sDaUxS.js.map +1 -0
  12. package/dist/components/{p-ByrpRZ3E.js → p-lCn8WPSe.js} +2 -2
  13. package/dist/components/p-lCn8WPSe.js.map +1 -0
  14. package/dist/components/verdocs-build.js +1 -1
  15. package/dist/components/verdocs-contact-picker.js +1 -1
  16. package/dist/components/verdocs-send.js +1 -1
  17. package/dist/esm/verdocs-contact-picker.entry.js +3 -3
  18. package/dist/esm/verdocs-contact-picker.entry.js.map +1 -1
  19. package/dist/esm/verdocs-preview_6.entry.js +8 -12
  20. package/dist/esm/verdocs-preview_6.entry.js.map +1 -1
  21. package/dist/esm-es5/verdocs-contact-picker.entry.js +1 -1
  22. package/dist/esm-es5/verdocs-contact-picker.entry.js.map +1 -1
  23. package/dist/esm-es5/verdocs-preview_6.entry.js +2 -2
  24. package/dist/esm-es5/verdocs-preview_6.entry.js.map +1 -1
  25. package/dist/types/components/embeds/verdocs-send/verdocs-send.d.ts +0 -1
  26. package/dist/verdocs-web-sdk/{p-38800961.system.entry.js → p-3a97f4b4.system.entry.js} +2 -2
  27. package/dist/verdocs-web-sdk/p-3a97f4b4.system.entry.js.map +1 -0
  28. package/dist/verdocs-web-sdk/{p-301f0247.entry.js → p-78a18a3b.entry.js} +2 -2
  29. package/dist/verdocs-web-sdk/p-78a18a3b.entry.js.map +1 -0
  30. package/dist/verdocs-web-sdk/p-895174e4.system.entry.js +8 -0
  31. package/dist/verdocs-web-sdk/p-895174e4.system.entry.js.map +1 -0
  32. package/dist/verdocs-web-sdk/p-8f7d0062.entry.js +8 -0
  33. package/dist/verdocs-web-sdk/p-8f7d0062.entry.js.map +1 -0
  34. package/dist/verdocs-web-sdk/p-BdZ5Ghsa.system.js +1 -1
  35. package/dist/verdocs-web-sdk/verdocs-web-sdk.esm.js +1 -1
  36. package/package.json +1 -1
  37. package/dist/components/p-Blr31TcJ.js +0 -2
  38. package/dist/components/p-Blr31TcJ.js.map +0 -1
  39. package/dist/components/p-ByrpRZ3E.js.map +0 -1
  40. package/dist/verdocs-web-sdk/p-1b818cdf.entry.js +0 -8
  41. package/dist/verdocs-web-sdk/p-1b818cdf.entry.js.map +0 -1
  42. package/dist/verdocs-web-sdk/p-24dcc54e.system.entry.js +0 -8
  43. package/dist/verdocs-web-sdk/p-24dcc54e.system.entry.js.map +0 -1
  44. package/dist/verdocs-web-sdk/p-301f0247.entry.js.map +0 -1
  45. package/dist/verdocs-web-sdk/p-38800961.system.entry.js.map +0 -1
@@ -121,7 +121,6 @@ export declare class VerdocsSend {
121
121
  expiresAt(): Date;
122
122
  unlistenToTemplate(): void;
123
123
  reset(): Promise<void>;
124
- brandSenderName(): string;
125
124
  effectiveSenderName(): string;
126
125
  effectiveSenderEmail(): string;
127
126
  senderOverrides(): {
@@ -1,2 +1,2 @@
1
- var __awaiter=this&&this.__awaiter||function(e,t,i,o){function n(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,c){function r(e){try{a(o.next(e))}catch(e){c(e)}}function s(e){try{a(o["throw"](e))}catch(e){c(e)}}function a(e){e.done?i(e.value):n(e.value).then(r,s)}a((o=o.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(c[0]&1)throw c[1];return c[1]},trys:[],ops:[]},o,n,c,r=Object.create((typeof Iterator==="function"?Iterator:Object).prototype);return r.next=s(0),r["throw"]=s(1),r["return"]=s(2),typeof Symbol==="function"&&(r[Symbol.iterator]=function(){return this}),r;function s(e){return function(t){return a([e,t])}}function a(s){if(o)throw new TypeError("Generator is already executing.");while(r&&(r=0,s[0]&&(i=0)),i)try{if(o=1,n&&(c=s[0]&2?n["return"]:s[0]?n["throw"]||((c=n["return"])&&c.call(n),0):n.next)&&!(c=c.call(n,s[1])).done)return c;if(n=0,c)s=[s[0]&2,c.value];switch(s[0]){case 0:case 1:c=s;break;case 4:i.label++;return{value:s[1],done:false};case 5:i.label++;n=s[1];s=[0];continue;case 7:s=i.ops.pop();i.trys.pop();continue;default:if(!(c=i.trys,c=c.length>0&&c[c.length-1])&&(s[0]===6||s[0]===2)){i=0;continue}if(s[0]===3&&(!c||s[1]>c[0]&&s[1]<c[3])){i.label=s[1];break}if(s[0]===6&&i.label<c[1]){i.label=c[1];c=s;break}if(c&&i.label<c[2]){i.label=c[2];i.ops.push(s);break}if(c[2])i.ops.pop();i.trys.pop();continue}s=t.call(e,i)}catch(e){s=[6,e];n=0}finally{o=c=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(e,t,i){if(i||arguments.length===2)for(var o=0,n=t.length,c;o<n;o++){if(c||!(o in t)){if(!c)c=Array.prototype.slice.call(t,0,o);c[o]=t[o]}}return e.concat(c||Array.prototype.slice.call(t))};System.register(["./p-De3fNE_u.system.js","@verdocs/js-sdk","./p-CE9CFlX9.system.js","./p-nfw6V5pF.system.js","./p-C7pDryJb.system.js","./p-CwIkMPyJ.system.js"],(function(e){"use strict";var t,i,o,n,c,r,s,a,l,p;return{setters:[function(e){t=e.r;i=e.c;o=e.h;n=e.g},function(e){c=e.VerdocsEndpoint;r=e.formatFullName;s=e.getActiveEntitlements;a=e.isValidEmail},function(e){l=e.u},function(e){p=e.c},null,null],execute:function(){var d=function(){return'verdocs-contact-picker{--picker-ink:var(--verdocs-body-color, #111827);--picker-ink-2:#374151;--picker-muted:#6b7280;--picker-faint:#9ca3af;--picker-control-border:#d1d5db;--picker-accent:var(--verdocs-link-color, #4c56cb);--picker-accent-tint:#f4f5fc;--picker-accent-tint-2:#e6e7f8;display:block;font-size:14px;color:var(--picker-ink);font-family:var(--verdocs-primary-font, "Inter", "Barlow", sans-serif)}verdocs-contact-picker *{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-contact-picker form{-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body-wrap{position:relative;-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body{position:relative;-ms-flex:1;flex:1;min-height:0;overflow-y:auto}verdocs-contact-picker .scroll-fade{position:absolute;left:0;right:0;bottom:0;height:36px;opacity:0;pointer-events:none;-webkit-transition:opacity 150ms ease-out;transition:opacity 150ms ease-out;background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#ffffff));background:linear-gradient(rgba(255, 255, 255, 0), #ffffff)}verdocs-contact-picker .scrollable:not(.at-end)>.scroll-fade{opacity:1}verdocs-contact-picker .row.names{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;position:relative}verdocs-contact-picker .row.names .field{-ms-flex:1;flex:1;min-width:0}verdocs-contact-picker .field{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;row-gap:4px;margin:0 0 10px 0}verdocs-contact-picker .field label{font-size:12px;font-weight:500;color:var(--picker-ink-2)}verdocs-contact-picker .field label .optional{color:var(--picker-muted);font-weight:400}verdocs-contact-picker input,verdocs-contact-picker textarea{width:100%;font-size:13px;font-family:inherit;color:var(--picker-ink);background:#ffffff;border:1px solid var(--picker-control-border);border-radius:6px;outline:none}verdocs-contact-picker input:focus,verdocs-contact-picker textarea:focus{border-color:var(--picker-accent);-webkit-box-shadow:0 0 0 2px var(--picker-accent-tint-2);box-shadow:0 0 0 2px var(--picker-accent-tint-2)}verdocs-contact-picker input::-webkit-input-placeholder,verdocs-contact-picker textarea::-webkit-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-moz-placeholder,verdocs-contact-picker textarea::-moz-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input:-ms-input-placeholder,verdocs-contact-picker textarea:-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-ms-input-placeholder,verdocs-contact-picker textarea::-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::placeholder,verdocs-contact-picker textarea::placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input{height:34px;padding:0 10px}verdocs-contact-picker textarea{height:56px;padding:8px 10px;resize:vertical}verdocs-contact-picker .group{margin:2px 0 12px 0}verdocs-contact-picker .group .group-label{font-size:12px;font-weight:500;color:var(--picker-ink-2);margin:0 0 6px 0}verdocs-contact-picker .pills{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:6px}verdocs-contact-picker .pill{all:unset;height:26px;padding:0 9px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:4px;-moz-column-gap:4px;column-gap:4px;cursor:pointer;font-size:12px;font-weight:500;font-family:inherit;white-space:nowrap;border-radius:999px;color:var(--picker-ink-2);border:1px solid var(--picker-control-border)}verdocs-contact-picker .pill:focus-visible{outline:2px solid var(--picker-accent);outline-offset:2px}verdocs-contact-picker .pill.selected{color:var(--picker-accent);border-color:var(--picker-accent);background:var(--picker-accent-tint)}verdocs-contact-picker .pill.locked{opacity:0.5;cursor:not-allowed}verdocs-contact-picker .pill .pill-icon,verdocs-contact-picker .pill .pill-icon svg{width:12px;height:12px;display:block}verdocs-contact-picker .passcode{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:8px}verdocs-contact-picker .passcode input{-ms-flex:0 0 120px;flex:0 0 120px;width:120px;height:30px}verdocs-contact-picker .passcode .passcode-hint{-ms-flex:1;flex:1;min-width:0;font-size:11px;line-height:1.35;color:var(--picker-muted);-ms-flex-item-align:center;align-self:center}verdocs-contact-picker .buttons{margin-top:10px;padding-top:12px;border-top:1px solid #e5e7eb;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px}verdocs-contact-picker .buttons verdocs-button:last-child{-ms-flex:1;flex:1}verdocs-contact-picker .buttons verdocs-button:last-child button{width:100%}verdocs-contact-picker .suggestions{position:absolute;top:0;left:0;right:0;z-index:20;max-height:225px;overflow-y:auto;background:#ffffff;border-radius:6px;border:1px solid #e5e7eb;-webkit-box-shadow:0 8px 24px rgba(17, 24, 39, 0.14);box-shadow:0 8px 24px rgba(17, 24, 39, 0.14)}verdocs-contact-picker .suggestions .suggestion{display:-ms-flexbox;display:flex;padding:6px 12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;cursor:pointer}verdocs-contact-picker .suggestions .suggestion svg{width:28px;height:28px}verdocs-contact-picker .suggestions .suggestion .avatar{width:28px;height:28px;-ms-flex:0 0 28px;flex:0 0 28px;margin-right:8px;border-radius:100%}verdocs-contact-picker .suggestions .suggestion .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0}verdocs-contact-picker .suggestions .suggestion .name{font-size:13px;font-weight:500;color:var(--picker-ink)}verdocs-contact-picker .suggestions .suggestion .destination{font-size:12px;color:var(--picker-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-contact-picker .suggestions .suggestion:hover{background:var(--picker-accent-tint)}verdocs-contact-picker [data-lastpass-icon-root]{display:none !important}'};var u='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-user"><path d="M15 13a3 3 0 1 0-6 0"/><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"/><circle cx="12" cy="8" r="2"/></svg>';var f='<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>';var h=e("verdocs_contact_picker",function(){function e(e){t(this,e);this.searchContacts=i(this,"searchContacts");this.exit=i(this,"exit");this.next=i(this,"next");this.endpoint=c.getDefault();this.templateRole=null;this.contactSuggestions=[];this.showCancel=true;this.showSuggestions=false;this.showMessage=false;this.delegator=false;this.name_locked=false;this.auth_methods=[];this.passcode="";this.firstNameFieldId="verdocs-contact-picker-firstname-".concat(Math.random().toString(36).substring(2,11));this.lastNameFieldId="verdocs-contact-picker-lastname-".concat(Math.random().toString(36).substring(2,11));this.emailFieldId="verdocs-contact-picker-email-".concat(Math.random().toString(36).substring(2,11));this.phoneFieldId="verdocs-contact-picker-phone-".concat(Math.random().toString(36).substring(2,11));this.activeEntitlements={};this.authMethodsLoading=true}e.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var e,t,i,o,n;return __generator(this,(function(c){switch(c.label){case 0:this.endpoint.loadSession();if(this.templateRole){e=r(this.templateRole);t=e.split(" ");i=this.templateRole.first_name||t.shift()||"";o=this.templateRole.last_name||t.join(" ")||"";this.first_name=i;this.last_name=o;this.email=this.templateRole.email||"";this.phone=this.templateRole.phone||"";this.delegator=this.templateRole.delegator||false;this.name_locked=this.delegator?false:this.templateRole.name_locked||false;this.message=this.templateRole.message||"";this.showMessage=this.message!=="";this.auth_methods=this.templateRole.auth_methods||[];this.passcode=this.templateRole.passcode||""}n=this;return[4,s(this.endpoint).catch((function(e){console.warn("[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only",e);return{}}))];case 1:n.activeEntitlements=c.sent();this.authMethodsLoading=false;console.log("[CONTACT PICKER] Loaded entitlements",this.activeEntitlements);return[2]}}))}))};e.prototype.componentDidRender=function(){var e=this.el.querySelector(".form-body");l(e);if(this.suggestionsEl&&this.namesRowEl&&e){this.suggestionsEl.style.top="".concat(this.namesRowEl.offsetTop+this.namesRowEl.offsetHeight-e.scrollTop+4,"px")}};e.prototype.handleDocumentClick=function(e){if(this.showSuggestions&&!this.el.contains(e.target)){this.showSuggestions=false}};e.prototype.handleFirstNameChange=function(e){var t;this.first_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.first_name})};e.prototype.handleLastNameChange=function(e){var t;this.last_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.last_name})};e.prototype.handleCancel=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.exit)===null||t===void 0?void 0:t.emit()};e.prototype.handleSubmit=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.next)===null||t===void 0?void 0:t.emit({first_name:this.first_name,last_name:this.last_name,email:this.email,phone:this.phone,message:this.message,delegator:this.delegator,name_locked:this.name_locked,auth_methods:this.auth_methods,passcode:this.passcode,address:this.address,zip:this.zip})};e.prototype.handleSelectSuggestion=function(e,t){e.stopPropagation();this.first_name=t.first_name;this.last_name=t.last_name;this.email=t.email;this.phone=t.phone;this.showSuggestions=false};e.prototype.toggleAuthMethod=function(e){if(this.auth_methods.includes(e)){this.auth_methods=this.auth_methods.filter((function(t){return t!==e}))}else{this.auth_methods=__spreadArray(__spreadArray([],this.auth_methods,true),[e],false)}};e.prototype.setSigningOption=function(e){this.delegator=e==="delegator";this.name_locked=e==="name_locked"};e.prototype.renderPill=function(e,t,i,n){if(n===void 0){n={}}return o("button",{type:"button",class:{pill:true,selected:t,locked:!!n.locked},"aria-pressed":t?"true":"false",disabled:n.locked&&!t,title:n.title,onClick:i},n.locked&&o("span",{class:"pill-icon",innerHTML:f}),e)};e.prototype.render=function(){var e=this;var t=this.first_name&&this.last_name&&a(this.email);var i=this.auth_methods.every((function(t){switch(t){case"passcode":return!!e.passcode;case"kba":return!!e.first_name&&!!e.last_name;case"email":return!!e.email;case"sms":return!!e.phone;default:return true}}));var n=t&&i;var c=!!this.activeEntitlements.sms_auth;var s=[{label:"Email OTP",value:"email"},{label:"Passcode",value:"passcode"},{label:"SMS OTP",value:"sms",locked:!c},{label:"KBA",value:"kba",locked:!this.activeEntitlements.kba_auth},{label:"ID check",value:"id",locked:!this.activeEntitlements.id_auth}];var d=this.delegator?"delegator":this.name_locked?"name_locked":"none";return o("form",{onSubmit:function(e){return e.preventDefault()},autocomplete:"off"},o("div",{class:"form-body-wrap"},o("div",{class:"form-body",onScroll:function(t){l(t.target);e.showSuggestions=false}},o("div",{class:"row names",ref:function(t){return e.namesRowEl=t}},o("div",{class:"field"},o("label",{htmlFor:this.firstNameFieldId},"First name"),o("input",{id:this.firstNameFieldId,name:this.firstNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.first_name,onFocus:function(){setTimeout((function(){var t;e.showSuggestions=((t=e.contactSuggestions)===null||t===void 0?void 0:t.length)>0}),100)},onInput:function(t){return e.handleFirstNameChange(t)}})),o("div",{class:"field"},o("label",{htmlFor:this.lastNameFieldId},"Last name"),o("input",{id:this.lastNameFieldId,name:this.lastNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.last_name,onFocus:function(){setTimeout((function(){var t;e.showSuggestions=((t=e.contactSuggestions)===null||t===void 0?void 0:t.length)>0}),100)},onInput:function(t){return e.handleLastNameChange(t)}}))),o("div",{class:"field"},o("label",{htmlFor:this.emailFieldId},"Email"),o("input",{id:this.emailFieldId,name:this.emailFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.email,onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.email=t.target.value}})),c&&o("div",{class:"field"},o("label",{htmlFor:this.phoneFieldId},"Phone ",o("span",{class:"optional"},"(optional)")),o("input",{id:this.phoneFieldId,name:this.phoneFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.phone,placeholder:"+1 (555) 000-0000",onFocus:function(){return e.showSuggestions=false},onInput:function(t){e.phone=p(t.target.value)}})),o("div",{class:"group"},o("div",{class:"group-label"},"Verification"),this.authMethodsLoading?o("verdocs-spinner",{size:10,mode:"dark"}):o("div",{class:"pills"},s.map((function(t){return e.renderPill(t.label,e.auth_methods.includes(t.value),(function(){return e.toggleAuthMethod(t.value)}),{locked:t.locked,title:t.locked?"Please contact sales@verdocs.com to enable this feature.":undefined})}))),this.auth_methods.includes("passcode")&&o("div",{class:"passcode"},o("input",{id:"verdocs-passcode",name:"verdocs-passcode",type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none","aria-label":"Passcode",value:this.passcode,placeholder:"4-8 digits",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.passcode=t.target.value}}),o("span",{class:"passcode-hint"},"PIN or passcode shared separately with the recipient ahead of time"))),o("div",{class:"group"},o("div",{class:"group-label"},"Signing options"),o("div",{class:"pills"},this.renderPill("None",d==="none",(function(){return e.setSigningOption("none")})),this.renderPill("May delegate",d==="delegator",(function(){return e.setSigningOption("delegator")})),this.renderPill("Name locked",d==="name_locked",(function(){return e.setSigningOption("name_locked")})))),o("div",{class:"field"},o("label",{htmlFor:"verdocs-contact-picker-message"},"Message ",o("span",{class:"optional"},"(optional)")),o("textarea",{id:"verdocs-contact-picker-message",name:"verdocs-contact-picker-message","data-lpignore":"true",autocomplete:"blocked",placeholder:"Add a message to the invitation",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.message=t.target.value}},this.message))),o("div",{class:"scroll-fade"}),this.showSuggestions&&o("div",{class:"suggestions",role:"listbox",ref:function(t){return e.suggestionsEl=t}},this.contactSuggestions.filter((function(t){var i;return!e.first_name||((i=t.first_name)===null||i===void 0?void 0:i.toLowerCase().includes(e.first_name.toLowerCase()))})).map((function(t){var i;return o("div",{key:(i=t.id)!==null&&i!==void 0?i:t.email,class:"suggestion",onClick:function(i){return e.handleSelectSuggestion(i,t)}},t.picture?o("img",{alt:"Avatar",class:"avatar",src:t.picture}):o("div",{class:"avatar",innerHTML:u}),o("div",{class:"details"},o("div",{class:"name"},r(t)),t.email&&o("div",{class:"destination"},t.email),t.phone&&o("div",{class:"destination"},t.phone)))})))),o("div",{class:"buttons"},this.showCancel&&o("verdocs-button",{label:"Cancel",variant:"text",size:"small",onClick:function(t){return e.handleCancel(t)}}),o("verdocs-button",{label:"Done",size:"small",disabled:!n,onClick:!n?function(){}:function(t){return e.handleSubmit(t)}})))};Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());h.style=d()}}}));
2
- //# sourceMappingURL=p-38800961.system.entry.js.map
1
+ var __awaiter=this&&this.__awaiter||function(e,t,i,o){function n(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,r){function c(e){try{a(o.next(e))}catch(e){r(e)}}function s(e){try{a(o["throw"](e))}catch(e){r(e)}}function a(e){e.done?i(e.value):n(e.value).then(c,s)}a((o=o.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},o,n,r,c=Object.create((typeof Iterator==="function"?Iterator:Object).prototype);return c.next=s(0),c["throw"]=s(1),c["return"]=s(2),typeof Symbol==="function"&&(c[Symbol.iterator]=function(){return this}),c;function s(e){return function(t){return a([e,t])}}function a(s){if(o)throw new TypeError("Generator is already executing.");while(c&&(c=0,s[0]&&(i=0)),i)try{if(o=1,n&&(r=s[0]&2?n["return"]:s[0]?n["throw"]||((r=n["return"])&&r.call(n),0):n.next)&&!(r=r.call(n,s[1])).done)return r;if(n=0,r)s=[s[0]&2,r.value];switch(s[0]){case 0:case 1:r=s;break;case 4:i.label++;return{value:s[1],done:false};case 5:i.label++;n=s[1];s=[0];continue;case 7:s=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(s[0]===6||s[0]===2)){i=0;continue}if(s[0]===3&&(!r||s[1]>r[0]&&s[1]<r[3])){i.label=s[1];break}if(s[0]===6&&i.label<r[1]){i.label=r[1];r=s;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(s);break}if(r[2])i.ops.pop();i.trys.pop();continue}s=t.call(e,i)}catch(e){s=[6,e];n=0}finally{o=r=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(e,t,i){if(i||arguments.length===2)for(var o=0,n=t.length,r;o<n;o++){if(r||!(o in t)){if(!r)r=Array.prototype.slice.call(t,0,o);r[o]=t[o]}}return e.concat(r||Array.prototype.slice.call(t))};System.register(["./p-De3fNE_u.system.js","@verdocs/js-sdk","./p-CE9CFlX9.system.js","./p-nfw6V5pF.system.js","./p-C7pDryJb.system.js","./p-CwIkMPyJ.system.js"],(function(e){"use strict";var t,i,o,n,r,c,s,a,l,p;return{setters:[function(e){t=e.r;i=e.c;o=e.h;n=e.g},function(e){r=e.VerdocsEndpoint;c=e.formatFullName;s=e.getActiveEntitlements;a=e.isValidEmail},function(e){l=e.u},function(e){p=e.c},null,null],execute:function(){var d=function(){return'verdocs-contact-picker{--picker-ink:var(--verdocs-body-color, #111827);--picker-ink-2:#374151;--picker-muted:#6b7280;--picker-faint:#9ca3af;--picker-control-border:#d1d5db;--picker-accent:var(--verdocs-link-color, #4c56cb);--picker-accent-tint:#f4f5fc;--picker-accent-tint-2:#e6e7f8;display:block;font-size:14px;color:var(--picker-ink);font-family:var(--verdocs-primary-font, "Inter", "Barlow", sans-serif)}verdocs-contact-picker *{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-contact-picker form{-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body-wrap{position:relative;-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body{position:relative;-ms-flex:1;flex:1;min-height:0;overflow-y:auto}verdocs-contact-picker .scroll-fade{position:absolute;left:0;right:0;bottom:0;height:36px;opacity:0;pointer-events:none;-webkit-transition:opacity 150ms ease-out;transition:opacity 150ms ease-out;background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#ffffff));background:linear-gradient(rgba(255, 255, 255, 0), #ffffff)}verdocs-contact-picker .scrollable:not(.at-end)>.scroll-fade{opacity:1}verdocs-contact-picker .row.names{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;position:relative}verdocs-contact-picker .row.names .field{-ms-flex:1;flex:1;min-width:0}verdocs-contact-picker .field{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;row-gap:4px;margin:0 0 10px 0}verdocs-contact-picker .field label{font-size:12px;font-weight:500;color:var(--picker-ink-2)}verdocs-contact-picker .field label .optional{color:var(--picker-muted);font-weight:400}verdocs-contact-picker input,verdocs-contact-picker textarea{width:100%;font-size:13px;font-family:inherit;color:var(--picker-ink);background:#ffffff;border:1px solid var(--picker-control-border);border-radius:6px;outline:none}verdocs-contact-picker input:focus,verdocs-contact-picker textarea:focus{border-color:var(--picker-accent);-webkit-box-shadow:0 0 0 2px var(--picker-accent-tint-2);box-shadow:0 0 0 2px var(--picker-accent-tint-2)}verdocs-contact-picker input::-webkit-input-placeholder,verdocs-contact-picker textarea::-webkit-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-moz-placeholder,verdocs-contact-picker textarea::-moz-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input:-ms-input-placeholder,verdocs-contact-picker textarea:-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-ms-input-placeholder,verdocs-contact-picker textarea::-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::placeholder,verdocs-contact-picker textarea::placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input{height:34px;padding:0 10px}verdocs-contact-picker textarea{height:56px;padding:8px 10px;resize:vertical}verdocs-contact-picker .group{margin:2px 0 12px 0}verdocs-contact-picker .group .group-label{font-size:12px;font-weight:500;color:var(--picker-ink-2);margin:0 0 6px 0}verdocs-contact-picker .pills{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:6px}verdocs-contact-picker .pill{all:unset;height:26px;padding:0 9px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:4px;-moz-column-gap:4px;column-gap:4px;cursor:pointer;font-size:12px;font-weight:500;font-family:inherit;white-space:nowrap;border-radius:999px;color:var(--picker-ink-2);border:1px solid var(--picker-control-border)}verdocs-contact-picker .pill:focus-visible{outline:2px solid var(--picker-accent);outline-offset:2px}verdocs-contact-picker .pill.selected{color:var(--picker-accent);border-color:var(--picker-accent);background:var(--picker-accent-tint)}verdocs-contact-picker .pill.locked{opacity:0.5;cursor:not-allowed}verdocs-contact-picker .pill .pill-icon,verdocs-contact-picker .pill .pill-icon svg{width:12px;height:12px;display:block}verdocs-contact-picker .passcode{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:8px}verdocs-contact-picker .passcode input{-ms-flex:0 0 120px;flex:0 0 120px;width:120px;height:30px}verdocs-contact-picker .passcode .passcode-hint{-ms-flex:1;flex:1;min-width:0;font-size:11px;line-height:1.35;color:var(--picker-muted);-ms-flex-item-align:center;align-self:center}verdocs-contact-picker .buttons{margin-top:10px;padding-top:12px;border-top:1px solid #e5e7eb;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px}verdocs-contact-picker .buttons verdocs-button:last-child{-ms-flex:1;flex:1}verdocs-contact-picker .buttons verdocs-button:last-child button{width:100%}verdocs-contact-picker .suggestions{position:absolute;top:0;left:0;right:0;z-index:20;max-height:225px;overflow-y:auto;background:#ffffff;border-radius:6px;border:1px solid #e5e7eb;-webkit-box-shadow:0 8px 24px rgba(17, 24, 39, 0.14);box-shadow:0 8px 24px rgba(17, 24, 39, 0.14)}verdocs-contact-picker .suggestions .suggestion{display:-ms-flexbox;display:flex;padding:6px 12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;cursor:pointer}verdocs-contact-picker .suggestions .suggestion svg{width:28px;height:28px}verdocs-contact-picker .suggestions .suggestion .avatar{width:28px;height:28px;-ms-flex:0 0 28px;flex:0 0 28px;margin-right:8px;border-radius:100%}verdocs-contact-picker .suggestions .suggestion .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0}verdocs-contact-picker .suggestions .suggestion .name{font-size:13px;font-weight:500;color:var(--picker-ink)}verdocs-contact-picker .suggestions .suggestion .destination{font-size:12px;color:var(--picker-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-contact-picker .suggestions .suggestion:hover{background:var(--picker-accent-tint)}verdocs-contact-picker [data-lastpass-icon-root]{display:none !important}'};var u='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-user"><path d="M15 13a3 3 0 1 0-6 0"/><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"/><circle cx="12" cy="8" r="2"/></svg>';var f='<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>';var h=e("verdocs_contact_picker",function(){function e(e){t(this,e);this.searchContacts=i(this,"searchContacts");this.exit=i(this,"exit");this.next=i(this,"next");this.endpoint=r.getDefault();this.templateRole=null;this.contactSuggestions=[];this.showCancel=true;this.showSuggestions=false;this.showMessage=false;this.delegator=false;this.name_locked=false;this.auth_methods=[];this.passcode="";this.firstNameFieldId="verdocs-contact-picker-firstname-".concat(Math.random().toString(36).substring(2,11));this.lastNameFieldId="verdocs-contact-picker-lastname-".concat(Math.random().toString(36).substring(2,11));this.emailFieldId="verdocs-contact-picker-email-".concat(Math.random().toString(36).substring(2,11));this.phoneFieldId="verdocs-contact-picker-phone-".concat(Math.random().toString(36).substring(2,11));this.activeEntitlements={};this.authMethodsLoading=true}e.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var e,t,i,o,n;return __generator(this,(function(r){switch(r.label){case 0:this.endpoint.loadSession();if(this.templateRole){e=c(this.templateRole);t=e.split(" ");i=this.templateRole.first_name||t.shift()||"";o=this.templateRole.last_name||t.join(" ")||"";this.first_name=i;this.last_name=o;this.email=this.templateRole.email||"";this.phone=this.templateRole.phone||"";this.delegator=this.templateRole.delegator||false;this.name_locked=this.delegator?false:this.templateRole.name_locked||false;this.message=this.templateRole.message||"";this.showMessage=this.message!=="";this.auth_methods=this.templateRole.auth_methods||[];this.passcode=this.templateRole.passcode||""}n=this;return[4,s(this.endpoint).catch((function(e){console.warn("[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only",e);return{}}))];case 1:n.activeEntitlements=r.sent();this.authMethodsLoading=false;console.log("[CONTACT PICKER] Loaded entitlements",this.activeEntitlements);return[2]}}))}))};e.prototype.componentDidRender=function(){var e=this.el.querySelector(".form-body");l(e);if(this.suggestionsEl&&this.namesRowEl&&e){this.suggestionsEl.style.top="".concat(this.namesRowEl.offsetTop+this.namesRowEl.offsetHeight-e.scrollTop+4,"px")}};e.prototype.handleDocumentClick=function(e){if(this.showSuggestions&&!this.el.contains(e.target)){this.showSuggestions=false}};e.prototype.handleFirstNameChange=function(e){var t;this.first_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.first_name})};e.prototype.handleLastNameChange=function(e){var t;this.last_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.last_name})};e.prototype.handleCancel=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.exit)===null||t===void 0?void 0:t.emit()};e.prototype.handleSubmit=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.next)===null||t===void 0?void 0:t.emit({first_name:this.first_name,last_name:this.last_name,email:this.email,phone:this.phone,message:this.message,delegator:this.delegator,name_locked:this.name_locked,auth_methods:this.auth_methods,passcode:this.passcode,address:this.address,zip:this.zip})};e.prototype.handleSelectSuggestion=function(e,t){e.stopPropagation();this.first_name=t.first_name;this.last_name=t.last_name;this.email=t.email;this.phone=t.phone;this.showSuggestions=false};e.prototype.toggleAuthMethod=function(e){if(this.auth_methods.includes(e)){this.auth_methods=this.auth_methods.filter((function(t){return t!==e}))}else{this.auth_methods=__spreadArray(__spreadArray([],this.auth_methods,true),[e],false)}};e.prototype.setSigningOption=function(e){this.delegator=e==="delegator";this.name_locked=e==="name_locked"};e.prototype.renderPill=function(e,t,i,n){if(n===void 0){n={}}return o("button",{type:"button",class:{pill:true,selected:t,locked:!!n.locked},"aria-pressed":t?"true":"false",disabled:n.locked&&!t,title:n.title,onClick:i},n.locked&&o("span",{class:"pill-icon",innerHTML:f}),e)};e.prototype.render=function(){var e=this;var t=this.first_name&&this.last_name&&a(this.email);var i=(this.contactSuggestions||[]).filter((function(t){var i;return!e.first_name||((i=t.first_name)===null||i===void 0?void 0:i.toLowerCase().includes(e.first_name.toLowerCase()))}));var n=this.auth_methods.every((function(t){switch(t){case"passcode":return!!e.passcode;case"kba":return!!e.first_name&&!!e.last_name;case"email":return!!e.email;case"sms":return!!e.phone;default:return true}}));var r=t&&n;var s=!!this.activeEntitlements.sms_auth;var d=[{label:"Email OTP",value:"email"},{label:"Passcode",value:"passcode"},{label:"SMS OTP",value:"sms",locked:!s},{label:"KBA",value:"kba",locked:!this.activeEntitlements.kba_auth},{label:"ID check",value:"id",locked:!this.activeEntitlements.id_auth}];var f=this.delegator?"delegator":this.name_locked?"name_locked":"none";return o("form",{onSubmit:function(e){return e.preventDefault()},autocomplete:"off"},o("div",{class:"form-body-wrap"},o("div",{class:"form-body",onScroll:function(t){l(t.target);e.showSuggestions=false}},o("div",{class:"row names",ref:function(t){return e.namesRowEl=t}},o("div",{class:"field"},o("label",{htmlFor:this.firstNameFieldId},"First name"),o("input",{id:this.firstNameFieldId,name:this.firstNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.first_name,onFocus:function(){setTimeout((function(){var t;e.showSuggestions=((t=e.contactSuggestions)===null||t===void 0?void 0:t.length)>0}),100)},onInput:function(t){return e.handleFirstNameChange(t)}})),o("div",{class:"field"},o("label",{htmlFor:this.lastNameFieldId},"Last name"),o("input",{id:this.lastNameFieldId,name:this.lastNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.last_name,onFocus:function(){setTimeout((function(){var t;e.showSuggestions=((t=e.contactSuggestions)===null||t===void 0?void 0:t.length)>0}),100)},onInput:function(t){return e.handleLastNameChange(t)}}))),o("div",{class:"field"},o("label",{htmlFor:this.emailFieldId},"Email"),o("input",{id:this.emailFieldId,name:this.emailFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.email,onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.email=t.target.value}})),s&&o("div",{class:"field"},o("label",{htmlFor:this.phoneFieldId},"Phone ",o("span",{class:"optional"},"(optional)")),o("input",{id:this.phoneFieldId,name:this.phoneFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.phone,placeholder:"+1 (555) 000-0000",onFocus:function(){return e.showSuggestions=false},onInput:function(t){e.phone=p(t.target.value)}})),o("div",{class:"group"},o("div",{class:"group-label"},"Verification"),this.authMethodsLoading?o("verdocs-spinner",{size:10,mode:"dark"}):o("div",{class:"pills"},d.map((function(t){return e.renderPill(t.label,e.auth_methods.includes(t.value),(function(){return e.toggleAuthMethod(t.value)}),{locked:t.locked,title:t.locked?"Please contact sales@verdocs.com to enable this feature.":undefined})}))),this.auth_methods.includes("passcode")&&o("div",{class:"passcode"},o("input",{id:"verdocs-passcode",name:"verdocs-passcode",type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none","aria-label":"Passcode",value:this.passcode,placeholder:"4-8 digits",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.passcode=t.target.value}}),o("span",{class:"passcode-hint"},"PIN or passcode shared separately with the recipient ahead of time"))),o("div",{class:"group"},o("div",{class:"group-label"},"Signing options"),o("div",{class:"pills"},this.renderPill("None",f==="none",(function(){return e.setSigningOption("none")})),this.renderPill("May delegate",f==="delegator",(function(){return e.setSigningOption("delegator")})),this.renderPill("Name locked",f==="name_locked",(function(){return e.setSigningOption("name_locked")})))),o("div",{class:"field"},o("label",{htmlFor:"verdocs-contact-picker-message"},"Message ",o("span",{class:"optional"},"(optional)")),o("textarea",{id:"verdocs-contact-picker-message",name:"verdocs-contact-picker-message","data-lpignore":"true",autocomplete:"blocked",placeholder:"Add a message to the invitation",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.message=t.target.value}},this.message))),o("div",{class:"scroll-fade"}),this.showSuggestions&&i.length>0&&o("div",{class:"suggestions",role:"listbox",ref:function(t){return e.suggestionsEl=t}},i.map((function(t){var i;return o("div",{key:(i=t.id)!==null&&i!==void 0?i:t.email,class:"suggestion",onClick:function(i){return e.handleSelectSuggestion(i,t)}},t.picture?o("img",{alt:"Avatar",class:"avatar",src:t.picture}):o("div",{class:"avatar",innerHTML:u}),o("div",{class:"details"},o("div",{class:"name"},c(t)),t.email&&o("div",{class:"destination"},t.email),t.phone&&o("div",{class:"destination"},t.phone)))})))),o("div",{class:"buttons"},this.showCancel&&o("verdocs-button",{label:"Cancel",variant:"text",size:"small",onClick:function(t){return e.handleCancel(t)}}),o("verdocs-button",{label:"Done",size:"small",disabled:!r,onClick:!r?function(){}:function(t){return e.handleSubmit(t)}})))};Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());h.style=d()}}}));
2
+ //# sourceMappingURL=p-3a97f4b4.system.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["verdocsContactPickerCss","addrBookIcon","lockIcon","VerdocsContactPicker","exports","class_1","hostRef","this","endpoint","VerdocsEndpoint","getDefault","templateRole","contactSuggestions","showCancel","showSuggestions","showMessage","delegator","name_locked","auth_methods","passcode","firstNameFieldId","concat","Math","random","toString","substring","lastNameFieldId","emailFieldId","phoneFieldId","activeEntitlements","authMethodsLoading","prototype","componentWillLoad","loadSession","fullName","formatFullName","nameComponents","split","firstName","first_name","shift","lastName","last_name","join","email","phone","message","_b","getActiveEntitlements","catch","e","console","warn","_c","sent","log","componentDidRender","body","el","querySelector","updateScrollFade","suggestionsEl","namesRowEl","style","top","offsetTop","offsetHeight","scrollTop","handleDocumentClick","contains","target","handleFirstNameChange","value","_a","searchContacts","emit","query","handleLastNameChange","handleCancel","stopPropagation","exit","handleSubmit","next","address","zip","handleSelectSuggestion","suggestion","toggleAuthMethod","method","includes","filter","selected","__spreadArray","setSigningOption","option","renderPill","label","onClick","opts","h","type","class","pill","locked","disabled","title","innerHTML","render","_this","hasBasics","isValidEmail","visibleSuggestions","toLowerCase","hasAuthRequirements","every","canSubmit","hasSMSAuth","sms_auth","verificationOptions","kba_auth","id_auth","signingOption","onSubmit","preventDefault","autocomplete","onScroll","ref","htmlFor","id","name","onFocus","setTimeout","length","onInput","autoComplete","placeholder","convertToE164","size","mode","map","undefined","role","key","picture","alt","src","variant"],"sources":["src/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.scss?tag=verdocs-contact-picker","src/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-contact-picker {\n --picker-ink: var(--verdocs-body-color, #111827);\n --picker-ink-2: #374151;\n --picker-muted: #6b7280;\n --picker-faint: #9ca3af;\n --picker-control-border: #d1d5db;\n --picker-accent: var(--verdocs-link-color, #{$secondary-color});\n --picker-accent-tint: #f4f5fc;\n --picker-accent-tint-2: #e6e7f8;\n\n display: block;\n font-size: 14px;\n color: var(--picker-ink);\n font-family: $verdocs-primary-font;\n\n * {\n box-sizing: border-box;\n }\n\n form {\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n // Fields scroll above a pinned Done button when the host constrains the picker's height; with\n // no constraint the body simply grows and the fade never shows.\n .form-body-wrap {\n position: relative;\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n .form-body {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n }\n\n .scroll-fade {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 36px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms ease-out;\n background: linear-gradient(rgba(255, 255, 255, 0), #ffffff);\n }\n\n .scrollable:not(.at-end) > .scroll-fade {\n opacity: 1;\n }\n\n .row.names {\n display: flex;\n column-gap: 8px;\n position: relative;\n\n .field {\n flex: 1;\n min-width: 0;\n }\n }\n\n .field {\n display: flex;\n flex-direction: column;\n row-gap: 4px;\n margin: 0 0 10px 0;\n\n label {\n font-size: 12px;\n font-weight: 500;\n color: var(--picker-ink-2);\n\n .optional {\n color: var(--picker-muted);\n font-weight: 400;\n }\n }\n }\n\n input,\n textarea {\n width: 100%;\n font-size: 13px;\n font-family: inherit;\n color: var(--picker-ink);\n background: #ffffff;\n border: 1px solid var(--picker-control-border);\n border-radius: 6px;\n outline: none;\n\n &:focus {\n border-color: var(--picker-accent);\n box-shadow: 0 0 0 2px var(--picker-accent-tint-2);\n }\n\n &::placeholder {\n color: var(--picker-faint);\n opacity: 1;\n }\n }\n\n input {\n height: 34px;\n padding: 0 10px;\n }\n\n textarea {\n height: 56px;\n padding: 8px 10px;\n resize: vertical;\n }\n\n .group {\n margin: 2px 0 12px 0;\n\n .group-label {\n font-size: 12px;\n font-weight: 500;\n color: var(--picker-ink-2);\n margin: 0 0 6px 0;\n }\n }\n\n .pills {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n }\n\n .pill {\n all: unset;\n height: 26px;\n padding: 0 9px;\n display: inline-flex;\n align-items: center;\n column-gap: 4px;\n cursor: pointer;\n font-size: 12px;\n font-weight: 500;\n font-family: inherit;\n white-space: nowrap;\n border-radius: 999px;\n color: var(--picker-ink-2);\n border: 1px solid var(--picker-control-border);\n\n &:focus-visible {\n outline: 2px solid var(--picker-accent);\n outline-offset: 2px;\n }\n\n &.selected {\n color: var(--picker-accent);\n border-color: var(--picker-accent);\n background: var(--picker-accent-tint);\n }\n\n &.locked {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .pill-icon,\n .pill-icon svg {\n width: 12px;\n height: 12px;\n display: block;\n }\n }\n\n .passcode {\n display: flex;\n align-items: center;\n column-gap: 8px;\n margin-top: 8px;\n\n input {\n flex: 0 0 120px;\n width: 120px;\n height: 30px;\n }\n\n .passcode-hint {\n flex: 1;\n min-width: 0;\n font-size: 11px;\n line-height: 1.35;\n color: var(--picker-muted);\n align-self: center;\n }\n }\n\n .buttons {\n margin-top: 10px;\n padding-top: 12px;\n border-top: 1px solid #e5e7eb;\n flex: none;\n display: flex;\n column-gap: 10px;\n\n verdocs-button:last-child {\n flex: 1;\n }\n\n verdocs-button:last-child button {\n width: 100%;\n }\n }\n\n .suggestions {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 20;\n max-height: 225px;\n overflow-y: auto;\n background: #ffffff;\n border-radius: 6px;\n border: 1px solid #e5e7eb;\n box-shadow: 0 8px 24px rgba(17, 24, 39, 0.14);\n\n .suggestion {\n display: flex;\n padding: 6px 12px;\n align-items: center;\n flex-direction: row;\n cursor: pointer;\n\n svg {\n width: 28px;\n height: 28px;\n }\n\n .avatar {\n width: 28px;\n height: 28px;\n flex: 0 0 28px;\n margin-right: 8px;\n border-radius: 100%;\n }\n\n .details {\n display: flex;\n flex-direction: column;\n min-width: 0;\n }\n\n .name {\n font-size: 13px;\n font-weight: 500;\n color: var(--picker-ink);\n }\n\n .destination {\n font-size: 12px;\n color: var(--picker-muted);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &:hover {\n background: var(--picker-accent-tint);\n }\n }\n }\n\n // @see https://community.logmein.com/t5/LastPass-Support-Discussions/placeholder-text-overrides-data-lpignore-quot-true-quot/td-p/295135\n // LastPass is ignoring the data-lpignore attribute in some cases\n [data-lastpass-icon-root] {\n display: none !important;\n }\n}\n","import {Component, Element, h, Event, EventEmitter, Listen, Prop, State} from '@stencil/core';\nimport {formatFullName, getActiveEntitlements, IEntitlement, IProfile, IRecipient, isValidEmail, TEntitlement, TRecipientAuthMethod, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {updateScrollFade} from '../../../utils/ScrollFade';\nimport {convertToE164} from '../../../utils/utils';\n\nconst addrBookIcon = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-book-user\"><path d=\"M15 13a3 3 0 1 0-6 0\"/><path d=\"M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20\"/><circle cx=\"12\" cy=\"8\" r=\"2\"/></svg>`;\n\nconst lockIcon = `<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\"/><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"/></svg>`;\n\ntype TSigningOption = 'none' | 'delegator' | 'name_locked';\n\nexport interface IContactSearchEvent {\n query: string;\n}\n\nexport interface IContactSelectEvent {\n first_name: string;\n last_name: string;\n email: string;\n phone: string;\n message: string;\n delegator: boolean;\n name_locked: boolean;\n auth_methods: TRecipientAuthMethod[];\n passcode: string;\n address: string;\n zip: string;\n}\n\nexport type TPickerContact = Partial<IProfile>;\n\n/**\n * Display a contact picker suitable for filling out Recipient objects when sending Envelopes.\n *\n * This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the\n * user interacts with the component, the text entered in the name fields is sent back to the parent via the `searchContacts` event.\n * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be\n * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as \"Recently Used\" contacts, or\n * to always display the user's own contact record.\n *\n * ```ts\n * <verdocs-contact-picker\n * templateRole={role}\n * contactSuggestions={[]}\n * onNext={e => console.log('Contact completed', e.detail)}\n * />\n * ```\n */\n@Component({\n tag: 'verdocs-contact-picker',\n styleUrl: 'verdocs-contact-picker.scss',\n shadow: false,\n})\nexport class VerdocsContactPicker {\n @Element() el: HTMLElement;\n\n private namesRowEl: HTMLElement;\n private suggestionsEl: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The role that this contact will be assigned to.\n */\n @Prop() templateRole: Partial<IRecipient> | null = null;\n\n /**\n * If set, suggestions will be displayed in a drop-down list to the user. It is recommended that the number\n * of suggestions be limited to the 5 best matching records.\n */\n @Prop() contactSuggestions: TPickerContact[] = [];\n\n /**\n * Whether to show a Cancel button beside Done.\n */\n @Prop() showCancel = true;\n\n /**\n * Event fired when the user enters text in the search field. The calling application may use this to update\n * the `contactSuggestions` property.\n */\n @Event({composed: true}) searchContacts: EventEmitter<IContactSearchEvent>;\n\n /**\n * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n */\n @Event({composed: true}) exit: EventEmitter;\n\n /**\n * Event fired when the user changes the type.\n */\n @Event({composed: true}) next: EventEmitter<IContactSelectEvent>;\n\n @State() first_name: string;\n @State() last_name: string;\n @State() email: string;\n @State() phone: string;\n @State() zip: string;\n @State() address: string;\n @State() message: string;\n @State() showSuggestions: boolean = false;\n @State() showMessage: boolean = false;\n @State() delegator: boolean = false;\n @State() name_locked: boolean = false;\n @State() auth_methods: TRecipientAuthMethod[] = [];\n @State() passcode: string = '';\n\n @State() firstNameFieldId = `verdocs-contact-picker-firstname-${Math.random().toString(36).substring(2, 11)}`;\n @State() lastNameFieldId = `verdocs-contact-picker-lastname-${Math.random().toString(36).substring(2, 11)}`;\n @State() emailFieldId = `verdocs-contact-picker-email-${Math.random().toString(36).substring(2, 11)}`;\n @State() phoneFieldId = `verdocs-contact-picker-phone-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() activeEntitlements: Partial<Record<TEntitlement, IEntitlement>> = {};\n @State() authMethodsLoading: boolean = true;\n\n async componentWillLoad() {\n this.endpoint.loadSession();\n\n if (this.templateRole) {\n const fullName = formatFullName(this.templateRole);\n const nameComponents = fullName.split(' ');\n const firstName = this.templateRole.first_name || nameComponents.shift() || '';\n const lastName = this.templateRole.last_name || nameComponents.join(' ') || '';\n this.first_name = firstName;\n this.last_name = lastName;\n\n this.email = this.templateRole.email || '';\n this.phone = this.templateRole.phone || '';\n // delegator and name_locked are mutually exclusive; delegator takes precedence if both are somehow set\n this.delegator = this.templateRole.delegator || false;\n this.name_locked = this.delegator ? false : this.templateRole.name_locked || false;\n this.message = this.templateRole.message || '';\n this.showMessage = this.message !== '';\n this.auth_methods = this.templateRole.auth_methods || [];\n this.passcode = this.templateRole.passcode || '';\n }\n\n // Entitlements only gate optional methods like KBA. We need error handling here in case the getActiveEntitlements\n // call fails or we stay loading forever.\n this.activeEntitlements = await getActiveEntitlements(this.endpoint).catch(e => {\n console.warn('[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only', e);\n return {} as Partial<Record<TEntitlement, IEntitlement>>;\n });\n\n this.authMethodsLoading = false;\n console.log('[CONTACT PICKER] Loaded entitlements', this.activeEntitlements);\n }\n\n // Make sure the suggestion list doesn't break the scroll region\n componentDidRender() {\n const body = this.el.querySelector('.form-body') as HTMLElement | null;\n updateScrollFade(body);\n if (this.suggestionsEl && this.namesRowEl && body) {\n this.suggestionsEl.style.top = `${this.namesRowEl.offsetTop + this.namesRowEl.offsetHeight - body.scrollTop + 4}px`;\n }\n }\n\n @Listen('click', {target: 'document'})\n handleDocumentClick(e: MouseEvent) {\n if (this.showSuggestions && !this.el.contains(e.target as Node)) {\n this.showSuggestions = false;\n }\n }\n\n handleFirstNameChange(e: any) {\n this.first_name = e.target.value;\n this.searchContacts?.emit({query: this.first_name});\n }\n\n handleLastNameChange(e: any) {\n this.last_name = e.target.value;\n this.searchContacts?.emit({query: this.last_name});\n }\n\n handleCancel(e: any) {\n e.stopPropagation();\n this.showSuggestions = false;\n this.exit?.emit();\n }\n\n handleSubmit(e: any) {\n e.stopPropagation();\n\n this.showSuggestions = false;\n this.next?.emit({\n first_name: this.first_name,\n last_name: this.last_name,\n email: this.email,\n phone: this.phone,\n message: this.message,\n delegator: this.delegator,\n name_locked: this.name_locked,\n auth_methods: this.auth_methods,\n passcode: this.passcode,\n address: this.address,\n zip: this.zip,\n });\n }\n\n handleSelectSuggestion(e: any, suggestion: TPickerContact) {\n e.stopPropagation();\n\n this.first_name = suggestion.first_name;\n this.last_name = suggestion.last_name;\n this.email = suggestion.email;\n this.phone = suggestion.phone;\n this.showSuggestions = false;\n }\n\n toggleAuthMethod(method: TRecipientAuthMethod) {\n if (this.auth_methods.includes(method)) {\n this.auth_methods = this.auth_methods.filter(selected => selected !== method);\n } else {\n this.auth_methods = [...this.auth_methods, method];\n }\n }\n\n // TODO: Decide whether we want to keep these mutually-exclusive\n setSigningOption(option: TSigningOption) {\n this.delegator = option === 'delegator';\n this.name_locked = option === 'name_locked';\n }\n\n renderPill(label: string, selected: boolean, onClick: () => void, opts: {locked?: boolean; title?: string} = {}) {\n return (\n <button\n type=\"button\"\n class={{pill: true, selected, locked: !!opts.locked}}\n aria-pressed={selected ? 'true' : 'false'}\n disabled={opts.locked && !selected}\n title={opts.title}\n onClick={onClick}\n >\n {opts.locked && <span class=\"pill-icon\" innerHTML={lockIcon} />}\n {label}\n </button>\n );\n }\n\n // The reason for the random names/IDs is to disable browser autocomplete. We set the autocomplete tags but many browsers ignore them\n // and show a duplicate autocomplete picker on top of our own.\n render() {\n const hasBasics = this.first_name && this.last_name && isValidEmail(this.email);\n\n // First name is the first focused field so it's our quicksearch matching target.\n const visibleSuggestions = (this.contactSuggestions || []).filter(\n suggestion => !this.first_name || suggestion.first_name?.toLowerCase().includes(this.first_name.toLowerCase()),\n );\n\n const hasAuthRequirements = this.auth_methods.every(method => {\n switch (method) {\n case 'passcode':\n return !!this.passcode;\n case 'kba':\n return !!this.first_name && !!this.last_name;\n case 'email':\n return !!this.email;\n case 'sms':\n return !!this.phone;\n default:\n return true;\n }\n });\n\n const canSubmit = hasBasics && hasAuthRequirements;\n const hasSMSAuth = !!this.activeEntitlements.sms_auth;\n\n // TODO: We show non-entitled options disabled so folks know what's possible. We could alternatively hide them.\n const verificationOptions: {label: string; value: TRecipientAuthMethod; locked?: boolean}[] = [\n {label: 'Email OTP', value: 'email'},\n {label: 'Passcode', value: 'passcode'},\n {label: 'SMS OTP', value: 'sms', locked: !hasSMSAuth},\n {label: 'KBA', value: 'kba', locked: !this.activeEntitlements.kba_auth},\n {label: 'ID check', value: 'id', locked: !this.activeEntitlements.id_auth},\n ];\n\n const signingOption: TSigningOption = this.delegator ? 'delegator' : this.name_locked ? 'name_locked' : 'none';\n\n return (\n <form onSubmit={e => e.preventDefault()} autocomplete=\"off\">\n <div class=\"form-body-wrap\">\n <div\n class=\"form-body\"\n onScroll={(e: any) => {\n updateScrollFade(e.target);\n this.showSuggestions = false;\n }}\n >\n <div class=\"row names\" ref={el => (this.namesRowEl = el)}>\n <div class=\"field\">\n <label htmlFor={this.firstNameFieldId}>First name</label>\n <input\n id={this.firstNameFieldId}\n name={this.firstNameFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.first_name}\n onFocus={() => {\n // Give the blur event a chance to hide it first if going between first/last\n setTimeout(() => {\n this.showSuggestions = this.contactSuggestions?.length > 0;\n }, 100);\n }}\n onInput={e => this.handleFirstNameChange(e)}\n />\n </div>\n <div class=\"field\">\n <label htmlFor={this.lastNameFieldId}>Last name</label>\n <input\n id={this.lastNameFieldId}\n name={this.lastNameFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.last_name}\n onFocus={() => {\n // Give the blur event a chance to hide it first if going between first/last\n setTimeout(() => {\n this.showSuggestions = this.contactSuggestions?.length > 0;\n }, 100);\n }}\n onInput={e => this.handleLastNameChange(e)}\n />\n </div>\n </div>\n\n <div class=\"field\">\n <label htmlFor={this.emailFieldId}>Email</label>\n <input\n id={this.emailFieldId}\n name={this.emailFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autoComplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.email}\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.email = e.target.value)}\n />\n </div>\n\n {hasSMSAuth && (\n <div class=\"field\">\n <label htmlFor={this.phoneFieldId}>\n Phone <span class=\"optional\">(optional)</span>\n </label>\n <input\n id={this.phoneFieldId}\n name={this.phoneFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autoComplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.phone}\n placeholder=\"+1 (555) 000-0000\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => {\n this.phone = convertToE164(e.target.value);\n }}\n />\n </div>\n )}\n\n <div class=\"group\">\n <div class=\"group-label\">Verification</div>\n {this.authMethodsLoading ? (\n <verdocs-spinner size={10} mode=\"dark\" />\n ) : (\n <div class=\"pills\">\n {verificationOptions.map(option =>\n this.renderPill(option.label, this.auth_methods.includes(option.value), () => this.toggleAuthMethod(option.value), {\n locked: option.locked,\n title: option.locked ? 'Please contact sales@verdocs.com to enable this feature.' : undefined,\n }),\n )}\n </div>\n )}\n\n {this.auth_methods.includes('passcode') && (\n <div class=\"passcode\">\n <input\n id=\"verdocs-passcode\"\n name=\"verdocs-passcode\"\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n aria-label=\"Passcode\"\n value={this.passcode}\n placeholder=\"4-8 digits\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.passcode = e.target.value)}\n />\n <span class=\"passcode-hint\">PIN or passcode shared separately with the recipient ahead of time</span>\n </div>\n )}\n </div>\n\n <div class=\"group\">\n <div class=\"group-label\">Signing options</div>\n <div class=\"pills\">\n {this.renderPill('None', signingOption === 'none', () => this.setSigningOption('none'))}\n {this.renderPill('May delegate', signingOption === 'delegator', () => this.setSigningOption('delegator'))}\n {this.renderPill('Name locked', signingOption === 'name_locked', () => this.setSigningOption('name_locked'))}\n </div>\n </div>\n\n <div class=\"field\">\n <label htmlFor=\"verdocs-contact-picker-message\">\n Message <span class=\"optional\">(optional)</span>\n </label>\n <textarea\n id=\"verdocs-contact-picker-message\"\n name=\"verdocs-contact-picker-message\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n placeholder=\"Add a message to the invitation\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.message = e.target.value)}\n >\n {this.message}\n </textarea>\n </div>\n </div>\n <div class=\"scroll-fade\" />\n {this.showSuggestions && visibleSuggestions.length > 0 && (\n <div class=\"suggestions\" role=\"listbox\" ref={el => (this.suggestionsEl = el)}>\n {visibleSuggestions.map(suggestion => (\n <div key={suggestion.id ?? suggestion.email} class=\"suggestion\" onClick={e => this.handleSelectSuggestion(e, suggestion)}>\n {suggestion.picture ? <img alt=\"Avatar\" class=\"avatar\" src={suggestion.picture} /> : <div class=\"avatar\" innerHTML={addrBookIcon} />}\n <div class=\"details\">\n <div class=\"name\">{formatFullName(suggestion)}</div>\n {suggestion.email && <div class=\"destination\">{suggestion.email}</div>}\n {suggestion.phone && <div class=\"destination\">{suggestion.phone}</div>}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n\n <div class=\"buttons\">\n {this.showCancel && <verdocs-button label=\"Cancel\" variant=\"text\" size=\"small\" onClick={e => this.handleCancel(e)} />}\n <verdocs-button label=\"Done\" size=\"small\" disabled={!canSubmit} onClick={!canSubmit ? () => {} : e => this.handleSubmit(e)} />\n </div>\n </form>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{r as e,c as t,h as i,g as o}from"./p-CjTHbolG.js";import{VerdocsEndpoint as s,formatFullName as c,getActiveEntitlements as a,isValidEmail as r}from"@verdocs/js-sdk";import{u as l}from"./p-7UEjZarN.js";import{c as n}from"./p-CGsVCy75.js";import"./p-BglCURB-.js";import"./p-CIxfEdV7.js";const p=()=>`verdocs-contact-picker{--picker-ink:var(--verdocs-body-color, #111827);--picker-ink-2:#374151;--picker-muted:#6b7280;--picker-faint:#9ca3af;--picker-control-border:#d1d5db;--picker-accent:var(--verdocs-link-color, #4c56cb);--picker-accent-tint:#f4f5fc;--picker-accent-tint-2:#e6e7f8;display:block;font-size:14px;color:var(--picker-ink);font-family:var(--verdocs-primary-font, "Inter", "Barlow", sans-serif)}verdocs-contact-picker *{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-contact-picker form{-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body-wrap{position:relative;-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body{position:relative;-ms-flex:1;flex:1;min-height:0;overflow-y:auto}verdocs-contact-picker .scroll-fade{position:absolute;left:0;right:0;bottom:0;height:36px;opacity:0;pointer-events:none;-webkit-transition:opacity 150ms ease-out;transition:opacity 150ms ease-out;background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#ffffff));background:linear-gradient(rgba(255, 255, 255, 0), #ffffff)}verdocs-contact-picker .scrollable:not(.at-end)>.scroll-fade{opacity:1}verdocs-contact-picker .row.names{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;position:relative}verdocs-contact-picker .row.names .field{-ms-flex:1;flex:1;min-width:0}verdocs-contact-picker .field{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;row-gap:4px;margin:0 0 10px 0}verdocs-contact-picker .field label{font-size:12px;font-weight:500;color:var(--picker-ink-2)}verdocs-contact-picker .field label .optional{color:var(--picker-muted);font-weight:400}verdocs-contact-picker input,verdocs-contact-picker textarea{width:100%;font-size:13px;font-family:inherit;color:var(--picker-ink);background:#ffffff;border:1px solid var(--picker-control-border);border-radius:6px;outline:none}verdocs-contact-picker input:focus,verdocs-contact-picker textarea:focus{border-color:var(--picker-accent);-webkit-box-shadow:0 0 0 2px var(--picker-accent-tint-2);box-shadow:0 0 0 2px var(--picker-accent-tint-2)}verdocs-contact-picker input::-webkit-input-placeholder,verdocs-contact-picker textarea::-webkit-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-moz-placeholder,verdocs-contact-picker textarea::-moz-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input:-ms-input-placeholder,verdocs-contact-picker textarea:-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-ms-input-placeholder,verdocs-contact-picker textarea::-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::placeholder,verdocs-contact-picker textarea::placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input{height:34px;padding:0 10px}verdocs-contact-picker textarea{height:56px;padding:8px 10px;resize:vertical}verdocs-contact-picker .group{margin:2px 0 12px 0}verdocs-contact-picker .group .group-label{font-size:12px;font-weight:500;color:var(--picker-ink-2);margin:0 0 6px 0}verdocs-contact-picker .pills{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:6px}verdocs-contact-picker .pill{all:unset;height:26px;padding:0 9px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:4px;-moz-column-gap:4px;column-gap:4px;cursor:pointer;font-size:12px;font-weight:500;font-family:inherit;white-space:nowrap;border-radius:999px;color:var(--picker-ink-2);border:1px solid var(--picker-control-border)}verdocs-contact-picker .pill:focus-visible{outline:2px solid var(--picker-accent);outline-offset:2px}verdocs-contact-picker .pill.selected{color:var(--picker-accent);border-color:var(--picker-accent);background:var(--picker-accent-tint)}verdocs-contact-picker .pill.locked{opacity:0.5;cursor:not-allowed}verdocs-contact-picker .pill .pill-icon,verdocs-contact-picker .pill .pill-icon svg{width:12px;height:12px;display:block}verdocs-contact-picker .passcode{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:8px}verdocs-contact-picker .passcode input{-ms-flex:0 0 120px;flex:0 0 120px;width:120px;height:30px}verdocs-contact-picker .passcode .passcode-hint{-ms-flex:1;flex:1;min-width:0;font-size:11px;line-height:1.35;color:var(--picker-muted);-ms-flex-item-align:center;align-self:center}verdocs-contact-picker .buttons{margin-top:10px;padding-top:12px;border-top:1px solid #e5e7eb;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px}verdocs-contact-picker .buttons verdocs-button:last-child{-ms-flex:1;flex:1}verdocs-contact-picker .buttons verdocs-button:last-child button{width:100%}verdocs-contact-picker .suggestions{position:absolute;top:0;left:0;right:0;z-index:20;max-height:225px;overflow-y:auto;background:#ffffff;border-radius:6px;border:1px solid #e5e7eb;-webkit-box-shadow:0 8px 24px rgba(17, 24, 39, 0.14);box-shadow:0 8px 24px rgba(17, 24, 39, 0.14)}verdocs-contact-picker .suggestions .suggestion{display:-ms-flexbox;display:flex;padding:6px 12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;cursor:pointer}verdocs-contact-picker .suggestions .suggestion svg{width:28px;height:28px}verdocs-contact-picker .suggestions .suggestion .avatar{width:28px;height:28px;-ms-flex:0 0 28px;flex:0 0 28px;margin-right:8px;border-radius:100%}verdocs-contact-picker .suggestions .suggestion .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0}verdocs-contact-picker .suggestions .suggestion .name{font-size:13px;font-weight:500;color:var(--picker-ink)}verdocs-contact-picker .suggestions .suggestion .destination{font-size:12px;color:var(--picker-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-contact-picker .suggestions .suggestion:hover{background:var(--picker-accent-tint)}verdocs-contact-picker [data-lastpass-icon-root]{display:none !important}`;const d=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-user"><path d="M15 13a3 3 0 1 0-6 0"/><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"/><circle cx="12" cy="8" r="2"/></svg>`;const h=`<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>`;const u=class{constructor(i){e(this,i);this.searchContacts=t(this,"searchContacts");this.exit=t(this,"exit");this.next=t(this,"next");this.endpoint=s.getDefault();this.templateRole=null;this.contactSuggestions=[];this.showCancel=true;this.showSuggestions=false;this.showMessage=false;this.delegator=false;this.name_locked=false;this.auth_methods=[];this.passcode="";this.firstNameFieldId=`verdocs-contact-picker-firstname-${Math.random().toString(36).substring(2,11)}`;this.lastNameFieldId=`verdocs-contact-picker-lastname-${Math.random().toString(36).substring(2,11)}`;this.emailFieldId=`verdocs-contact-picker-email-${Math.random().toString(36).substring(2,11)}`;this.phoneFieldId=`verdocs-contact-picker-phone-${Math.random().toString(36).substring(2,11)}`;this.activeEntitlements={};this.authMethodsLoading=true}async componentWillLoad(){this.endpoint.loadSession();if(this.templateRole){const e=c(this.templateRole);const t=e.split(" ");const i=this.templateRole.first_name||t.shift()||"";const o=this.templateRole.last_name||t.join(" ")||"";this.first_name=i;this.last_name=o;this.email=this.templateRole.email||"";this.phone=this.templateRole.phone||"";this.delegator=this.templateRole.delegator||false;this.name_locked=this.delegator?false:this.templateRole.name_locked||false;this.message=this.templateRole.message||"";this.showMessage=this.message!=="";this.auth_methods=this.templateRole.auth_methods||[];this.passcode=this.templateRole.passcode||""}this.activeEntitlements=await a(this.endpoint).catch((e=>{console.warn("[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only",e);return{}}));this.authMethodsLoading=false;console.log("[CONTACT PICKER] Loaded entitlements",this.activeEntitlements)}componentDidRender(){const e=this.el.querySelector(".form-body");l(e);if(this.suggestionsEl&&this.namesRowEl&&e){this.suggestionsEl.style.top=`${this.namesRowEl.offsetTop+this.namesRowEl.offsetHeight-e.scrollTop+4}px`}}handleDocumentClick(e){if(this.showSuggestions&&!this.el.contains(e.target)){this.showSuggestions=false}}handleFirstNameChange(e){var t;this.first_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.first_name})}handleLastNameChange(e){var t;this.last_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.last_name})}handleCancel(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.exit)===null||t===void 0?void 0:t.emit()}handleSubmit(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.next)===null||t===void 0?void 0:t.emit({first_name:this.first_name,last_name:this.last_name,email:this.email,phone:this.phone,message:this.message,delegator:this.delegator,name_locked:this.name_locked,auth_methods:this.auth_methods,passcode:this.passcode,address:this.address,zip:this.zip})}handleSelectSuggestion(e,t){e.stopPropagation();this.first_name=t.first_name;this.last_name=t.last_name;this.email=t.email;this.phone=t.phone;this.showSuggestions=false}toggleAuthMethod(e){if(this.auth_methods.includes(e)){this.auth_methods=this.auth_methods.filter((t=>t!==e))}else{this.auth_methods=[...this.auth_methods,e]}}setSigningOption(e){this.delegator=e==="delegator";this.name_locked=e==="name_locked"}renderPill(e,t,o,s={}){return i("button",{type:"button",class:{pill:true,selected:t,locked:!!s.locked},"aria-pressed":t?"true":"false",disabled:s.locked&&!t,title:s.title,onClick:o},s.locked&&i("span",{class:"pill-icon",innerHTML:h}),e)}render(){const e=this.first_name&&this.last_name&&r(this.email);const t=this.auth_methods.every((e=>{switch(e){case"passcode":return!!this.passcode;case"kba":return!!this.first_name&&!!this.last_name;case"email":return!!this.email;case"sms":return!!this.phone;default:return true}}));const o=e&&t;const s=!!this.activeEntitlements.sms_auth;const a=[{label:"Email OTP",value:"email"},{label:"Passcode",value:"passcode"},{label:"SMS OTP",value:"sms",locked:!s},{label:"KBA",value:"kba",locked:!this.activeEntitlements.kba_auth},{label:"ID check",value:"id",locked:!this.activeEntitlements.id_auth}];const p=this.delegator?"delegator":this.name_locked?"name_locked":"none";return i("form",{onSubmit:e=>e.preventDefault(),autocomplete:"off"},i("div",{class:"form-body-wrap"},i("div",{class:"form-body",onScroll:e=>{l(e.target);this.showSuggestions=false}},i("div",{class:"row names",ref:e=>this.namesRowEl=e},i("div",{class:"field"},i("label",{htmlFor:this.firstNameFieldId},"First name"),i("input",{id:this.firstNameFieldId,name:this.firstNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.first_name,onFocus:()=>{setTimeout((()=>{var e;this.showSuggestions=((e=this.contactSuggestions)===null||e===void 0?void 0:e.length)>0}),100)},onInput:e=>this.handleFirstNameChange(e)})),i("div",{class:"field"},i("label",{htmlFor:this.lastNameFieldId},"Last name"),i("input",{id:this.lastNameFieldId,name:this.lastNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.last_name,onFocus:()=>{setTimeout((()=>{var e;this.showSuggestions=((e=this.contactSuggestions)===null||e===void 0?void 0:e.length)>0}),100)},onInput:e=>this.handleLastNameChange(e)}))),i("div",{class:"field"},i("label",{htmlFor:this.emailFieldId},"Email"),i("input",{id:this.emailFieldId,name:this.emailFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.email,onFocus:()=>this.showSuggestions=false,onInput:e=>this.email=e.target.value})),s&&i("div",{class:"field"},i("label",{htmlFor:this.phoneFieldId},"Phone ",i("span",{class:"optional"},"(optional)")),i("input",{id:this.phoneFieldId,name:this.phoneFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.phone,placeholder:"+1 (555) 000-0000",onFocus:()=>this.showSuggestions=false,onInput:e=>{this.phone=n(e.target.value)}})),i("div",{class:"group"},i("div",{class:"group-label"},"Verification"),this.authMethodsLoading?i("verdocs-spinner",{size:10,mode:"dark"}):i("div",{class:"pills"},a.map((e=>this.renderPill(e.label,this.auth_methods.includes(e.value),(()=>this.toggleAuthMethod(e.value)),{locked:e.locked,title:e.locked?"Please contact sales@verdocs.com to enable this feature.":undefined})))),this.auth_methods.includes("passcode")&&i("div",{class:"passcode"},i("input",{id:"verdocs-passcode",name:"verdocs-passcode",type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none","aria-label":"Passcode",value:this.passcode,placeholder:"4-8 digits",onFocus:()=>this.showSuggestions=false,onInput:e=>this.passcode=e.target.value}),i("span",{class:"passcode-hint"},"PIN or passcode shared separately with the recipient ahead of time"))),i("div",{class:"group"},i("div",{class:"group-label"},"Signing options"),i("div",{class:"pills"},this.renderPill("None",p==="none",(()=>this.setSigningOption("none"))),this.renderPill("May delegate",p==="delegator",(()=>this.setSigningOption("delegator"))),this.renderPill("Name locked",p==="name_locked",(()=>this.setSigningOption("name_locked"))))),i("div",{class:"field"},i("label",{htmlFor:"verdocs-contact-picker-message"},"Message ",i("span",{class:"optional"},"(optional)")),i("textarea",{id:"verdocs-contact-picker-message",name:"verdocs-contact-picker-message","data-lpignore":"true",autocomplete:"blocked",placeholder:"Add a message to the invitation",onFocus:()=>this.showSuggestions=false,onInput:e=>this.message=e.target.value},this.message))),i("div",{class:"scroll-fade"}),this.showSuggestions&&i("div",{class:"suggestions",role:"listbox",ref:e=>this.suggestionsEl=e},this.contactSuggestions.filter((e=>{var t;return!this.first_name||((t=e.first_name)===null||t===void 0?void 0:t.toLowerCase().includes(this.first_name.toLowerCase()))})).map((e=>{var t;return i("div",{key:(t=e.id)!==null&&t!==void 0?t:e.email,class:"suggestion",onClick:t=>this.handleSelectSuggestion(t,e)},e.picture?i("img",{alt:"Avatar",class:"avatar",src:e.picture}):i("div",{class:"avatar",innerHTML:d}),i("div",{class:"details"},i("div",{class:"name"},c(e)),e.email&&i("div",{class:"destination"},e.email),e.phone&&i("div",{class:"destination"},e.phone)))})))),i("div",{class:"buttons"},this.showCancel&&i("verdocs-button",{label:"Cancel",variant:"text",size:"small",onClick:e=>this.handleCancel(e)}),i("verdocs-button",{label:"Done",size:"small",disabled:!o,onClick:!o?()=>{}:e=>this.handleSubmit(e)})))}get el(){return o(this)}};u.style=p();export{u as verdocs_contact_picker};
2
- //# sourceMappingURL=p-301f0247.entry.js.map
1
+ import{r as e,c as t,h as i,g as o}from"./p-CjTHbolG.js";import{VerdocsEndpoint as s,formatFullName as c,getActiveEntitlements as a,isValidEmail as r}from"@verdocs/js-sdk";import{u as l}from"./p-7UEjZarN.js";import{c as n}from"./p-CGsVCy75.js";import"./p-BglCURB-.js";import"./p-CIxfEdV7.js";const p=()=>`verdocs-contact-picker{--picker-ink:var(--verdocs-body-color, #111827);--picker-ink-2:#374151;--picker-muted:#6b7280;--picker-faint:#9ca3af;--picker-control-border:#d1d5db;--picker-accent:var(--verdocs-link-color, #4c56cb);--picker-accent-tint:#f4f5fc;--picker-accent-tint-2:#e6e7f8;display:block;font-size:14px;color:var(--picker-ink);font-family:var(--verdocs-primary-font, "Inter", "Barlow", sans-serif)}verdocs-contact-picker *{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-contact-picker form{-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body-wrap{position:relative;-ms-flex:1;flex:1;min-height:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker .form-body{position:relative;-ms-flex:1;flex:1;min-height:0;overflow-y:auto}verdocs-contact-picker .scroll-fade{position:absolute;left:0;right:0;bottom:0;height:36px;opacity:0;pointer-events:none;-webkit-transition:opacity 150ms ease-out;transition:opacity 150ms ease-out;background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#ffffff));background:linear-gradient(rgba(255, 255, 255, 0), #ffffff)}verdocs-contact-picker .scrollable:not(.at-end)>.scroll-fade{opacity:1}verdocs-contact-picker .row.names{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;position:relative}verdocs-contact-picker .row.names .field{-ms-flex:1;flex:1;min-width:0}verdocs-contact-picker .field{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;row-gap:4px;margin:0 0 10px 0}verdocs-contact-picker .field label{font-size:12px;font-weight:500;color:var(--picker-ink-2)}verdocs-contact-picker .field label .optional{color:var(--picker-muted);font-weight:400}verdocs-contact-picker input,verdocs-contact-picker textarea{width:100%;font-size:13px;font-family:inherit;color:var(--picker-ink);background:#ffffff;border:1px solid var(--picker-control-border);border-radius:6px;outline:none}verdocs-contact-picker input:focus,verdocs-contact-picker textarea:focus{border-color:var(--picker-accent);-webkit-box-shadow:0 0 0 2px var(--picker-accent-tint-2);box-shadow:0 0 0 2px var(--picker-accent-tint-2)}verdocs-contact-picker input::-webkit-input-placeholder,verdocs-contact-picker textarea::-webkit-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-moz-placeholder,verdocs-contact-picker textarea::-moz-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input:-ms-input-placeholder,verdocs-contact-picker textarea:-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::-ms-input-placeholder,verdocs-contact-picker textarea::-ms-input-placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input::placeholder,verdocs-contact-picker textarea::placeholder{color:var(--picker-faint);opacity:1}verdocs-contact-picker input{height:34px;padding:0 10px}verdocs-contact-picker textarea{height:56px;padding:8px 10px;resize:vertical}verdocs-contact-picker .group{margin:2px 0 12px 0}verdocs-contact-picker .group .group-label{font-size:12px;font-weight:500;color:var(--picker-ink-2);margin:0 0 6px 0}verdocs-contact-picker .pills{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:6px}verdocs-contact-picker .pill{all:unset;height:26px;padding:0 9px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:4px;-moz-column-gap:4px;column-gap:4px;cursor:pointer;font-size:12px;font-weight:500;font-family:inherit;white-space:nowrap;border-radius:999px;color:var(--picker-ink-2);border:1px solid var(--picker-control-border)}verdocs-contact-picker .pill:focus-visible{outline:2px solid var(--picker-accent);outline-offset:2px}verdocs-contact-picker .pill.selected{color:var(--picker-accent);border-color:var(--picker-accent);background:var(--picker-accent-tint)}verdocs-contact-picker .pill.locked{opacity:0.5;cursor:not-allowed}verdocs-contact-picker .pill .pill-icon,verdocs-contact-picker .pill .pill-icon svg{width:12px;height:12px;display:block}verdocs-contact-picker .passcode{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:8px}verdocs-contact-picker .passcode input{-ms-flex:0 0 120px;flex:0 0 120px;width:120px;height:30px}verdocs-contact-picker .passcode .passcode-hint{-ms-flex:1;flex:1;min-width:0;font-size:11px;line-height:1.35;color:var(--picker-muted);-ms-flex-item-align:center;align-self:center}verdocs-contact-picker .buttons{margin-top:10px;padding-top:12px;border-top:1px solid #e5e7eb;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px}verdocs-contact-picker .buttons verdocs-button:last-child{-ms-flex:1;flex:1}verdocs-contact-picker .buttons verdocs-button:last-child button{width:100%}verdocs-contact-picker .suggestions{position:absolute;top:0;left:0;right:0;z-index:20;max-height:225px;overflow-y:auto;background:#ffffff;border-radius:6px;border:1px solid #e5e7eb;-webkit-box-shadow:0 8px 24px rgba(17, 24, 39, 0.14);box-shadow:0 8px 24px rgba(17, 24, 39, 0.14)}verdocs-contact-picker .suggestions .suggestion{display:-ms-flexbox;display:flex;padding:6px 12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;cursor:pointer}verdocs-contact-picker .suggestions .suggestion svg{width:28px;height:28px}verdocs-contact-picker .suggestions .suggestion .avatar{width:28px;height:28px;-ms-flex:0 0 28px;flex:0 0 28px;margin-right:8px;border-radius:100%}verdocs-contact-picker .suggestions .suggestion .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0}verdocs-contact-picker .suggestions .suggestion .name{font-size:13px;font-weight:500;color:var(--picker-ink)}verdocs-contact-picker .suggestions .suggestion .destination{font-size:12px;color:var(--picker-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}verdocs-contact-picker .suggestions .suggestion:hover{background:var(--picker-accent-tint)}verdocs-contact-picker [data-lastpass-icon-root]{display:none !important}`;const d=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-user"><path d="M15 13a3 3 0 1 0-6 0"/><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"/><circle cx="12" cy="8" r="2"/></svg>`;const h=`<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>`;const u=class{constructor(i){e(this,i);this.searchContacts=t(this,"searchContacts");this.exit=t(this,"exit");this.next=t(this,"next");this.endpoint=s.getDefault();this.templateRole=null;this.contactSuggestions=[];this.showCancel=true;this.showSuggestions=false;this.showMessage=false;this.delegator=false;this.name_locked=false;this.auth_methods=[];this.passcode="";this.firstNameFieldId=`verdocs-contact-picker-firstname-${Math.random().toString(36).substring(2,11)}`;this.lastNameFieldId=`verdocs-contact-picker-lastname-${Math.random().toString(36).substring(2,11)}`;this.emailFieldId=`verdocs-contact-picker-email-${Math.random().toString(36).substring(2,11)}`;this.phoneFieldId=`verdocs-contact-picker-phone-${Math.random().toString(36).substring(2,11)}`;this.activeEntitlements={};this.authMethodsLoading=true}async componentWillLoad(){this.endpoint.loadSession();if(this.templateRole){const e=c(this.templateRole);const t=e.split(" ");const i=this.templateRole.first_name||t.shift()||"";const o=this.templateRole.last_name||t.join(" ")||"";this.first_name=i;this.last_name=o;this.email=this.templateRole.email||"";this.phone=this.templateRole.phone||"";this.delegator=this.templateRole.delegator||false;this.name_locked=this.delegator?false:this.templateRole.name_locked||false;this.message=this.templateRole.message||"";this.showMessage=this.message!=="";this.auth_methods=this.templateRole.auth_methods||[];this.passcode=this.templateRole.passcode||""}this.activeEntitlements=await a(this.endpoint).catch((e=>{console.warn("[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only",e);return{}}));this.authMethodsLoading=false;console.log("[CONTACT PICKER] Loaded entitlements",this.activeEntitlements)}componentDidRender(){const e=this.el.querySelector(".form-body");l(e);if(this.suggestionsEl&&this.namesRowEl&&e){this.suggestionsEl.style.top=`${this.namesRowEl.offsetTop+this.namesRowEl.offsetHeight-e.scrollTop+4}px`}}handleDocumentClick(e){if(this.showSuggestions&&!this.el.contains(e.target)){this.showSuggestions=false}}handleFirstNameChange(e){var t;this.first_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.first_name})}handleLastNameChange(e){var t;this.last_name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.last_name})}handleCancel(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.exit)===null||t===void 0?void 0:t.emit()}handleSubmit(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.next)===null||t===void 0?void 0:t.emit({first_name:this.first_name,last_name:this.last_name,email:this.email,phone:this.phone,message:this.message,delegator:this.delegator,name_locked:this.name_locked,auth_methods:this.auth_methods,passcode:this.passcode,address:this.address,zip:this.zip})}handleSelectSuggestion(e,t){e.stopPropagation();this.first_name=t.first_name;this.last_name=t.last_name;this.email=t.email;this.phone=t.phone;this.showSuggestions=false}toggleAuthMethod(e){if(this.auth_methods.includes(e)){this.auth_methods=this.auth_methods.filter((t=>t!==e))}else{this.auth_methods=[...this.auth_methods,e]}}setSigningOption(e){this.delegator=e==="delegator";this.name_locked=e==="name_locked"}renderPill(e,t,o,s={}){return i("button",{type:"button",class:{pill:true,selected:t,locked:!!s.locked},"aria-pressed":t?"true":"false",disabled:s.locked&&!t,title:s.title,onClick:o},s.locked&&i("span",{class:"pill-icon",innerHTML:h}),e)}render(){const e=this.first_name&&this.last_name&&r(this.email);const t=(this.contactSuggestions||[]).filter((e=>{var t;return!this.first_name||((t=e.first_name)===null||t===void 0?void 0:t.toLowerCase().includes(this.first_name.toLowerCase()))}));const o=this.auth_methods.every((e=>{switch(e){case"passcode":return!!this.passcode;case"kba":return!!this.first_name&&!!this.last_name;case"email":return!!this.email;case"sms":return!!this.phone;default:return true}}));const s=e&&o;const a=!!this.activeEntitlements.sms_auth;const p=[{label:"Email OTP",value:"email"},{label:"Passcode",value:"passcode"},{label:"SMS OTP",value:"sms",locked:!a},{label:"KBA",value:"kba",locked:!this.activeEntitlements.kba_auth},{label:"ID check",value:"id",locked:!this.activeEntitlements.id_auth}];const h=this.delegator?"delegator":this.name_locked?"name_locked":"none";return i("form",{onSubmit:e=>e.preventDefault(),autocomplete:"off"},i("div",{class:"form-body-wrap"},i("div",{class:"form-body",onScroll:e=>{l(e.target);this.showSuggestions=false}},i("div",{class:"row names",ref:e=>this.namesRowEl=e},i("div",{class:"field"},i("label",{htmlFor:this.firstNameFieldId},"First name"),i("input",{id:this.firstNameFieldId,name:this.firstNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.first_name,onFocus:()=>{setTimeout((()=>{var e;this.showSuggestions=((e=this.contactSuggestions)===null||e===void 0?void 0:e.length)>0}),100)},onInput:e=>this.handleFirstNameChange(e)})),i("div",{class:"field"},i("label",{htmlFor:this.lastNameFieldId},"Last name"),i("input",{id:this.lastNameFieldId,name:this.lastNameFieldId,type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none",value:this.last_name,onFocus:()=>{setTimeout((()=>{var e;this.showSuggestions=((e=this.contactSuggestions)===null||e===void 0?void 0:e.length)>0}),100)},onInput:e=>this.handleLastNameChange(e)}))),i("div",{class:"field"},i("label",{htmlFor:this.emailFieldId},"Email"),i("input",{id:this.emailFieldId,name:this.emailFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.email,onFocus:()=>this.showSuggestions=false,onInput:e=>this.email=e.target.value})),a&&i("div",{class:"field"},i("label",{htmlFor:this.phoneFieldId},"Phone ",i("span",{class:"optional"},"(optional)")),i("input",{id:this.phoneFieldId,name:this.phoneFieldId,type:"text","data-lpignore":"true",autoComplete:"blocked","aria-autocomplete":"none",value:this.phone,placeholder:"+1 (555) 000-0000",onFocus:()=>this.showSuggestions=false,onInput:e=>{this.phone=n(e.target.value)}})),i("div",{class:"group"},i("div",{class:"group-label"},"Verification"),this.authMethodsLoading?i("verdocs-spinner",{size:10,mode:"dark"}):i("div",{class:"pills"},p.map((e=>this.renderPill(e.label,this.auth_methods.includes(e.value),(()=>this.toggleAuthMethod(e.value)),{locked:e.locked,title:e.locked?"Please contact sales@verdocs.com to enable this feature.":undefined})))),this.auth_methods.includes("passcode")&&i("div",{class:"passcode"},i("input",{id:"verdocs-passcode",name:"verdocs-passcode",type:"text","data-lpignore":"true",autocomplete:"blocked","aria-autocomplete":"none","aria-label":"Passcode",value:this.passcode,placeholder:"4-8 digits",onFocus:()=>this.showSuggestions=false,onInput:e=>this.passcode=e.target.value}),i("span",{class:"passcode-hint"},"PIN or passcode shared separately with the recipient ahead of time"))),i("div",{class:"group"},i("div",{class:"group-label"},"Signing options"),i("div",{class:"pills"},this.renderPill("None",h==="none",(()=>this.setSigningOption("none"))),this.renderPill("May delegate",h==="delegator",(()=>this.setSigningOption("delegator"))),this.renderPill("Name locked",h==="name_locked",(()=>this.setSigningOption("name_locked"))))),i("div",{class:"field"},i("label",{htmlFor:"verdocs-contact-picker-message"},"Message ",i("span",{class:"optional"},"(optional)")),i("textarea",{id:"verdocs-contact-picker-message",name:"verdocs-contact-picker-message","data-lpignore":"true",autocomplete:"blocked",placeholder:"Add a message to the invitation",onFocus:()=>this.showSuggestions=false,onInput:e=>this.message=e.target.value},this.message))),i("div",{class:"scroll-fade"}),this.showSuggestions&&t.length>0&&i("div",{class:"suggestions",role:"listbox",ref:e=>this.suggestionsEl=e},t.map((e=>{var t;return i("div",{key:(t=e.id)!==null&&t!==void 0?t:e.email,class:"suggestion",onClick:t=>this.handleSelectSuggestion(t,e)},e.picture?i("img",{alt:"Avatar",class:"avatar",src:e.picture}):i("div",{class:"avatar",innerHTML:d}),i("div",{class:"details"},i("div",{class:"name"},c(e)),e.email&&i("div",{class:"destination"},e.email),e.phone&&i("div",{class:"destination"},e.phone)))})))),i("div",{class:"buttons"},this.showCancel&&i("verdocs-button",{label:"Cancel",variant:"text",size:"small",onClick:e=>this.handleCancel(e)}),i("verdocs-button",{label:"Done",size:"small",disabled:!s,onClick:!s?()=>{}:e=>this.handleSubmit(e)})))}get el(){return o(this)}};u.style=p();export{u as verdocs_contact_picker};
2
+ //# sourceMappingURL=p-78a18a3b.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["verdocsContactPickerCss","addrBookIcon","lockIcon","VerdocsContactPicker","constructor","hostRef","this","endpoint","VerdocsEndpoint","getDefault","templateRole","contactSuggestions","showCancel","showSuggestions","showMessage","delegator","name_locked","auth_methods","passcode","firstNameFieldId","Math","random","toString","substring","lastNameFieldId","emailFieldId","phoneFieldId","activeEntitlements","authMethodsLoading","componentWillLoad","loadSession","fullName","formatFullName","nameComponents","split","firstName","first_name","shift","lastName","last_name","join","email","phone","message","getActiveEntitlements","catch","e","console","warn","log","componentDidRender","body","el","querySelector","updateScrollFade","suggestionsEl","namesRowEl","style","top","offsetTop","offsetHeight","scrollTop","handleDocumentClick","contains","target","handleFirstNameChange","value","_a","searchContacts","emit","query","handleLastNameChange","handleCancel","stopPropagation","exit","handleSubmit","next","address","zip","handleSelectSuggestion","suggestion","toggleAuthMethod","method","includes","filter","selected","setSigningOption","option","renderPill","label","onClick","opts","h","type","class","pill","locked","disabled","title","innerHTML","render","hasBasics","isValidEmail","visibleSuggestions","toLowerCase","hasAuthRequirements","every","canSubmit","hasSMSAuth","sms_auth","verificationOptions","kba_auth","id_auth","signingOption","onSubmit","preventDefault","autocomplete","onScroll","ref","htmlFor","id","name","onFocus","setTimeout","length","onInput","autoComplete","placeholder","convertToE164","size","mode","map","undefined","role","key","picture","alt","src","variant"],"sources":["src/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.scss?tag=verdocs-contact-picker","src/components/envelopes/verdocs-contact-picker/verdocs-contact-picker.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-contact-picker {\n --picker-ink: var(--verdocs-body-color, #111827);\n --picker-ink-2: #374151;\n --picker-muted: #6b7280;\n --picker-faint: #9ca3af;\n --picker-control-border: #d1d5db;\n --picker-accent: var(--verdocs-link-color, #{$secondary-color});\n --picker-accent-tint: #f4f5fc;\n --picker-accent-tint-2: #e6e7f8;\n\n display: block;\n font-size: 14px;\n color: var(--picker-ink);\n font-family: $verdocs-primary-font;\n\n * {\n box-sizing: border-box;\n }\n\n form {\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n // Fields scroll above a pinned Done button when the host constrains the picker's height; with\n // no constraint the body simply grows and the fade never shows.\n .form-body-wrap {\n position: relative;\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n\n .form-body {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n }\n\n .scroll-fade {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 36px;\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms ease-out;\n background: linear-gradient(rgba(255, 255, 255, 0), #ffffff);\n }\n\n .scrollable:not(.at-end) > .scroll-fade {\n opacity: 1;\n }\n\n .row.names {\n display: flex;\n column-gap: 8px;\n position: relative;\n\n .field {\n flex: 1;\n min-width: 0;\n }\n }\n\n .field {\n display: flex;\n flex-direction: column;\n row-gap: 4px;\n margin: 0 0 10px 0;\n\n label {\n font-size: 12px;\n font-weight: 500;\n color: var(--picker-ink-2);\n\n .optional {\n color: var(--picker-muted);\n font-weight: 400;\n }\n }\n }\n\n input,\n textarea {\n width: 100%;\n font-size: 13px;\n font-family: inherit;\n color: var(--picker-ink);\n background: #ffffff;\n border: 1px solid var(--picker-control-border);\n border-radius: 6px;\n outline: none;\n\n &:focus {\n border-color: var(--picker-accent);\n box-shadow: 0 0 0 2px var(--picker-accent-tint-2);\n }\n\n &::placeholder {\n color: var(--picker-faint);\n opacity: 1;\n }\n }\n\n input {\n height: 34px;\n padding: 0 10px;\n }\n\n textarea {\n height: 56px;\n padding: 8px 10px;\n resize: vertical;\n }\n\n .group {\n margin: 2px 0 12px 0;\n\n .group-label {\n font-size: 12px;\n font-weight: 500;\n color: var(--picker-ink-2);\n margin: 0 0 6px 0;\n }\n }\n\n .pills {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n }\n\n .pill {\n all: unset;\n height: 26px;\n padding: 0 9px;\n display: inline-flex;\n align-items: center;\n column-gap: 4px;\n cursor: pointer;\n font-size: 12px;\n font-weight: 500;\n font-family: inherit;\n white-space: nowrap;\n border-radius: 999px;\n color: var(--picker-ink-2);\n border: 1px solid var(--picker-control-border);\n\n &:focus-visible {\n outline: 2px solid var(--picker-accent);\n outline-offset: 2px;\n }\n\n &.selected {\n color: var(--picker-accent);\n border-color: var(--picker-accent);\n background: var(--picker-accent-tint);\n }\n\n &.locked {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .pill-icon,\n .pill-icon svg {\n width: 12px;\n height: 12px;\n display: block;\n }\n }\n\n .passcode {\n display: flex;\n align-items: center;\n column-gap: 8px;\n margin-top: 8px;\n\n input {\n flex: 0 0 120px;\n width: 120px;\n height: 30px;\n }\n\n .passcode-hint {\n flex: 1;\n min-width: 0;\n font-size: 11px;\n line-height: 1.35;\n color: var(--picker-muted);\n align-self: center;\n }\n }\n\n .buttons {\n margin-top: 10px;\n padding-top: 12px;\n border-top: 1px solid #e5e7eb;\n flex: none;\n display: flex;\n column-gap: 10px;\n\n verdocs-button:last-child {\n flex: 1;\n }\n\n verdocs-button:last-child button {\n width: 100%;\n }\n }\n\n .suggestions {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 20;\n max-height: 225px;\n overflow-y: auto;\n background: #ffffff;\n border-radius: 6px;\n border: 1px solid #e5e7eb;\n box-shadow: 0 8px 24px rgba(17, 24, 39, 0.14);\n\n .suggestion {\n display: flex;\n padding: 6px 12px;\n align-items: center;\n flex-direction: row;\n cursor: pointer;\n\n svg {\n width: 28px;\n height: 28px;\n }\n\n .avatar {\n width: 28px;\n height: 28px;\n flex: 0 0 28px;\n margin-right: 8px;\n border-radius: 100%;\n }\n\n .details {\n display: flex;\n flex-direction: column;\n min-width: 0;\n }\n\n .name {\n font-size: 13px;\n font-weight: 500;\n color: var(--picker-ink);\n }\n\n .destination {\n font-size: 12px;\n color: var(--picker-muted);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &:hover {\n background: var(--picker-accent-tint);\n }\n }\n }\n\n // @see https://community.logmein.com/t5/LastPass-Support-Discussions/placeholder-text-overrides-data-lpignore-quot-true-quot/td-p/295135\n // LastPass is ignoring the data-lpignore attribute in some cases\n [data-lastpass-icon-root] {\n display: none !important;\n }\n}\n","import {Component, Element, h, Event, EventEmitter, Listen, Prop, State} from '@stencil/core';\nimport {formatFullName, getActiveEntitlements, IEntitlement, IProfile, IRecipient, isValidEmail, TEntitlement, TRecipientAuthMethod, VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {updateScrollFade} from '../../../utils/ScrollFade';\nimport {convertToE164} from '../../../utils/utils';\n\nconst addrBookIcon = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-book-user\"><path d=\"M15 13a3 3 0 1 0-6 0\"/><path d=\"M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20\"/><circle cx=\"12\" cy=\"8\" r=\"2\"/></svg>`;\n\nconst lockIcon = `<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\"/><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"/></svg>`;\n\ntype TSigningOption = 'none' | 'delegator' | 'name_locked';\n\nexport interface IContactSearchEvent {\n query: string;\n}\n\nexport interface IContactSelectEvent {\n first_name: string;\n last_name: string;\n email: string;\n phone: string;\n message: string;\n delegator: boolean;\n name_locked: boolean;\n auth_methods: TRecipientAuthMethod[];\n passcode: string;\n address: string;\n zip: string;\n}\n\nexport type TPickerContact = Partial<IProfile>;\n\n/**\n * Display a contact picker suitable for filling out Recipient objects when sending Envelopes.\n *\n * This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the\n * user interacts with the component, the text entered in the name fields is sent back to the parent via the `searchContacts` event.\n * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be\n * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as \"Recently Used\" contacts, or\n * to always display the user's own contact record.\n *\n * ```ts\n * <verdocs-contact-picker\n * templateRole={role}\n * contactSuggestions={[]}\n * onNext={e => console.log('Contact completed', e.detail)}\n * />\n * ```\n */\n@Component({\n tag: 'verdocs-contact-picker',\n styleUrl: 'verdocs-contact-picker.scss',\n shadow: false,\n})\nexport class VerdocsContactPicker {\n @Element() el: HTMLElement;\n\n private namesRowEl: HTMLElement;\n private suggestionsEl: HTMLElement;\n\n /**\n * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n */\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /**\n * The role that this contact will be assigned to.\n */\n @Prop() templateRole: Partial<IRecipient> | null = null;\n\n /**\n * If set, suggestions will be displayed in a drop-down list to the user. It is recommended that the number\n * of suggestions be limited to the 5 best matching records.\n */\n @Prop() contactSuggestions: TPickerContact[] = [];\n\n /**\n * Whether to show a Cancel button beside Done.\n */\n @Prop() showCancel = true;\n\n /**\n * Event fired when the user enters text in the search field. The calling application may use this to update\n * the `contactSuggestions` property.\n */\n @Event({composed: true}) searchContacts: EventEmitter<IContactSearchEvent>;\n\n /**\n * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n */\n @Event({composed: true}) exit: EventEmitter;\n\n /**\n * Event fired when the user changes the type.\n */\n @Event({composed: true}) next: EventEmitter<IContactSelectEvent>;\n\n @State() first_name: string;\n @State() last_name: string;\n @State() email: string;\n @State() phone: string;\n @State() zip: string;\n @State() address: string;\n @State() message: string;\n @State() showSuggestions: boolean = false;\n @State() showMessage: boolean = false;\n @State() delegator: boolean = false;\n @State() name_locked: boolean = false;\n @State() auth_methods: TRecipientAuthMethod[] = [];\n @State() passcode: string = '';\n\n @State() firstNameFieldId = `verdocs-contact-picker-firstname-${Math.random().toString(36).substring(2, 11)}`;\n @State() lastNameFieldId = `verdocs-contact-picker-lastname-${Math.random().toString(36).substring(2, 11)}`;\n @State() emailFieldId = `verdocs-contact-picker-email-${Math.random().toString(36).substring(2, 11)}`;\n @State() phoneFieldId = `verdocs-contact-picker-phone-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() activeEntitlements: Partial<Record<TEntitlement, IEntitlement>> = {};\n @State() authMethodsLoading: boolean = true;\n\n async componentWillLoad() {\n this.endpoint.loadSession();\n\n if (this.templateRole) {\n const fullName = formatFullName(this.templateRole);\n const nameComponents = fullName.split(' ');\n const firstName = this.templateRole.first_name || nameComponents.shift() || '';\n const lastName = this.templateRole.last_name || nameComponents.join(' ') || '';\n this.first_name = firstName;\n this.last_name = lastName;\n\n this.email = this.templateRole.email || '';\n this.phone = this.templateRole.phone || '';\n // delegator and name_locked are mutually exclusive; delegator takes precedence if both are somehow set\n this.delegator = this.templateRole.delegator || false;\n this.name_locked = this.delegator ? false : this.templateRole.name_locked || false;\n this.message = this.templateRole.message || '';\n this.showMessage = this.message !== '';\n this.auth_methods = this.templateRole.auth_methods || [];\n this.passcode = this.templateRole.passcode || '';\n }\n\n // Entitlements only gate optional methods like KBA. We need error handling here in case the getActiveEntitlements\n // call fails or we stay loading forever.\n this.activeEntitlements = await getActiveEntitlements(this.endpoint).catch(e => {\n console.warn('[CONTACT PICKER] Unable to load entitlements, continuing with base auth methods only', e);\n return {} as Partial<Record<TEntitlement, IEntitlement>>;\n });\n\n this.authMethodsLoading = false;\n console.log('[CONTACT PICKER] Loaded entitlements', this.activeEntitlements);\n }\n\n // Make sure the suggestion list doesn't break the scroll region\n componentDidRender() {\n const body = this.el.querySelector('.form-body') as HTMLElement | null;\n updateScrollFade(body);\n if (this.suggestionsEl && this.namesRowEl && body) {\n this.suggestionsEl.style.top = `${this.namesRowEl.offsetTop + this.namesRowEl.offsetHeight - body.scrollTop + 4}px`;\n }\n }\n\n @Listen('click', {target: 'document'})\n handleDocumentClick(e: MouseEvent) {\n if (this.showSuggestions && !this.el.contains(e.target as Node)) {\n this.showSuggestions = false;\n }\n }\n\n handleFirstNameChange(e: any) {\n this.first_name = e.target.value;\n this.searchContacts?.emit({query: this.first_name});\n }\n\n handleLastNameChange(e: any) {\n this.last_name = e.target.value;\n this.searchContacts?.emit({query: this.last_name});\n }\n\n handleCancel(e: any) {\n e.stopPropagation();\n this.showSuggestions = false;\n this.exit?.emit();\n }\n\n handleSubmit(e: any) {\n e.stopPropagation();\n\n this.showSuggestions = false;\n this.next?.emit({\n first_name: this.first_name,\n last_name: this.last_name,\n email: this.email,\n phone: this.phone,\n message: this.message,\n delegator: this.delegator,\n name_locked: this.name_locked,\n auth_methods: this.auth_methods,\n passcode: this.passcode,\n address: this.address,\n zip: this.zip,\n });\n }\n\n handleSelectSuggestion(e: any, suggestion: TPickerContact) {\n e.stopPropagation();\n\n this.first_name = suggestion.first_name;\n this.last_name = suggestion.last_name;\n this.email = suggestion.email;\n this.phone = suggestion.phone;\n this.showSuggestions = false;\n }\n\n toggleAuthMethod(method: TRecipientAuthMethod) {\n if (this.auth_methods.includes(method)) {\n this.auth_methods = this.auth_methods.filter(selected => selected !== method);\n } else {\n this.auth_methods = [...this.auth_methods, method];\n }\n }\n\n // TODO: Decide whether we want to keep these mutually-exclusive\n setSigningOption(option: TSigningOption) {\n this.delegator = option === 'delegator';\n this.name_locked = option === 'name_locked';\n }\n\n renderPill(label: string, selected: boolean, onClick: () => void, opts: {locked?: boolean; title?: string} = {}) {\n return (\n <button\n type=\"button\"\n class={{pill: true, selected, locked: !!opts.locked}}\n aria-pressed={selected ? 'true' : 'false'}\n disabled={opts.locked && !selected}\n title={opts.title}\n onClick={onClick}\n >\n {opts.locked && <span class=\"pill-icon\" innerHTML={lockIcon} />}\n {label}\n </button>\n );\n }\n\n // The reason for the random names/IDs is to disable browser autocomplete. We set the autocomplete tags but many browsers ignore them\n // and show a duplicate autocomplete picker on top of our own.\n render() {\n const hasBasics = this.first_name && this.last_name && isValidEmail(this.email);\n\n // First name is the first focused field so it's our quicksearch matching target.\n const visibleSuggestions = (this.contactSuggestions || []).filter(\n suggestion => !this.first_name || suggestion.first_name?.toLowerCase().includes(this.first_name.toLowerCase()),\n );\n\n const hasAuthRequirements = this.auth_methods.every(method => {\n switch (method) {\n case 'passcode':\n return !!this.passcode;\n case 'kba':\n return !!this.first_name && !!this.last_name;\n case 'email':\n return !!this.email;\n case 'sms':\n return !!this.phone;\n default:\n return true;\n }\n });\n\n const canSubmit = hasBasics && hasAuthRequirements;\n const hasSMSAuth = !!this.activeEntitlements.sms_auth;\n\n // TODO: We show non-entitled options disabled so folks know what's possible. We could alternatively hide them.\n const verificationOptions: {label: string; value: TRecipientAuthMethod; locked?: boolean}[] = [\n {label: 'Email OTP', value: 'email'},\n {label: 'Passcode', value: 'passcode'},\n {label: 'SMS OTP', value: 'sms', locked: !hasSMSAuth},\n {label: 'KBA', value: 'kba', locked: !this.activeEntitlements.kba_auth},\n {label: 'ID check', value: 'id', locked: !this.activeEntitlements.id_auth},\n ];\n\n const signingOption: TSigningOption = this.delegator ? 'delegator' : this.name_locked ? 'name_locked' : 'none';\n\n return (\n <form onSubmit={e => e.preventDefault()} autocomplete=\"off\">\n <div class=\"form-body-wrap\">\n <div\n class=\"form-body\"\n onScroll={(e: any) => {\n updateScrollFade(e.target);\n this.showSuggestions = false;\n }}\n >\n <div class=\"row names\" ref={el => (this.namesRowEl = el)}>\n <div class=\"field\">\n <label htmlFor={this.firstNameFieldId}>First name</label>\n <input\n id={this.firstNameFieldId}\n name={this.firstNameFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.first_name}\n onFocus={() => {\n // Give the blur event a chance to hide it first if going between first/last\n setTimeout(() => {\n this.showSuggestions = this.contactSuggestions?.length > 0;\n }, 100);\n }}\n onInput={e => this.handleFirstNameChange(e)}\n />\n </div>\n <div class=\"field\">\n <label htmlFor={this.lastNameFieldId}>Last name</label>\n <input\n id={this.lastNameFieldId}\n name={this.lastNameFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.last_name}\n onFocus={() => {\n // Give the blur event a chance to hide it first if going between first/last\n setTimeout(() => {\n this.showSuggestions = this.contactSuggestions?.length > 0;\n }, 100);\n }}\n onInput={e => this.handleLastNameChange(e)}\n />\n </div>\n </div>\n\n <div class=\"field\">\n <label htmlFor={this.emailFieldId}>Email</label>\n <input\n id={this.emailFieldId}\n name={this.emailFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autoComplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.email}\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.email = e.target.value)}\n />\n </div>\n\n {hasSMSAuth && (\n <div class=\"field\">\n <label htmlFor={this.phoneFieldId}>\n Phone <span class=\"optional\">(optional)</span>\n </label>\n <input\n id={this.phoneFieldId}\n name={this.phoneFieldId}\n type=\"text\"\n data-lpignore=\"true\"\n autoComplete=\"blocked\"\n aria-autocomplete=\"none\"\n value={this.phone}\n placeholder=\"+1 (555) 000-0000\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => {\n this.phone = convertToE164(e.target.value);\n }}\n />\n </div>\n )}\n\n <div class=\"group\">\n <div class=\"group-label\">Verification</div>\n {this.authMethodsLoading ? (\n <verdocs-spinner size={10} mode=\"dark\" />\n ) : (\n <div class=\"pills\">\n {verificationOptions.map(option =>\n this.renderPill(option.label, this.auth_methods.includes(option.value), () => this.toggleAuthMethod(option.value), {\n locked: option.locked,\n title: option.locked ? 'Please contact sales@verdocs.com to enable this feature.' : undefined,\n }),\n )}\n </div>\n )}\n\n {this.auth_methods.includes('passcode') && (\n <div class=\"passcode\">\n <input\n id=\"verdocs-passcode\"\n name=\"verdocs-passcode\"\n type=\"text\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n aria-autocomplete=\"none\"\n aria-label=\"Passcode\"\n value={this.passcode}\n placeholder=\"4-8 digits\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.passcode = e.target.value)}\n />\n <span class=\"passcode-hint\">PIN or passcode shared separately with the recipient ahead of time</span>\n </div>\n )}\n </div>\n\n <div class=\"group\">\n <div class=\"group-label\">Signing options</div>\n <div class=\"pills\">\n {this.renderPill('None', signingOption === 'none', () => this.setSigningOption('none'))}\n {this.renderPill('May delegate', signingOption === 'delegator', () => this.setSigningOption('delegator'))}\n {this.renderPill('Name locked', signingOption === 'name_locked', () => this.setSigningOption('name_locked'))}\n </div>\n </div>\n\n <div class=\"field\">\n <label htmlFor=\"verdocs-contact-picker-message\">\n Message <span class=\"optional\">(optional)</span>\n </label>\n <textarea\n id=\"verdocs-contact-picker-message\"\n name=\"verdocs-contact-picker-message\"\n data-lpignore=\"true\"\n autocomplete=\"blocked\"\n placeholder=\"Add a message to the invitation\"\n onFocus={() => (this.showSuggestions = false)}\n onInput={(e: any) => (this.message = e.target.value)}\n >\n {this.message}\n </textarea>\n </div>\n </div>\n <div class=\"scroll-fade\" />\n {this.showSuggestions && visibleSuggestions.length > 0 && (\n <div class=\"suggestions\" role=\"listbox\" ref={el => (this.suggestionsEl = el)}>\n {visibleSuggestions.map(suggestion => (\n <div key={suggestion.id ?? suggestion.email} class=\"suggestion\" onClick={e => this.handleSelectSuggestion(e, suggestion)}>\n {suggestion.picture ? <img alt=\"Avatar\" class=\"avatar\" src={suggestion.picture} /> : <div class=\"avatar\" innerHTML={addrBookIcon} />}\n <div class=\"details\">\n <div class=\"name\">{formatFullName(suggestion)}</div>\n {suggestion.email && <div class=\"destination\">{suggestion.email}</div>}\n {suggestion.phone && <div class=\"destination\">{suggestion.phone}</div>}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n\n <div class=\"buttons\">\n {this.showCancel && <verdocs-button label=\"Cancel\" variant=\"text\" size=\"small\" onClick={e => this.handleCancel(e)} />}\n <verdocs-button label=\"Done\" size=\"small\" disabled={!canSubmit} onClick={!canSubmit ? () => {} : e => this.handleSubmit(e)} />\n </div>\n </form>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}