pop-emojis 0.0.0

package/README.md

@@ -0,0 +1,73 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```

package/dist/pop-emojis.js

@@ -0,0 +1,297 @@
+import ee, { useState as re } from "react";
+import { AnimatePresence as te, motion as ne } from "framer-motion";
+var R = { exports: {} }, _ = {};
+var D;
+function ae() {
+  if (D) return _;
+  D = 1;
+  var l = /* @__PURE__ */ Symbol.for("react.transitional.element"), m = /* @__PURE__ */ Symbol.for("react.fragment");
+  function f(c, s, o) {
+    var u = null;
+    if (o !== void 0 && (u = "" + o), s.key !== void 0 && (u = "" + s.key), "key" in s) {
+      o = {};
+      for (var i in s)
+        i !== "key" && (o[i] = s[i]);
+    } else o = s;
+    return s = o.ref, {
+      $$typeof: l,
+      type: c,
+      key: u,
+      ref: s !== void 0 ? s : null,
+      props: o
+    };
+  }
+  return _.Fragment = m, _.jsx = f, _.jsxs = f, _;
+}
+var E = {};
+var F;
+function oe() {
+  return F || (F = 1, process.env.NODE_ENV !== "production" && (function() {
+    function l(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === Z ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case k:
+          return "Fragment";
+        case q:
+          return "Profiler";
+        case U:
+          return "StrictMode";
+        case G:
+          return "Suspense";
+        case X:
+          return "SuspenseList";
+        case H:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case W:
+            return "Portal";
+          case V:
+            return e.displayName || "Context";
+          case J:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case z:
+            var r = e.render;
+            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case B:
+            return r = e.displayName || null, r !== null ? r : l(e.type) || "Memo";
+          case x:
+            r = e._payload, e = e._init;
+            try {
+              return l(e(r));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function m(e) {
+      return "" + e;
+    }
+    function f(e) {
+      try {
+        m(e);
+        var r = !1;
+      } catch {
+        r = !0;
+      }
+      if (r) {
+        r = console;
+        var t = r.error, n = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return t.call(
+          r,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          n
+        ), m(e);
+      }
+    }
+    function c(e) {
+      if (e === k) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === x)
+        return "<...>";
+      try {
+        var r = l(e);
+        return r ? "<" + r + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function s() {
+      var e = y.A;
+      return e === null ? null : e.getOwner();
+    }
+    function o() {
+      return Error("react-stack-top-frame");
+    }
+    function u(e) {
+      if (g.call(e, "key")) {
+        var r = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (r && r.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function i(e, r) {
+      function t() {
+        N || (N = !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)",
+          r
+        ));
+      }
+      t.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: t,
+        configurable: !0
+      });
+    }
+    function T() {
+      var e = l(this.type);
+      return C[e] || (C[e] = !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."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function L(e, r, t, n, b, A) {
+      var a = t.ref;
+      return e = {
+        $$typeof: w,
+        type: e,
+        key: r,
+        props: t,
+        _owner: n
+      }, (a !== void 0 ? a : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: T
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: b
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: A
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function P(e, r, t, n, b, A) {
+      var a = r.children;
+      if (a !== void 0)
+        if (n)
+          if (Q(a)) {
+            for (n = 0; n < a.length; n++)
+              S(a[n]);
+            Object.freeze && Object.freeze(a);
+          } 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 S(a);
+      if (g.call(r, "key")) {
+        a = l(e);
+        var d = Object.keys(r).filter(function(K) {
+          return K !== "key";
+        });
+        n = 0 < d.length ? "{key: someKey, " + d.join(": ..., ") + ": ...}" : "{key: someKey}", $[a + n] || (d = 0 < d.length ? "{" + d.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} />`,
+          n,
+          a,
+          d,
+          a
+        ), $[a + n] = !0);
+      }
+      if (a = null, t !== void 0 && (f(t), a = "" + t), u(r) && (f(r.key), a = "" + r.key), "key" in r) {
+        t = {};
+        for (var h in r)
+          h !== "key" && (t[h] = r[h]);
+      } else t = r;
+      return a && i(
+        t,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), L(
+        e,
+        a,
+        t,
+        s(),
+        b,
+        A
+      );
+    }
+    function S(e) {
+      j(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === x && (e._payload.status === "fulfilled" ? j(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function j(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === w;
+    }
+    var p = ee, w = /* @__PURE__ */ Symbol.for("react.transitional.element"), W = /* @__PURE__ */ Symbol.for("react.portal"), k = /* @__PURE__ */ Symbol.for("react.fragment"), U = /* @__PURE__ */ Symbol.for("react.strict_mode"), q = /* @__PURE__ */ Symbol.for("react.profiler"), J = /* @__PURE__ */ Symbol.for("react.consumer"), V = /* @__PURE__ */ Symbol.for("react.context"), z = /* @__PURE__ */ Symbol.for("react.forward_ref"), G = /* @__PURE__ */ Symbol.for("react.suspense"), X = /* @__PURE__ */ Symbol.for("react.suspense_list"), B = /* @__PURE__ */ Symbol.for("react.memo"), x = /* @__PURE__ */ Symbol.for("react.lazy"), H = /* @__PURE__ */ Symbol.for("react.activity"), Z = /* @__PURE__ */ Symbol.for("react.client.reference"), y = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, g = Object.prototype.hasOwnProperty, Q = Array.isArray, O = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    p = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var N, C = {}, Y = p.react_stack_bottom_frame.bind(
+      p,
+      o
+    )(), I = O(c(o)), $ = {};
+    E.Fragment = k, E.jsx = function(e, r, t) {
+      var n = 1e4 > y.recentlyCreatedOwnerStacks++;
+      return P(
+        e,
+        r,
+        t,
+        !1,
+        n ? Error("react-stack-top-frame") : Y,
+        n ? O(c(e)) : I
+      );
+    }, E.jsxs = function(e, r, t) {
+      var n = 1e4 > y.recentlyCreatedOwnerStacks++;
+      return P(
+        e,
+        r,
+        t,
+        !0,
+        n ? Error("react-stack-top-frame") : Y,
+        n ? O(c(e)) : I
+      );
+    };
+  })()), E;
+}
+var M;
+function se() {
+  return M || (M = 1, process.env.NODE_ENV === "production" ? R.exports = ae() : R.exports = oe()), R.exports;
+}
+var v = se();
+function ce({ emoji: l = "🔥", count: m = 6 }) {
+  const [f, c] = re([]), s = () => {
+    const o = Date.now(), u = Array.from({ length: m }, (i, T) => ({
+      id: o + T,
+      x: Math.random() * 180 - 80,
+      y: Math.random() * -100
+    }));
+    c(u), setTimeout(() => c([]), 600);
+  };
+  return /* @__PURE__ */ v.jsxs("div", { className: "relative inline-block", children: [
+    /* @__PURE__ */ v.jsx(
+      "button",
+      {
+        onClick: s,
+        className: "rounded  px-4 py-2 text-white",
+        children: "🫡"
+      }
+    ),
+    /* @__PURE__ */ v.jsx(te, { children: f.map(({ id: o, x: u, y: i }) => /* @__PURE__ */ v.jsx(
+      ne.span,
+      {
+        initial: { scale: 0.5, opacity: 1, x: 0, y: 0 },
+        animate: { scale: 1, opacity: 0, x: u, y: i },
+        exit: { opacity: 0 },
+        transition: { duration: 0.8, ease: "easeOut" },
+        className: "pointer-events-none absolute left-1/2 top-1/3 text-xl",
+        children: l
+      },
+      o
+    )) })
+  ] });
+}
+export {
+  ce as EmojiPop
+};

