vue-devui 1.0.0-rc.8 → 1.0.1

package/statistic/index.es.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { defineComponent, ref, computed, onMounted, watch, createVNode, mergeProps, createTextVNode } from "vue";
+import { defineComponent, ref, computed, onMounted, watch, createVNode, createTextVNode } from "vue";
 const statisticProps = {
   title: {
     type: String,
@@ -26,9 +26,6 @@ const statisticProps = {
     type: String,
     default: ""
   },
-  valueStyle: {
-    type: Object
-  },
   animationDuration: {
     type: Number,
     default: 2e3
@@ -179,15 +176,38 @@ class Tween {
     this.timer = null;
   }
 }
+function createBem(namespace, element, modifier) {
+  let cls = namespace;
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+}
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
+  const b = () => createBem(namespace);
+  const e = (element) => element ? createBem(namespace, element) : "";
+  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
+  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
+  return {
+    b,
+    e,
+    m,
+    em
+  };
+}
 var statistic = "";
 var Statistic = defineComponent({
   name: "DStatistic",
-  inheritAttrs: false,
   props: statisticProps,
   setup(props, ctx) {
     var _a;
     const innerValue = ref((_a = props.valueFrom) != null ? _a : props.value);
     const tween = ref(null);
+    const ns = useNamespace("statistic");
     const animation = (from = ((_b) => (_b = props.valueFrom) != null ? _b : 0)(), to = typeof props.value === "number" ? props.value : Number(props.value)) => {
       if (from !== to) {
         tween.value = new Tween({
@@ -225,22 +245,20 @@ var Statistic = defineComponent({
     });
     return () => {
       var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
-      return createVNode("div", mergeProps({
-        "class": "devui-statistic"
-      }, ctx.attrs), [createVNode("div", {
-        "class": "devui-statistic-title",
-        "style": props.titleStyle
+      return createVNode("div", {
+        "class": ns.b()
+      }, [createVNode("div", {
+        "class": ns.e("title")
       }, [((_b = (_a2 = ctx.slots).title) == null ? void 0 : _b.call(_a2)) || props.title]), createVNode("div", {
-        "class": "devui-statistic-content",
-        "style": props.valueStyle
+        "class": ns.e("content")
       }, [props.prefix || ((_d = (_c = ctx.slots).prefix) == null ? void 0 : _d.call(_c)) ? createVNode("span", {
-        "class": "devui-statistic-prefix"
+        "class": ns.e("prefix")
       }, [((_f = (_e = ctx.slots).prefix) == null ? void 0 : _f.call(_e)) || props.prefix]) : null, createVNode("span", {
-        "class": "devui-statistic--value"
+        "class": ns.e("value")
       }, [statisticValue.value]), props.suffix || ((_h = (_g = ctx.slots).suffix) == null ? void 0 : _h.call(_g)) ? createVNode("span", {
-        "class": "devui-statistic-suffix"
+        "class": ns.e("suffix")
       }, [((_j = (_i = ctx.slots).suffix) == null ? void 0 : _j.call(_i)) || props.suffix]) : null]), props.extra || ((_l = (_k = ctx.slots).extra) == null ? void 0 : _l.call(_k)) ? createVNode("div", {
-        "class": "devui-statistic-extra"
+        "class": ns.e("extra")
       }, [createTextVNode(" "), ((_n = (_m = ctx.slots).extra) == null ? void 0 : _n.call(_m)) || props.extra]) : null]);
     };
   }

package/statistic/index.umd.js

@@ -1 +1 @@
-var q=Object.defineProperty;var j=(s,i,d)=>i in s?q(s,i,{enumerable:!0,configurable:!0,writable:!0,value:d}):s[i]=d;var a=(s,i,d)=>(j(s,typeof i!="symbol"?i+"":i,d),d);(function(s,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(s=typeof globalThis!="undefined"?globalThis:s||self,i(s.index={},s.Vue))})(this,function(s,i){"use strict";const d={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},valueStyle:{type:Object},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!0},extra:{type:String,default:""}},m=(t,e)=>t.replace(/\d+/,function(n){return n.replace(/(\d)(?=(\d{3})+$)/g,function(f){return f+`${e}`})}),E=t=>isNaN(t)?!1:(t+"").indexOf(".")!==-1,A=(t,e,r,n)=>{const f=(e==null?void 0:e.toString().indexOf("."))!==-1?(e==null?void 0:e.toString().length)-(e==null?void 0:e.toString().indexOf("."))-1:0;return typeof t=="number"?E(t)?m(n?t.toFixed(n).toString():t.toFixed(f).toString(),r):m(n?t.toFixed(n).toString():t.toString(),r):t},c=Math.pow,v=Math.sqrt;var I={easeOutCubic:function(t){return 1-c(1-t,3)},linear:t=>t,easeOutExpo:function(t){return t===1?1:1-c(2,-10*t)},easeInOutExpo:function(t){return t===0?0:t===1?1:t<.5?c(2,20*t-10)/2:(2-c(2,-20*t+10))/2},easeInExpo:function(t){return t===0?0:c(2,10*t-10)},easeInOutCirc:function(t){return t<.5?(1-v(1-c(2*t,2)))/2:(v(1-c(-2*t+2,2))+1)/2}};class M{constructor(e){a(this,"from");a(this,"to");a(this,"duration");a(this,"delay");a(this,"easing");a(this,"onStart");a(this,"onUpdate");a(this,"onFinish");a(this,"startTime");a(this,"started");a(this,"finished");a(this,"timer");a(this,"time");a(this,"elapsed");a(this,"keys");const{from:r,to:n,duration:f,delay:g,easing:y,onStart:u,onUpdate:l,onFinish:h}=e;for(const o in r)n[o]===void 0&&(n[o]=r[o]);for(const o in n)r[o]===void 0&&(r[o]=n[o]);this.from=r,this.to=n,this.duration=f,this.delay=g,this.easing=y,this.onStart=u,this.onUpdate=l,this.onFinish=h,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const e in this.to)this.keys[e]=this.from[e]+(this.to[e]-this.from[e])*I[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const e=()=>{this.update(),this.timer=requestAnimationFrame(e),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};e()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}var G="",S=i.defineComponent({name:"DStatistic",inheritAttrs:!1,props:d,setup(t,e){var y;const r=i.ref((y=t.valueFrom)!=null?y:t.value),n=i.ref(null),f=(u=(h=>(h=t.valueFrom)!=null?h:0)(),l=typeof t.value=="number"?t.value:Number(t.value))=>{u!==l&&(n.value=new M({from:{value:u},to:{value:l},delay:0,duration:t.animationDuration,easing:"easeOutCubic",onUpdate:o=>{r.value=o.value},onFinish:()=>{r.value=l}}),n.value.start())},g=i.computed(()=>A(r.value,t.value,t.groupSeparator,t.precision));return i.onMounted(()=>{t.animation&&t.start&&f()}),i.watch(()=>t.start,u=>{u&&!n.value&&f()}),()=>{var u,l,h,o,x,F,O,N,b,T,k,w,C,D;return i.createVNode("div",i.mergeProps({class:"devui-statistic"},e.attrs),[i.createVNode("div",{class:"devui-statistic-title",style:t.titleStyle},[((l=(u=e.slots).title)==null?void 0:l.call(u))||t.title]),i.createVNode("div",{class:"devui-statistic-content",style:t.valueStyle},[t.prefix||((o=(h=e.slots).prefix)==null?void 0:o.call(h))?i.createVNode("span",{class:"devui-statistic-prefix"},[((F=(x=e.slots).prefix)==null?void 0:F.call(x))||t.prefix]):null,i.createVNode("span",{class:"devui-statistic--value"},[g.value]),t.suffix||((N=(O=e.slots).suffix)==null?void 0:N.call(O))?i.createVNode("span",{class:"devui-statistic-suffix"},[((T=(b=e.slots).suffix)==null?void 0:T.call(b))||t.suffix]):null]),t.extra||((w=(k=e.slots).extra)==null?void 0:w.call(k))?i.createVNode("div",{class:"devui-statistic-extra"},[i.createTextVNode(" "),((D=(C=e.slots).extra)==null?void 0:D.call(C))||t.extra]):null])}}}),U={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.component(S.name,S)}};s.Statistic=S,s.default=U,s.statisticProps=d,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
+var _=Object.defineProperty;var j=(a,i,c)=>i in a?_(a,i,{enumerable:!0,configurable:!0,writable:!0,value:c}):a[i]=c;var r=(a,i,c)=>(j(a,typeof i!="symbol"?i+"":i,c),c);(function(a,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(a=typeof globalThis!="undefined"?globalThis:a||self,i(a.index={},a.Vue))})(this,function(a,i){"use strict";const c={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!0},extra:{type:String,default:""}},y=(t,e)=>t.replace(/\d+/,function(s){return s.replace(/(\d)(?=(\d{3})+$)/g,function(o){return o+`${e}`})}),$=t=>isNaN(t)?!1:(t+"").indexOf(".")!==-1,A=(t,e,n,s)=>{const o=(e==null?void 0:e.toString().indexOf("."))!==-1?(e==null?void 0:e.toString().length)-(e==null?void 0:e.toString().indexOf("."))-1:0;return typeof t=="number"?$(t)?y(s?t.toFixed(s).toString():t.toFixed(o).toString(),n):y(s?t.toFixed(s).toString():t.toString(),n):t},l=Math.pow,v=Math.sqrt;var M={easeOutCubic:function(t){return 1-l(1-t,3)},linear:t=>t,easeOutExpo:function(t){return t===1?1:1-l(2,-10*t)},easeInOutExpo:function(t){return t===0?0:t===1?1:t<.5?l(2,20*t-10)/2:(2-l(2,-20*t+10))/2},easeInExpo:function(t){return t===0?0:l(2,10*t-10)},easeInOutCirc:function(t){return t<.5?(1-v(1-l(2*t,2)))/2:(v(1-l(-2*t+2,2))+1)/2}};class U{constructor(e){r(this,"from");r(this,"to");r(this,"duration");r(this,"delay");r(this,"easing");r(this,"onStart");r(this,"onUpdate");r(this,"onFinish");r(this,"startTime");r(this,"started");r(this,"finished");r(this,"timer");r(this,"time");r(this,"elapsed");r(this,"keys");const{from:n,to:s,duration:o,delay:m,easing:S,onStart:u,onUpdate:f,onFinish:h}=e;for(const d in n)s[d]===void 0&&(s[d]=n[d]);for(const d in s)n[d]===void 0&&(n[d]=s[d]);this.from=n,this.to=s,this.duration=o,this.delay=m,this.easing=S,this.onStart=u,this.onUpdate=f,this.onFinish=h,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const e in this.to)this.keys[e]=this.from[e]+(this.to[e]-this.from[e])*M[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const e=()=>{this.update(),this.timer=requestAnimationFrame(e),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};e()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}function g(t,e,n){let s=t;return e&&(s+=`__${e}`),n&&(s+=`--${n}`),s}function q(t,e=!1){const n=e?`.devui-${t}`:`devui-${t}`;return{b:()=>g(n),e:u=>u?g(n,u):"",m:u=>u?g(n,"",u):"",em:(u,f)=>u&&f?g(n,u,f):""}}var P="",F=i.defineComponent({name:"DStatistic",props:c,setup(t,e){var u;const n=i.ref((u=t.valueFrom)!=null?u:t.value),s=i.ref(null),o=q("statistic"),m=(f=(d=>(d=t.valueFrom)!=null?d:0)(),h=typeof t.value=="number"?t.value:Number(t.value))=>{f!==h&&(s.value=new U({from:{value:f},to:{value:h},delay:0,duration:t.animationDuration,easing:"easeOutCubic",onUpdate:x=>{n.value=x.value},onFinish:()=>{n.value=h}}),s.value.start())},S=i.computed(()=>A(n.value,t.value,t.groupSeparator,t.precision));return i.onMounted(()=>{t.animation&&t.start&&m()}),i.watch(()=>t.start,f=>{f&&!s.value&&m()}),()=>{var f,h,d,x,N,O,b,T,k,w,C,D,E,I;return i.createVNode("div",{class:o.b()},[i.createVNode("div",{class:o.e("title")},[((h=(f=e.slots).title)==null?void 0:h.call(f))||t.title]),i.createVNode("div",{class:o.e("content")},[t.prefix||((x=(d=e.slots).prefix)==null?void 0:x.call(d))?i.createVNode("span",{class:o.e("prefix")},[((O=(N=e.slots).prefix)==null?void 0:O.call(N))||t.prefix]):null,i.createVNode("span",{class:o.e("value")},[S.value]),t.suffix||((T=(b=e.slots).suffix)==null?void 0:T.call(b))?i.createVNode("span",{class:o.e("suffix")},[((w=(k=e.slots).suffix)==null?void 0:w.call(k))||t.suffix]):null]),t.extra||((D=(C=e.slots).extra)==null?void 0:D.call(C))?i.createVNode("div",{class:o.e("extra")},[i.createTextVNode(" "),((I=(E=e.slots).extra)==null?void 0:I.call(E))||t.extra]):null])}}}),B={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.component(F.name,F)}};a.Statistic=F,a.default=B,a.statisticProps=c,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});

package/statistic/style.css

@@ -1 +1 @@
-.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;font-size:14px}.devui-statistic-content{font-size:24px;display:flex;align-items:center}.devui-statistic-prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic-suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic--value{display:inline-block}
+.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic__title{margin-bottom:4px;font-size:14px}.devui-statistic__content{font-size:24px;display:flex;align-items:center}.devui-statistic__prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic__suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic__value{display:inline-block}

package/status/index.es.js

@@ -9,8 +9,8 @@ function createBem(namespace, element, modifier) {
   }
   return cls;
 }
-function useNamespace(block) {
-  const namespace = `devui-${block}`;
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
   const b = () => createBem(namespace);
   const e = (element) => element ? createBem(namespace, element) : "";
   const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
@@ -56,6 +56,10 @@ var index = {
   title: "Status \u72B6\u6001",
   category: "\u901A\u7528",
   status: "100%",
+  deprecated: {
+    value: true,
+    reason: "Status \u662F\u65E0\u5185\u5BB9\u5305\u88F9\u72B6\u6001\u4E0B\u7684 Badge \u7EC4\u4EF6\uFF0C\u5E94\u8BE5\u4F7F\u7528 Badge \u66FF\u4EE3\u3002"
+  },
   install(app) {
     app.component(Status.name, Status);
   }

package/status/index.umd.js

@@ -1 +1 @@
-(function(e,u){typeof exports=="object"&&typeof module!="undefined"?u(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],u):(e=typeof globalThis!="undefined"?globalThis:e||self,u(e.index={},e.Vue))})(this,function(e,u){"use strict";function r(a,n,s){let i=a;return n&&(i+=`__${n}`),s&&(i+=`--${s}`),i}function p(a){const n=`devui-${a}`;return{b:()=>r(n),e:t=>t?r(n,t):"",m:t=>t?r(n,"",t):"",em:(t,l)=>t&&l?r(n,t,l):""}}var m="",d=u.defineComponent({name:"DStatus",props:{type:{default:"invalid",type:String}},setup(a,n){const s=p("status"),i=u.computed(()=>{const{type:o}=a,c=["success","error","initial","warning","waiting","running","invalid"];let t=`${s.b()} ${s.em("bg","invalid")}`;return c.includes(o)&&(t=`${s.b()} ${s.em("bg",o)}`),t});return()=>{var o,c;return u.createVNode("span",{class:i.value},[(c=(o=n.slots).default)==null?void 0:c.call(o)])}}}),f={title:"Status \u72B6\u6001",category:"\u901A\u7528",status:"100%",install(a){a.component(d.name,d)}};e.Status=d,e.default=f,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"});
+(function(t,s){typeof exports=="object"&&typeof module!="undefined"?s(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],s):(t=typeof globalThis!="undefined"?globalThis:t||self,s(t.index={},t.Vue))})(this,function(t,s){"use strict";function c(u,a,e){let i=u;return a&&(i+=`__${a}`),e&&(i+=`--${e}`),i}function f(u,a=!1){const e=a?`.devui-${u}`:`devui-${u}`;return{b:()=>c(e),e:n=>n?c(e,n):"",m:n=>n?c(e,"",n):"",em:(n,p)=>n&&p?c(e,n,p):""}}var v="",d=s.defineComponent({name:"DStatus",props:{type:{default:"invalid",type:String}},setup(u,a){const e=f("status"),i=s.computed(()=>{const{type:o}=u,r=["success","error","initial","warning","waiting","running","invalid"];let l=`${e.b()} ${e.em("bg","invalid")}`;return r.includes(o)&&(l=`${e.b()} ${e.em("bg",o)}`),l});return()=>{var o,r;return s.createVNode("span",{class:i.value},[(r=(o=a.slots).default)==null?void 0:r.call(o)])}}}),m={title:"Status \u72B6\u6001",category:"\u901A\u7528",status:"100%",deprecated:{value:!0,reason:"Status \u662F\u65E0\u5185\u5BB9\u5305\u88F9\u72B6\u6001\u4E0B\u7684 Badge \u7EC4\u4EF6\uFF0C\u5E94\u8BE5\u4F7F\u7528 Badge \u66FF\u4EE3\u3002"},install(u){u.component(d.name,d)}};t.Status=d,t.default=m,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});

package/status/style.css

@@ -1 +1 @@
-.devui-status{line-height:20px;height:20px;display:flex;align-items:center}.devui-status:before{display:inline-block;content:"";width:10px;height:10px;margin-right:5px;border-radius:100%}.devui-status.devui-status__bg--success:before{background-color:var(--devui-success, #50d4ab)}.devui-status.devui-status__bg--error:before{background-color:var(--devui-danger, #f66f6a)}.devui-status.devui-status__bg--warning:before{background-color:var(--devui-warning, #fac20a)}.devui-status.devui-status__bg--initial:before{background-color:var(--devui-initial, #e9edfa)}.devui-status.devui-status__bg--waiting:before{background-color:var(--devui-waiting, #9faad7)}.devui-status.devui-status__bg--running:before{background-color:var(--devui-info, #5e7ce0)}.devui-status.devui-status__bg--invalid:before{background-color:var(--devui-dividing-line, #dfe1e6)}
+.devui-status{line-height:20px;height:20px;display:flex;align-items:center}.devui-status:before{display:inline-block;content:"";width:10px;height:10px;margin-right:5px;border-radius:100%}.devui-status.devui-status__bg--success:before{background-color:var(--devui-success, #50d4ab)}.devui-status.devui-status__bg--error:before{background-color:var(--devui-danger, #f66f6a)}.devui-status.devui-status__bg--warning:before{background-color:var(--devui-warning, #fac20a)}.devui-status.devui-status__bg--initial:before{background-color:var(--devui-initial, #e9edfa)}.devui-status.devui-status__bg--waiting:before{background-color:var(--devui-waiting, #9faad7)}.devui-status.devui-status__bg--running:before{background-color:var(--devui-info, #5e7ce0)}.devui-status.devui-status__bg--invalid:before{background-color:var(--devui-dividing-line, #f2f2f3)}

package/steps/index.d.ts

@@ -0,0 +1,7 @@
+import { App } from 'vue';
+  declare function install(app: App): void
+  declare const _default: {
+      install: typeof install;
+      version: string;
+  };
+  export default _default;

package/steps/index.es.js

@@ -0,0 +1,387 @@
+import { defineComponent, toRefs, ref, provide, watch, computed, createVNode, resolveDynamicComponent, mergeProps, getCurrentInstance, inject, Fragment } from "vue";
+const stepsProps = {
+  modelValue: {
+    type: Number,
+    default: 0
+  },
+  space: {
+    type: Number
+  },
+  alignCenter: {
+    type: Boolean,
+    default: false
+  },
+  direction: {
+    type: String,
+    default: "horizontal"
+  },
+  simple: {
+    type: Boolean,
+    default: false
+  }
+};
+function createBem(namespace, element, modifier) {
+  let cls = namespace;
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+}
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
+  const b = () => createBem(namespace);
+  const e = (element) => element ? createBem(namespace, element) : "";
+  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
+  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
+  return {
+    b,
+    e,
+    m,
+    em
+  };
+}
+var steps = "";
+const ACTIVE_STEP = "active-step";
+const STEPS = "steps";
+const STEPS_PROPS = "steps-props";
+var Steps = defineComponent({
+  name: "DSteps",
+  props: stepsProps,
+  emits: ["update:modelValue"],
+  setup(props, {
+    slots
+  }) {
+    const {
+      modelValue,
+      direction,
+      simple
+    } = toRefs(props);
+    const ns = useNamespace("steps");
+    const activeStep = ref(modelValue.value);
+    provide(ACTIVE_STEP, activeStep);
+    provide(STEPS_PROPS, props);
+    const steps2 = ref([]);
+    provide(STEPS, steps2);
+    watch(modelValue, (newVal) => {
+      activeStep.value = newVal;
+    });
+    const stepsClass = computed(() => {
+      const directionClass = direction.value === "vertical" ? " vertical" : "";
+      const simpleClass = simple.value ? " simple" : "";
+      return `${ns.b()}${directionClass}${simpleClass}`;
+    });
+    return () => {
+      var _a;
+      return createVNode("div", {
+        "class": stepsClass.value
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+const stepProps = {
+  title: {
+    type: String,
+    required: true
+  },
+  description: {
+    type: String
+  },
+  icon: {
+    type: String
+  },
+  status: {
+    type: String
+  }
+};
+const DEFAULT_PREFIX = "icon";
+const iconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  size: {
+    type: [Number, String],
+    default: "inherit"
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  component: {
+    type: Object,
+    default: null
+  },
+  classPrefix: {
+    type: String,
+    default: DEFAULT_PREFIX
+  },
+  operable: {
+    type: Boolean,
+    default: false
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  rotate: {
+    type: [Number, String]
+  }
+};
+const svgIconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  size: {
+    type: [Number, String],
+    default: "inherit"
+  }
+};
+var icon = "";
+var svgIcon = defineComponent({
+  name: "DSvgIcon",
+  props: svgIconProps,
+  setup(props) {
+    const {
+      name,
+      color,
+      size
+    } = toRefs(props);
+    const ns = useNamespace("svg-icon");
+    const iconName = computed(() => `#icon-${name.value}`);
+    const iconSize = computed(() => {
+      return typeof size.value === "number" ? `${size.value}px` : size.value;
+    });
+    const styles = {
+      width: iconSize.value,
+      height: iconSize.value
+    };
+    return () => {
+      return createVNode("svg", {
+        "class": ns.b(),
+        "style": styles
+      }, [createVNode("use", {
+        "xlink:href": iconName.value,
+        "fill": color.value
+      }, null)]);
+    };
+  }
+});
+function isUrl(value) {
+  return /^((http|https):)?\/\//.test(value);
+}
+function useIconDom(props, ctx) {
+  const {
+    component,
+    name,
+    size,
+    color,
+    classPrefix,
+    rotate
+  } = toRefs(props);
+  const ns = useNamespace("icon");
+  const iconSize = computed(() => {
+    return typeof size.value === "number" ? `${size.value}px` : size.value;
+  });
+  const IconComponent = component.value ? resolveDynamicComponent(component.value) : resolveDynamicComponent(svgIcon);
+  const imgIconDom = () => {
+    return createVNode("img", mergeProps({
+      "src": name.value,
+      "alt": name.value.split("/")[name.value.split("/").length - 1],
+      "class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns.m("spin")],
+      "style": {
+        width: iconSize.value || "",
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`,
+        verticalAlign: "middle"
+      }
+    }, ctx.attrs), null);
+  };
+  const svgIconDom = () => {
+    return createVNode(IconComponent, mergeProps({
+      "name": name.value,
+      "color": color.value,
+      "size": iconSize.value,
+      "class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns.m("spin")],
+      "style": {
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
+      }
+    }, ctx.attrs), null);
+  };
+  const fontIconDom = () => {
+    const fontIconClass = /^icon-/.test(name.value) ? name.value : `${classPrefix.value}-${name.value}`;
+    return createVNode("i", mergeProps({
+      "class": [classPrefix.value, fontIconClass, (rotate == null ? void 0 : rotate.value) === "infinite" && ns.m("spin")],
+      "style": {
+        fontSize: iconSize.value,
+        color: color.value,
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
+      }
+    }, ctx.attrs), null);
+  };
+  const iconDom = () => {
+    return component.value ? svgIconDom() : isUrl(name.value) ? imgIconDom() : fontIconDom();
+  };
+  return {
+    iconDom
+  };
+}
+var Icon = defineComponent({
+  name: "DIcon",
+  props: iconProps,
+  emits: ["click"],
+  setup(props, ctx) {
+    const {
+      disabled,
+      operable
+    } = toRefs(props);
+    const {
+      iconDom
+    } = useIconDom(props, ctx);
+    const ns = useNamespace("icon");
+    const wrapClassed = computed(() => ({
+      [ns.e("container")]: true,
+      [ns.m("disabled")]: disabled.value,
+      [ns.m("operable")]: operable.value,
+      [ns.m("no-slots")]: !Object.keys(ctx.slots).length
+    }));
+    const onClick = (e) => {
+      if (disabled.value) {
+        return;
+      }
+      ctx.emit("click", e);
+    };
+    return () => {
+      var _a, _b, _c, _d;
+      return createVNode("div", {
+        "class": wrapClassed.value,
+        "onClick": onClick
+      }, [(_b = (_a = ctx.slots).prefix) == null ? void 0 : _b.call(_a), iconDom(), (_d = (_c = ctx.slots).suffix) == null ? void 0 : _d.call(_c)]);
+    };
+  }
+});
+var iconGroup = "";
+defineComponent({
+  name: "DIconGroup",
+  setup(_, ctx) {
+    const ns = useNamespace("icon-group");
+    return () => {
+      var _a, _b;
+      return createVNode("div", {
+        "class": ns.b()
+      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
+    };
+  }
+});
+var step = "";
+var Step = defineComponent({
+  name: "DStep",
+  props: stepProps,
+  setup(props, {
+    slots
+  }) {
+    const {
+      title,
+      description,
+      icon: icon2,
+      status
+    } = toRefs(props);
+    const ns = useNamespace("step");
+    const instance = getCurrentInstance();
+    const activeStep = inject(ACTIVE_STEP);
+    const steps2 = inject(STEPS);
+    steps2.value.push(instance);
+    const stepsProps2 = inject(STEPS_PROPS);
+    const currentStepIndex = steps2.value.indexOf(instance);
+    const stepClass = computed(() => {
+      const activeClass = activeStep.value === currentStepIndex ? " active" : "";
+      const finishedClass = activeStep.value > currentStepIndex ? " finished" : "";
+      const centerClass = stepsProps2.alignCenter ? " center" : "";
+      const statusClass = (status == null ? void 0 : status.value) ? ` ${status == null ? void 0 : status.value}` : "";
+      const simpleClass = stepsProps2.simple ? ` ${ns.m("simple")}` : "";
+      return `${ns.b()}${activeClass}${finishedClass}${centerClass}${statusClass}${simpleClass}`;
+    });
+    const stepStyle = computed(() => {
+      const styleObj = {};
+      if (stepsProps2.space) {
+        styleObj.width = `${stepsProps2.space}px`;
+      } else {
+        styleObj.flexBasis = stepsProps2.alignCenter || stepsProps2.simple ? `${100 / steps2.value.length}%` : `${100 / (steps2.value.length - 1)}%`;
+      }
+      return styleObj;
+    });
+    const iconColor = computed(() => {
+      const isActive = activeStep.value === currentStepIndex;
+      const isFinished = activeStep.value > currentStepIndex;
+      return isActive ? "var(--devui-brand)" : isFinished ? "var(--devui-success)" : "var(--devui-placeholder)";
+    });
+    const statusMap = {
+      finish: createVNode(Icon, {
+        "name": "right-o",
+        "color": "var(--devui-success)",
+        "size": "24px"
+      }, null),
+      success: createVNode(Icon, {
+        "name": "right-o",
+        "color": "var(--devui-success)",
+        "size": "24px"
+      }, null),
+      error: createVNode(Icon, {
+        "name": "error-o",
+        "color": "var(--devui-danger)",
+        "size": "24px"
+      }, null)
+    };
+    const renderDot = () => {
+      var _a;
+      return slots.icon ? (_a = slots.icon) == null ? void 0 : _a.call(slots, iconColor.value) : icon2.value ? createVNode(Icon, {
+        "name": icon2.value,
+        "color": iconColor.value,
+        "size": "24px"
+      }, null) : status.value && statusMap[status.value] ? statusMap[status.value] : activeStep.value > steps2.value.indexOf(instance) ? createVNode(Icon, {
+        "name": "right-o",
+        "color": "var(--devui-success)",
+        "size": "24px"
+      }, null) : createVNode("span", {
+        "class": ns.e("dot")
+      }, [currentStepIndex + 1]);
+    };
+    return () => {
+      return createVNode(Fragment, null, [stepsProps2.simple ? createVNode("div", {
+        "class": stepClass.value,
+        "style": stepStyle.value
+      }, [title.value]) : createVNode("div", {
+        "class": stepClass.value,
+        "style": stepStyle.value
+      }, [createVNode("div", {
+        "class": ns.e("dot-container")
+      }, [renderDot(), createVNode("div", {
+        "class": ns.e("line")
+      }, null)]), createVNode("div", {
+        "class": ns.e("content")
+      }, [createVNode("span", {
+        "class": ns.e("title")
+      }, [title.value]), description.value && createVNode("span", {
+        "class": ns.e("description")
+      }, [description.value])])])]);
+    };
+  }
+});
+var index = {
+  title: "Steps \u6B65\u9AA4\u6761",
+  category: "\u6570\u636E\u5C55\u793A",
+  status: "100%",
+  install(app) {
+    app.component(Steps.name, Steps);
+    app.component(Step.name, Step);
+  }
+};
+export { Step, Steps, index as default, stepProps, stepsProps };

package/steps/index.umd.js

@@ -0,0 +1 @@
+(function(d,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(d=typeof globalThis!="undefined"?globalThis:d||self,e(d.index={},d.Vue))})(this,function(d,e){"use strict";const P={modelValue:{type:Number,default:0},space:{type:Number},alignCenter:{type:Boolean,default:!1},direction:{type:String,default:"horizontal"},simple:{type:Boolean,default:!1}};function y(a,n,o){let s=a;return n&&(s+=`__${n}`),o&&(s+=`--${o}`),s}function v(a,n=!1){const o=n?`.devui-${a}`:`devui-${a}`;return{b:()=>y(o),e:t=>t?y(o,t):"",m:t=>t?y(o,"",t):"",em:(t,r)=>t&&r?y(o,t,r):""}}var w="";const D="active-step",I="steps",z="steps-props";var C=e.defineComponent({name:"DSteps",props:P,emits:["update:modelValue"],setup(a,{slots:n}){const{modelValue:o,direction:s,simple:u}=e.toRefs(a),l=v("steps"),c=e.ref(o.value);e.provide(D,c),e.provide(z,a);const t=e.ref([]);e.provide(I,t),e.watch(o,i=>{c.value=i});const r=e.computed(()=>{const i=s.value==="vertical"?" vertical":"",p=u.value?" simple":"";return`${l.b()}${i}${p}`});return()=>{var i;return e.createVNode("div",{class:r.value},[(i=n.default)==null?void 0:i.call(n)])}}});const x={title:{type:String,required:!0},description:{type:String},icon:{type:String},status:{type:String}},E={name:{type:String,default:"",required:!0},size:{type:[Number,String],default:"inherit"},color:{type:String,default:"inherit"},component:{type:Object,default:null},classPrefix:{type:String,default:"icon"},operable:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},rotate:{type:[Number,String]}},T={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};var M="",_=e.defineComponent({name:"DSvgIcon",props:T,setup(a){const{name:n,color:o,size:s}=e.toRefs(a),u=v("svg-icon"),l=e.computed(()=>`#icon-${n.value}`),c=e.computed(()=>typeof s.value=="number"?`${s.value}px`:s.value),t={width:c.value,height:c.value};return()=>e.createVNode("svg",{class:u.b(),style:t},[e.createVNode("use",{"xlink:href":l.value,fill:o.value},null)])}});function j(a){return/^((http|https):)?\/\//.test(a)}function A(a,n){const{component:o,name:s,size:u,color:l,classPrefix:c,rotate:t}=e.toRefs(a),r=v("icon"),i=e.computed(()=>typeof u.value=="number"?`${u.value}px`:u.value),p=o.value?e.resolveDynamicComponent(o.value):e.resolveDynamicComponent(_),m=()=>e.createVNode("img",e.mergeProps({src:s.value,alt:s.value.split("/")[s.value.split("/").length-1],class:[(t==null?void 0:t.value)==="infinite"&&r.m("spin")],style:{width:i.value||"",transform:`rotate(${t==null?void 0:t.value}deg)`,verticalAlign:"middle"}},n.attrs),null),S=()=>e.createVNode(p,e.mergeProps({name:s.value,color:l.value,size:i.value,class:[(t==null?void 0:t.value)==="infinite"&&r.m("spin")],style:{transform:`rotate(${t==null?void 0:t.value}deg)`}},n.attrs),null),h=()=>{const N=/^icon-/.test(s.value)?s.value:`${c.value}-${s.value}`;return e.createVNode("i",e.mergeProps({class:[c.value,N,(t==null?void 0:t.value)==="infinite"&&r.m("spin")],style:{fontSize:i.value,color:l.value,transform:`rotate(${t==null?void 0:t.value}deg)`}},n.attrs),null)};return{iconDom:()=>o.value?S():j(s.value)?m():h()}}var g=e.defineComponent({name:"DIcon",props:E,emits:["click"],setup(a,n){const{disabled:o,operable:s}=e.toRefs(a),{iconDom:u}=A(a,n),l=v("icon"),c=e.computed(()=>({[l.e("container")]:!0,[l.m("disabled")]:o.value,[l.m("operable")]:s.value,[l.m("no-slots")]:!Object.keys(n.slots).length})),t=r=>{o.value||n.emit("click",r)};return()=>{var r,i,p,m;return e.createVNode("div",{class:c.value,onClick:t},[(i=(r=n.slots).prefix)==null?void 0:i.call(r),u(),(m=(p=n.slots).suffix)==null?void 0:m.call(p)])}}}),U="";e.defineComponent({name:"DIconGroup",setup(a,n){const o=v("icon-group");return()=>{var s,u;return e.createVNode("div",{class:o.b()},[(u=(s=n.slots).default)==null?void 0:u.call(s)])}}});var G="",V=e.defineComponent({name:"DStep",props:x,setup(a,{slots:n}){const{title:o,description:s,icon:u,status:l}=e.toRefs(a),c=v("step"),t=e.getCurrentInstance(),r=e.inject(D),i=e.inject(I);i.value.push(t);const p=e.inject(z),m=i.value.indexOf(t),S=e.computed(()=>{const f=r.value===m?" active":"",b=r.value>m?" finished":"",O=p.alignCenter?" center":"",F=(l==null?void 0:l.value)?` ${l==null?void 0:l.value}`:"",k=p.simple?` ${c.m("simple")}`:"";return`${c.b()}${f}${b}${O}${F}${k}`}),h=e.computed(()=>{const f={};return p.space?f.width=`${p.space}px`:f.flexBasis=p.alignCenter||p.simple?`${100/i.value.length}%`:`${100/(i.value.length-1)}%`,f}),$=e.computed(()=>{const f=r.value===m,b=r.value>m;return f?"var(--devui-brand)":b?"var(--devui-success)":"var(--devui-placeholder)"}),N={finish:e.createVNode(g,{name:"right-o",color:"var(--devui-success)",size:"24px"},null),success:e.createVNode(g,{name:"right-o",color:"var(--devui-success)",size:"24px"},null),error:e.createVNode(g,{name:"error-o",color:"var(--devui-danger)",size:"24px"},null)},B=()=>{var f;return n.icon?(f=n.icon)==null?void 0:f.call(n,$.value):u.value?e.createVNode(g,{name:u.value,color:$.value,size:"24px"},null):l.value&&N[l.value]?N[l.value]:r.value>i.value.indexOf(t)?e.createVNode(g,{name:"right-o",color:"var(--devui-success)",size:"24px"},null):e.createVNode("span",{class:c.e("dot")},[m+1])};return()=>e.createVNode(e.Fragment,null,[p.simple?e.createVNode("div",{class:S.value,style:h.value},[o.value]):e.createVNode("div",{class:S.value,style:h.value},[e.createVNode("div",{class:c.e("dot-container")},[B(),e.createVNode("div",{class:c.e("line")},null)]),e.createVNode("div",{class:c.e("content")},[e.createVNode("span",{class:c.e("title")},[o.value]),s.value&&e.createVNode("span",{class:c.e("description")},[s.value])])])])}}),R={title:"Steps \u6B65\u9AA4\u6761",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(a){a.component(C.name,C),a.component(V.name,V)}};d.Step=V,d.Steps=C,d.default=R,d.stepProps=x,d.stepsProps=P,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});

package/steps/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "steps",
+  "version": "0.0.0",
+  "main": "index.umd.js",
+  "module": "index.es.js",
+  "style": "style.css"
+}

package/steps/style.css

@@ -0,0 +1 @@
+.devui-steps{display:flex}.devui-steps.vertical{flex-direction:column;height:100%}.devui-steps.vertical .devui-step{flex-direction:row}.devui-steps.vertical .devui-step__line{width:1px;height:100%;left:12px;top:24px}.devui-steps.vertical .devui-step__content{margin-left:8px;padding-top:2px}.devui-steps.simple .devui-step{position:relative;height:36px;line-height:36px;text-align:center;background-color:var(--devui-brand-foil, #f2f2f3);color:var(--devui-text, #252b3a)}.devui-steps.simple .devui-step:not(:first-child){margin-left:18px}.devui-steps.simple .devui-step:not(:last-child){margin-right:18px}.devui-steps.simple .devui-step:not(:first-child):before{content:"";width:0;height:0;position:absolute;left:-28px;top:0;border:solid 18px transparent;border-top-color:var(--devui-brand-foil, #f2f2f3);border-right-color:var(--devui-brand-foil, #f2f2f3);border-bottom-color:var(--devui-brand-foil, #f2f2f3)}.devui-steps.simple .devui-step:after{content:"";width:0;height:0;position:absolute;right:-36px;top:0;border:solid 18px transparent;border-left-color:var(--devui-brand-foil, #f2f2f3)}.devui-steps.simple .devui-step.active{background-color:var(--devui-brand, #5e7ce0);color:var(--devui-light-text, #ffffff)}.devui-steps.simple .devui-step.active:before{border-top-color:var(--devui-brand, #5e7ce0);border-right-color:var(--devui-brand, #5e7ce0);border-bottom-color:var(--devui-brand, #5e7ce0)}.devui-steps.simple .devui-step.active:after{border-left-color:var(--devui-brand, #5e7ce0)}.devui-steps.simple .devui-step.finished{background-color:var(--devui-success, #50d4ab);color:var(--devui-light-text, #ffffff)}.devui-steps.simple .devui-step.finished:before{border-top-color:var(--devui-success, #50d4ab);border-right-color:var(--devui-success, #50d4ab);border-bottom-color:var(--devui-success, #50d4ab)}.devui-steps.simple .devui-step.finished:after{border-left-color:var(--devui-success, #50d4ab)}.devui-icon__container{display:inline-block;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--no-slots i,.devui-icon--no-slots img{display:block}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;line-height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 2px);transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--spin{animation:iconSpin 2.5s linear infinite}.devui-svg-icon{vertical-align:middle}@keyframes iconSpin{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.devui-icon-group{display:inline-flex;align-items:center}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable){padding:8px;margin-left:0}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable):first-child{margin-left:-8px}.devui-icon-group>*:not(:first-child){margin-left:0}.devui-step{display:flex;flex-direction:column;flex-shrink:1}.devui-step:last-child{flex-shrink:0}.devui-step:last-child:not(.center):not(.devui-step--simple){flex-basis:auto!important}.devui-step:last-child .devui-step__line{display:none}.devui-step__dot-container{position:relative}.devui-step__content{display:flex;flex-direction:column}.devui-step__dot{display:inline-flex;justify-content:center;align-items:center;width:24px;height:24px;border-radius:50%;background-color:var(--devui-brand-foil, #f2f2f3);color:var(--devui-text, #252b3a)}.devui-step__line{position:absolute;top:12px;left:24px;width:calc(100% - 24px);height:1px;background-color:var(--devui-line, #d7d8da)}.devui-step__title{color:var(--devui-placeholder, #babbc0)}.devui-step__description{color:var(--devui-placeholder, #babbc0);font-size:12px}.devui-step.active .devui-step__dot{background-color:var(--devui-brand, #5e7ce0);color:var(--devui-light-text, #ffffff)}.devui-step.active .devui-step__title,.devui-step.active .devui-step__description{color:var(--devui-brand, #5e7ce0)}.devui-step.finished .devui-step__dot{background-color:var(--devui-success, #50d4ab)}.devui-step.finished .devui-step__title,.devui-step.finished .devui-step__description{color:var(--devui-success, #50d4ab)}.devui-step.center{text-align:center}.devui-step.center .devui-step__line{left:calc(50% + 12px)}.devui-step.wait .devui-step__dot{background-color:var(--devui-brand-foil, #f2f2f3);color:var(--devui-text, #252b3a)}.devui-step.wait .devui-step__title{color:var(--devui-placeholder, #babbc0)}.devui-step.process .devui-step__dot{background-color:var(--devui-brand, #5e7ce0);color:var(--devui-light-text, #ffffff)}.devui-step.process .devui-step__title{color:var(--devui-brand, #5e7ce0)}.devui-step.finish .devui-step__dot{background-color:var(--devui-success, #50d4ab);color:var(--devui-light-text, #ffffff)}.devui-step.finish .devui-step__title{color:var(--devui-success, #50d4ab)}.devui-step.success .devui-step__dot{background-color:var(--devui-success, #50d4ab);color:var(--devui-light-text, #ffffff)}.devui-step.success .devui-step__title{color:var(--devui-success, #50d4ab)}.devui-step.error .devui-step__dot{background-color:var(--devui-danger, #f66f6a);color:var(--devui-light-text, #ffffff)}.devui-step.error .devui-step__title{color:var(--devui-danger, #f66f6a)}