sui-explorer-local

Version:
Local Sui Explorer
16 lines (15 loc) • 2.42 kB
JavaScript
import{j as r}from"./jsx-runtime-ffb262ed.js";import{c as f}from"./clsx-0839fdbe.js";import{m as i}from"./motion-b354e7ba.js";import"./index-76fb7be0.js";import"./_commonjsHelpers-de833af9.js";import"./SVGVisualElement-4900b852.js";const l=.25,x=20,y=e=>({initial:{width:0},animate:{transition:{delay:l,duration:.5,delayChildren:l*8},width:`${e}%`}});function a({progress:e,animate:s}){const o=s&&e>x;return r.jsxs("div",{className:"relative w-full rounded-full bg-success-light",children:[r.jsx(i.div,{variants:y(e),className:f("rounded-full py-1",o?"bg-success":"bg-gradient-to-r from-success via-success/50 to-success"),initial:"initial",animate:"animate"}),o&&r.jsx(i.div,{initial:{left:0},animate:{left:`${Math.floor(e)}%`,opacity:[0,1,0],transition:{delay:1.5,repeatDelay:1,duration:6,repeat:1/0,ease:[.16,1,.3,1]}},className:"absolute top-1/2 z-10 h-0 w-0 -translate-y-1/2 bg-white opacity-0 shadow-glow"})]})}try{a.displayName="ProgressBar",a.__docgenInfo={description:"",displayName:"ProgressBar",props:{progress:{defaultValue:null,description:"",name:"progress",required:!0,type:{name:"number"}},animate:{defaultValue:null,description:"",name:"animate",required:!1,type:{name:"boolean"}}}}}catch{}const A={component:a,parameters:{backgrounds:{default:"gray100",values:[{name:"gray100",value:"#182435"}]}}},t={args:{progress:75},render:e=>r.jsx("div",{className:"flex w-1/2",children:r.jsx(a,{...e})})},n={render:()=>{const e=[5,10,25,50,75,100];return r.jsx("div",{className:"flex w-1/2 flex-col gap-4",children:e.map((s,o)=>r.jsx(a,{progress:s,animate:!0},s))})}};var c,d,m;t.parameters={...t.parameters,docs:{...(c=t.parameters)==null?void 0:c.docs,source:{originalSource:`{
  args: {
    progress: 75
  },
  render: args => <div className="flex w-1/2">
            <ProgressBar {...args} />
        </div>
}`,...(m=(d=t.parameters)==null?void 0:d.docs)==null?void 0:m.source}}};var p,u,g;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`{
  render: () => {
    const progress = [5, 10, 25, 50, 75, 100];
    return <div className="flex w-1/2 flex-col gap-4">
                {progress.map((p, index) => <ProgressBar key={p} progress={p} animate />)}
            </div>;
  }
}`,...(g=(u=n.parameters)==null?void 0:u.docs)==null?void 0:g.source}}};const b=["Default","Animated"];export{n as Animated,t as Default,b as __namedExportsOrder,A as default};