package/dist/pop-emojis.umd.cjs

@@ -0,0 +1,6 @@
+(function(l,m){typeof exports=="object"&&typeof module<"u"?m(exports,require("react"),require("framer-motion")):typeof define=="function"&&define.amd?define(["exports","react","framer-motion"],m):(l=typeof globalThis<"u"?globalThis:l||self,m(l.PopEmojis={},l.require$$0,l.framerMotion))})(this,(function(l,m,S){"use strict";var v={exports:{}},_={};var w;function q(){if(w)return _;w=1;var i=Symbol.for("react.transitional.element"),p=Symbol.for("react.fragment");function d(c,s,o){var u=null;if(o!==void 0&&(u=""+o),s.key!==void 0&&(u=""+s.key),"key"in s){o={};for(var f in s)f!=="key"&&(o[f]=s[f])}else o=s;return s=o.ref,{$$typeof:i,type:c,key:u,ref:s!==void 0?s:null,props:o}}return _.Fragment=p,_.jsx=d,_.jsxs=d,_}var b={};var g;function J(){return g||(g=1,process.env.NODE_ENV!=="production"&&(function(){function i(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===ae?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case y:return"Fragment";case H:return"Profiler";case B:return"StrictMode";case ee:return"Suspense";case re:return"SuspenseList";case ne:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case X:return"Portal";case Q:return e.displayName||"Context";case Z:return(e._context.displayName||"Context")+".Consumer";case K:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case te:return r=e.displayName||null,r!==null?r:i(e.type)||"Memo";case O:r=e._payload,e=e._init;try{return i(e(r))}catch{}}return null}function p(e){return""+e}function d(e){try{p(e);var r=!1}catch{r=!0}if(r){r=console;var t=r.error,n=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",n),p(e)}}function c(e){if(e===y)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===O)return"<...>";try{var r=i(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function s(){var e=h.A;return e===null?null:e.getOwner()}function o(){return Error("react-stack-top-frame")}function u(e){if(D.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function f(e,r){function t(){F||(F=!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)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}function x(){var e=i(this.type);return M[e]||(M[e]=!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.")),e=this.props.ref,e!==void 0?e:null}function G(e,r,t,n,k,P){var a=t.ref;return e={$$typeof:$,type:e,key:r,props:t,_owner:n},(a!==void 0?a:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:x}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:k}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:P}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function C(e,r,t,n,k,P){var a=r.children;if(a!==void 0)if(n)if(oe(a)){for(n=0;n<a.length;n++)Y(a[n]);Object.freeze&&Object.freeze(a)}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 Y(a);if(D.call(r,"key")){a=i(e);var E=Object.keys(r).filter(function(se){return se!=="key"});n=0<E.length?"{key: someKey, "+E.join(": ..., ")+": ...}":"{key: someKey}",U[a+n]||(E=0<E.length?"{"+E.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} />`,n,a,E,a),U[a+n]=!0)}if(a=null,t!==void 0&&(d(t),a=""+t),u(r)&&(d(r.key),a=""+r.key),"key"in r){t={};for(var A in r)A!=="key"&&(t[A]=r[A])}else t=r;return a&&f(t,typeof e=="function"?e.displayName||e.name||"Unknown":e),G(e,a,t,s(),k,P)}function Y(e){I(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===O&&(e._payload.status==="fulfilled"?I(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function I(e){return typeof e=="object"&&e!==null&&e.$$typeof===$}var T=m,$=Symbol.for("react.transitional.element"),X=Symbol.for("react.portal"),y=Symbol.for("react.fragment"),B=Symbol.for("react.strict_mode"),H=Symbol.for("react.profiler"),Z=Symbol.for("react.consumer"),Q=Symbol.for("react.context"),K=Symbol.for("react.forward_ref"),ee=Symbol.for("react.suspense"),re=Symbol.for("react.suspense_list"),te=Symbol.for("react.memo"),O=Symbol.for("react.lazy"),ne=Symbol.for("react.activity"),ae=Symbol.for("react.client.reference"),h=T.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,D=Object.prototype.hasOwnProperty,oe=Array.isArray,j=console.createTask?console.createTask:function(){return null};T={react_stack_bottom_frame:function(e){return e()}};var F,M={},L=T.react_stack_bottom_frame.bind(T,o)(),W=j(c(o)),U={};b.Fragment=y,b.jsx=function(e,r,t){var n=1e4>h.recentlyCreatedOwnerStacks++;return C(e,r,t,!1,n?Error("react-stack-top-frame"):L,n?j(c(e)):W)},b.jsxs=function(e,r,t){var n=1e4>h.recentlyCreatedOwnerStacks++;return C(e,r,t,!0,n?Error("react-stack-top-frame"):L,n?j(c(e)):W)}})()),b}var N;function V(){return N||(N=1,process.env.NODE_ENV==="production"?v.exports=q():v.exports=J()),v.exports}var R=V();function z({emoji:i="🔥",count:p=6}){const[d,c]=m.useState([]),s=()=>{const o=Date.now(),u=Array.from({length:p},(f,x)=>({id:o+x,x:Math.random()*180-80,y:Math.random()*-100}));c(u),setTimeout(()=>c([]),600)};return R.jsxs("div",{className:"relative inline-block",children:[R.jsx("button",{onClick:s,className:"rounded  px-4 py-2 text-white",children:"🫡"}),R.jsx(S.AnimatePresence,{children:d.map(({id:o,x:u,y:f})=>R.jsx(S.motion.span,{initial:{scale:.5,opacity:1,x:0,y:0},animate:{scale:1,opacity:0,x:u,y:f},exit:{opacity:0},transition:{duration:.8,ease:"easeOut"},className:"pointer-events-none absolute left-1/2 top-1/3 text-xl",children:i},o))})]})}l.EmojiPop=z,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "pop-emojis",
+  "private": false,
+  "version": "0.0.0",
+  "type": "module",
+  "author": "MahindraGamni",
+  "description": "A React component for animated emoji pop effects",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "build:lib": "tsc && vite build --mode lib",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "test": "vitest",
+    "test:ui": "vitest --ui"
+  },
+  "dependencies": {
+    "framer-motion": "^12.23.26"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.1",
+    "@tailwindcss/postcss": "^4.1.18",
+    "motion": "^12.23.26",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.1",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/node": "^24.10.1",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "autoprefixer": "^10.4.23",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "globals": "^16.5.0",
+    "jsdom": "^27.4.0",
+    "postcss": "^8.5.6",
+    "tailwindcss": "^4.1.18",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.46.4",
+    "vite": "^7.2.4",
+    "vitest": "^4.0.16"
+  }
+}