jattac.libs.web.overflow-menu 0.0.19 → 0.0.21
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/UI/OverflowMenu.d.ts +7 -7
- 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
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React
|
|
2
|
-
import IOverflowMenuItem from '../Data/IOverflowMenuItem';
|
|
3
|
-
interface
|
|
4
|
-
icon?: ReactNode;
|
|
5
|
-
portal?: HTMLElement;
|
|
6
|
-
className?: string;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { IOverflowMenuItem } from '../Data/IOverflowMenuItem';
|
|
3
|
+
interface OverflowMenuProps {
|
|
7
4
|
items: IOverflowMenuItem[];
|
|
5
|
+
icon?: React.ReactNode;
|
|
6
|
+
className?: string;
|
|
7
|
+
portal?: HTMLElement;
|
|
8
8
|
}
|
|
9
|
-
declare const OverflowMenu: React.FC<
|
|
9
|
+
declare const OverflowMenu: React.FC<OverflowMenuProps>;
|
|
10
10
|
export default OverflowMenu;
|
package/dist/index.es.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{useState as
|
|
1
|
+
import e,{useState as o,useRef as n,useEffect as r}from"react";import{AnimatePresence as t,motion as a}from"framer-motion";import{createPortal as i}from"react-dom";var l={trigger:"OverflowMenu-module_trigger__imdPK",menu:"OverflowMenu-module_menu__n8uKD"};!function(e,o){void 0===o&&(o={});var n=o.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css","top"===n&&r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.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%;width:max-content;z-index:9999}.OverflowMenu-module_menu__n8uKD button{background:transparent;border:none;border-bottom:1px solid rgba(2,75,89,.1);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:last-child{border-bottom: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 d=({items:d,icon:u="⋮",className:s="",portal:m=null})=>{const[c,p]=o(!1),[f,b]=o(!0),g=n(null),_=n(null);r(()=>{b(!1)},[]);const v=e=>{g.current&&!g.current.contains(e.target)&&p(!1)};r(()=>(c?document.addEventListener("mousedown",v):document.removeEventListener("mousedown",v),()=>{document.removeEventListener("mousedown",v)}),[c]);const h={hidden:{opacity:0,y:-10},visible:{opacity:1,y:0}},x=e.createElement(t,null,c&&e.createElement(a.div,{ref:g,className:l.menu,variants:{hidden:{opacity:0,scale:.95,transition:{duration:.1}},visible:{opacity:1,scale:1,transition:{duration:.2,staggerChildren:.05}}},initial:!f&&"hidden",animate:"visible",exit:"hidden"},d.map((o,n)=>e.createElement(a.button,{key:n,className:l.menuItem,onClick:()=>{var e;null===(e=o.onClick)||void 0===e||e.call(o),p(!1)},variants:h},o.content))));return e.createElement("div",{className:l.overflowMenu},e.createElement("button",{ref:_,onClick:e=>{e.stopPropagation(),p(!c)},className:`${l.trigger} ${s}`,"aria-haspopup":"true","aria-expanded":c},u),m?i(x,m):x)};export{d 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","
|
|
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","OverflowMenu","items","icon","className","portal","isOpen","setIsOpen","useState","isInitialRender","setIsInitialRender","menuRef","useRef","triggerRef","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","itemVariants","hidden","opacity","y","visible","menuContent","React","AnimatePresence","motion","div","styles","menu","variants","scale","transition","duration","staggerChildren","initial","animate","exit","map","item","index","button","key","menuItem","onClick","_a","call","content","overflowMenu","stopPropagation","trigger","createPortal"],"mappings":"iQAAA,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,gxDCZA,MAAMe,EAA4C,EAC9CC,QACAC,OAAO,IACPC,YAAY,GACZC,SAAS,SAET,MAAOC,EAAQC,GAAaC,GAAS,IAC9BC,EAAiBC,GAAsBF,GAAS,GACjDG,EAAUC,EAAuB,MACjCC,EAAaD,EAA0B,MAE7CE,EAAU,KACNJ,GAAmB,IACpB,IAEH,MAKMK,EAAsBC,IACpBL,EAAQM,UAAYN,EAAQM,QAAQC,SAASF,EAAMG,SACnDZ,GAAU,IAIlBO,EAAU,KACFR,EACAjB,SAAS+B,iBAAiB,YAAaL,GAEvC1B,SAASgC,oBAAoB,YAAaN,GAGvC,KACH1B,SAASgC,oBAAoB,YAAaN,KAE/C,CAACT,IAEJ,MAkBMgB,EAAe,CACjBC,OAAQ,CAAEC,QAAS,EAAGC,GAAG,IACzBC,QAAS,CAAEF,QAAS,EAAGC,EAAG,IAGxBE,EACFC,EAAAnC,cAACoC,OACIvB,GACGsB,EAAAnC,cAACqC,EAAOC,IAAG,CACP5C,IAAKwB,EACLP,UAAW4B,EAAOC,KAClBC,SA7BK,CACjBX,OAAQ,CACJC,QAAS,EACTW,MAAO,IACPC,WAAY,CACRC,SAAU,KAGlBX,QAAS,CACLF,QAAS,EACTW,MAAO,EACPC,WAAY,CACRC,SAAU,GACVC,gBAAiB,OAiBbC,SAAS9B,GAA0B,SACnC+B,QAAQ,UACRC,KAAK,UAEJvC,EAAMwC,IAAI,CAACC,EAAMC,IACdhB,EAAAnC,cAACqC,EAAOe,OAAM,CACVC,IAAKF,EACLxC,UAAW4B,EAAOe,SAClBC,QAAS,WACO,QAAZC,EAAAN,EAAKK,eAAO,IAAAC,GAAAA,EAAAC,KAAAP,GACZpC,GAAU,IAEd2B,SAAUZ,GAETqB,EAAKQ,YAQ9B,OACIvB,EAAAnC,cAAA,MAAA,CAAKW,UAAW4B,EAAOoB,cACnBxB,EAAAnC,cAAA,SAAA,CACIN,IAAK0B,EACLmC,QA/EQhC,IAChBA,EAAMqC,kBACN9C,GAAWD,IA8EHF,UAAW,GAAG4B,EAAOsB,WAAWlD,IAAW,gBAC7B,OAAM,gBACLE,GAEdH,GAEJE,EAASkD,EAAa5B,EAAatB,GAAUsB","x_google_ignoreList":[0]}
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react"),
|
|
1
|
+
"use strict";var e=require("react"),r=require("framer-motion"),n=require("react-dom");var o={trigger:"OverflowMenu-module_trigger__imdPK",menu:"OverflowMenu-module_menu__n8uKD"};!function(e,r){void 0===r&&(r={});var n=r.insertAt;if("undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css","top"===n&&o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.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%;width:max-content;z-index:9999}.OverflowMenu-module_menu__n8uKD button{background:transparent;border:none;border-bottom:1px solid rgba(2,75,89,.1);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:last-child{border-bottom: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}");module.exports=({items:t,icon:a="⋮",className:i="",portal:l=null})=>{const[u,d]=e.useState(!1),[s,c]=e.useState(!0),m=e.useRef(null),p=e.useRef(null);e.useEffect(()=>{c(!1)},[]);const f=e=>{m.current&&!m.current.contains(e.target)&&d(!1)};e.useEffect(()=>(u?document.addEventListener("mousedown",f):document.removeEventListener("mousedown",f),()=>{document.removeEventListener("mousedown",f)}),[u]);const b={hidden:{opacity:0,y:-10},visible:{opacity:1,y:0}},g=e.createElement(r.AnimatePresence,null,u&&e.createElement(r.motion.div,{ref:m,className:o.menu,variants:{hidden:{opacity:0,scale:.95,transition:{duration:.1}},visible:{opacity:1,scale:1,transition:{duration:.2,staggerChildren:.05}}},initial:!s&&"hidden",animate:"visible",exit:"hidden"},t.map((n,t)=>e.createElement(r.motion.button,{key:t,className:o.menuItem,onClick:()=>{var e;null===(e=n.onClick)||void 0===e||e.call(n),d(!1)},variants:b},n.content))));return e.createElement("div",{className:o.overflowMenu},e.createElement("button",{ref:p,onClick:e=>{e.stopPropagation(),d(!u)},className:`${o.trigger} ${i}`,"aria-haspopup":"true","aria-expanded":u},a),l?n.createPortal(g,l):g)};
|
|
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","
|
|
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","items","icon","className","portal","isOpen","setIsOpen","useState","isInitialRender","setIsInitialRender","menuRef","useRef","triggerRef","useEffect","handleClickOutside","event","current","contains","target","addEventListener","removeEventListener","itemVariants","hidden","opacity","y","visible","menuContent","React","AnimatePresence","motion","div","styles","menu","variants","scale","transition","duration","staggerChildren","initial","animate","exit","map","item","index","button","key","menuItem","onClick","_a","call","content","overflowMenu","stopPropagation","trigger","createPortal"],"mappings":"mLAAA,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,+xDCZkD,EAC9Ce,QACAC,OAAO,IACPC,YAAY,GACZC,SAAS,SAET,MAAOC,EAAQC,GAAaC,EAAAA,UAAS,IAC9BC,EAAiBC,GAAsBF,EAAAA,UAAS,GACjDG,EAAUC,EAAAA,OAAuB,MACjCC,EAAaD,EAAAA,OAA0B,MAE7CE,EAAAA,UAAU,KACNJ,GAAmB,IACpB,IAEH,MAKMK,EAAsBC,IACpBL,EAAQM,UAAYN,EAAQM,QAAQC,SAASF,EAAMG,SACnDZ,GAAU,IAIlBO,EAAAA,UAAU,KACFR,EACAhB,SAAS8B,iBAAiB,YAAaL,GAEvCzB,SAAS+B,oBAAoB,YAAaN,GAGvC,KACHzB,SAAS+B,oBAAoB,YAAaN,KAE/C,CAACT,IAEJ,MAkBMgB,EAAe,CACjBC,OAAQ,CAAEC,QAAS,EAAGC,GAAG,IACzBC,QAAS,CAAEF,QAAS,EAAGC,EAAG,IAGxBE,EACFC,EAAAlC,cAACmC,EAAAA,qBACIvB,GACGsB,EAAAlC,cAACoC,EAAAA,OAAOC,IAAG,CACP3C,IAAKuB,EACLP,UAAW4B,EAAOC,KAClBC,SA7BK,CACjBX,OAAQ,CACJC,QAAS,EACTW,MAAO,IACPC,WAAY,CACRC,SAAU,KAGlBX,QAAS,CACLF,QAAS,EACTW,MAAO,EACPC,WAAY,CACRC,SAAU,GACVC,gBAAiB,OAiBbC,SAAS9B,GAA0B,SACnC+B,QAAQ,UACRC,KAAK,UAEJvC,EAAMwC,IAAI,CAACC,EAAMC,IACdhB,EAAAlC,cAACoC,EAAAA,OAAOe,OAAM,CACVC,IAAKF,EACLxC,UAAW4B,EAAOe,SAClBC,QAAS,WACO,QAAZC,EAAAN,EAAKK,eAAO,IAAAC,GAAAA,EAAAC,KAAAP,GACZpC,GAAU,IAEd2B,SAAUZ,GAETqB,EAAKQ,YAQ9B,OACIvB,EAAAlC,cAAA,MAAA,CAAKU,UAAW4B,EAAOoB,cACnBxB,EAAAlC,cAAA,SAAA,CACIN,IAAKyB,EACLmC,QA/EQhC,IAChBA,EAAMqC,kBACN9C,GAAWD,IA8EHF,UAAW,GAAG4B,EAAOsB,WAAWlD,IAAW,gBAC7B,OAAM,gBACLE,GAEdH,GAEJE,EAASkD,EAAAA,aAAa5B,EAAatB,GAAUsB","x_google_ignoreList":[0]}
|
package/package.json
CHANGED