react-emoji-toggle-button/build/index.cjs

A flexible and reusable React package to use an emoji picker and connect it with a text input using Ref. Toggle emoji button for React apps.

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react");var re={exports:{}},ee={};/**
 * @license React
 * react-jsx-runtime.production.js
 *
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var he;function Le(){if(he)return ee;he=1;var t=Symbol.for("react.transitional.element"),e=Symbol.for("react.fragment");function r(i,s,u){var c=null;if(u!==void 0&&(c=""+u),s.key!==void 0&&(c=""+s.key),"key"in s){u={};for(var d in s)d!=="key"&&(u[d]=s[d])}else u=s;return s=u.ref,{$$typeof:t,type:i,key:c,ref:s!==void 0?s:null,props:u}}return ee.Fragment=e,ee.jsx=r,ee.jsxs=r,ee}var te={};/**
 * @license React
 * react-jsx-runtime.development.js
 *
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var pe;function De(){return pe||(pe=1,process.env.NODE_ENV!=="production"&&function(){function t(n){if(n==null)return null;if(typeof n=="function")return n.$$typeof===L?null:n.displayName||n.name||null;if(typeof n=="string")return n;switch(n){case o:return"Fragment";case l:return"Profiler";case a:return"StrictMode";case S:return"Suspense";case w:return"SuspenseList";case A:return"Activity"}if(typeof n=="object")switch(typeof n.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),n.$$typeof){case g:return"Portal";case y:return(n.displayName||"Context")+".Provider";case b:return(n._context.displayName||"Context")+".Consumer";case x:var h=n.render;return n=n.displayName,n||(n=h.displayName||h.name||"",n=n!==""?"ForwardRef("+n+")":"ForwardRef"),n;case O:return h=n.displayName||null,h!==null?h:t(n.type)||"Memo";case I:h=n._payload,n=n._init;try{return t(n(h))}catch{}}return null}function e(n){return""+n}function r(n){try{e(n);var h=!1}catch{h=!0}if(h){h=console;var T=h.error,_=typeof Symbol=="function"&&Symbol.toStringTag&&n[Symbol.toStringTag]||n.constructor.name||"Object";return T.call(h,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",_),e(n)}}function i(n){if(n===o)return"<>";if(typeof n=="object"&&n!==null&&n.$$typeof===I)return"<...>";try{var h=t(n);return h?"<"+h+">":"<...>"}catch{return"<...>"}}function s(){var n=F.A;return n===null?null:n.getOwner()}function u(){return Error("react-stack-top-frame")}function c(n){if(W.call(n,"key")){var h=Object.getOwnPropertyDescriptor(n,"key").get;if(h&&h.isReactWarning)return!1}return n.key!==void 0}function d(n,h){function T(){D||(D=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",h))}T.isReactWarning=!0,Object.defineProperty(n,"key",{get:T,configurable:!0})}function f(){var n=t(this.type);return q[n]||(q[n]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),n=this.props.ref,n!==void 0?n:null}function m(n,h,T,_,z,N,Y,X){return T=N.ref,n={$$typeof:E,type:n,key:h,props:N,_owner:z},(T!==void 0?T:null)!==null?Object.defineProperty(n,"ref",{enumerable:!1,get:f}):Object.defineProperty(n,"ref",{enumerable:!1,value:null}),n._store={},Object.defineProperty(n._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(n,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(n,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:Y}),Object.defineProperty(n,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:X}),Object.freeze&&(Object.freeze(n.props),Object.freeze(n)),n}function p(n,h,T,_,z,N,Y,X){var P=h.children;if(P!==void 0)if(_)if(G(P)){for(_=0;_<P.length;_++)j(P[_]);Object.freeze&&Object.freeze(P)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else j(P);if(W.call(h,"key")){P=t(n);var $=Object.keys(h).filter(function(K){return K!=="key"});_=0<$.length?"{key: someKey, "+$.join(": ..., ")+": ...}":"{key: someKey}",J[P+_]||($=0<$.length?"{"+$.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
  let props = %s;
  <%s {...props} />
React keys must be passed directly to JSX without using spread:
  let props = %s;
  <%s key={someKey} {...props} />`,_,P,$,P),J[P+_]=!0)}if(P=null,T!==void 0&&(r(T),P=""+T),c(h)&&(r(h.key),P=""+h.key),"key"in h){T={};for(var Q in h)Q!=="key"&&(T[Q]=h[Q])}else T=h;return P&&d(T,typeof n=="function"?n.displayName||n.name||"Unknown":n),m(n,P,N,z,s(),T,Y,X)}function j(n){typeof n=="object"&&n!==null&&n.$$typeof===E&&n._store&&(n._store.validated=1)}var C=v,E=Symbol.for("react.transitional.element"),g=Symbol.for("react.portal"),o=Symbol.for("react.fragment"),a=Symbol.for("react.strict_mode"),l=Symbol.for("react.profiler"),b=Symbol.for("react.consumer"),y=Symbol.for("react.context"),x=Symbol.for("react.forward_ref"),S=Symbol.for("react.suspense"),w=Symbol.for("react.suspense_list"),O=Symbol.for("react.memo"),I=Symbol.for("react.lazy"),A=Symbol.for("react.activity"),L=Symbol.for("react.client.reference"),F=C.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,W=Object.prototype.hasOwnProperty,G=Array.isArray,V=console.createTask?console.createTask:function(){return null};C={"react-stack-bottom-frame":function(n){return n()}};var D,q={},U=C["react-stack-bottom-frame"].bind(C,u)(),B=V(i(u)),J={};te.Fragment=o,te.jsx=function(n,h,T,_,z){var N=1e4>F.recentlyCreatedOwnerStacks++;return p(n,h,T,!1,_,z,N?Error("react-stack-top-frame"):U,N?V(i(n)):B)},te.jsxs=function(n,h,T,_,z){var N=1e4>F.recentlyCreatedOwnerStacks++;return p(n,h,T,!0,_,z,N?Error("react-stack-top-frame"):U,N?V(i(n)):B)}}()),te}var ge;function $e(){return ge||(ge=1,process.env.NODE_ENV==="production"?re.exports=Le():re.exports=De()),re.exports}var R=$e();function le(){return le=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var i in r)({}).hasOwnProperty.call(r,i)&&(t[i]=r[i])}return t},le.apply(null,arguments)}function be(t){if(t===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function ce(t,e){return ce=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(r,i){return r.__proto__=i,r},ce(t,e)}function We(t,e){t.prototype=Object.create(e.prototype),t.prototype.constructor=t,ce(t,e)}var ve=Number.isNaN||function(e){return typeof e=="number"&&e!==e};function Ue(t,e){return!!(t===e||ve(t)&&ve(e))}function Be(t,e){if(t.length!==e.length)return!1;for(var r=0;r<t.length;r++)if(!Ue(t[r],e[r]))return!1;return!0}function se(t,e){e===void 0&&(e=Be);var r,i=[],s,u=!1;function c(){for(var d=[],f=0;f<arguments.length;f++)d[f]=arguments[f];return u&&r===this&&e(d,i)||(s=t.apply(this,d),u=!0,r=this,i=d),s}return c}var He=typeof performance=="object"&&typeof performance.now=="function",Se=He?function(){return performance.now()}:function(){return Date.now()};function Ee(t){cancelAnimationFrame(t.id)}function Ve(t,e){var r=Se();function i(){Se()-r>=e?t.call(null):s.id=requestAnimationFrame(i)}var s={id:requestAnimationFrame(i)};return s}var ae=-1;function ye(t){if(t===void 0&&(t=!1),ae===-1||t){var e=document.createElement("div"),r=e.style;r.width="50px",r.height="50px",r.overflow="scroll",document.body.appendChild(e),ae=e.offsetWidth-e.clientWidth,document.body.removeChild(e)}return ae}var Z=null;function ke(t){if(t===void 0&&(t=!1),Z===null||t){var e=document.createElement("div"),r=e.style;r.width="50px",r.height="50px",r.overflow="scroll",r.direction="rtl";var i=document.createElement("div"),s=i.style;return s.width="100px",s.height="100px",e.appendChild(i),document.body.appendChild(e),e.scrollLeft>0?Z="positive-descending":(e.scrollLeft=1,e.scrollLeft===0?Z="negative":Z="positive-ascending"),document.body.removeChild(e),Z}return Z}process.env.NODE_ENV;var qe=150,Ye=function(e,r){return e},oe=null,ne=null;process.env.NODE_ENV!=="production"&&typeof window<"u"&&typeof window.WeakSet<"u"&&(oe=new WeakSet,ne=new WeakSet);function Ge(t){var e,r=t.getItemOffset,i=t.getEstimatedTotalSize,s=t.getItemSize,u=t.getOffsetForIndexAndAlignment,c=t.getStartIndexForOffset,d=t.getStopIndexForStartIndex,f=t.initInstanceProps,m=t.shouldResetStyleCacheOnItemSizeChange,p=t.validateProps;return e=function(j){We(C,j);function C(g){var o;return o=j.call(this,g)||this,o._instanceProps=f(o.props,be(o)),o._outerRef=void 0,o._resetIsScrollingTimeoutId=null,o.state={instance:be(o),isScrolling:!1,scrollDirection:"forward",scrollOffset:typeof o.props.initialScrollOffset=="number"?o.props.initialScrollOffset:0,scrollUpdateWasRequested:!1},o._callOnItemsRendered=void 0,o._callOnItemsRendered=se(function(a,l,b,y){return o.props.onItemsRendered({overscanStartIndex:a,overscanStopIndex:l,visibleStartIndex:b,visibleStopIndex:y})}),o._callOnScroll=void 0,o._callOnScroll=se(function(a,l,b){return o.props.onScroll({scrollDirection:a,scrollOffset:l,scrollUpdateWasRequested:b})}),o._getItemStyle=void 0,o._getItemStyle=function(a){var l=o.props,b=l.direction,y=l.itemSize,x=l.layout,S=o._getItemStyleCache(m&&y,m&&x,m&&b),w;if(S.hasOwnProperty(a))w=S[a];else{var O=r(o.props,a,o._instanceProps),I=s(o.props,a,o._instanceProps),A=b==="horizontal"||x==="horizontal",L=b==="rtl",F=A?O:0;S[a]=w={position:"absolute",left:L?void 0:F,right:L?F:void 0,top:A?0:O,height:A?"100%":I,width:A?I:"100%"}}return w},o._getItemStyleCache=void 0,o._getItemStyleCache=se(function(a,l,b){return{}}),o._onScrollHorizontal=function(a){var l=a.currentTarget,b=l.clientWidth,y=l.scrollLeft,x=l.scrollWidth;o.setState(function(S){if(S.scrollOffset===y)return null;var w=o.props.direction,O=y;if(w==="rtl")switch(ke()){case"negative":O=-y;break;case"positive-descending":O=x-b-y;break}return O=Math.max(0,Math.min(O,x-b)),{isScrolling:!0,scrollDirection:S.scrollOffset<O?"forward":"backward",scrollOffset:O,scrollUpdateWasRequested:!1}},o._resetIsScrollingDebounced)},o._onScrollVertical=function(a){var l=a.currentTarget,b=l.clientHeight,y=l.scrollHeight,x=l.scrollTop;o.setState(function(S){if(S.scrollOffset===x)return null;var w=Math.max(0,Math.min(x,y-b));return{isScrolling:!0,scrollDirection:S.scrollOffset<w?"forward":"backward",scrollOffset:w,scrollUpdateWasRequested:!1}},o._resetIsScrollingDebounced)},o._outerRefSetter=function(a){var l=o.props.outerRef;o._outerRef=a,typeof l=="function"?l(a):l!=null&&typeof l=="object"&&l.hasOwnProperty("current")&&(l.current=a)},o._resetIsScrollingDebounced=function(){o._resetIsScrollingTimeoutId!==null&&Ee(o._resetIsScrollingTimeoutId),o._resetIsScrollingTimeoutId=Ve(o._resetIsScrolling,qe)},o._resetIsScrolling=function(){o._resetIsScrollingTimeoutId=null,o.setState({isScrolling:!1},function(){o._getItemStyleCache(-1,null)})},o}C.getDerivedStateFromProps=function(o,a){return Je(o,a),p(o),null};var E=C.prototype;return E.scrollTo=function(o){o=Math.max(0,o),this.setState(function(a){return a.scrollOffset===o?null:{scrollDirection:a.scrollOffset<o?"forward":"backward",scrollOffset:o,scrollUpdateWasRequested:!0}},this._resetIsScrollingDebounced)},E.scrollToItem=function(o,a){a===void 0&&(a="auto");var l=this.props,b=l.itemCount,y=l.layout,x=this.state.scrollOffset;o=Math.max(0,Math.min(o,b-1));var S=0;if(this._outerRef){var w=this._outerRef;y==="vertical"?S=w.scrollWidth>w.clientWidth?ye():0:S=w.scrollHeight>w.clientHeight?ye():0}this.scrollTo(u(this.props,o,a,x,this._instanceProps,S))},E.componentDidMount=function(){var o=this.props,a=o.direction,l=o.initialScrollOffset,b=o.layout;if(typeof l=="number"&&this._outerRef!=null){var y=this._outerRef;a==="horizontal"||b==="horizontal"?y.scrollLeft=l:y.scrollTop=l}this._callPropsCallbacks()},E.componentDidUpdate=function(){var o=this.props,a=o.direction,l=o.layout,b=this.state,y=b.scrollOffset,x=b.scrollUpdateWasRequested;if(x&&this._outerRef!=null){var S=this._outerRef;if(a==="horizontal"||l==="horizontal")if(a==="rtl")switch(ke()){case"negative":S.scrollLeft=-y;break;case"positive-ascending":S.scrollLeft=y;break;default:var w=S.clientWidth,O=S.scrollWidth;S.scrollLeft=O-w-y;break}else S.scrollLeft=y;else S.scrollTop=y}this._callPropsCallbacks()},E.componentWillUnmount=function(){this._resetIsScrollingTimeoutId!==null&&Ee(this._resetIsScrollingTimeoutId)},E.render=function(){var o=this.props,a=o.children,l=o.className,b=o.direction,y=o.height,x=o.innerRef,S=o.innerElementType,w=o.innerTagName,O=o.itemCount,I=o.itemData,A=o.itemKey,L=A===void 0?Ye:A,F=o.layout,W=o.outerElementType,G=o.outerTagName,V=o.style,D=o.useIsScrolling,q=o.width,U=this.state.isScrolling,B=b==="horizontal"||F==="horizontal",J=B?this._onScrollHorizontal:this._onScrollVertical,n=this._getRangeToRender(),h=n[0],T=n[1],_=[];if(O>0)for(var z=h;z<=T;z++)_.push(v.createElement(a,{data:I,key:L(z,I),index:z,isScrolling:D?U:void 0,style:this._getItemStyle(z)}));var N=i(this.props,this._instanceProps);return v.createElement(W||G||"div",{className:l,onScroll:J,ref:this._outerRefSetter,style:le({position:"relative",height:y,width:q,overflow:"auto",WebkitOverflowScrolling:"touch",willChange:"transform",direction:b},V)},v.createElement(S||w||"div",{children:_,ref:x,style:{height:B?"100%":N,pointerEvents:U?"none":void 0,width:B?N:"100%"}}))},E._callPropsCallbacks=function(){if(typeof this.props.onItemsRendered=="function"){var o=this.props.itemCount;if(o>0){var a=this._getRangeToRender(),l=a[0],b=a[1],y=a[2],x=a[3];this._callOnItemsRendered(l,b,y,x)}}if(typeof this.props.onScroll=="function"){var S=this.state,w=S.scrollDirection,O=S.scrollOffset,I=S.scrollUpdateWasRequested;this._callOnScroll(w,O,I)}},E._getRangeToRender=function(){var o=this.props,a=o.itemCount,l=o.overscanCount,b=this.state,y=b.isScrolling,x=b.scrollDirection,S=b.scrollOffset;if(a===0)return[0,0,0,0];var w=c(this.props,S,this._instanceProps),O=d(this.props,w,S,this._instanceProps),I=!y||x==="backward"?Math.max(1,l):1,A=!y||x==="forward"?Math.max(1,l):1;return[Math.max(0,w-I),Math.max(0,Math.min(a-1,O+A)),w,O]},C}(v.PureComponent),e.defaultProps={direction:"ltr",itemData:void 0,layout:"vertical",overscanCount:2,useIsScrolling:!1},e}var Je=function(e,r){var i=e.children,s=e.direction,u=e.height,c=e.layout,d=e.innerTagName,f=e.outerTagName,m=e.width,p=r.instance;if(process.env.NODE_ENV!=="production"){(d!=null||f!=null)&&ne&&!ne.has(p)&&(ne.add(p),console.warn("The innerTagName and outerTagName props have been deprecated. Please use the innerElementType and outerElementType props instead."));var j=s==="horizontal"||c==="horizontal";switch(s){case"horizontal":case"vertical":oe&&!oe.has(p)&&(oe.add(p),console.warn('The direction prop should be either "ltr" (default) or "rtl". Please use the layout prop to specify "vertical" (default) or "horizontal" orientation.'));break;case"ltr":case"rtl":break;default:throw Error('An invalid "direction" prop has been specified. Value should be either "ltr" or "rtl". '+('"'+s+'" was specified.'))}switch(c){case"horizontal":case"vertical":break;default:throw Error('An invalid "layout" prop has been specified. Value should be either "horizontal" or "vertical". '+('"'+c+'" was specified.'))}if(i==null)throw Error('An invalid "children" prop has been specified. Value should be a React component. '+('"'+(i===null?"null":typeof i)+'" was specified.'));if(j&&typeof m!="number")throw Error('An invalid "width" prop has been specified. Horizontal lists must specify a number for width. '+('"'+(m===null?"null":typeof m)+'" was specified.'));if(!j&&typeof u!="number")throw Error('An invalid "height" prop has been specified. Vertical lists must specify a number for height. '+('"'+(u===null?"null":typeof u)+'" was specified.'))}},Xe=Ge({getItemOffset:function(e,r){var i=e.itemSize;return r*i},getItemSize:function(e,r){var i=e.itemSize;return i},getEstimatedTotalSize:function(e){var r=e.itemCount,i=e.itemSize;return i*r},getOffsetForIndexAndAlignment:function(e,r,i,s,u,c){var d=e.direction,f=e.height,m=e.itemCount,p=e.itemSize,j=e.layout,C=e.width,E=d==="horizontal"||j==="horizontal",g=E?C:f,o=Math.max(0,m*p-g),a=Math.min(o,r*p),l=Math.max(0,r*p-g+p+c);switch(i==="smart"&&(s>=l-g&&s<=a+g?i="auto":i="center"),i){case"start":return a;case"end":return l;case"center":{var b=Math.round(l+(a-l)/2);return b<Math.ceil(g/2)?0:b>o+Math.floor(g/2)?o:b}case"auto":default:return s>=l&&s<=a?s:s<l?l:a}},getStartIndexForOffset:function(e,r){var i=e.itemCount,s=e.itemSize;return Math.max(0,Math.min(i-1,Math.floor(r/s)))},getStopIndexForStartIndex:function(e,r,i){var s=e.direction,u=e.height,c=e.itemCount,d=e.itemSize,f=e.layout,m=e.width,p=s==="horizontal"||f==="horizontal",j=r*d,C=p?m:u,E=Math.ceil((C+i-j)/d);return Math.max(0,Math.min(c-1,r+E-1))},initInstanceProps:function(e){},shouldResetStyleCacheOnItemSizeChange:!0,validateProps:function(e){var r=e.itemSize;if(process.env.NODE_ENV!=="production"&&typeof r!="number")throw Error('An invalid "itemSize" prop has been specified. Value should be a number. '+('"'+(r===null?"null":typeof r)+'" was specified.'))}});const Ke='"Twemoji Mozilla","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","EmojiOne Color","Android Emoji",sans-serif';function Ze(){const t=document.createElement("canvas");t.width=t.height=1;const e=t.getContext("2d",{willReadFrequently:!0});return e.textBaseline="top",e.font=`100px ${Ke}`,e.scale(.01,.01),e}function xe(t,e,r){return t.clearRect(0,0,100,100),t.fillStyle=r,t.fillText(e,0,0),t.getImageData(0,0,1,1).data.join(",")}function je(t){const e=Ze(),r=xe(e,t,"#fff"),i=xe(e,t,"#000");return i===r&&!i.startsWith("0,0,0,")}function Qe(t="Twemoji Country Flags",e="https://cdn.jsdelivr.net/npm/country-flag-emoji-polyfill@0.1/dist/TwemojiCountryFlags.woff2"){if(typeof window<"u"&&je("😊")&&!je("🇨🇭")){const r=document.createElement("style");return r.textContent=`@font-face {
      font-family: "${t}";
      unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E0063, U+E0065, U+E0067,
        U+E006C, U+E006E, U+E0073-E0074, U+E0077, U+E007F;
      src: url('${e}') format('woff2');
      font-display: swap;
    }`,document.head.appendChild(r),!0}return!1}const Re=()=>{v.useEffect(()=>{Qe()},[])},we=["😀","😎","🥳","😍","🤩","😐","😫","😓","🙂‍↔️","🙂‍↕️","🥹","😖","😞","😵","😰","😭","😂","🥰","😵‍💫","🤣","🤐","🤑","🥵","😡","🤯","😬"],et=({setCurrentEmoji:t,showEmojiPicker:e})=>{if(!e){const r=Math.floor(Math.random()*we.length);t(we[r])}},tt=({position:t,pickerWidth:e,pickerHeight:r})=>{switch(console.log(t,e,r),t){case"top-right":return{bottom:`calc(100% + ${r}px)`,right:`-calc(100% + ${e}px)`};case"top-left":return{bottom:`calc(100% + ${r}px)`,right:`calc(100% + ${e}px)`};case"bottom-right":return{top:"100%",right:`-calc(100% + ${e}px)`};case"bottom-left":return{top:"100%",right:`calc(100% + ${e}px)`};default:return{top:"100%",left:"50%",transform:"translateX(-50%)"}}},Oe={light:{backgroundColor:"#fff",textColor:"#222",borderColor:"#ccc",tabActiveBackgroundColor:"#eee",tabActiveBorderColor:"#ccc",tabHoverBackgroundColor:"#f5f5f5",scrollbarThumbColor:"#c1c1c1",scrollbarThumbHoverColor:"#a8a8a8",inputBorderColor:"#eee",boxShadowColor:"rgba(0,0,0,0.1)",noResultsTextColor:"#777"},dark:{backgroundColor:"#222",textColor:"#f5f5f5",borderColor:"#444",tabActiveBackgroundColor:"#444",tabActiveBorderColor:"#555",tabHoverBackgroundColor:"#333",scrollbarThumbColor:"#555",scrollbarThumbHoverColor:"#666",inputBorderColor:"#444",boxShadowColor:"rgba(0,0,0,0.3)",noResultsTextColor:"#aaa"}},rt=(t,e)=>{if(!t)return;const r=t.selectionStart||0,i=t.selectionEnd||0,s=t.value;t.value=s.substring(0,r)+e+s.substring(i),t.focus(),t.setSelectionRange(r+e.length,r+e.length);const u=new Event("input",{bubbles:!0,cancelable:!0});t.dispatchEvent(u)},ot='"Twemoji Country Flags", "Helvetica", "Comic Sans", serif',nt=6,it=40,st=320,at=420,lt=330,ct=["🖕","🖕🏻","🖕🏼","🖕🏽","🖕🏾","🖕🏿","🫃","🫃🏻","🫃🏼","🫃🏽","🫃🏾","🫃🏿","🫄","🫄🏻","🫄🏼","🫄🏽","🫄🏾","🫄🏿","✡️","⚧️","🇮🇱","🏳️‍🌈","🏳️‍⚧️"],ut={sm:{emojiItemSize:28,pickerWidth:260,pickerHeight:320,listHeight:220},md:{emojiItemSize:36,pickerWidth:320,pickerHeight:380,listHeight:280},lg:{emojiItemSize:44,pickerWidth:400,pickerHeight:480,listHeight:370}},Te={"Recent Emojis":"🕒","Smileys & Emotion":"😂","People & Body":"👋",Component:"🏽","Animals & Nature":"🐄","Food & Drink":"🍹","Travel & Places":"🚃",Activities:"⚽",Objects:"🛠️",Symbols:"🔅",Flags:"🚩"},dt=()=>R.jsx("svg",{className:"emoji-picker-spinner",viewBox:"25 25 50 50",children:R.jsx("circle",{className:"emoji-picker-spinner-path",r:"20",cy:"50",cx:"50"})}),ft=()=>{const t=v.useRef(null),e=v.useRef(!1),r=v.useRef(0),i=v.useRef(0),s=.1,u=v.useCallback(()=>{const c=t.current;c&&(Math.abs(i.current-r.current)>1?(i.current+=(r.current-i.current)*s,c.scrollLeft=i.current,requestAnimationFrame(u)):e.current=!1)},[]);return v.useEffect(()=>{const c=t.current;if(!c)return;const d=f=>{f.preventDefault(),r.current+=f.deltaY;const m=c.scrollWidth-c.clientWidth;r.current=Math.min(Math.max(r.current,0),m),e.current||(e.current=!0,u())};return c.addEventListener("wheel",d),()=>{c.removeEventListener("wheel",d)}},[u]),{containerRef:t}},mt=({activeCategory:t,emojiJsonData:e,emojisPerRow:r,searchTerm:i,recentEmojis:s=[],recentEmojisLabel:u="Recent"})=>{const c=v.useMemo(()=>{var j;if(t===u)return s;const f=(j=e.emojis)==null?void 0:j[t];if(!f)return[];const m=[];for(const C in f)m.push(...f[C]);if(!i.trim())return m;const p=i.toLowerCase();return m.filter(C=>C.name.toLowerCase().includes(p)||C.emoji.includes(p))},[e,t,i,s,u]),d=v.useMemo(()=>{const f=[];for(let m=0;m<c.length;m+=r)f.push({type:"emoji-row",emojis:c.slice(m,m+r)});return f},[c,r]);return{filteredEmojis:c,groupedAndFilteredEmojis:d}},ht=()=>{const[t,e]=v.useState(null),[r,i]=v.useState(!1),s=v.useRef(null),u=v.useRef(null);return{longPressEmoji:t,setLongPressEmoji:e,showSkinToneVariants:r,setShowSkinToneVariants:i,longPressTimeoutRef:s,skinToneVariantsRef:u,handleEmojiMouseDown:(m,p)=>{m.hasSkinTones&&m.skinToneVariants&&(p.preventDefault(),s.current=setTimeout(()=>{e(m),i(!0)},500))},handleEmojiMouseUp:()=>{s.current&&(clearTimeout(s.current),s.current=null)},handleEmojiMouseLeave:()=>{s.current&&(clearTimeout(s.current),s.current=null)}}},pt=({onClose:t,pickerRef:e,setLongPressEmoji:r,setShowSkinToneVariants:i,showSkinToneVariants:s,skinToneVariantsRef:u})=>{v.useEffect(()=>{const c=d=>{const f=e.current,m=u.current,p=d.target;if(!(m&&m.contains(p))){if(s&&f&&f.contains(p)){i(!1),r(null);return}f&&!f.contains(p)&&t&&t()}};return document.addEventListener("mousedown",c),()=>{document.removeEventListener("mousedown",c)}},[t,e,s,r,i,u])},gt=({onClose:t,pickerRef:e})=>{v.useEffect(()=>{const r=i=>{e.current&&!e.current.contains(i.target)&&t&&t()};return document.addEventListener("mousedown",r),()=>{document.removeEventListener("mousedown",r)}},[t,e])},bt=({activeCategory:t,allCategories:e,setActiveCategory:r})=>{v.useEffect(()=>{e.length>0&&!t&&r(e[0])},[e,t,r])},vt=({pickerRef:t,setLongPressEmoji:e,showSkinToneVariants:r})=>{v.useEffect(()=>{t.current&&(r||e(null))},[r,t,e])},St=({classNames:t,emojiItemSize:e,fontFamily:r,handleEmojiClick:i,handleEmojiMouseDown:s,handleEmojiMouseLeave:u,handleEmojiMouseUp:c,onEmojiButtonLongPress:d,item:f,emojisPerRow:m,style:p,styles:j})=>{if(f.type!=="emoji-row")return null;const C=m-f.emojis.length;return R.jsxs("div",{style:{...p,display:"flex",height:e},className:t.emojiRow,children:[f.emojis.map(E=>{const g=v.createRef();return R.jsxs("button",{ref:g,onClick:()=>i(E.emoji,E),onMouseDown:o=>{s(E,o),E.hasSkinTones&&d&&setTimeout(()=>{g.current&&d(g.current.getBoundingClientRect())},500)},onMouseUp:c,onMouseLeave:u,title:E.name,style:{background:"none",border:"none",fontSize:"1.4rem",margin:"2px 2px",padding:"0px",cursor:"pointer",flex:1,textAlign:"center",position:"relative",fontFamily:r,...j.emojiButton},className:t.emojiButton,children:[E.emoji,E.hasSkinTones&&R.jsx("span",{style:{position:"absolute",bottom:"2px",right:"2px",width:"6px",height:"6px",backgroundColor:"#888",borderRadius:"50%"}})]},E.name+E.code.join(""))}),Array.from({length:C}).map((E,g)=>R.jsx("div",{className:t.emojiButton,style:{flex:1,margin:"2px 2px",padding:"0px"}},`empty-slot-${g}`))]})},Ce="recent-emojis",Et=36,yt=(t=!0)=>{const[e,r]=v.useState([]);return v.useEffect(()=>{if(t)try{const s=localStorage.getItem(Ce);s&&r(JSON.parse(s))}catch(s){console.error("Error loading recent emojis:",s)}},[t]),{recentEmojis:e,addRecentEmoji:s=>{t&&r(u=>{const c=u.filter(f=>f.emoji!==s.emoji),d=[s,...c].slice(0,Et);try{localStorage.setItem(Ce,JSON.stringify(d))}catch(f){console.error("Error saving recent emojis:",f)}return d})}}},kt=({inputRef:t,isLoading:e,pickerRef:r,emojiJsonData:i,onClose:s,onEmojiSelect:u,styles:c={},classNames:d={},config:f={},initialCategory:m,theme:p="light",lang:j="en",enableTabsTitleEmoji:C=!0,preventBadEmojis:E=!0,badEmojiList:g=[]})=>{var fe,me;const{emojisPerRow:o=nt,emojiItemSize:a=it,pickerWidth:l=st,pickerHeight:b=at,listHeight:y=lt,fontFamily:x=ot,searchPlaceholder:S=j==="en"?"Search emojis...":"إبحث عن ايموجي...",noResultsMessage:w=j==="en"?"No emojis found.":"لا يوجد ايموجي",applyEmojiFont:O=!0,themeConfig:I=Oe,enableRecentEmojis:A=!0,recentEmojisLabel:L=j==="en"?"Recent Emojis":"ايموجي حديثا"}=f,{addRecentEmoji:F,recentEmojis:W}=yt(A),[G,V]=v.useState(""),[D,q]=v.useState(m||""),[U,B]=v.useState(null),J=k=>{B({top:k.top+window.scrollY,left:k.left+window.scrollX})},{handleEmojiMouseDown:n,handleEmojiMouseLeave:h,handleEmojiMouseUp:T,longPressEmoji:_,setLongPressEmoji:z,setShowSkinToneVariants:N,showSkinToneVariants:Y,skinToneVariantsRef:X}=ht();pt({onClose:s,pickerRef:r,setLongPressEmoji:z,setShowSkinToneVariants:N,showSkinToneVariants:Y,skinToneVariantsRef:X}),vt({pickerRef:r,setLongPressEmoji:z,showSkinToneVariants:Y}),console.log("picker width: ",(fe=r.current)==null?void 0:fe.offsetWidth),console.log("picker height: ",(me=r.current)==null?void 0:me.offsetHeight);const P=v.useMemo(()=>{if(!E)return i;const k={...i};return k.emojis=Object.fromEntries(Object.entries(i.emojis||{}).map(([H,ie])=>[H,Object.fromEntries(Object.entries(ie).map(([Ne,Me])=>[Ne,Me.filter(Fe=>!g.includes(Fe.emoji))]))])),k},[i,E,g]),$=v.useMemo(()=>{const k=Object.keys(P.emojis||{});return A&&W.length>0?[L,...k]:k},[P,A,W.length,L]);Re();const{containerRef:Q}=ft();bt({activeCategory:D,allCategories:$,setActiveCategory:q});const{groupedAndFilteredEmojis:K}=mt({activeCategory:D,emojiJsonData:E?P:i,emojisPerRow:o,searchTerm:G,recentEmojis:W,recentEmojisLabel:j==="en"?"Recent Emojis":"ايموجي حديثا"}),ue=(k,H)=>{u&&u(k),t.current&&(rt(t.current,k),O&&(t.current.style.fontFamily=x)),A&&H&&F(H)};gt({onClose:s,pickerRef:r});const _e=({index:k,style:H})=>{const ie=K[k];return R.jsx(St,{classNames:d,emojiItemSize:a,emojisPerRow:o,fontFamily:x,handleEmojiClick:ue,handleEmojiMouseDown:n,handleEmojiMouseLeave:h,handleEmojiMouseUp:T,onEmojiButtonLongPress:J,item:ie,style:H,styles:c})},M=p==="light"||p==="dark"?I[p]:I.custom&&I.custom[p]?I.custom[p]:I.light,Ie={border:"1px solid #ccc",borderRadius:"8px",padding:"10px",width:l,height:b,backgroundColor:M.backgroundColor,color:M.textColor,boxShadow:`0 4px 12px ${M.boxShadowColor}`,position:"absolute",zIndex:1e3,display:"flex",flexDirection:"column",fontFamily:x,...c.container},Pe={display:"flex",marginBottom:"8px",overflowX:"auto",fontFamily:x,...c.tabs},ze=k=>({flexShrink:0,padding:"6px 10px",marginRight:"4px",backgroundColor:k?M.tabActiveBackgroundColor:"transparent",color:M.textColor,border:`1px solid ${k?M.tabActiveBorderColor:M.borderColor}`,borderRadius:"6px",cursor:"pointer",fontWeight:k?"bold":"normal",fontSize:"1rem",whiteSpace:"nowrap",...k?c.activeTabButton:c.tabButton}),Ae={width:"90%",padding:"8px",marginBottom:"8px",border:`"1px solid ${M.inputBorderColor}`,borderRadius:"4px",backgroundColor:M.backgroundColor,color:M.textColor,...c.searchInput},de={textAlign:"center",color:M.noResultsTextColor,flexGrow:1,...c.noResultsMessage};return R.jsxs("div",{ref:r,style:Ie,className:`${d.container||""} emoji-picker-theme-${p}`,"data-theme":p,"data-lang":j,dir:j==="en"?"ltr":"rtl",children:[R.jsx("div",{style:Pe,className:d.tabs,ref:Q,children:$.map(k=>R.jsx("button",{onClick:()=>q(k),style:ze(k===D),className:k===D?d.activeTabButton:d.tabButton,children:C&&Te[k]?Te[k]:k},k))}),R.jsx("input",{type:"text",placeholder:S,value:G,onChange:k=>V(k.target.value),style:Ae,className:d.searchInput}),e&&R.jsx("div",{style:de,children:R.jsx(dt,{})}),K.length===0&&!e&&R.jsx("div",{style:de,className:d.noResultsMessage,children:w}),Y&&_&&_.skinToneVariants&&R.jsx("div",{ref:X,style:{position:"absolute",zIndex:1001,backgroundColor:M.backgroundColor,border:`1px solid ${M.borderColor}`,borderRadius:"8px",padding:"8px",boxShadow:`0 4px 12px ${M.boxShadowColor}`,display:"flex",flexDirection:"row",top:U?`${U.top}px`:"50%",left:"50%",transform:"translate(-50%, -190%)"},children:_.skinToneVariants.map((k,H)=>R.jsx("button",{onClick:()=>{ue(k.emoji),N(!1)},title:k.name,style:{background:"none",border:"none",fontSize:"1.4rem",margin:"2px 8px",padding:"8px",cursor:"pointer",textAlign:"center",fontFamily:x},children:k.emoji},`skin-tone-variant-${H}${k.name+k.code.join("-")}`))}),K.length!==0&&!e&&R.jsx(Xe,{height:y,itemCount:K.length,itemSize:a,width:"100%",style:c.emojiList,className:d.emojiList,children:_e})]})},xt=({pickerRef:t,showEmojiPicker:e})=>{const[r,i]=v.useState({width:0,height:0});return v.useLayoutEffect(()=>{if(e&&t.current){const{offsetWidth:s,offsetHeight:u}=t.current;i({width:s,height:u})}},[e,t]),{pickerSize:r}},jt=({currentEmoji:t,setCurrentEmoji:e,setShowEmojiPicker:r,showEmojiPicker:i,theme:s="light"})=>R.jsx("button",{"aria-label":i?"Close-Picker":"Open-Picker","aria-expanded":i,type:"button",className:`emoji-button ${i?"active":""} emoji-button-theme-${s}`,onClick:()=>r(!i),onMouseEnter:()=>et({setCurrentEmoji:e,showEmojiPicker:i}),"data-theme":s,children:t},i?"Close-Picker":"Open-Picker"),wt=(t,e,r)=>{const i=t[e];return i?typeof i=="function"?i():Promise.resolve(i):new Promise((s,u)=>{(typeof queueMicrotask=="function"?queueMicrotask:setTimeout)(u.bind(null,new Error("Unknown variable dynamic import: "+e+(e.split("/").length!==r?". Note that variables only represent file names one level deep.":""))))})},Tt=({lang:t,showEmojiPicker:e})=>{const[r,i]=v.useState({emojis:{}}),[s,u]=v.useState(!1),c=d=>{const f={...d};return Object.keys(f.emojis).forEach(m=>{const p=f.emojis[m];Object.keys(p).forEach(j=>{const C=p[j],E=[],g={};C.forEach(o=>{if(o.name.includes("skin tone")){const a=o.name.split(":")[0].trim();g[a]||(g[a]=[]),g[a].push(o)}else g[o.name]||(g[o.name]=[]),g[o.name].unshift(o)}),Object.keys(g).forEach(o=>{const a=g[o];if(a.length>1){const l={...a[0],skinToneVariants:a,hasSkinTones:!0};E.push(l)}else E.push(a[0])}),p[j]=E})}),f};return v.useEffect(()=>{if(!e)return;(async()=>{u(!0);const f=await wt(Object.assign({"../data/categories.with.modifiers-ar.json":()=>Promise.resolve().then(()=>require("./categories.with.modifiers-ar-BUwSmA7m.cjs")),"../data/categories.with.modifiers.json":()=>Promise.resolve().then(()=>require("./categories.with.modifiers-BpD67Dfi.cjs"))}),`../data/categories.with.modifiers${t==="ar"?"-ar":""}.json`,3),m=c(f.default);i(m),u(!1)})()},[t,e]),{emojiData:r,isLoading:s}},Ct=({lang:t,textInputRef:e})=>{v.useEffect(()=>{e.current&&(e.current.dir=t==="en"?"ltr":"rtl",e.current.placeholder=t==="en"?"Type a message...":"اكتب رسالة...")},[t,e])},Rt=()=>{const[t,e]=v.useState(!1),[r,i]=v.useState("😀"),s=v.useRef(null);return{showEmojiPicker:t,setShowEmojiPicker:e,currentEmoji:r,setCurrentEmoji:i,pickerRef:s}},Ot=()=>R.jsx("style",{children:`
        .emoji-picker-container {
  position: relative;
  user-select: none;
}

.emoji-picker-container *::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

/* Light theme scrollbar */
.emoji-picker-theme-light *::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 10px;
}

