vue-devui 1.0.0-rc.6 → 1.0.0-rc.9

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.
Files changed (168) hide show
  1. package/README.md +5 -0
  2. package/alert/index.es.js +37 -11
  3. package/alert/index.umd.js +1 -1
  4. package/alert/style.css +1 -1
  5. package/auto-complete/index.es.js +311 -77
  6. package/auto-complete/index.umd.js +3 -5
  7. package/auto-complete/style.css +1 -1
  8. package/avatar/index.es.js +81 -70
  9. package/avatar/index.umd.js +1 -1
  10. package/avatar/style.css +1 -1
  11. package/badge/index.es.js +29 -4
  12. package/badge/index.umd.js +1 -1
  13. package/badge/style.css +1 -1
  14. package/button/index.es.js +5632 -87
  15. package/button/index.umd.js +27 -1
  16. package/button/style.css +1 -1
  17. package/card/index.es.js +56 -29
  18. package/card/index.umd.js +1 -1
  19. package/card/style.css +1 -1
  20. package/checkbox/index.es.js +364 -234
  21. package/checkbox/index.umd.js +1 -1
  22. package/checkbox/style.css +1 -1
  23. package/date-picker/index.es.js +310 -157
  24. package/date-picker/index.umd.js +1 -1
  25. package/date-picker/style.css +1 -1
  26. package/drawer/index.es.js +28 -3
  27. package/drawer/index.umd.js +1 -1
  28. package/drawer/style.css +1 -1
  29. package/dropdown/index.es.js +125 -45
  30. package/dropdown/index.umd.js +1 -1
  31. package/dropdown/style.css +1 -1
  32. package/editable-select/index.es.js +437 -22
  33. package/editable-select/index.umd.js +1 -1
  34. package/editable-select/style.css +1 -1
  35. package/form/index.es.js +490 -605
  36. package/form/index.umd.js +15 -15
  37. package/form/style.css +1 -1
  38. package/fullscreen/index.es.js +29 -5
  39. package/fullscreen/index.umd.js +1 -1
  40. package/fullscreen/style.css +1 -1
  41. package/grid/index.es.js +71 -50
  42. package/grid/index.umd.js +1 -1
  43. package/grid/style.css +1 -1
  44. package/icon/index.es.js +109 -13
  45. package/icon/index.umd.js +1 -1
  46. package/icon/style.css +1 -0
  47. package/image-preview/index.es.js +34 -11
  48. package/image-preview/index.umd.js +1 -1
  49. package/image-preview/style.css +1 -1
  50. package/input/index.es.js +330 -130
  51. package/input/index.umd.js +1 -1
  52. package/input/style.css +1 -1
  53. package/input-number/index.es.js +272 -199
  54. package/input-number/index.umd.js +1 -1
  55. package/input-number/style.css +1 -1
  56. package/layout/index.es.js +34 -6
  57. package/layout/index.umd.js +1 -1
  58. package/layout/style.css +1 -1
  59. package/loading/index.es.js +34 -10
  60. package/loading/index.umd.js +1 -1
  61. package/loading/style.css +1 -1
  62. package/modal/index.es.js +126 -27
  63. package/modal/index.umd.js +1 -1
  64. package/modal/style.css +1 -1
  65. package/notification/index.es.js +125 -25
  66. package/notification/index.umd.js +1 -1
  67. package/notification/style.css +1 -1
  68. package/nuxt/components/ButtonGroup.js +3 -0
  69. package/nuxt/components/CheckboxButton.js +3 -0
  70. package/nuxt/components/CheckboxGroup.js +3 -0
  71. package/nuxt/components/FORM_ITEM_TOKEN.js +3 -0
  72. package/nuxt/components/FORM_TOKEN.js +3 -0
  73. package/nuxt/components/Icon.js +1 -0
  74. package/nuxt/components/LABEL_DATA.js +3 -0
  75. package/nuxt/components/Option.js +3 -0
  76. package/nuxt/components/buttonGroupInjectionKey.js +3 -0
  77. package/nuxt/components/buttonGroupProps.js +3 -0
  78. package/nuxt/components/formControlProps.js +3 -0
  79. package/nuxt/components/formItemProps.js +3 -0
  80. package/nuxt/components/formProps.js +3 -0
  81. package/nuxt/components/iconProps.js +1 -0
  82. package/nuxt/components/svgIconProps.js +3 -0
  83. package/overlay/index.es.js +31 -9
  84. package/overlay/index.umd.js +1 -1
  85. package/overlay/style.css +1 -1
  86. package/package.json +2 -1
  87. package/pagination/index.es.js +135 -124
  88. package/pagination/index.umd.js +1 -1
  89. package/pagination/style.css +1 -1
  90. package/popover/index.es.js +198 -83
  91. package/popover/index.umd.js +16 -16
  92. package/popover/style.css +1 -1
  93. package/progress/index.es.js +76 -20
  94. package/progress/index.umd.js +3 -3
  95. package/progress/style.css +1 -1
  96. package/radio/index.es.js +161 -140
  97. package/radio/index.umd.js +1 -1
  98. package/radio/style.css +1 -1
  99. package/rate/index.es.js +48 -16
  100. package/rate/index.umd.js +1 -1
  101. package/rate/style.css +1 -1
  102. package/result/index.es.js +108 -12
  103. package/result/index.umd.js +1 -1
  104. package/result/style.css +1 -1
  105. package/search/index.es.js +379 -167
  106. package/search/index.umd.js +17 -17
  107. package/search/style.css +1 -1
  108. package/select/index.es.js +7339 -556
  109. package/select/index.umd.js +27 -1
  110. package/select/style.css +1 -1
  111. package/skeleton/index.es.js +37 -12
  112. package/skeleton/index.umd.js +1 -1
  113. package/skeleton/style.css +1 -1
  114. package/slider/index.es.js +34 -10
  115. package/slider/index.umd.js +1 -1
  116. package/slider/style.css +1 -1
  117. package/splitter/index.es.js +201 -84
  118. package/splitter/index.umd.js +14 -14
  119. package/splitter/style.css +1 -1
  120. package/status/index.es.js +26 -2
  121. package/status/index.umd.js +1 -1
  122. package/status/style.css +1 -1
  123. package/style.css +1 -1
  124. package/switch/index.es.js +30 -6
  125. package/switch/index.umd.js +1 -1
  126. package/switch/style.css +1 -1
  127. package/table/index.es.js +6808 -585
  128. package/table/index.umd.js +27 -1
  129. package/table/style.css +1 -1
  130. package/tabs/index.es.js +136 -70
  131. package/tabs/index.umd.js +1 -1
  132. package/tabs/style.css +1 -1
  133. package/tag/index.es.js +31 -7
  134. package/tag/index.umd.js +1 -1
  135. package/tag/style.css +1 -1
  136. package/textarea/index.es.js +5631 -80
  137. package/textarea/index.umd.js +35 -1
  138. package/textarea/style.css +1 -1
  139. package/timeline/index.es.js +108 -12
  140. package/timeline/index.umd.js +1 -1
  141. package/timeline/style.css +1 -1
  142. package/tooltip/index.es.js +190 -74
  143. package/tooltip/index.umd.js +17 -17
  144. package/tooltip/style.css +1 -1
  145. package/tree/index.es.js +376 -256
  146. package/tree/index.umd.js +1 -1
  147. package/tree/style.css +1 -1
  148. package/upload/index.es.js +138 -34
  149. package/upload/index.umd.js +1 -1
  150. package/upload/style.css +1 -1
  151. package/vue-devui.es.js +6770 -5769
  152. package/vue-devui.umd.js +27 -21
  153. package/comment/index.d.ts +0 -7
  154. package/comment/index.es.js +0 -84
  155. package/comment/index.umd.js +0 -1
  156. package/comment/package.json +0 -7
  157. package/comment/style.css +0 -1
  158. package/nuxt/components/Comment.js +0 -3
  159. package/nuxt/components/FormControl.js +0 -3
  160. package/nuxt/components/FormLabel.js +0 -3
  161. package/nuxt/components/ReadTip.js +0 -3
  162. package/nuxt/components/commentProps.js +0 -3
  163. package/nuxt/components/readTipProps.js +0 -3
  164. package/read-tip/index.d.ts +0 -7
  165. package/read-tip/index.es.js +0 -261
  166. package/read-tip/index.umd.js +0 -1
  167. package/read-tip/package.json +0 -7
  168. package/read-tip/style.css +0 -1
