tsm-ui
Version:
### Welcome to TSM-UI: Your Design System for Modern Web Development
8 lines (7 loc) • 1.83 kB
JavaScript
import{s}from"./index.f31275f4.js";import{T as S}from"./index.655ecc4d.js";import{a as p,j as i}from"./jsx-runtime.e41c3930.js";import{B as y}from"./index.bf78a962.js";import"./index.d591fb27.js";import"./_commonjsHelpers.712cc82f.js";import"./index.8dde8ec8.js";const _=s("div",{}),x=s(S,{color:"$colorPurple050",defaultVariants:{size:"xs"}}),h=s("div",{display:"grid",gridTemplateColumns:"repeat(var(--steps-size), 1fr)",gap:"$2",marginTop:"$1"}),v=s("div",{height:"$1",borderRadius:"$px",backgroundColor:"$colorMain030",variants:{active:{true:{backgroundColor:"$colorPurple050"}}}});function a({size:e,currentStep:n=1}){return p(_,{children:[p(x,{children:["Step ",n," of ",e]}),i(h,{css:{"--steps-size":e},children:Array.from({length:e},(o,f)=>f+1).map(o=>i(v,{active:n>=o},o))})]})}a.displayName="MultiStep";try{a.displayName="MultiStep",a.__docgenInfo={description:"",displayName:"MultiStep",props:{size:{defaultValue:null,description:"",name:"size",required:!0,type:{name:"number"}},currentStep:{defaultValue:{value:"1"},description:"",name:"currentStep",required:!1,type:{name:"number"}}}}}catch{}const j={title:"Components/Multi Step",component:a,args:{size:4,currentStep:1},decorators:[e=>i(y,{as:"label",css:{display:"flex",flexDirection:"column",gap:"$2"},children:e()})]},r={args:{}},t={args:{currentStep:4}};var c,l,u;r.parameters={...r.parameters,docs:{...(c=r.parameters)==null?void 0:c.docs,source:{originalSource:`{
args: {}
}`,...(u=(l=r.parameters)==null?void 0:l.docs)==null?void 0:u.source}}};var d,m,g;t.parameters={...t.parameters,docs:{...(d=t.parameters)==null?void 0:d.docs,source:{originalSource:`{
args: {
currentStep: 4
}
}`,...(g=(m=t.parameters)==null?void 0:m.docs)==null?void 0:g.source}}};const N=["Primary","Full"];export{t as Full,r as Primary,N as __namedExportsOrder,j as default};