vue-devui 1.0.0-alpha.1 → 1.0.0-alpha.10

package/input-number/index.es.js

@@ -1 +1,308 @@
-import{defineComponent as e,ref as t,computed as u,createVNode as a,createTextVNode as n}from"vue";var l=e({name:"DInputNumber",props:{placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},step:{type:Number,default:0},max:{type:Number,default:1/0},min:{type:Number,default:-1/0},size:{type:String,default:""},modelValue:{type:Number,default:0},"onUpdate:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}},emits:["update:modelValue","change","input","focus","blur","keydown"],setup(e,a){const n=t(e.modelValue),l=u((()=>`devui-input-number-${e.size}`)),d=u((()=>e.disabled?"devui-input-disabled":""));return{inputVal:n,isDisabled:d,isSize:l,add:()=>{e.disabled||n.value>=e.max||(n.value+=0!=e.step?e.step:1,a.emit("change",n.value),a.emit("update:modelValue",n.value))},subtract:()=>{e.disabled||n.value<=e.min||(n.value-=0!=e.step?e.step:1,a.emit("change",n.value),a.emit("update:modelValue",n.value))},onInput:e=>{n.value=parseInt(e.data),a.emit("input",e.data),a.emit("update:modelValue",e.data)},onChange:e=>{a.emit("change",e.target.value)},onKeydown:e=>{a.emit("keydown",e)},onBlur:e=>{a.emit("blur",e)},onFocus:e=>{a.emit("focus",e)}}},render(){const{placeholder:e,add:t,inputVal:u,isDisabled:l,isSize:d,subtract:i,onInput:o,onChange:s,onKeydown:p,onBlur:r,onFocus:m}=this;return a("div",{class:["devui-input-number",l,d]},[a("div",{class:"devui-input-item"},[a("span",{class:"devui-subtract",onClick:i},[n("-")]),a("input",{type:"number",value:u,class:"devui-input-style",placeholder:e,onInput:o,onChange:s,onFocus:m,onBlur:r,onKeydown:p},null),a("span",{class:"devui-add",onClick:t},[n("+")])])])}});l.install=function(e){e.component(l.name,l)};var d={title:"InputNumber 数字输入框",category:"导航",install(e){e.use(l)}};export{l as InputNumber,d as default};
+import { createVNode, computed, ref, toRefs, reactive, watch, defineComponent, mergeProps } from "vue";
+const inputNumberProps = {
+  placeholder: {
+    type: String
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  step: {
+    type: Number,
+    default: 1
+  },
+  max: {
+    type: Number,
+    default: Infinity
+  },
+  min: {
+    type: Number,
+    default: -Infinity
+  },
+  size: {
+    type: String,
+    default: ""
+  },
+  modelValue: {
+    type: Number
+  },
+  precision: {
+    type: Number
+  }
+};
+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
+  };
+}
+const ns$1 = useNamespace("input-number");
+function IncIcon() {
+  return createVNode("svg", {
+    "class": ns$1.e("icon-arrow"),
+    "width": "1em",
+    "height": "1em",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": "M12.1464466,6.85355339 L8.35355339,10.6464466 C8.15829124,10.8417088 7.84170876,10.8417088 7.64644661,10.6464466           L3.85355339,6.85355339 C3.65829124,6.65829124 3.65829124,6.34170876 3.85355339,6.14644661 C3.94732158,6.05267842           4.07449854,6 4.20710678,6 L11.7928932,6 C12.0690356,6 12.2928932,6.22385763 12.2928932,6.5 C12.2928932,6.63260824           12.2402148,6.7597852 12.1464466,6.85355339 Z",
+    "fill-rule": "nonzero"
+  }, null)])]);
+}
+function DecIcon() {
+  return createVNode("svg", {
+    "class": ns$1.e("icon-arrow"),
+    "width": "1em",
+    "height": "1em",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": "M12.1464466,6.85355339 L8.35355339,10.6464466 C8.15829124,10.8417088 7.84170876,10.8417088 7.64644661,10.6464466           L3.85355339,6.85355339 C3.65829124,6.65829124 3.65829124,6.34170876 3.85355339,6.14644661 C3.94732158,6.05267842           4.07449854,6 4.20710678,6 L11.7928932,6 C12.0690356,6 12.2928932,6.22385763 12.2928932,6.5 C12.2928932,6.63260824           12.2402148,6.7597852 12.1464466,6.85355339 Z",
+    "fill-rule": "nonzero"
+  }, null)])]);
+}
+const isNumber = (value) => typeof value === "number";
+const isUndefined = (value) => value === void 0;
+const isNull = (value) => value === null;
+const ns = useNamespace("input-number");
+function useRender(props, ctx) {
+  const { style, class: customClass, ...otherAttrs } = ctx.attrs;
+  const customStyle = { style };
+  const wrapClass = computed(() => [
+    {
+      [ns.b()]: true
+    },
+    customClass
+  ]);
+  const controlButtonsClass = computed(() => ({
+    [ns.e("control-buttons")]: true,
+    disabled: props.disabled,
+    [ns.m(props.size)]: true
+  }));
+  const inputWrapClass = computed(() => ({
+    [ns.e("input-wrap")]: true,
+    [ns.m(props.size)]: true
+  }));
+  const inputInnerClass = computed(() => ({
+    [ns.e("input-box")]: true,
+    disabled: props.disabled
+  }));
+  return { wrapClass, customStyle, otherAttrs, controlButtonsClass, inputWrapClass, inputInnerClass };
+}
+function useExpose(ctx) {
+  const inputRef = ref();
+  const focus = () => {
+    inputRef.value.focus();
+  };
+  const blur = () => {
+    inputRef.value.blur();
+  };
+  const select = () => {
+    inputRef.value.select();
+  };
+  ctx.expose({ focus, blur, select });
+  return { inputRef };
+}
+function getPrecision(pre) {
+  let precision = 0;
+  if (isUndefined(pre)) {
+    return precision;
+  }
+  const preString = pre.toString();
+  const dotIndex = preString.indexOf(".");
+  if (dotIndex !== -1) {
+    precision = preString.length - dotIndex - 1;
+  }
+  return precision;
+}
+function useEvent(props, ctx, inputRef) {
+  const { min, max, step, disabled } = toRefs(props);
+  const state = reactive({
+    currentValue: props.modelValue || "",
+    userInputValue: void 0
+  });
+  const numPrecision = computed(() => {
+    if (!isUndefined(props.precision)) {
+      return props.precision;
+    } else {
+      return Math.max(getPrecision(props.modelValue), getPrecision(step.value));
+    }
+  });
+  const inputVal = computed(() => {
+    if (!isUndefined(state.userInputValue)) {
+      return state.userInputValue;
+    }
+    let currentValue = state.currentValue;
+    if (currentValue === "" || isUndefined(currentValue) || Number.isNaN(currentValue)) {
+      return "";
+    }
+    if (isNumber(currentValue)) {
+      currentValue = currentValue.toFixed(numPrecision.value);
+    }
+    return currentValue;
+  });
+  const toPrecision = (num) => {
+    return Number.parseFloat(num.toFixed(numPrecision.value));
+  };
+  const computeByStep = (val, addOrNot = 1) => {
+    if (!isNumber(val)) {
+      return state.currentValue;
+    }
+    return toPrecision(val + step.value * addOrNot);
+  };
+  const correctValue = (value, shouldUpdate) => {
+    if (value === "" || isUndefined(value) || isNull(value) || Number.isNaN(value)) {
+      return void 0;
+    }
+    let newVal = Number(value);
+    newVal = toPrecision(newVal);
+    if (newVal > max.value || newVal < min.value) {
+      newVal = newVal > max.value ? max.value : min.value;
+      shouldUpdate && ctx.emit("update:modelValue", newVal);
+    }
+    return newVal;
+  };
+  const setCurrentValue = (value) => {
+    const oldVal = state.currentValue;
+    const newVal = correctValue(value);
+    if (oldVal === newVal) {
+      return;
+    }
+    state.userInputValue = void 0;
+    ctx.emit("update:modelValue", newVal);
+    ctx.emit("input", newVal);
+    ctx.emit("change", newVal, oldVal);
+    state.currentValue = newVal;
+  };
+  const minDisabled = computed(() => isNumber(state.currentValue) && computeByStep(state.currentValue, -1) < props.min);
+  const maxDisabled = computed(() => isNumber(state.currentValue) && computeByStep(state.currentValue) > props.max);
+  const onAdd = () => {
+    if (disabled.value || maxDisabled.value) {
+      return;
+    }
+    inputRef.value.focus();
+    const newVal = computeByStep(state.currentValue || 0);
+    setCurrentValue(newVal);
+  };
+  const onSubtract = () => {
+    if (disabled.value || minDisabled.value) {
+      return;
+    }
+    inputRef.value.focus();
+    const newVal = computeByStep(state.currentValue || 0, -1);
+    setCurrentValue(newVal);
+  };
+  watch(() => props.modelValue, (val) => {
+    state.currentValue = correctValue(val, true);
+    state.userInputValue = void 0;
+  }, { immediate: true });
+  const onInput = (event) => {
+    const value = event.target.value;
+    state.userInputValue = value;
+  };
+  const onChange = (event) => {
+    const value = event.target.value;
+    const newVal = value !== "" ? Number(value) : "";
+    if (isNumber(newVal) && !Number.isNaN(newVal) || value === "") {
+      setCurrentValue(newVal);
+    }
+    state.userInputValue = void 0;
+  };
+  return { inputVal, minDisabled, maxDisabled, onAdd, onSubtract, onInput, onChange };
+}
+var inputNumber = "";
+var InputNumber = defineComponent({
+  name: "DInputNumber",
+  props: inputNumberProps,
+  emits: ["update:modelValue", "change", "input"],
+  setup(props, ctx) {
+    const {
+      disabled
+    } = toRefs(props);
+    const {
+      wrapClass,
+      customStyle,
+      otherAttrs,
+      controlButtonsClass,
+      inputWrapClass,
+      inputInnerClass
+    } = useRender(props, ctx);
+    const {
+      inputRef
+    } = useExpose(ctx);
+    const {
+      inputVal,
+      minDisabled,
+      maxDisabled,
+      onAdd,
+      onSubtract,
+      onInput,
+      onChange
+    } = useEvent(props, ctx, inputRef);
+    return () => createVNode("div", mergeProps({
+      "class": wrapClass.value
+    }, customStyle), [createVNode("div", {
+      "class": controlButtonsClass.value
+    }, [createVNode("span", {
+      "class": ["control-button control-inc", {
+        disabled: maxDisabled.value
+      }],
+      "onClick": onAdd
+    }, [createVNode(IncIcon, null, null)]), createVNode("span", {
+      "class": ["control-button control-dec", {
+        disabled: minDisabled.value
+      }],
+      "onClick": onSubtract
+    }, [createVNode(DecIcon, null, null)])]), createVNode("div", {
+      "class": inputWrapClass.value
+    }, [createVNode("input", mergeProps({
+      "type": "number",
+      "ref": inputRef,
+      "value": inputVal.value,
+      "placeholder": props.placeholder,
+      "disabled": disabled.value,
+      "class": inputInnerClass.value
+    }, otherAttrs, {
+      "onInput": onInput,
+      "onChange": onChange
+    }), null)])]);
+  }
+});
+var index = {
+  title: "InputNumber \u6570\u5B57\u8F93\u5165\u6846",
+  category: "\u6570\u636E\u5F55\u5165",
+  status: "50%",
+  install(app) {
+    app.component(InputNumber.name, InputNumber);
+  }
+};
+export { InputNumber, index as default };