package/rate/index.es.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent, reactive, ref, onMounted, createVNode, resolveComponent } from "vue";
1
+ import { defineComponent, ref, watch, onMounted, createVNode, resolveComponent } from "vue";
2
2
  const rateProps = {
3
3
  modelValue: {
4
4
  type: Number,
@@ -41,17 +41,40 @@ const rateProps = {
41
41
  default: void 0
42
42
  }
43
43
  };
44
+ function createBem(namespace, element, modifier) {
45
+ let cls = namespace;
46
+ if (element) {
47
+ cls += `__${element}`;
48
+ }
49
+ if (modifier) {
50
+ cls += `--${modifier}`;
51
+ }
52
+ return cls;
53
+ }
54
+ function useNamespace(block, needDot = false) {
55
+ const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
56
+ const b = () => createBem(namespace);
57
+ const e = (element) => element ? createBem(namespace, element) : "";
58
+ const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
59
+ const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
60
+ return {
61
+ b,
62
+ e,
63
+ m,
64
+ em
65
+ };
66
+ }
44
67
  var rate = "";
45
68
  var Rate = defineComponent({
46
69
  name: "DRate",
47
70
  props: rateProps,
48
71
  emits: ["change", "update:modelValue"],
49
72
  setup(props, ctx) {
50
- const totalLevelArray = reactive([]);
73
+ const totalLevelArray = ref([]);
51
74
  const chooseValue = ref(0);
52
75
  const setChange = (start, end, width) => {
53
76
  for (let i = start; i < end; i++) {
54
- totalLevelArray[i]["width"] = width;
77
+ totalLevelArray.value[i]["width"] = width;
55
78
  }
56
79
  };
57
80
  const initRating = () => {
@@ -60,18 +83,26 @@ var Rate = defineComponent({
60
83
  const intCurrentLevel = Math.floor(chooseValue.value);
61
84
  setChange(0, intCurrentLevel, "100%");
62
85
  if (halfStar > 0) {
63
- totalLevelArray[intCurrentLevel]["width"] = halfStar * 100 + "%";
86
+ totalLevelArray.value[intCurrentLevel]["width"] = halfStar * 100 + "%";
64
87
  setChange(intCurrentLevel + 1, props.count, "0");
65
88
  } else {
66
89
  setChange(intCurrentLevel, props.count, "0");
67
90
  }
68
91
  };
69
- onMounted(() => {
92
+ const initLevelArray = () => {
93
+ totalLevelArray.value = [];
70
94
  for (let i = 0; i < props.count; i++) {
71
- totalLevelArray.push({
95
+ totalLevelArray.value.push({
72
96
  width: "0"
73
97
  });
74
98
  }
99
+ };
100
+ watch([() => props.modelValue, () => props.count], () => {
101
+ initLevelArray();
102
+ initRating();
103
+ });
104
+ onMounted(() => {
105
+ initLevelArray();
75
106
  initRating();
76
107
  });
77
108
  const isSemiSelected = (e) => {
@@ -127,22 +158,24 @@ var Rate = defineComponent({
127
158
  selectValue,
128
159
  onMouseleave
129
160
  } = this;
161
+ const ns = useNamespace("rate");
130
162
  return createVNode("div", {
131
- "class": "devui-star-container",
132
- "onMouseleave": onMouseleave
163
+ "class": ns.b(),
164
+ "onMouseleave": onMouseleave,
165
+ "style": `--star-color: ${color}`
133
166
  }, [totalLevelArray.map((item, index2) => createVNode("div", {
134
- "class": `devui-star-align devui-pointer ${read ? "devui-only-read" : ""}`,
167
+ "class": [ns.m("align"), ns.m("pointer"), read ? ns.m("only-read") : ""],
135
168
  "key": index2,
136
169
  "onMouseover": (e) => hoverToggle(e, index2),
137
170
  "onClick": (e) => selectValue(e, index2)
138
171
  }, [icon && !character && createVNode("span", {
139
- "class": "devui-star-color"
172
+ "class": ns.e("color")
140
173
  }, [createVNode(resolveComponent("d-icon"), {
141
174
  "name": icon
142
175
  }, null)]), character && !icon && createVNode("span", {
143
- "class": "devui-star-color"
176
+ "class": ns.e("color")
144
177
  }, [character]), !icon && !character && createVNode("span", {
145
- "class": "devui-star-color"
178
+ "class": ns.e("color")
146
179
  }, [createVNode("svg", {
147
180
  "width": "16px",
148
181
  "height": "16px",
@@ -161,7 +194,7 @@ var Rate = defineComponent({
161
194
  }, [createVNode("polygon", {
162
195
  "points": "8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"
163
196
  }, null)])])])]), icon && !character && createVNode("span", {
164
- "class": `devui-star-color-active devui-active-star devui-star-color-${type}`,
197
+ "class": [ns.e("color-active"), ns.e("active-star"), ns.em("color", type)],
165
198
  "style": {
166
199
  width: item.width
167
200
  }
@@ -169,15 +202,14 @@ var Rate = defineComponent({
169
202
  "name": icon,
170
203
  "color": color
171
204
  }, null)]), character && !icon && createVNode("span", {
172
- "class": `devui-star-color-active devui-active-star devui-star-color-${type}`,
205
+ "class": [ns.e("color-active"), ns.e("active-star"), ns.em("color", type)],
173
206
  "style": {
174
207
  color,
175
208
  width: item.width
176
209
  }
177
210
  }, [character]), !character && !icon && createVNode("span", {
178
- "class": `devui-star-color-active devui-active-star devui-star-color-${type}`,
211
+ "class": [ns.e("color-active"), ns.e("active-star"), !color ? ns.em("color", type) : ns.em("color", "customize")],
179
212
  "style": {
180
- color,
181
213
  width: item.width
182
214
  }
183
215
  }, [createVNode("svg", {
package/rate/index.umd.js CHANGED
@@ -1 +1 @@
1
- (function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue))})(this,function(r,e){"use strict";const g={modelValue:{type:Number,default:0},read:{type:Boolean,default:!1},count:{type:Number,default:5},type:{type:String,default:""},color:{type:String,default:""},icon:{type:String,default:""},character:{type:String,default:""},allowHalf:{type:Boolean,default:!1},onChange:{type:Function,default:void 0},onTouched:{type:Function,default:void 0}};var p="",f=e.defineComponent({name:"DRate",props:g,emits:["change","update:modelValue"],setup(a,i){const n=e.reactive([]),c=e.ref(0),l=(o,t,h)=>{for(let v=o;v<t;v++)n[v].width=h},s=()=>{c.value=a.modelValue;const o=c.value%1,t=Math.floor(c.value);l(0,t,"100%"),o>0?(n[t].width=o*100+"%",l(t+1,a.count,"0")):l(t,a.count,"0")};e.onMounted(()=>{for(let o=0;o<a.count;o++)n.push({width:"0"});s()});const d=o=>{const t=o.target;return a.allowHalf&&o.offsetX*2<=t.clientWidth};return{totalLevelArray:n,chooseValue:c,hoverToggle:(o,t)=>{if(a.read)return;l(0,t+1,"100%");const h=d(o)?"50%":"100%";l(t,t+1,h),l(t+1,a.count,"0")},selectValue:(o,t)=>{a.read||(l(0,t,"100%"),d(o)?(l(t,t+1,"50%"),c.value=t-.5):(l(t,t+1,"100%"),c.value=t),l(t+1,a.count,"0"),a.onChange&&a.onChange(c.value+1),a.onTouched&&a.onTouched(),i.emit("update:modelValue",c.value+1))},onMouseleave:()=>{s()}}},render(){const{totalLevelArray:a,icon:i,character:n,read:c,type:l,color:s,hoverToggle:d,selectValue:w,onMouseleave:V}=this;return e.createVNode("div",{class:"devui-star-container",onMouseleave:V},[a.map((u,o)=>e.createVNode("div",{class:`devui-star-align devui-pointer ${c?"devui-only-read":""}`,key:o,onMouseover:t=>d(t,o),onClick:t=>w(t,o)},[i&&!n&&e.createVNode("span",{class:"devui-star-color"},[e.createVNode(e.resolveComponent("d-icon"),{name:i},null)]),n&&!i&&e.createVNode("span",{class:"devui-star-color"},[n]),!i&&!n&&e.createVNode("span",{class:"devui-star-color"},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns-xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#E3E5E9",id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])]),i&&!n&&e.createVNode("span",{class:`devui-star-color-active devui-active-star devui-star-color-${l}`,style:{width:u.width}},[e.createVNode(e.resolveComponent("d-icon"),{name:i,color:s},null)]),n&&!i&&e.createVNode("span",{class:`devui-star-color-active devui-active-star devui-star-color-${l}`,style:{color:s,width:u.width}},[n]),!n&&!i&&e.createVNode("span",{class:`devui-star-color-active devui-active-star devui-star-color-${l}`,style:{color:s,width:u.width}},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns-xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])])]))])}}),y={title:"Rate \u8BC4\u5206",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(a){a.component(f.name,f)}};r.Rate=f,r.default=y,r.rateProps=g,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
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 V={modelValue:{type:Number,default:0},read:{type:Boolean,default:!1},count:{type:Number,default:5},type:{type:String,default:""},color:{type:String,default:""},icon:{type:String,default:""},character:{type:String,default:""},allowHalf:{type:Boolean,default:!1},onChange:{type:Function,default:void 0},onTouched:{type:Function,default:void 0}};function g(o,c,a){let r=o;return c&&(r+=`__${c}`),a&&(r+=`--${a}`),r}function p(o,c=!1){const a=c?`.devui-${o}`:`devui-${o}`;return{b:()=>g(a),e:i=>i?g(a,i):"",m:i=>i?g(a,"",i):"",em:(i,h)=>i&&h?g(a,i,h):""}}var k="",m=e.defineComponent({name:"DRate",props:V,emits:["change","update:modelValue"],setup(o,c){const a=e.ref([]),r=e.ref(0),s=(n,t,v)=>{for(let y=n;y<t;y++)a.value[y].width=v},u=()=>{r.value=o.modelValue;const n=r.value%1,t=Math.floor(r.value);s(0,t,"100%"),n>0?(a.value[t].width=n*100+"%",s(t+1,o.count,"0")):s(t,o.count,"0")},f=()=>{a.value=[];for(let n=0;n<o.count;n++)a.value.push({width:"0"})};e.watch([()=>o.modelValue,()=>o.count],()=>{f(),u()}),e.onMounted(()=>{f(),u()});const i=n=>{const t=n.target;return o.allowHalf&&n.offsetX*2<=t.clientWidth};return{totalLevelArray:a,chooseValue:r,hoverToggle:(n,t)=>{if(o.read)return;s(0,t+1,"100%");const v=i(n)?"50%":"100%";s(t,t+1,v),s(t+1,o.count,"0")},selectValue:(n,t)=>{o.read||(s(0,t,"100%"),i(n)?(s(t,t+1,"50%"),r.value=t-.5):(s(t,t+1,"100%"),r.value=t),s(t+1,o.count,"0"),o.onChange&&o.onChange(r.value+1),o.onTouched&&o.onTouched(),c.emit("update:modelValue",r.value+1))},onMouseleave:()=>{u()}}},render(){const{totalLevelArray:o,icon:c,character:a,read:r,type:s,color:u,hoverToggle:f,selectValue:i,onMouseleave:h}=this,l=p("rate");return e.createVNode("div",{class:l.b(),onMouseleave:h,style:`--star-color: ${u}`},[o.map((w,n)=>e.createVNode("div",{class:[l.m("align"),l.m("pointer"),r?l.m("only-read"):""],key:n,onMouseover:t=>f(t,n),onClick:t=>i(t,n)},[c&&!a&&e.createVNode("span",{class:l.e("color")},[e.createVNode(e.resolveComponent("d-icon"),{name:c},null)]),a&&!c&&e.createVNode("span",{class:l.e("color")},[a]),!c&&!a&&e.createVNode("span",{class:l.e("color")},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns-xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#E3E5E9",id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])]),c&&!a&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),l.em("color",s)],style:{width:w.width}},[e.createVNode(e.resolveComponent("d-icon"),{name:c,color:u},null)]),a&&!c&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),l.em("color",s)],style:{color:u,width:w.width}},[a]),!a&&!c&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),u?l.em("color","customize"):l.em("color",s)],style:{width:w.width}},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns-xlink":"http://www.w3.org/1999/xlink"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])])]))])}}),N={title:"Rate \u8BC4\u5206",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(o){o.component(m.name,m)}};d.Rate=m,d.default=N,d.rateProps=V,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});
package/rate/style.css CHANGED
@@ -1 +1 @@
1
- .devui-star-align{font-size:var(--devui-font-size-icon, 16px);margin-right:5px;position:relative;line-height:1}.devui-pointer{cursor:pointer}.devui-star-container{display:inline-flex}.devui-star-color-active{color:#6a81ed;line-height:1.5}.devui-star-color-active svg g{fill:#6a81ed}.devui-star-color-success{color:#3dcca6}.devui-star-color-success svg g{fill:#3dcca6}.devui-star-color-warning{color:#fac20a}.devui-star-color-warning svg g{fill:#fac20a}.devui-star-color-error{color:#f66f6a}.devui-star-color-error svg g{fill:#f66f6a}.devui-active-star{position:absolute;top:0;left:0;overflow:hidden}.devui-star-color{color:var(--devui-dividing-line, #dfe1e6);line-height:1.5}.devui-star-color .icon{color:var(--devui-dividing-line, #dfe1e6)!important}.devui-star-color svg g{fill:var(--devui-dividing-line, #dfe1e6)}.devui-only-read{cursor:not-allowed}
1
+ .devui-rate--align{font-size:var(--devui-font-size-icon, 16px);margin-right:5px;position:relative;line-height:1}.devui-rate--pointer{cursor:pointer}.devui-rate{display:inline-flex}.devui-rate__color-active{color:#6a81ed;line-height:1.5}.devui-rate__color-active svg g{fill:#6a81ed}.devui-rate__color--success{color:#3dcca6}.devui-rate__color--success svg g{fill:#3dcca6}.devui-rate__color--warning{color:#fac20a}.devui-rate__color--warning svg g{fill:#fac20a}.devui-rate__color--error{color:#f66f6a}.devui-rate__color--error svg g{fill:#f66f6a}.devui-rate__color--customize{color:var(--star-color)}.devui-rate__color--customize svg g{fill:var(--star-color)}.devui-rate__active-star{position:absolute;top:0;left:0;overflow:hidden}.devui-rate__color{color:var(--devui-dividing-line, #dfe1e6);line-height:1.5}.devui-rate__color .icon{color:var(--devui-dividing-line, #dfe1e6)!important}.devui-rate__color svg g{fill:var(--devui-dividing-line, #dfe1e6)}.devui-rate--only-read{cursor:not-allowed}
@@ -1,4 +1,4 @@
1
- import { defineComponent, toRefs, createVNode } from "vue";
1
+ import { defineComponent, toRefs, computed, createVNode, resolveDynamicComponent, mergeProps } from "vue";
2
2
  const resultProps = {
3
3
  icon: {
4
4
  type: String,
@@ -13,6 +13,10 @@ const resultProps = {
13
13
  default: ""
14
14
  }
15
15
  };
16
+ function isUrl(value) {
17
+ return /^((http|https):)?\/\//.test(value);
18
+ }
19
+ const DEFAULT_PREFIX = "icon";
16
20
  const iconProps = {
17
21
  name: {
18
22
  type: String,
@@ -20,43 +24,135 @@ const iconProps = {
20
24
  required: true
21
25
  },
22
26
  size: {
23
- type: String,
27
+ type: [Number, String],
24
28
  default: "inherit"
25
29
  },
26
30
  color: {
27
31
  type: String,
28
32
  default: "inherit"
29
33
  },
34
+ component: {
35
+ type: Object,
36
+ default: null
37
+ },
30
38
  classPrefix: {
31
39
  type: String,
32
- default: "icon"
40
+ default: DEFAULT_PREFIX
33
41
  }
34
42
  };
43
+ const svgIconProps = {
44
+ name: {
45
+ type: String,
46
+ default: "",
47
+ required: true
48
+ },
49
+ color: {
50
+ type: String,
51
+ default: "inherit"
52
+ },
53
+ size: {
54
+ type: [Number, String],
55
+ default: "inherit"
56
+ }
57
+ };
58
+ function createBem(namespace, element, modifier) {
59
+ let cls = namespace;
60
+ if (element) {
61
+ cls += `__${element}`;
62
+ }
63
+ if (modifier) {
64
+ cls += `--${modifier}`;
65
+ }
66
+ return cls;
67
+ }
68
+ function useNamespace(block, needDot = false) {
69
+ const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
70
+ const b = () => createBem(namespace);
71
+ const e = (element) => element ? createBem(namespace, element) : "";
72
+ const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
73
+ const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
74
+ return {
75
+ b,
76
+ e,
77
+ m,
78
+ em
79
+ };
80
+ }
81
+ var icon = "";
82
+ var svgIcon = defineComponent({
83
+ name: "DSvgIcon",
84
+ props: svgIconProps,
85
+ setup(props) {
86
+ const {
87
+ name,
88
+ color,
89
+ size
90
+ } = toRefs(props);
91
+ const ns = useNamespace("svg-icon");
92
+ const iconName = computed(() => `#icon-${name.value}`);
93
+ const iconSize = computed(() => {
94
+ return typeof size.value === "number" ? `${size.value}px` : size.value;
95
+ });
96
+ const styles = {
97
+ width: iconSize.value,
98
+ height: iconSize.value
99
+ };
100
+ return () => {
101
+ return createVNode("svg", {
102
+ "class": ns.b(),
103
+ "style": styles
104
+ }, [createVNode("use", {
105
+ "xlink:href": iconName.value,
106
+ "fill": color.value
107
+ }, null)]);
108
+ };
109
+ }
110
+ });
35
111
  var Icon = defineComponent({
36
112
  name: "DIcon",
37
113
  props: iconProps,
38
- setup(props) {
114
+ setup(props, {
115
+ attrs
116
+ }) {
39
117
  const {
118
+ component,
40
119
  name,
41
120
  size,
42
121
  color,
43
122
  classPrefix
44
123
  } = toRefs(props);
45
- return () => {
46
- return /^((https?):)?\/\//.test(name.value) ? createVNode("img", {
124
+ const IconComponent = component.value ? resolveDynamicComponent(component.value) : resolveDynamicComponent(svgIcon);
125
+ const iconSize = computed(() => {
126
+ return typeof size.value === "number" ? `${size.value}px` : size.value;
127
+ });
128
+ const svgIconDom = () => {
129
+ return createVNode(IconComponent, mergeProps({
130
+ "name": name.value,
131
+ "color": color.value,
132
+ "size": iconSize.value
133
+ }, attrs), null);
134
+ };
135
+ const imgIconDom = () => {
136
+ return createVNode("img", mergeProps({
47
137
  "src": name.value,
48
138
  "alt": name.value.split("/")[name.value.split("/").length - 1],
49
139
  "style": {
50
- width: size.value,
51
- verticalAlign: "text-bottom"
140
+ width: iconSize.value || ""
52
141
  }
53
- }, null) : createVNode("i", {
54
- "class": `${classPrefix.value} ${classPrefix.value}-${name.value}`,
142
+ }, attrs), null);
143
+ };
144
+ const fontIconDom = () => {
145
+ const fontIconClass = /^icon-/.test(name.value) ? name.value : `${classPrefix.value}-${name.value}`;
146
+ return createVNode("i", mergeProps({
147
+ "class": [classPrefix.value, fontIconClass],
55
148
  "style": {
56
- fontSize: size.value,
149
+ fontSize: iconSize.value,
57
150
  color: color.value
58
151
  }
59
- }, null);
152
+ }, attrs), null);
153
+ };
154
+ return () => {
155
+ return component.value ? svgIconDom() : isUrl(name.value) ? imgIconDom() : fontIconDom();
60
156
  };
61
157
  }
62
158
  });
@@ -1 +1 @@
1
- (function(s,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis!="undefined"?globalThis:s||self,e(s.index={},s.Vue))})(this,function(s,e){"use strict";const u={icon:{type:String,default:"info"},title:{type:String,default:""},desc:{type:String,default:""}},c={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var f=e.defineComponent({name:"DIcon",props:c,setup(i){const{name:t,size:n,color:l,classPrefix:o}=e.toRefs(i);return()=>/^((https?):)?\/\//.test(t.value)?e.createVNode("img",{src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:n.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${o.value} ${o.value}-${t.value}`,style:{fontSize:n.value,color:l.value}},null)}}),v="",r=e.defineComponent({name:"DResult",props:u,setup(i,t){let n;return function(l){l.success="right-o",l.danger="error-o",l.warning="warning-o",l.info="info-o"}(n||(n={})),()=>{var l,o,a,d;return e.createVNode("div",{class:"devui-result"},[t.slots.icon?e.createVNode("div",null,[(l=t.slots)==null?void 0:l.icon()]):e.createVNode(f,{name:n[i.icon]||"",class:`devui-result__icon-${i.icon}`,size:"64px"},null),e.createVNode("div",{class:"devui-result__title"},[t.slots.title?(o=t.slots)==null?void 0:o.title():i.title]),e.createVNode("div",{class:"devui-result__desc"},[t.slots.desc?(a=t.slots)==null?void 0:a.desc():i.desc]),e.createVNode("div",{class:"devui-result__extra"},[t.slots.extra?(d=t.slots)==null?void 0:d.extra():""])])}}}),p={title:"Result \u7ED3\u679C",category:"\u53CD\u9988",status:"100%",install(i){i.component(r.name,r)}};s.Result=r,s.default=p,s.resultProps=u,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
1
+ (function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue))})(this,function(r,e){"use strict";const f={icon:{type:String,default:"info"},title:{type:String,default:""},desc:{type:String,default:""}};function m(o){return/^((http|https):)?\/\//.test(o)}const v={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"}},g={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function d(o,n,s){let t=o;return n&&(t+=`__${n}`),s&&(t+=`--${s}`),t}function y(o,n=!1){const s=n?`.devui-${o}`:`devui-${o}`;return{b:()=>d(s),e:l=>l?d(s,l):"",m:l=>l?d(s,"",l):"",em:(l,c)=>l&&c?d(s,l,c):""}}var $="",h=e.defineComponent({name:"DSvgIcon",props:g,setup(o){const{name:n,color:s,size:t}=e.toRefs(o),i=y("svg-icon"),a=e.computed(()=>`#icon-${n.value}`),u=e.computed(()=>typeof t.value=="number"?`${t.value}px`:t.value),l={width:u.value,height:u.value};return()=>e.createVNode("svg",{class:i.b(),style:l},[e.createVNode("use",{"xlink:href":a.value,fill:s.value},null)])}}),S=e.defineComponent({name:"DIcon",props:v,setup(o,{attrs:n}){const{component:s,name:t,size:i,color:a,classPrefix:u}=e.toRefs(o),l=s.value?e.resolveDynamicComponent(s.value):e.resolveDynamicComponent(h),c=e.computed(()=>typeof i.value=="number"?`${i.value}px`:i.value),_=()=>e.createVNode(l,e.mergeProps({name:t.value,color:a.value,size:c.value},n),null),D=()=>e.createVNode("img",e.mergeProps({src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:c.value||""}},n),null),P=()=>{const V=/^icon-/.test(t.value)?t.value:`${u.value}-${t.value}`;return e.createVNode("i",e.mergeProps({class:[u.value,V],style:{fontSize:c.value,color:a.value}},n),null)};return()=>s.value?_():m(t.value)?D():P()}}),b="",p=e.defineComponent({name:"DResult",props:f,setup(o,n){let s;return function(t){t.success="right-o",t.danger="error-o",t.warning="warning-o",t.info="info-o"}(s||(s={})),()=>{var t,i,a,u;return e.createVNode("div",{class:"devui-result"},[n.slots.icon?e.createVNode("div",null,[(t=n.slots)==null?void 0:t.icon()]):e.createVNode(S,{name:s[o.icon]||"",class:`devui-result__icon-${o.icon}`,size:"64px"},null),e.createVNode("div",{class:"devui-result__title"},[n.slots.title?(i=n.slots)==null?void 0:i.title():o.title]),e.createVNode("div",{class:"devui-result__desc"},[n.slots.desc?(a=n.slots)==null?void 0:a.desc():o.desc]),e.createVNode("div",{class:"devui-result__extra"},[n.slots.extra?(u=n.slots)==null?void 0:u.extra():""])])}}}),N={title:"Result \u7ED3\u679C",category:"\u53CD\u9988",status:"100%",install(o){o.component(p.name,p)}};r.Result=p,r.default=N,r.resultProps=f,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
package/result/style.css CHANGED
@@ -1 +1 @@
1
- .devui-result{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:30px}.devui-result__icon-success:before{color:var(--devui-success, #50d4ab)}.devui-result__icon-danger:before{color:var(--devui-danger, #f66f6a)}.devui-result__icon-warning:before{color:var(--devui-warning, #fac20a)}.devui-result__icon-info:before{color:var(--devui-info, #5e7ce0)}.devui-result__title{margin-top:20px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size-lg, 14px)}.devui-result__desc{margin-top:10px;color:var(--devui-text-weak, #575d6c);font-size:var(--devui-font-size-md, 12px)}.devui-result__extra{margin-top:30px}
1
+ .devui-svg-icon{vertical-align:middle}.devui-result{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:30px}.devui-result__icon-success:before{color:var(--devui-success, #50d4ab)}.devui-result__icon-danger:before{color:var(--devui-danger, #f66f6a)}.devui-result__icon-warning:before{color:var(--devui-warning, #fac20a)}.devui-result__icon-info:before{color:var(--devui-info, #5e7ce0)}.devui-result__title{margin-top:20px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size-lg, 14px)}.devui-result__desc{margin-top:10px;color:var(--devui-text-weak, #575d6c);font-size:var(--devui-font-size-md, 12px)}.devui-result__extra{margin-top:30px}