contact-input-component/dist/contact-input-component.cjs.production.min.js


"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n,e=require("react"),t=(n=e)&&"object"==typeof n&&"default"in n?n.default:n;function a(){return e.createElement("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},e.createElement("path",{d:"M18 6L6 18"}),e.createElement("path",{d:"M6 6l12 12"}))}function i(){return e.createElement("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},e.createElement("path",{d:"M20 6L9 17L4 12"}))}!function(n,e){void 0===e&&(e={});var t=e.insertAt;if("undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===t&&a.firstChild?a.insertBefore(i,a.firstChild):a.appendChild(i),i.styleSheet?i.styleSheet.cssText=n:i.appendChild(document.createTextNode(n))}}("body, html {\n\tmargin: 0;\n\tpadding: 0;\n}\n\ninput, button {\n\tall: unset;\n}\n\ninput {\n\twidth: auto;\n\tmin-width: 20px;\n}\n\nbutton {\n\tcursor: pointer;\n}\n\n.index_contact-input-wrapper__I0mwg {\n  position: relative;\n  width: 100%;\n}\n\n.index_contact-input-container__JWTEt {\n  display: flex;\n  align-items: center;\n  min-height: 40px;\n  width: 100%;\n  border-radius: 4px;\n  border: 1px solid #dbdde1;\n  padding: 6px 12px;\n  font-size: 14px;\n  transition: all 0.2s ease;\n  background-color: white;\n  box-sizing: border-box;\n}\n\n.index_contact-input-container__JWTEt:focus-within {\n  border-color: #1a73e8;\n  box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.3);\n}\n\n.index_contact-input-focused__94W3D {\n  background-color: #f1f3f4;\n}\n\n.index_contact-input-label__ehkIk {\n  color: #5f6368;\n  margin-right: 8px;\n  font-weight: 500;\n  flex-shrink: 0;\n}\n\n.index_contact-input-tags__iAIum {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n}\n\n.index_contact-tag__K3ZEa {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  background-color: #e8eaed;\n  border-radius: 16px;\n  padding: 2px 4px;\n  font-size: 14px;\n  transition: background-color 0.2s ease;\n}\n\n.index_contact-tag__K3ZEa:hover {\n  background-color: #dadce0;\n}\n\n.index_contact-avatar__uxua5 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  width: 24px;\n  height: 24px;\n  font-size: 12px;\n  color: white;\n  font-weight: 500;\n  background-color: #4285f4;\n  overflow: hidden;\n}\n\n.index_contact-tag-name__jZt-C {\n  font-weight: 500;\n  margin-top: -2px;\n}\n\n.index_contact-tag-remove__rcPdA {\n  color: #5f6368;\n  border-radius: 50%;\n  padding: 2px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.index_contact-tag-remove__rcPdA:hover {\n  color: #202124;\n  background-color: rgba(0, 0, 0, 0.05);\n}\n\n.index_contact-input__c71ii {\n  flex: 1;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  min-width: 120px;\n  height: 28px;\n}\n\n.index_contact-suggestions__dJuYK {\n  position: absolute;\n  z-index: 50;\n  width: 100%;\n  margin-top: 4px;\n  background-color: white;\n  border-radius: 4px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n  animation: index_scaleIn__YOBnR 0.2s ease;\n}\n\n@keyframes index_scaleIn__YOBnR {\n  from {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n.index_contact-suggestions-list__XdJLM {\n  padding: 4px 0;\n  max-height: 280px;\n  overflow-y: auto;\n}\n\n.index_contact-suggestion-item__5dlRN {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 16px;\n  cursor: pointer;\n  transition: background-color 0.2s ease;\n}\n\n.index_contact-suggestion-item__5dlRN:hover,\n.index_highlighted__juYTV {\n  background-color: #f1f3f4;\n}\n\n.index_suggestion-details__qdLRu {\n  display: flex;\n  flex-direction: column;\n}\n\n.index_suggestion-name__2n4Gs {\n  font-weight: 500;\n}\n\n.index_suggestion-contact__yj-0u {\n  font-size: 13px;\n  color: #5f6368;\n}\n\n.index_suggestion-check__vfUMT {\n  margin-left: auto;\n  color: #1a73e8;\n} ");var o=["label","contacts","selectedContacts","onChange","onInputChange","allowNewContacts"],r=function(n,e){return e.filter((function(e){var t=e.name,a=e.description,i=n.toLowerCase();return t.toLowerCase().includes(i)||(null==a?void 0:a.toLowerCase().includes(i))}))};exports.default=function(n){var c=n.label,s=void 0===c?"To":c,l=n.contacts,d=void 0===l?[]:l,u=n.selectedContacts,_=void 0===u?[]:u,g=n.onChange,m=n.onInputChange,p=n.allowNewContacts,x=void 0===p||p,f=function(n,e){if(null==n)return{};var t={};for(var a in n)if({}.hasOwnProperty.call(n,a)){if(-1!==e.indexOf(a))continue;t[a]=n[a]}return t}(n,o),h=e.useState(""),v=h[0],w=h[1],E=e.useState(!1),b=E[0],k=E[1],y=e.useState(!1),N=y[0],C=y[1],L=e.useState(_),j=L[0],T=L[1],R=e.useState([]),I=R[0],M=R[1],Y=e.useState(-1),A=Y[0],D=Y[1],S=e.useRef(null),B=e.useRef(null);e.useEffect((function(){T(_)}),[_]),e.useEffect((function(){v.trim()?M(r(v,d)):M([])}),[v,d]),e.useEffect((function(){var n=function(n){B.current&&!B.current.contains(n.target)&&(C(!1),k(!1))};return document.addEventListener("mousedown",n),function(){document.removeEventListener("mousedown",n)}}),[]);var J=function(n){var e;if(!j.some((function(e){return e.id===n.id}))){var t=[].concat(j,[n]);T(t),g&&g(t)}w(""),C(!1),M([]),null==(e=S.current)||e.focus()},W=function(n){var e=j.filter((function(e){return e.id!==n}));T(e),g&&g(e)},z=function(){if(v.trim()){var n={id:""+Date.now(),name:v.trim()},e=[].concat(j,[n]);T(e),g&&g(e),w(""),C(!1),M([])}};return t.createElement("div",{ref:B,className:"index_contact-input-wrapper__I0mwg"},t.createElement("div",{className:"index_contact-input-container__JWTEt "+(b?"index_contact-input-focused__94W3D":""),onClick:function(){var n;return null==(n=S.current)?void 0:n.focus()}},s&&t.createElement("span",{className:"index_contact-input-label__ehkIk"},s),t.createElement("div",{className:"index_contact-input-tags__iAIum"},j.map((function(n){return t.createElement("div",{key:n.id,className:"index_contact-tag__K3ZEa"},n.image?t.createElement("img",{src:n.image,alt:n.name,className:"index_contact-avatar__uxua5"}):null,t.createElement("span",{className:"index_contact-tag-name__jZt-C"},n.name),t.createElement("button",{type:"button",onClick:function(e){e.stopPropagation(),W(n.id)},className:"index_contact-tag-remove__rcPdA"},t.createElement(a,null)))})),t.createElement("input",Object.assign({ref:S,type:"text",className:"index_contact-input__c71ii",value:v,onChange:function(n){var e=n.target.value;w(e),e.trim()?(C(!0),M(r(e,d)),D(-1)):(C(!1),M([])),m&&m(e)},onFocus:function(){k(!0),v.trim()&&C(!0)},onKeyDown:function(n){"ArrowDown"===n.key&&(null==I?void 0:I.length)>0?(n.preventDefault(),D((function(n){return n<(null==I?void 0:I.length)-1?n+1:0}))):"ArrowUp"===n.key&&(null==I?void 0:I.length)>0?(n.preventDefault(),D((function(n){return n>0?n-1:(null==I?void 0:I.length)-1}))):"Enter"===n.key?(n.preventDefault(),A>=0&&(null==I?void 0:I.length)>0?J(I[A]):x&&v.trim()&&z()):"Escape"===n.key?C(!1):"Backspace"===n.key&&""===v&&j.length>0&&W(j[j.length-1].id)}},f)))),N&&t.createElement("div",{className:"index_contact-suggestions__dJuYK"},t.createElement("div",{className:"index_contact-suggestions-list__XdJLM"},I.length>0?I.map((function(n,e){return t.createElement("div",{key:n.id,onClick:function(){return J(n)},className:"index_contact-suggestion-item__5dlRN "+(A===e?"index_highlighted__juYTV":"")},n.image?t.createElement("img",{src:n.image,alt:n.name,className:"index_contact-avatar__uxua5"}):null,t.createElement("div",{className:"index_suggestion-details__qdLRu"},t.createElement("span",{className:"index_suggestion-name__2n4Gs"},n.name),n.description&&t.createElement("span",{className:"index_suggestion-contact__yj-0u"},n.description)),A===e&&t.createElement("span",{className:"index_suggestion-check__vfUMT"},t.createElement(i,null)))})):x&&v.trim()?t.createElement("div",{className:"index_contact-suggestion-item__5dlRN index_highlighted__juYTV",onClick:z},t.createElement("div",{className:"index_suggestion-details__qdLRu"},t.createElement("span",{className:"index_suggestion-name__2n4Gs"},'"',v,'"')),t.createElement("span",{className:"index_suggestion-check__vfUMT"},t.createElement(i,null))):null)))};
//# sourceMappingURL=contact-input-component.cjs.production.min.js.map