.emoji-picker-theme-light *::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* Dark theme scrollbar */
.emoji-picker-theme-dark *::-webkit-scrollbar-thumb {
  background: #555;
  border-radius: 10px;
}

.emoji-picker-theme-dark *::-webkit-scrollbar-thumb:hover {
  background: #666;
}

/* Hide scrollbar track for both themes */
.emoji-picker-theme-light *::-webkit-scrollbar-track,
.emoji-picker-theme-dark *::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 0;
}

/* For Firefox */
.emoji-picker-container * {
  scrollbar-width: thin;
}

.emoji-picker-theme-light * {
  scrollbar-color: #c1c1c1 transparent;
}

.emoji-picker-theme-dark * {
  scrollbar-color: #555 transparent;
}

/* ====================================== */

.emoji-button {
  background-color: transparent;
  border: 2px solid #e0e0e0;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  font-size: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Light theme button */
.emoji-button-theme-light {
  border-color: #e0e0e0;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Dark theme button */
.emoji-button-theme-dark {
  border-color: #444;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.emoji-button:hover {
  border-color: #ffcc00;
  box-shadow: 0 5px 15px rgba(255, 204, 0, 0.3);
  animation: pulse 1s infinite;
}

.emoji-button.active {
  color: white;
  transform: rotate(360deg);
  transition: transform 0.5s ease-in-out, background-color 0.3s ease;
}

.emoji-picker-wrapper {
  transform-origin: top center;
  z-index: 1;
}

/* Add support for custom themes */
[data-theme]:not([data-theme="light"]):not([data-theme="dark"]) {
  /* Custom themes will be handled via inline styles */
}

/* Spinner styles for loading */
svg.emoji-picker-spinner {
  width: 3.25em;
  transform-origin: center;
  animation: rotate4 2s linear infinite;
}

circle.emoji-picker-spinner-path {
  fill: none;
  stroke: hsl(214, 97%, 59%);
  stroke-width: 2;
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  animation: dash4 1.5s ease-in-out infinite;
}

@keyframes rotate4 {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash4 {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 90, 200;
    stroke-dashoffset: -35px;
  }

  100% {
    stroke-dashoffset: -125px;
  }
}

        `}),_t=({textInputRef:t,classNames:e,config:r,initialCategory:i,onEmojiSelect:s,styles:u,position:c="top-left",theme:d="light",themeConfig:f=Oe,lang:m="en",enableRecentEmojis:p=!0,sizes:j={},size:C="md",enableTabsTitleEmoji:E=!0,preventBadEmojis:g=!0,badEmojiList:o=ct})=>{const{currentEmoji:a,pickerRef:l,setCurrentEmoji:b,setShowEmojiPicker:y,showEmojiPicker:x}=Rt();Re();const{pickerSize:S}=xt({pickerRef:l,showEmojiPicker:x}),w={...r,themeConfig:f,enableRecentEmojis:p,...j,...ut[C]},{emojiData:O,isLoading:I}=Tt({lang:m,showEmojiPicker:x});return console.log("isLoading",I),Ct({lang:m,textInputRef:t}),R.jsxs(R.Fragment,{children:[R.jsx(Ot,{}),R.jsxs("div",{className:`emoji-picker-container emoji-picker-theme-${d}`,style:{fontFamily:'"Twemoji Country Flags", "Helvetica", "Comic Sans", serif'},"data-theme":d,children:[R.jsx(jt,{currentEmoji:a,setCurrentEmoji:b,setShowEmojiPicker:y,showEmojiPicker:x,theme:d}),x&&R.jsx("div",{className:`emoji-picker-wrapper emoji-picker-position-${c} emoji-picker-theme-${d}`,style:{position:"absolute",...tt({position:c,pickerHeight:S.height,pickerWidth:S.width})},"data-theme":d,children:R.jsx(kt,{isLoading:I,classNames:e,config:w,initialCategory:i,onEmojiSelect:s,styles:u,inputRef:t,emojiJsonData:O,onClose:()=>y(!1),pickerRef:l,theme:d,lang:m,enableTabsTitleEmoji:E,preventBadEmojis:g,badEmojiList:o})})]})]})};exports.EmojiPickerButton=_t;