UNPKG

@ebay/ui-core-react

Version:

Skin components build off React

2 lines (1 loc) 4.38 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const X=require("../tslib.es6-C4EgNkz1.js"),z=require("classnames"),l=require("react"),N=require("../listbox-button-rlxnsga8.js"),w=require("../textbox-Bp4UkkZJ.js");require("../icon-CR8ApQBy.js");require("../icon-button-B1aE4GTn.js");const $=require("../flag-DU-1tRv6.js"),v={US:{countryCode:"US",callingCode:"1",mask:"(000) 000-0000"},CA:{countryCode:"CA",callingCode:"1",mask:"(000) 000-0000"},GB:{countryCode:"GB",callingCode:"44",mask:"0000 000 0000"},AU:{countryCode:"AU",callingCode:"61",mask:"0 0000 0000"},DE:{countryCode:"DE",callingCode:"49",mask:"000 00000000"},FR:{countryCode:"FR",callingCode:"33",mask:"0 00 00 00 00"},IT:{countryCode:"IT",callingCode:"39",mask:"000 000 0000"},ES:{countryCode:"ES",callingCode:"34",mask:"000 00 00 00"},IN:{countryCode:"IN",callingCode:"91",mask:"00000 00000"},JP:{countryCode:"JP",callingCode:"81",mask:"000-0000-0000"},CN:{countryCode:"CN",callingCode:"86",mask:"000 0000 0000"},BR:{countryCode:"BR",callingCode:"55",mask:"(00) 00000-0000"},MX:{countryCode:"MX",callingCode:"52",mask:"000 000 0000"}};function H(n,r){let t=r;const a=s=>{B(n,t,n.value,s.inputType)};return n.addEventListener("input",a),{update(s,c){t=c,B(n,t,s,"")},destroy(){n.removeEventListener("input",a)},get value(){return n.value}}}function B(n,r,t,a){const s=/delete.*Backwards/.test(a),c=n.selectionStart||0,u=Q(t,r);if(t!==u){n.value=u;const C=Y(u,t,c,s);C!==void 0&&n.setSelectionRange(C,C)}}function U(n){return n.replace(/\D+/g,"")}function Q(n,r){const t=U(n);let a="",s=0;if(t.length){for(const c of r)if(c==="0"){if(a+=t[s++],s===t.length)break}else a+=c;s<t.length&&(a+=" "+t.slice(s))}return a}function Y(n,r,t,a){const s=t===r.length;if(a||!s){const c=r.slice(0,t),u=r.slice(t);if(n.startsWith(c))return t;if(n.endsWith(u))return n.length-u.length;{const C=P(c);let p=0,m=0;for(;m<C.length;)P(n[p])&&m++,p++;return p}}}function P(n){return n.replace(/[.,\\/#!$%^&*;:{}=+\-_`~()\s]/g,"")}const Z=n=>n||(typeof navigator<"u"?navigator.language:"en-US"),V=n=>{var{countryCode:r,value:t,locale:a,floatingLabel:s,disabled:c,readonly:u,invalid:C,className:p,onFocus:m,onBlur:k,onChange:x,onInputChange:E,onKeyDown:I,onKeyPress:T,onKeyUp:D,onExpand:L,onCollapse:R}=n,q=X.__rest(n,["countryCode","value","locale","floatingLabel","disabled","readonly","invalid","className","onFocus","onBlur","onChange","onInputChange","onKeyDown","onKeyPress","onKeyUp","onExpand","onCollapse"]);const h=l.useMemo(()=>{const e=Z(a),o=new Intl.DisplayNames([e],{type:"region"});return Object.keys(v).map(i=>{var d;return[i,(d=o.of(i))!==null&&d!==void 0?d:""]}).sort(([,i],[,d])=>i.localeCompare(d))},[a]),[S,K]=l.useState(()=>{if(r){const e=h.findIndex(([o])=>o===r.toUpperCase());return e!==-1?e:0}return 0}),b=l.useRef(null),f=l.useRef(null);l.useEffect(()=>{if(r){const e=h.findIndex(([o])=>o===r.toUpperCase());K(e!==-1?e:0)}},[r,h]);const y=(e=S)=>{const[o]=h[e];return v[o]};l.useEffect(()=>{b.current&&y()&&(f.current||(f.current=H(b.current,y().mask)),f.current.update(b.current.value,y().mask))},[y().mask]),l.useEffect(()=>()=>{f.current&&f.current.destroy()},[]);const g=e=>{var o,i;return{value:((o=f.current)===null||o===void 0?void 0:o.value)||"",rawValue:U(((i=f.current)===null||i===void 0?void 0:i.value)||""),callingCode:y(e).callingCode,countryCode:y(e).countryCode}},F=(e,{index:o})=>{K(o),x&&x(e,g(o))},A=e=>{m&&m(e,g())},O=e=>{k&&k(e,g())},_=e=>{x&&x(e,g())},M=e=>{E&&E(e,g())},j=e=>{I&&I(e,g())},G=e=>{T&&T(e,g())},J=e=>{D&&D(e,g())},W=h.map(([e,o],i)=>{const d=v[e];return l.createElement(N.ListboxOption,{key:e,value:d.callingCode,selected:i===S,icon:l.createElement($.EbayFlagIcon,{flag:d.countryCode.toLowerCase()})},l.createElement("span",null,o," ( + ",d.callingCode," )"))});return l.createElement("span",Object.assign({},q,{className:z("phone-input",p,{"phone-input--disabled":c,"phone-input--readonly":u,"phone-input--error":C})}),l.createElement(N.ListboxButton,{split:"start",disabled:u||c,onChange:F,onExpand:L,onCollapse:R},W),l.createElement(w.EbayTextbox,{type:"tel",value:t,disabled:c,floatingLabel:s,floatingLabelStatic:!0,readOnly:u,invalid:C,onBlur:O,onFocus:A,onKeyDown:j,onKeyPress:G,onKeyUp:J,onChange:_,onInputChange:M,ref:b},l.createElement(w.EbayTextboxPrefixText,{id:"phone-prefix"},"+ ",y().callingCode)))};exports.EbayPhoneInput=V;