package/input-number/index.umd.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).index={},e.Vue)}(this,(function(e,t){"use strict";const u={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},step:{type:Number,default:0},max:{type:Number,default:1/0},min:{type:Number,default:-1/0},size:{type:String,default:""},modelValue:{type:Number,default:0},"onUpdate:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}};var n=t.defineComponent({name:"DInputNumber",props:u,emits:["update:modelValue","change","input","focus","blur","keydown"],setup(e,u){const n=t.ref(e.modelValue),a=t.computed((()=>`devui-input-number-${e.size}`)),o=t.computed((()=>e.disabled?"devui-input-disabled":""));return{inputVal:n,isDisabled:o,isSize:a,add:()=>{e.disabled||n.value>=e.max||(n.value+=0!=e.step?e.step:1,u.emit("change",n.value),u.emit("update:modelValue",n.value))},subtract:()=>{e.disabled||n.value<=e.min||(n.value-=0!=e.step?e.step:1,u.emit("change",n.value),u.emit("update:modelValue",n.value))},onInput:e=>{n.value=parseInt(e.data),u.emit("input",e.data),u.emit("update:modelValue",e.data)},onChange:e=>{u.emit("change",e.target.value)},onKeydown:e=>{u.emit("keydown",e)},onBlur:e=>{u.emit("blur",e)},onFocus:e=>{u.emit("focus",e)}}},render(){const{placeholder:e,add:u,inputVal:n,isDisabled:a,isSize:o,subtract:d,onInput:i,onChange:l,onKeydown:s,onBlur:p,onFocus:r}=this,c=["devui-input-number",a,o];return t.createVNode("div",{class:c},[t.createVNode("div",{class:"devui-input-item"},[t.createVNode("span",{class:"devui-subtract",onClick:d},[t.createTextVNode("-")]),t.createVNode("input",{type:"number",value:n,class:"devui-input-style",placeholder:e,onInput:i,onChange:l,onFocus:r,onBlur:p,onKeydown:s},null),t.createVNode("span",{class:"devui-add",onClick:u},[t.createTextVNode("+")])])])}});n.install=function(e){e.component(n.name,n)};var a={title:"InputNumber 数字输入框",category:"导航",install(e){e.use(n)}};e.InputNumber=n,e.default=a,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"}));
+(function(d,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(d=typeof globalThis!="undefined"?globalThis:d||self,t(d.index={},d.Vue))})(this,function(d,t){"use strict";const L={placeholder:{type:String},disabled:{type:Boolean,default:!1},step:{type:Number,default:1},max:{type:Number,default:1/0},min:{type:Number,default:-1/0},size:{type:String,default:""},modelValue:{type:Number},precision:{type:Number}};function v(e,o,r){let s=e;return o&&(s+=`__${o}`),r&&(s+=`--${r}`),s}function B(e,o=!1){const r=o?`.devui-${e}`:`devui-${e}`;return{b:()=>v(r),e:n=>n?v(r,n):"",m:n=>n?v(r,"",n):"",em:(n,i)=>n&&i?v(r,n,i):""}}const P=B("input-number");function k(){return t.createVNode("svg",{class:P.e("icon-arrow"),width:"1em",height:"1em",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},[t.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[t.createVNode("path",{d:"M12.1464466,6.85355339 L8.35355339,10.6464466 C8.15829124,10.8417088 7.84170876,10.8417088 7.64644661,10.6464466           L3.85355339,6.85355339 C3.65829124,6.65829124 3.65829124,6.34170876 3.85355339,6.14644661 C3.94732158,6.05267842           4.07449854,6 4.20710678,6 L11.7928932,6 C12.0690356,6 12.2928932,6.22385763 12.2928932,6.5 C12.2928932,6.63260824           12.2402148,6.7597852 12.1464466,6.85355339 Z","fill-rule":"nonzero"},null)])])}function z(){return t.createVNode("svg",{class:P.e("icon-arrow"),width:"1em",height:"1em",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},[t.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[t.createVNode("path",{d:"M12.1464466,6.85355339 L8.35355339,10.6464466 C8.15829124,10.8417088 7.84170876,10.8417088 7.64644661,10.6464466           L3.85355339,6.85355339 C3.65829124,6.65829124 3.65829124,6.34170876 3.85355339,6.14644661 C3.94732158,6.05267842           4.07449854,6 4.20710678,6 L11.7928932,6 C12.0690356,6 12.2928932,6.22385763 12.2928932,6.5 C12.2928932,6.63260824           12.2402148,6.7597852 12.1464466,6.85355339 Z","fill-rule":"nonzero"},null)])])}const N=e=>typeof e=="number",h=e=>e===void 0,F=e=>e===null,f=B("input-number");function M(e,o){const{style:r,class:s,...c}=o.attrs,m={style:r},p=t.computed(()=>[{[f.b()]:!0},s]),n=t.computed(()=>({[f.e("control-buttons")]:!0,disabled:e.disabled,[f.m(e.size)]:!0})),i=t.computed(()=>({[f.e("input-wrap")]:!0,[f.m(e.size)]:!0})),V=t.computed(()=>({[f.e("input-box")]:!0,disabled:e.disabled}));return{wrapClass:p,customStyle:m,otherAttrs:c,controlButtonsClass:n,inputWrapClass:i,inputInnerClass:V}}function $(e){const o=t.ref(),r=()=>{o.value.focus()},s=()=>{o.value.blur()},c=()=>{o.value.select()};return e.expose({focus:r,blur:s,select:c}),{inputRef:o}}function D(e){let o=0;if(h(e))return o;const r=e.toString(),s=r.indexOf(".");return s!==-1&&(o=r.length-s-1),o}function A(e,o,r){const{min:s,max:c,step:m,disabled:p}=t.toRefs(e),n=t.reactive({currentValue:e.modelValue||"",userInputValue:void 0}),i=t.computed(()=>h(e.precision)?Math.max(D(e.modelValue),D(m.value)):e.precision),V=t.computed(()=>{if(!h(n.userInputValue))return n.userInputValue;let u=n.currentValue;return u===""||h(u)||Number.isNaN(u)?"":(N(u)&&(u=u.toFixed(i.value)),u)}),C=u=>Number.parseFloat(u.toFixed(i.value)),b=(u,a=1)=>N(u)?C(u+m.value*a):n.currentValue,w=(u,a)=>{if(u===""||h(u)||F(u)||Number.isNaN(u))return;let l=Number(u);return l=C(l),(l>c.value||l<s.value)&&(l=l>c.value?c.value:s.value,a&&o.emit("update:modelValue",l)),l},g=u=>{const a=n.currentValue,l=w(u);a!==l&&(n.userInputValue=void 0,o.emit("update:modelValue",l),o.emit("input",l),o.emit("change",l,a),n.currentValue=l)},I=t.computed(()=>N(n.currentValue)&&b(n.currentValue,-1)<e.min),y=t.computed(()=>N(n.currentValue)&&b(n.currentValue)>e.max),S=()=>{if(p.value||y.value)return;r.value.focus();const u=b(n.currentValue||0);g(u)},_=()=>{if(p.value||I.value)return;r.value.focus();const u=b(n.currentValue||0,-1);g(u)};return t.watch(()=>e.modelValue,u=>{n.currentValue=w(u,!0),n.userInputValue=void 0},{immediate:!0}),{inputVal:V,minDisabled:I,maxDisabled:y,onAdd:S,onSubtract:_,onInput:u=>{const a=u.target.value;n.userInputValue=a},onChange:u=>{const a=u.target.value,l=a!==""?Number(a):"";(N(l)&&!Number.isNaN(l)||a==="")&&g(l),n.userInputValue=void 0}}}var E="",x=t.defineComponent({name:"DInputNumber",props:L,emits:["update:modelValue","change","input"],setup(e,o){const{disabled:r}=t.toRefs(e),{wrapClass:s,customStyle:c,otherAttrs:m,controlButtonsClass:p,inputWrapClass:n,inputInnerClass:i}=M(e,o),{inputRef:V}=$(o),{inputVal:C,minDisabled:b,maxDisabled:w,onAdd:g,onSubtract:I,onInput:y,onChange:S}=A(e,o,V);return()=>t.createVNode("div",t.mergeProps({class:s.value},c),[t.createVNode("div",{class:p.value},[t.createVNode("span",{class:["control-button control-inc",{disabled:w.value}],onClick:g},[t.createVNode(k,null,null)]),t.createVNode("span",{class:["control-button control-dec",{disabled:b.value}],onClick:I},[t.createVNode(z,null,null)])]),t.createVNode("div",{class:n.value},[t.createVNode("input",t.mergeProps({type:"number",ref:V,value:C.value,placeholder:e.placeholder,disabled:r.value,class:i.value},m,{onInput:y,onChange:S}),null)])])}}),R={title:"InputNumber \u6570\u5B57\u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"50%",install(e){e.component(x.name,x)}};d.InputNumber=x,d.default=R,Object.defineProperties(d,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/input-number/style.css

@@ -1 +1 @@
-.devui-input-number{position:relative;display:block;width:180px;line-height:38px}.devui-input-number.devui-input-disabled .devui-subtract,.devui-input-number.devui-input-disabled .devui-add,.devui-input-number.devui-input-disabled .devui-input-style{cursor:not-allowed;border-color:#e4e7ed;color:#e4e7ed}.devui-input-number.devui-input-disabled .devui-input-style{background-color:#f5f7fa;color:#c0c4cc}.devui-input-number.devui-input-number-sm .devui-subtract,.devui-input-number.devui-input-number-sm .devui-add{width:40px;height:34px;line-height:34px}.devui-input-number.devui-input-number-sm .devui-input-style{width:70px;height:34px;line-height:34px}.devui-input-number.devui-input-number-lg .devui-subtract,.devui-input-number.devui-input-number-lg .devui-add{width:60px}.devui-input-number.devui-input-number-lg .devui-input-style{width:90px}.devui-input-number .devui-input-item{display:flex;display:-webkit-box;width:200px;line-height:38px}.devui-input-number .devui-input-style::-webkit-outer-spin-button,.devui-input-number .devui-input-style::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.devui-input-number .devui-add,.devui-input-number .devui-subtract{display:inline-block;width:50px;height:38px;line-height:38px;text-align:center;font-size:16px;color:#333;background:#f5f7fa;cursor:pointer;border:1px solid #dcdfe6}.devui-input-number .devui-add{float:right;margin-left:-1px;border-radius:0 4px 4px 0}.devui-input-number .devui-subtract{float:left;margin-right:-1px;border-radius:4px 0 0 4px}.devui-input-number .devui-input-style{display:block;-moz-appearance:textfield}.devui-input-number .devui-input-style{flex-grow:1;outline:none;background-color:#fff;border:1px solid #dcdfe6;border-radius:2px;padding:5px 10px;line-height:38px;font-size:12px;color:#252b3a;width:80px;display:block;cursor:text;height:38px;text-align:center;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-input-number .disabled{cursor:not-allowed}
+.devui-input-number{position:relative;display:inline-block;width:80px}.devui-input-number:hover .devui-input-number__input-box:not(.disabled){border:1px solid var(--devui-form-control-line-hover, #575d6c);padding-right:24px}.devui-input-number:hover .devui-input-number__control-buttons:not(.disabled){display:flex;border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-input-number:focus-within .devui-input-number__input-box:not(.disabled){border:1px solid var(--devui-form-control-line-active, #5e7ce0);padding-right:24px}.devui-input-number:focus-within .devui-input-number__control-buttons:not(.disabled){display:flex;border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-input-number.devui-input-number--md{width:80px}.devui-input-number.devui-input-number--md .devui-input-number__input-box{height:32px;line-height:32px}.devui-input-number .devui-input-number__input-box{box-sizing:border-box;padding:4px 8px;font-size:var(--devui-font-size, 14px);border-radius:var(--devui-border-radius, 4px);border:1px solid var(--devui-form-control-line, #d7d8da);outline:none;width:100%;line-height:20px;height:28px;display:block;cursor:text;-moz-appearance:textfield;transition:border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-input-number .devui-input-number__input-box:not(.disabled){background-color:var(--devui-base-bg, #ffffff);border-color:var(--devui-line, #d7d8da);color:var(--devui-text, #252b3a)}.devui-input-number .devui-input-number__input-box::-webkit-inner-spin-button,.devui-input-number .devui-input-number__input-box::-webkit-outer-spin-button{-webkit-appearance:none}.devui-input-number .devui-input-number__control-buttons{display:none;position:absolute;right:0;width:22px;height:100%;flex-direction:column;justify-content:center;align-items:center;border:1px solid transparent;border-left-color:var(--devui-line, #d7d8da);box-sizing:border-box;line-height:100%;border-radius:0 var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0}.devui-input-number .devui-input-number__control-buttons.disabled{border-left-color:var(--devui-disabled-line, #dfe1e6)}.devui-input-number .devui-input-number__control-buttons .control-button{user-select:none;box-sizing:border-box;height:50%;line-height:50%;border-width:0 1px;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));display:flex;justify-content:center;align-items:center;background-color:var(--devui-base-bg, #ffffff)}.devui-input-number .devui-input-number__control-buttons .control-button.control-inc svg{position:relative;top:2px;transform:rotate(180deg)}.devui-input-number .devui-input-number__control-buttons .control-button.control-dec svg{position:relative;bottom:2px}.devui-input-number .devui-input-number__control-buttons .control-button svg path{fill:var(--devui-text-weak, #575d6c)}.devui-input-number .devui-input-number__control-buttons .control-button:not(.disabled){cursor:pointer}.devui-input-number .devui-input-number__control-buttons .control-button:not(.disabled):hover>svg path{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-input-number .devui-input-number__control-buttons .control-button.disabled>svg path{fill:var(--devui-disabled-text, #adb0b8)}.devui-input-number .devui-input-number--lg>.devui-input-number__input-box{font-size:var(--devui-font-size-lg, 14px);line-height:24px;height:46px}.devui-input-number .devui-input-number--lg.devui-input-number__control-buttons .control-button .devui-input-number__icon-arrow{width:16px;height:16px}.devui-input-number .devui-input-number--md>.devui-input-number__input-box{font-size:var(--devui-font-size, 14px);line-height:20px;height:28px}.devui-input-number .devui-input-number--sm>.devui-input-number__input-box{font-size:var(--devui-font-size-sm, 12px);line-height:18px;height:26px}.devui-input-number .devui-input-number--sm.devui-input-number__control-buttons .control-button:first-child .devui-input-number__icon-arrow{width:14px;height:14px}.devui-input-number .devui-input-number--sm.devui-input-number__control-buttons .control-button:last-child .devui-input-number__icon-arrow{width:14px;height:14px}.devui-input-number .devui-input-number__input-wrap{line-height:100%}.devui-input-number .disabled{cursor:not-allowed}

package/layout/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/layout/index.es.js

@@ -0,0 +1,115 @@
+import { defineComponent, createVNode } from "vue";
+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 layout = "";
+var Layout = defineComponent({
+  name: "DLayout",
+  emits: [],
+  setup(props, {
+    slots
+  }) {
+    const ns = useNamespace("layout");
+    return () => {
+      var _a;
+      const slotDefault = (_a = slots.default) == null ? void 0 : _a.call(slots);
+      const isAside = slotDefault.some((item) => item.type.name === "DAside");
+      const classNames = `${isAside ? ns.e("aside") : ""} ${ns.b()}`;
+      return createVNode("div", {
+        "class": classNames
+      }, [slotDefault]);
+    };
+  }
+});
+var content = "";
+var Content = defineComponent({
+  name: "DContent",
+  setup(props, {
+    slots
+  }) {
+    const ns = useNamespace("layout");
+    return () => {
+      var _a;
+      return createVNode("div", {
+        "class": ns.e("content")
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+var header = "";
+var Header = defineComponent({
+  name: "DHeader",
+  setup(props, {
+    slots
+  }) {
+    const ns = useNamespace("layout");
+    return () => {
+      var _a;
+      return createVNode("div", {
+        "class": ns.e("header")
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+var footer = "";
+var Footer = defineComponent({
+  name: "DFooter",
+  setup(props, {
+    slots
+  }) {
+    const ns = useNamespace("layout");
+    return () => {
+      var _a;
+      return createVNode("div", {
+        "class": ns.e("footer")
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+var Aside = defineComponent({
+  name: "DAside",
+  setup(props, {
+    slots
+  }) {
+    const ns = useNamespace("layout");
+    return () => {
+      var _a;
+      return createVNode("div", {
+        "class": ns.em("aside", "inner")
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+var index = {
+  title: "Layout \u5E03\u5C40",
+  category: "\u5E03\u5C40",
+  status: "100%",
+  install(app) {
+    app.component(Layout.name, Layout);
+    app.component(Content.name, Content);
+    app.component(Header.name, Header);
+    app.component(Footer.name, Footer);
+    app.component(Aside.name, Aside);
+  }
+};
+export { Aside, Content, Footer, Header, Layout, index as default };

package/layout/index.umd.js

@@ -0,0 +1 @@
+(function(r,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(r=typeof globalThis!="undefined"?globalThis:r||self,o(r.index={},r.Vue))})(this,function(r,o){"use strict";function i(a,e,t){let n=a;return e&&(n+=`__${e}`),t&&(n+=`--${t}`),n}function u(a,e=!1){const t=e?`.devui-${a}`:`devui-${a}`;return{b:()=>i(t),e:d=>d?i(t,d):"",m:d=>d?i(t,"",d):"",em:(d,C)=>d&&C?i(t,d,C):""}}var N="",c=o.defineComponent({name:"DLayout",emits:[],setup(a,{slots:e}){const t=u("layout");return()=>{var y;const n=(y=e.default)==null?void 0:y.call(e),v=`${n.some(d=>d.type.name==="DAside")?t.e("aside"):""} ${t.b()}`;return o.createVNode("div",{class:v},[n])}}}),A="",m=o.defineComponent({name:"DContent",setup(a,{slots:e}){const t=u("layout");return()=>{var n;return o.createVNode("div",{class:t.e("content")},[(n=e.default)==null?void 0:n.call(e)])}}}),V="",f=o.defineComponent({name:"DHeader",setup(a,{slots:e}){const t=u("layout");return()=>{var n;return o.createVNode("div",{class:t.e("header")},[(n=e.default)==null?void 0:n.call(e)])}}}),$="",s=o.defineComponent({name:"DFooter",setup(a,{slots:e}){const t=u("layout");return()=>{var n;return o.createVNode("div",{class:t.e("footer")},[(n=e.default)==null?void 0:n.call(e)])}}}),p=o.defineComponent({name:"DAside",setup(a,{slots:e}){const t=u("layout");return()=>{var n;return o.createVNode("div",{class:t.em("aside","inner")},[(n=e.default)==null?void 0:n.call(e)])}}}),l={title:"Layout \u5E03\u5C40",category:"\u5E03\u5C40",status:"100%",install(a){a.component(c.name,c),a.component(m.name,m),a.component(f.name,f),a.component(s.name,s),a.component(p.name,p)}};r.Aside=p,r.Content=m,r.Footer=s,r.Header=f,r.Layout=c,r.default=l,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/layout/package.json

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

package/layout/style.css

@@ -0,0 +1 @@
+.devui-layout{display:flex;flex-direction:column;flex:auto}.devui-layout__aside{flex-direction:row}.devui-layout__content{flex:auto;min-height:0}.devui-layout__header{min-height:40px;flex:auto}.devui-layout__footer{text-align:center;line-height:1.5}

package/loading/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;