jattac.libs.web.overflow-menu 0.0.9 → 0.0.10
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.
- package/dist/index.es.js +1 -1
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.es.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{useState as t,useRef as n,useEffect as r,useLayoutEffect as o}from"react";import a from"react-dom";import{AnimatePresence as i,motion as l,useAnimationControls as s}from"framer-motion";var u="OverflowMenu-module_trigger__imdPK",d="OverflowMenu-module_menu__n8uKD",c="OverflowMenu-module_dotsWrapper__CHO9Q",m="OverflowMenu-module_dot__g5Rgi";!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}(".OverflowMenu-module_menuWrapper__psD7a{display:inline-block;position:relative;z-index:0}.OverflowMenu-module_trigger__imdPK{align-items:center;background:transparent;border:none;border-radius:50%;color:#024b59;cursor:pointer;display:flex;font-size:1.8rem;height:3rem;justify-content:center;transition:color .2s ease,background-color .2s ease;width:3rem}.OverflowMenu-module_trigger__imdPK:focus,.OverflowMenu-module_trigger__imdPK:hover{background-color:rgba(2,75,89,.05);color:#016a80;outline:none}.OverflowMenu-module_menu__n8uKD{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:hsla(0,0%,100%,.75);border:1px solid rgba(2,75,89,.15);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);color:#024b59;display:flex;flex-direction:column;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;gap:.35rem;margin-top:.5rem;min-width:180px;padding:.5rem .25rem;position:absolute;right:0;top:100%;z-index:9999}.OverflowMenu-module_menu__n8uKD button{background:transparent;border:none;border-radius:8px;color:#024b59;cursor:pointer;font-size:1rem;padding:.6rem 1rem;text-align:left;transition:background .25s ease,transform .12s ease;user-select:none}.OverflowMenu-module_menu__n8uKD button:focus,.OverflowMenu-module_menu__n8uKD button:hover{background:rgba(2,75,89,.05);outline:none;transform:scale(1.03)}.OverflowMenu-module_menu__n8uKD button:active{background:rgba(2,75,89,.1);transform:scale(.98)}.OverflowMenu-module_dotsWrapper__CHO9Q{align-items:center;display:flex;gap:3px;justify-content:center}.OverflowMenu-module_dot__g5Rgi{background-color:currentColor;border-radius:50%;display:block;height:5px;width:5px}");const p={open:{opacity:1,y:0,transition:{type:"spring",stiffness:400,damping:40,staggerChildren:.07}},closed:{opacity:0,y:-10,transition:{duration:.2}}},f={open:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:24}},closed:{opacity:0,y:10,transition:{duration:.2}}},g=({open:t})=>{const n=s();return r(()=>{t?n.start(e=>({x:[0,4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}})):n.start(e=>({y:[0,-4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}}))},[t,n]),e.createElement(l.div,{className:c},e.createElement(l.span,{className:m,animate:{backgroundColor:t?"#
|
|
1
|
+
import e,{useState as t,useRef as n,useEffect as r,useLayoutEffect as o}from"react";import a from"react-dom";import{AnimatePresence as i,motion as l,useAnimationControls as s}from"framer-motion";var u="OverflowMenu-module_trigger__imdPK",d="OverflowMenu-module_menu__n8uKD",c="OverflowMenu-module_dotsWrapper__CHO9Q",m="OverflowMenu-module_dot__g5Rgi";!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}(".OverflowMenu-module_menuWrapper__psD7a{display:inline-block;position:relative;z-index:0}.OverflowMenu-module_trigger__imdPK{align-items:center;background:transparent;border:none;border-radius:50%;color:#024b59;cursor:pointer;display:flex;font-size:1.8rem;height:3rem;justify-content:center;transition:color .2s ease,background-color .2s ease;width:3rem}.OverflowMenu-module_trigger__imdPK:focus,.OverflowMenu-module_trigger__imdPK:hover{background-color:rgba(2,75,89,.05);color:#016a80;outline:none}.OverflowMenu-module_menu__n8uKD{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:hsla(0,0%,100%,.75);border:1px solid rgba(2,75,89,.15);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);color:#024b59;display:flex;flex-direction:column;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;gap:.35rem;margin-top:.5rem;min-width:180px;padding:.5rem .25rem;position:absolute;right:0;top:100%;z-index:9999}.OverflowMenu-module_menu__n8uKD button{background:transparent;border:none;border-radius:8px;color:#024b59;cursor:pointer;font-size:1rem;padding:.6rem 1rem;text-align:left;transition:background .25s ease,transform .12s ease;user-select:none}.OverflowMenu-module_menu__n8uKD button:focus,.OverflowMenu-module_menu__n8uKD button:hover{background:rgba(2,75,89,.05);outline:none;transform:scale(1.03)}.OverflowMenu-module_menu__n8uKD button:active{background:rgba(2,75,89,.1);transform:scale(.98)}.OverflowMenu-module_dotsWrapper__CHO9Q{align-items:center;display:flex;flex-direction:column;gap:3px;justify-content:center}.OverflowMenu-module_dot__g5Rgi{background-color:currentColor;border-radius:50%;display:block;height:5px;width:5px}");const p={open:{opacity:1,y:0,transition:{type:"spring",stiffness:400,damping:40,staggerChildren:.07}},closed:{opacity:0,y:-10,transition:{duration:.2}}},f={open:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:24}},closed:{opacity:0,y:10,transition:{duration:.2}}},g=({open:t})=>{const n=s();return r(()=>{t?n.start(e=>({x:[0,4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}})):n.start(e=>({y:[0,-4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}}))},[t,n]),e.createElement(l.div,{className:c},e.createElement(l.span,{className:m,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:0}),e.createElement(l.span,{className:m,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:1}),e.createElement(l.span,{className:m,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:2}))},b=({icon:s="⋮",portal:c,className:m,items:b})=>{const[v,_]=t(!1),w=n(null),y=n(null),[h,k]=t({top:0,left:0});r(()=>{const e=e=>{v&&w.current&&!w.current.contains(e.target)&&y.current&&!y.current.contains(e.target)&&_(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[v]),r(()=>{if(!v)return;const e=e=>{"Escape"===e.key&&_(!1)};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[v]),o(()=>{var e,t;if(v){if(!w.current||!y.current)return;const t=w.current.getBoundingClientRect(),n=y.current.offsetHeight,r=window.innerHeight;let o=t.bottom+window.scrollY+4;t.bottom+n>r&&(o=t.top+window.scrollY-n-4),k({top:o,left:t.right+window.scrollX-160});const a=null===(e=y.current)||void 0===e?void 0:e.querySelector('[role="menuitem"]');null==a||a.focus()}else null===(t=w.current)||void 0===t||t.focus()},[v]);const x=e.createElement(i,null,v&&e.createElement(l.div,{ref:y,role:"menu",className:d,style:{position:"absolute",top:h.top,left:h.left},variants:p,initial:"closed",animate:"open",exit:"closed",onKeyDown:e=>{var t,n;if("ArrowUp"===e.key||"ArrowDown"===e.key){e.preventDefault();const r=Array.from(null===(t=y.current)||void 0===t?void 0:t.querySelectorAll('[role="menuitem"]')),o=r.findIndex(e=>e===document.activeElement);let a=-1;"ArrowDown"===e.key?a=(o+1)%r.length:"ArrowUp"===e.key&&(a=(o-1+r.length)%r.length),null===(n=r[a])||void 0===n||n.focus()}}},b.map((t,n)=>e.createElement(l.button,{key:n,role:"menuitem",onClick:()=>{t.onClick&&t.onClick(),_(!1)},variants:f},t.content))));return e.createElement(e.Fragment,null,e.createElement("button",{ref:w,className:`${u} ${m}`,onClick:()=>_(!v),"aria-haspopup":"true","aria-expanded":v},e.createElement(l.div,{whileHover:{scale:1.2}},"⋮"===s?e.createElement(g,{open:v}):e.createElement(l.div,{animate:{rotate:v?90:0},transition:{type:"spring",stiffness:400,damping:40}},s))),c?a.createPortal(x,c):x)};export{b as default};
|
|
2
2
|
//# sourceMappingURL=index.es.js.map
|
package/dist/index.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/UI/OverflowMenu.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n",null],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","menuVariants","open","opacity","y","transition","stiffness","damping","staggerChildren","closed","duration","itemVariants","DefaultIcon","dotControls","useAnimationControls","useEffect","start","i","x","delay","ease","React","motion","div","className","styles","span","animate","backgroundColor","custom","OverflowMenu","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","viewportHeight","window","innerHeight","newTop","bottom","scrollY","right","scrollX","firstItem","_a","querySelector","focus","_b","menuContent","AnimatePresence","role","position","variants","initial","exit","onKeyDown","e","preventDefault","Array","from","querySelectorAll","activeIndex","findIndex","item","activeElement","nextIndex","length","map","index","button","onClick","content","Fragment","whileHover","scale","rotate","ReactDOM","createPortal"],"mappings":"iWAAA,SAAqBA,EAAKC,QACX,IAARA,IAAiBA,EAAM,CAAA,GAC5B,IAAIC,EAAWD,EAAIC,SAEnB,GAAgC,oBAAbC,SAAnB,CAEA,IAAIC,EAAOD,SAASC,MAAQD,SAASE,qBAAqB,QAAQ,GAC9DC,EAAQH,SAASI,cAAc,SACnCD,EAAME,KAAO,WAEI,QAAbN,GACEE,EAAKK,WACPL,EAAKM,aAAaJ,EAAOF,EAAKK,YAKhCL,EAAKO,YAAYL,GAGfA,EAAMM,WACRN,EAAMM,WAAWC,QAAUb,EAE3BM,EAAMK,YAAYR,SAASW,eAAed,GAnBU,CAqBxD,
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/UI/OverflowMenu.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n",null],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","menuVariants","open","opacity","y","transition","stiffness","damping","staggerChildren","closed","duration","itemVariants","DefaultIcon","dotControls","useAnimationControls","useEffect","start","i","x","delay","ease","React","motion","div","className","styles","span","animate","backgroundColor","custom","OverflowMenu","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","viewportHeight","window","innerHeight","newTop","bottom","scrollY","right","scrollX","firstItem","_a","querySelector","focus","_b","menuContent","AnimatePresence","role","position","variants","initial","exit","onKeyDown","e","preventDefault","Array","from","querySelectorAll","activeIndex","findIndex","item","activeElement","nextIndex","length","map","index","button","onClick","content","Fragment","whileHover","scale","rotate","ReactDOM","createPortal"],"mappings":"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","x_google_ignoreList":[0]}
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react"),t=require("react-dom"),n=require("framer-motion");var o="OverflowMenu-module_trigger__imdPK",r="OverflowMenu-module_menu__n8uKD",
|
|
1
|
+
"use strict";var e=require("react"),t=require("react-dom"),n=require("framer-motion");var o="OverflowMenu-module_trigger__imdPK",r="OverflowMenu-module_menu__n8uKD",i="OverflowMenu-module_dotsWrapper__CHO9Q",a="OverflowMenu-module_dot__g5Rgi";!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}(".OverflowMenu-module_menuWrapper__psD7a{display:inline-block;position:relative;z-index:0}.OverflowMenu-module_trigger__imdPK{align-items:center;background:transparent;border:none;border-radius:50%;color:#024b59;cursor:pointer;display:flex;font-size:1.8rem;height:3rem;justify-content:center;transition:color .2s ease,background-color .2s ease;width:3rem}.OverflowMenu-module_trigger__imdPK:focus,.OverflowMenu-module_trigger__imdPK:hover{background-color:rgba(2,75,89,.05);color:#016a80;outline:none}.OverflowMenu-module_menu__n8uKD{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:hsla(0,0%,100%,.75);border:1px solid rgba(2,75,89,.15);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);color:#024b59;display:flex;flex-direction:column;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;gap:.35rem;margin-top:.5rem;min-width:180px;padding:.5rem .25rem;position:absolute;right:0;top:100%;z-index:9999}.OverflowMenu-module_menu__n8uKD button{background:transparent;border:none;border-radius:8px;color:#024b59;cursor:pointer;font-size:1rem;padding:.6rem 1rem;text-align:left;transition:background .25s ease,transform .12s ease;user-select:none}.OverflowMenu-module_menu__n8uKD button:focus,.OverflowMenu-module_menu__n8uKD button:hover{background:rgba(2,75,89,.05);outline:none;transform:scale(1.03)}.OverflowMenu-module_menu__n8uKD button:active{background:rgba(2,75,89,.1);transform:scale(.98)}.OverflowMenu-module_dotsWrapper__CHO9Q{align-items:center;display:flex;flex-direction:column;gap:3px;justify-content:center}.OverflowMenu-module_dot__g5Rgi{background-color:currentColor;border-radius:50%;display:block;height:5px;width:5px}");const l={open:{opacity:1,y:0,transition:{type:"spring",stiffness:400,damping:40,staggerChildren:.07}},closed:{opacity:0,y:-10,transition:{duration:.2}}},s={open:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:24}},closed:{opacity:0,y:10,transition:{duration:.2}}},u=({open:t})=>{const o=n.useAnimationControls();return e.useEffect(()=>{t?o.start(e=>({x:[0,4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}})):o.start(e=>({y:[0,-4,0],transition:{delay:.1*e,duration:.3,ease:"easeInOut"}}))},[t,o]),e.createElement(n.motion.div,{className:i},e.createElement(n.motion.span,{className:a,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:0}),e.createElement(n.motion.span,{className:a,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:1}),e.createElement(n.motion.span,{className:a,animate:{backgroundColor:t?"#00BCD4":"#024b59"},transition:{duration:.2},custom:2}))};module.exports=({icon:i="⋮",portal:a,className:c,items:d})=>{const[m,p]=e.useState(!1),f=e.useRef(null),g=e.useRef(null),[b,v]=e.useState({top:0,left:0});e.useEffect(()=>{const e=e=>{m&&f.current&&!f.current.contains(e.target)&&g.current&&!g.current.contains(e.target)&&p(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[m]),e.useEffect(()=>{if(!m)return;const e=e=>{"Escape"===e.key&&p(!1)};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[m]),e.useLayoutEffect(()=>{var e,t;if(m){if(!f.current||!g.current)return;const t=f.current.getBoundingClientRect(),n=g.current.offsetHeight,o=window.innerHeight;let r=t.bottom+window.scrollY+4;t.bottom+n>o&&(r=t.top+window.scrollY-n-4),v({top:r,left:t.right+window.scrollX-160});const i=null===(e=g.current)||void 0===e?void 0:e.querySelector('[role="menuitem"]');null==i||i.focus()}else null===(t=f.current)||void 0===t||t.focus()},[m]);const _=e.createElement(n.AnimatePresence,null,m&&e.createElement(n.motion.div,{ref:g,role:"menu",className:r,style:{position:"absolute",top:b.top,left:b.left},variants:l,initial:"closed",animate:"open",exit:"closed",onKeyDown:e=>{var t,n;if("ArrowUp"===e.key||"ArrowDown"===e.key){e.preventDefault();const o=Array.from(null===(t=g.current)||void 0===t?void 0:t.querySelectorAll('[role="menuitem"]')),r=o.findIndex(e=>e===document.activeElement);let i=-1;"ArrowDown"===e.key?i=(r+1)%o.length:"ArrowUp"===e.key&&(i=(r-1+o.length)%o.length),null===(n=o[i])||void 0===n||n.focus()}}},d.map((t,o)=>e.createElement(n.motion.button,{key:o,role:"menuitem",onClick:()=>{t.onClick&&t.onClick(),p(!1)},variants:s},t.content))));return e.createElement(e.Fragment,null,e.createElement("button",{ref:f,className:`${o} ${c}`,onClick:()=>p(!m),"aria-haspopup":"true","aria-expanded":m},e.createElement(n.motion.div,{whileHover:{scale:1.2}},"⋮"===i?e.createElement(u,{open:m}):e.createElement(n.motion.div,{animate:{rotate:m?90:0},transition:{type:"spring",stiffness:400,damping:40}},i))),a?t.createPortal(_,a):_)};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/UI/OverflowMenu.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n",null],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","menuVariants","open","opacity","y","transition","stiffness","damping","staggerChildren","closed","duration","itemVariants","DefaultIcon","dotControls","useAnimationControls","useEffect","start","i","x","delay","ease","React","motion","div","className","styles","span","animate","backgroundColor","custom","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","viewportHeight","window","innerHeight","newTop","bottom","scrollY","right","scrollX","firstItem","_a","querySelector","focus","_b","menuContent","AnimatePresence","role","position","variants","initial","exit","onKeyDown","e","preventDefault","Array","from","querySelectorAll","activeIndex","findIndex","item","activeElement","nextIndex","length","map","index","button","onClick","content","Fragment","whileHover","scale","rotate","ReactDOM","createPortal"],"mappings":"oPAAA,SAAqBA,EAAKC,QACX,IAARA,IAAiBA,EAAM,CAAA,GAC5B,IAAIC,EAAWD,EAAIC,SAEnB,GAAgC,oBAAbC,SAAnB,CAEA,IAAIC,EAAOD,SAASC,MAAQD,SAASE,qBAAqB,QAAQ,GAC9DC,EAAQH,SAASI,cAAc,SACnCD,EAAME,KAAO,WAEI,QAAbN,GACEE,EAAKK,WACPL,EAAKM,aAAaJ,EAAOF,EAAKK,YAKhCL,EAAKO,YAAYL,GAGfA,EAAMM,WACRN,EAAMM,WAAWC,QAAUb,EAE3BM,EAAMK,YAAYR,SAASW,eAAed,GAnBU,CAqBxD,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/UI/OverflowMenu.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n",null],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","menuVariants","open","opacity","y","transition","stiffness","damping","staggerChildren","closed","duration","itemVariants","DefaultIcon","dotControls","useAnimationControls","useEffect","start","i","x","delay","ease","React","motion","div","className","styles","span","animate","backgroundColor","custom","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","viewportHeight","window","innerHeight","newTop","bottom","scrollY","right","scrollX","firstItem","_a","querySelector","focus","_b","menuContent","AnimatePresence","role","position","variants","initial","exit","onKeyDown","e","preventDefault","Array","from","querySelectorAll","activeIndex","findIndex","item","activeElement","nextIndex","length","map","index","button","onClick","content","Fragment","whileHover","scale","rotate","ReactDOM","createPortal"],"mappings":"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","x_google_ignoreList":[0]}
|
package/package.json
CHANGED