@liberfi.io/ui-tokens 0.1.21 → 0.1.23

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.d.mts CHANGED
@@ -10,7 +10,7 @@ declare global {
10
10
  };
11
11
  }
12
12
  }
13
- declare const _default: "0.1.21";
13
+ declare const _default: "0.1.23";
14
14
 
15
15
  type SearchTokensButtonProps = {
16
16
  /** callback function when search button is pressed */
package/dist/index.d.ts CHANGED
@@ -10,7 +10,7 @@ declare global {
10
10
  };
11
11
  }
12
12
  }
13
- declare const _default: "0.1.21";
13
+ declare const _default: "0.1.23";
14
14
 
15
15
  type SearchTokensButtonProps = {
16
16
  /** callback function when search button is pressed */
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- 'use strict';var react=require('react'),i18n=require('@liberfi.io/i18n'),ui=require('@liberfi.io/ui'),uiScaffold=require('@liberfi.io/ui-scaffold'),jsxRuntime=require('react/jsx-runtime'),utils=require('@liberfi.io/utils'),hooks=require('@liberfi.io/hooks'),client=require('@liberfi.io/client');typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-tokens"]="0.1.21");var _t="0.1.21";function Ur({onSearch:e,onCancel:t}){let{t:o}=i18n.useTranslation(),{isDesktop:r,isMobile:n}=ui.useScreen(),{onOpen:s,onClose:p}=uiScaffold.useAsyncModal("search_tokens"),i=react.useCallback(()=>{e?e():s();},[e,s]),c=react.useCallback(()=>{t?t():p();},[t,p]);return react.useEffect(()=>{let d=a=>{let m=document.activeElement,l=!!m&&(m.tagName==="INPUT"||m.tagName==="TEXTAREA"||m.getAttribute("contenteditable")==="true");a.key==="/"&&!l&&(a.preventDefault(),i()),a.key==="Escape"&&(a.preventDefault(),c());};return window.addEventListener("keydown",d),()=>{window.removeEventListener("keydown",d);}},[i,c]),jsxRuntime.jsx(ui.StyledButton,{size:"sm",radius:"full",isIconOnly:!r,onPress:i,variant:n?"flat":"bordered",startContent:r?jsxRuntime.jsx(ui.SearchIcon,{}):void 0,endContent:r?jsxRuntime.jsx(ui.Kbd,{className:"min-w-6 justify-center text-xs bg-transparent border border-border rounded-full",children:"/"}):void 0,className:ui.clsx(r&&"pl-3 pr-1.5 text-neutral"),children:r?o("tokens.search.placeholder"):jsxRuntime.jsx(ui.SearchIcon,{})})}function De({token:e,enablePreview:t=true,enableSearch:o=true,showProgress:r=true,showProtocolFamily:n=true,radius:s="sm",className:p,classNames:i}){let c=react.useMemo(()=>e.launchedFrom?.protocolFamily?utils.parseTokenProtocolFamily(e.chain,e.launchedFrom.protocolFamily):void 0,[e.chain,e.launchedFrom?.protocolFamily]),d=react.useMemo(()=>n&&c,[n,c]),a=react.useMemo(()=>r&&e.migrateProgress&&new utils.SafeBigNumber(e.migrateProgress).lt(100),[r,e.migrateProgress]),m=react.useMemo(()=>o&&e.image,[o,e.image]),l=react.useMemo(()=>(e.symbol??e.name??e.address??"L").slice(0,1).toUpperCase(),[e.symbol,e.name,e.address]),[k,h]=react.useState(false),w=react.useCallback(()=>{h(true);},[]),C=react.useCallback(()=>{h(false);},[]),T=react.useCallback(E=>{if(E.stopPropagation(),!e.image)return;let q=utils.searchImageUrl(e.image);window.open(q,"_blank");},[e.image]);return jsxRuntime.jsxs("div",{className:ui.clsx("relative justify-center items-center",p??"w-15 h-15"),children:[!a&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0",`rounded-${s}`,c?`bg-${c}`:"bg-bullish",i?.background)}),a&&jsxRuntime.jsx("div",{className:ui.clsx("absolute -inset-0.5",`rounded-${s}`),children:jsxRuntime.jsx(so,{className:ui.clsx(c?`text-${c}`:"text-bullish",i?.progress),progress:e.migrateProgress??"0"})}),jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 p-px flex items-center justify-center",`rounded-${s}`,c?`bg-${c}/20`:"bg-bullish/20",i?.avatarWrapper),children:jsxRuntime.jsx(to,{token:e,radius:s,enableSearch:o,enablePreview:t,classNames:i,children:jsxRuntime.jsxs("div",{className:ui.clsx("relative w-full h-full bg-content1 flex items-center justify-center p-0.5",`rounded-${s}`,k&&m&&"cursor-pointer"),onMouseEnter:w,onMouseLeave:C,children:[jsxRuntime.jsx(ui.Avatar,{showFallback:true,src:e.image,name:l,className:ui.clsx("w-full h-full bg-content1 text-neutral text-2xl",`rounded-${s}`,i?.avatar)}),k&&m&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 bg-content1/80 flex items-center justify-center",`rounded-${s}`,i?.searchWrapper),onClick:T,children:jsxRuntime.jsx(ui.CameraIcon,{className:ui.clsx("w-6 h-6",i?.searchIcon)})})]})})}),d&&jsxRuntime.jsx("div",{className:"contents",children:jsxRuntime.jsx(ui.StyledTooltip,{content:e.launchedFrom?.protocolFamily??c,placement:"bottom",closeDelay:0,children:jsxRuntime.jsx("div",{className:ui.clsx("absolute -bottom-1 -right-1 rounded-full p-px w-4 h-4",`bg-${c}`,i?.protocolFamilyIconWrapper),children:jsxRuntime.jsx(ui.Image,{removeWrapper:true,src:`/images/protocols/${c}.svg`,className:ui.clsx("w-full h-full rounded-full bg-content1",i?.protocolFamilyIcon)})})})})]})}function to({token:e,radius:t,enableSearch:o,enablePreview:r,classNames:n,children:s}){return react.useMemo(()=>r&&e.image,[r,e.image])?jsxRuntime.jsx(ui.StyledTooltip,{content:jsxRuntime.jsx(oo,{token:e,radius:t,enableSearch:o,classNames:n}),closeDelay:100,placement:"bottom-start",classNames:{content:"p-1"},children:s}):s}function oo({token:e,enableSearch:t,radius:o,classNames:r}){let n=react.useMemo(()=>t&&e.image,[t,e.image]),s=react.useMemo(()=>(e.symbol??e.name??e.address??"L").slice(0,1).toUpperCase(),[e.symbol,e.name,e.address]),[p,i]=react.useState(false),c=react.useCallback(()=>{i(true);},[]),d=react.useCallback(()=>{i(false);},[]),a=react.useCallback(m=>{if(m.stopPropagation(),!e.image)return;let l=utils.searchImageUrl(e.image);window.open(l,"_blank");},[e.image]);return jsxRuntime.jsxs("div",{className:ui.clsx("relative flex items-center justify-center w-60 h-60",`rounded-${o}`,p&&n&&"cursor-pointer",r?.previewWrapper),onMouseEnter:c,onMouseLeave:d,children:[jsxRuntime.jsx(ui.Avatar,{showFallback:true,src:e.image,name:s,className:ui.clsx("w-full h-full bg-content1 text-neutral text-3xl",`rounded-${o}`,r?.previewAvatar)}),p&&n&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 bg-content1/80 flex items-center justify-center",`rounded-${o}`,r?.previewSearchWrapper),onClick:a,children:jsxRuntime.jsx(ui.CameraIcon,{className:ui.clsx("w-10 h-10",r?.previewSearchIcon)})})]})}function so({progress:e,className:t}){let o=react.useMemo(()=>296-Number(e)*296/100,[e]);return jsxRuntime.jsxs("svg",{viewBox:"0 0 78 78",className:"w-full h-full",children:[jsxRuntime.jsx("path",{className:`${t} opacity-40`,stroke:"currentColor",fill:"transparent",strokeWidth:"1",d:`
1
+ 'use strict';var react=require('react'),i18n=require('@liberfi.io/i18n'),ui=require('@liberfi.io/ui'),uiScaffold=require('@liberfi.io/ui-scaffold'),jsxRuntime=require('react/jsx-runtime'),utils=require('@liberfi.io/utils'),hooks=require('@liberfi.io/hooks'),client=require('@liberfi.io/client');typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-tokens"]="0.1.23");var _t="0.1.23";function Ur({onSearch:e,onCancel:t}){let{t:o}=i18n.useTranslation(),{isDesktop:r,isMobile:n}=ui.useScreen(),{onOpen:s,onClose:p}=uiScaffold.useAsyncModal("search_tokens"),i=react.useCallback(()=>{e?e():s();},[e,s]),c=react.useCallback(()=>{t?t():p();},[t,p]);return react.useEffect(()=>{let d=a=>{let m=document.activeElement,l=!!m&&(m.tagName==="INPUT"||m.tagName==="TEXTAREA"||m.getAttribute("contenteditable")==="true");a.key==="/"&&!l&&(a.preventDefault(),i()),a.key==="Escape"&&(a.preventDefault(),c());};return window.addEventListener("keydown",d),()=>{window.removeEventListener("keydown",d);}},[i,c]),jsxRuntime.jsx(ui.StyledButton,{size:"sm",radius:"full",isIconOnly:!r,onPress:i,variant:n?"flat":"bordered",startContent:r?jsxRuntime.jsx(ui.SearchIcon,{}):void 0,endContent:r?jsxRuntime.jsx(ui.Kbd,{className:"min-w-6 justify-center text-xs bg-transparent border border-border rounded-full",children:"/"}):void 0,className:ui.clsx(r&&"pl-3 pr-1.5 text-neutral"),children:r?o("tokens.search.placeholder"):jsxRuntime.jsx(ui.SearchIcon,{})})}function De({token:e,enablePreview:t=true,enableSearch:o=true,showProgress:r=true,showProtocolFamily:n=true,radius:s="sm",className:p,classNames:i}){let c=react.useMemo(()=>e.launchedFrom?.protocolFamily?utils.parseTokenProtocolFamily(e.chain,e.launchedFrom.protocolFamily):void 0,[e.chain,e.launchedFrom?.protocolFamily]),d=react.useMemo(()=>n&&c,[n,c]),a=react.useMemo(()=>r&&e.migrateProgress&&new utils.SafeBigNumber(e.migrateProgress).lt(100),[r,e.migrateProgress]),m=react.useMemo(()=>o&&e.image,[o,e.image]),l=react.useMemo(()=>(e.symbol??e.name??e.address??"L").slice(0,1).toUpperCase(),[e.symbol,e.name,e.address]),[k,h]=react.useState(false),w=react.useCallback(()=>{h(true);},[]),C=react.useCallback(()=>{h(false);},[]),T=react.useCallback(E=>{if(E.stopPropagation(),!e.image)return;let q=utils.searchImageUrl(e.image);window.open(q,"_blank");},[e.image]);return jsxRuntime.jsxs("div",{className:ui.clsx("relative justify-center items-center",p??"w-15 h-15"),children:[!a&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0",`rounded-${s}`,c?`bg-${c}`:"bg-bullish",i?.background)}),a&&jsxRuntime.jsx("div",{className:ui.clsx("absolute -inset-0.5",`rounded-${s}`),children:jsxRuntime.jsx(so,{className:ui.clsx(c?`text-${c}`:"text-bullish",i?.progress),progress:e.migrateProgress??"0"})}),jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 p-px flex items-center justify-center",`rounded-${s}`,c?`bg-${c}/20`:"bg-bullish/20",i?.avatarWrapper),children:jsxRuntime.jsx(to,{token:e,radius:s,enableSearch:o,enablePreview:t,classNames:i,children:jsxRuntime.jsxs("div",{className:ui.clsx("relative w-full h-full bg-content1 flex items-center justify-center p-0.5",`rounded-${s}`,k&&m&&"cursor-pointer"),onMouseEnter:w,onMouseLeave:C,children:[jsxRuntime.jsx(ui.Avatar,{showFallback:true,src:e.image,name:l,className:ui.clsx("w-full h-full bg-content1 text-neutral text-2xl",`rounded-${s}`,i?.avatar)}),k&&m&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 bg-content1/80 flex items-center justify-center",`rounded-${s}`,i?.searchWrapper),onClick:T,children:jsxRuntime.jsx(ui.CameraIcon,{className:ui.clsx("w-6 h-6",i?.searchIcon)})})]})})}),d&&jsxRuntime.jsx("div",{className:"contents",children:jsxRuntime.jsx(ui.StyledTooltip,{content:e.launchedFrom?.protocolFamily??c,placement:"bottom",closeDelay:0,children:jsxRuntime.jsx("div",{className:ui.clsx("absolute -bottom-1 -right-1 rounded-full p-px w-4 h-4",`bg-${c}`,i?.protocolFamilyIconWrapper),children:jsxRuntime.jsx(ui.Image,{removeWrapper:true,src:`/images/protocols/${c}.svg`,className:ui.clsx("w-full h-full rounded-full bg-content1",i?.protocolFamilyIcon)})})})})]})}function to({token:e,radius:t,enableSearch:o,enablePreview:r,classNames:n,children:s}){return react.useMemo(()=>r&&e.image,[r,e.image])?jsxRuntime.jsx(ui.StyledTooltip,{content:jsxRuntime.jsx(oo,{token:e,radius:t,enableSearch:o,classNames:n}),closeDelay:100,placement:"bottom-start",classNames:{content:"p-1"},children:s}):s}function oo({token:e,enableSearch:t,radius:o,classNames:r}){let n=react.useMemo(()=>t&&e.image,[t,e.image]),s=react.useMemo(()=>(e.symbol??e.name??e.address??"L").slice(0,1).toUpperCase(),[e.symbol,e.name,e.address]),[p,i]=react.useState(false),c=react.useCallback(()=>{i(true);},[]),d=react.useCallback(()=>{i(false);},[]),a=react.useCallback(m=>{if(m.stopPropagation(),!e.image)return;let l=utils.searchImageUrl(e.image);window.open(l,"_blank");},[e.image]);return jsxRuntime.jsxs("div",{className:ui.clsx("relative flex items-center justify-center w-60 h-60",`rounded-${o}`,p&&n&&"cursor-pointer",r?.previewWrapper),onMouseEnter:c,onMouseLeave:d,children:[jsxRuntime.jsx(ui.Avatar,{showFallback:true,src:e.image,name:s,className:ui.clsx("w-full h-full bg-content1 text-neutral text-3xl",`rounded-${o}`,r?.previewAvatar)}),p&&n&&jsxRuntime.jsx("div",{className:ui.clsx("absolute inset-0 bg-content1/80 flex items-center justify-center",`rounded-${o}`,r?.previewSearchWrapper),onClick:a,children:jsxRuntime.jsx(ui.CameraIcon,{className:ui.clsx("w-10 h-10",r?.previewSearchIcon)})})]})}function so({progress:e,className:t}){let o=react.useMemo(()=>296-Number(e)*296/100,[e]);return jsxRuntime.jsxs("svg",{viewBox:"0 0 78 78",className:"w-full h-full",children:[jsxRuntime.jsx("path",{className:`${t} opacity-40`,stroke:"currentColor",fill:"transparent",strokeWidth:"1",d:`
2
2
  M 76 76
3
3
  L 6 76
4
4
  Q 2 76 2 72