jattac.libs.web.overflow-menu 0.0.13 → 0.0.14
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
|
|
1
|
+
import e,{useState as t,useRef as n,useEffect as o,useLayoutEffect as r}from"react";import a from"react-dom";import{AnimatePresence as i,motion as l,useMotionValue as s,useSpring as u}from"framer-motion";var d="OverflowMenu-module_trigger__imdPK",c="OverflowMenu-module_menu__n8uKD",m="OverflowMenu-module_dotsWrapper__CHO9Q",p="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 #016a80;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 f={open:{opacity:1,y:0,transition:{type:"spring",stiffness:400,damping:40,staggerChildren:.07}},closed:{opacity:0,y:-10,transition:{duration:.2}}},g={open:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:24}},closed:{opacity:0,y:10,transition:{duration:.2}}},v=({open:t})=>e.createElement(l.div,{className:m},e.createElement(l.span,{className:p,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:0,duration:.3,ease:"easeInOut"},custom:0}),e.createElement(l.span,{className:p,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:.1,duration:.3,ease:"easeInOut"},custom:1}),e.createElement(l.span,{className:p,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:.2,duration:.3,ease:"easeInOut"},custom:2})),b=({icon:m="⋮",portal:p,className:b,items:w})=>{const[y,_]=t(!1),h=n(null),k=n(null),[x,C]=t({top:0,left:0});o(()=>{const e=e=>{y&&h.current&&!h.current.contains(e.target)&&k.current&&!k.current.contains(e.target)&&_(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[y]),o(()=>{if(!y)return;const e=e=>{"Escape"===e.key&&_(!1)};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[y]),r(()=>{var e,t;if(y){if(!h.current||!k.current)return;const t=h.current.getBoundingClientRect(),n=k.current.offsetWidth,o=k.current.offsetHeight,r=window.innerWidth,a=window.innerHeight,i=768;let l=t.bottom+window.scrollY+4,s=0;if(t.bottom+o>a&&(l=t.top+window.scrollY-o-4),r<i)s=(r-n)/2+window.scrollX;else{let e=t.right+window.scrollX-160;s=e+n>r+window.scrollX?t.left+window.scrollX-n:e}C({top:l,left:s});const u=null===(e=k.current)||void 0===e?void 0:e.querySelector('[role="menuitem"]');null==u||u.focus()}else null===(t=h.current)||void 0===t||t.focus()},[y]);const E=e.createElement(i,null,y&&e.createElement(l.div,{ref:k,role:"menu",className:c,style:{position:"absolute",top:x.top,left:x.left},variants:f,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=k.current)||void 0===t?void 0:t.querySelectorAll('[role="menuitem"]')),r=o.findIndex(e=>e===document.activeElement);let a=-1;"ArrowDown"===e.key?a=(r+1)%o.length:"ArrowUp"===e.key&&(a=(r-1+o.length)%o.length),null===(n=o[a])||void 0===n||n.focus()}}},w.map((t,n)=>{const o=s(0),r=s(0),a=u(o,{stiffness:500,damping:30}),i=u(r,{stiffness:500,damping:30});return e.createElement(l.button,{key:n,role:"menuitem",onClick:()=>{t.onClick&&t.onClick(),_(!1)},variants:g,onMouseMove:e=>{const t=e.currentTarget.getBoundingClientRect();o.set(e.clientX-t.left),r.set(e.clientY-t.top)},onMouseLeave:()=>{},style:{position:"relative",overflow:"hidden"},whileHover:"hover",whileTap:"tap"},e.createElement(l.div,{style:{position:"absolute",left:a,top:i,width:"20px",height:"20px",borderRadius:"50%",backgroundColor:"rgba(0, 0, 0, 0.1)",transform:"translate(-50%, -50%)",pointerEvents:"none",opacity:0},variants:{hover:{opacity:1},tap:{scale:1.2,opacity:.5}},transition:{duration:.1}}),t.content)})));return e.createElement(e.Fragment,null,e.createElement("button",{ref:h,className:`${d} ${b}`,onClick:()=>_(!y),"aria-haspopup":"true","aria-expanded":y},e.createElement(l.div,{whileHover:{scale:1.2}},"⋮"===m?e.createElement(v,{open:y}):e.createElement(l.div,{animate:{rotate:y?90:0},transition:{type:"spring",stiffness:400,damping:40}},m))),p?a.createPortal(E,p):E)};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","React","motion","div","className","styles","span","animate","x","backgroundColor","delay","ease","custom","OverflowMenu","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","
|
|
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","React","motion","div","className","styles","span","animate","x","backgroundColor","delay","ease","custom","OverflowMenu","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuWidth","offsetWidth","menuHeight","offsetHeight","viewportWidth","window","innerWidth","viewportHeight","innerHeight","breakpoint","newTop","bottom","scrollY","newLeft","scrollX","desiredLeft","right","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","mouseX","useMotionValue","mouseY","springX","useSpring","springY","button","onClick","onMouseMove","rect","currentTarget","set","clientX","clientY","onMouseLeave","overflow","whileHover","whileTap","width","height","borderRadius","transform","pointerEvents","hover","tap","scale","content","Fragment","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 #016a80;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})=>e.createElement(n.motion.div,{className:i},e.createElement(n.motion.span,{className:a,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:0,duration:.3,ease:"easeInOut"},custom:0}),e.createElement(n.motion.span,{className:a,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:.1,duration:.3,ease:"easeInOut"},custom:1}),e.createElement(n.motion.span,{className:a,animate:t?{x:[0,4,0],backgroundColor:"#00BCD4"}:{y:[0,-4,0],backgroundColor:"#024b59"},transition:{delay:.2,duration:.3,ease:"easeInOut"},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),[v,b]=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.offsetWidth,o=g.current.offsetHeight,r=window.innerWidth,i=window.innerHeight,a=768;let l=t.bottom+window.scrollY+4,s=0;if(t.bottom+o>i&&(l=t.top+window.scrollY-o-4),r<a)s=(r-n)/2+window.scrollX;else{let e=t.right+window.scrollX-160;s=e+n>r+window.scrollX?t.left+window.scrollX-n:e}b({top:l,left:s});const u=null===(e=g.current)||void 0===e?void 0:e.querySelector('[role="menuitem"]');null==u||u.focus()}else null===(t=f.current)||void 0===t||t.focus()},[m]);const w=e.createElement(n.AnimatePresence,null,m&&e.createElement(n.motion.div,{ref:g,role:"menu",className:r,style:{position:"absolute",top:v.top,left:v.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)=>{const r=n.useMotionValue(0),i=n.useMotionValue(0),a=n.useSpring(r,{stiffness:500,damping:30}),l=n.useSpring(i,{stiffness:500,damping:30});return e.createElement(n.motion.button,{key:o,role:"menuitem",onClick:()=>{t.onClick&&t.onClick(),p(!1)},variants:s,onMouseMove:e=>{const t=e.currentTarget.getBoundingClientRect();r.set(e.clientX-t.left),i.set(e.clientY-t.top)},onMouseLeave:()=>{},style:{position:"relative",overflow:"hidden"},whileHover:"hover",whileTap:"tap"},e.createElement(n.motion.div,{style:{position:"absolute",left:a,top:l,width:"20px",height:"20px",borderRadius:"50%",backgroundColor:"rgba(0, 0, 0, 0.1)",transform:"translate(-50%, -50%)",pointerEvents:"none",opacity:0},variants:{hover:{opacity:1},tap:{scale:1.2,opacity:.5}},transition:{duration:.1}}),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(w,a):w)};
|
|
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","React","motion","div","className","styles","span","animate","x","backgroundColor","delay","ease","custom","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuHeight","offsetHeight","
|
|
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","React","motion","div","className","styles","span","animate","x","backgroundColor","delay","ease","custom","icon","portal","items","setOpen","useState","triggerRef","useRef","menuRef","menuPos","setMenuPos","top","left","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","handleEsc","key","useLayoutEffect","triggerRect","getBoundingClientRect","menuWidth","offsetWidth","menuHeight","offsetHeight","viewportWidth","window","innerWidth","viewportHeight","innerHeight","breakpoint","newTop","bottom","scrollY","newLeft","scrollX","desiredLeft","right","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","mouseX","useMotionValue","mouseY","springX","useSpring","springY","button","onClick","onMouseMove","rect","currentTarget","set","clientX","clientY","onMouseLeave","overflow","whileHover","whileTap","width","height","borderRadius","transform","pointerEvents","hover","tap","scale","content","Fragment","rotate","ReactDOM","createPortal"],"mappings":"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","x_google_ignoreList":[0]}
|
package/package.json
CHANGED