vue-devui 1.0.0-beta.7 → 1.0.0-pre.0

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 (303) hide show
  1. package/README.md +81 -66
  2. package/accordion/index.es.js +522 -39
  3. package/accordion/index.umd.js +1 -1
  4. package/accordion/style.css +1 -1
  5. package/alert/index.es.js +7 -8
  6. package/alert/index.umd.js +1 -1
  7. package/alert/style.css +1 -1
  8. package/{toast → auto-complete}/index.d.ts +0 -0
  9. package/auto-complete/index.es.js +976 -0
  10. package/auto-complete/index.umd.js +1 -0
  11. package/auto-complete/package.json +7 -0
  12. package/auto-complete/style.css +1 -0
  13. package/avatar/index.es.js +1 -1
  14. package/avatar/index.umd.js +1 -1
  15. package/back-top/index.es.js +1 -1
  16. package/back-top/index.umd.js +1 -1
  17. package/badge/index.es.js +13 -19
  18. package/badge/index.umd.js +1 -1
  19. package/button/index.es.js +263 -83
  20. package/button/index.umd.js +1 -1
  21. package/button/style.css +1 -1
  22. package/card/index.es.js +1 -1
  23. package/card/index.umd.js +1 -1
  24. package/carousel/index.es.js +7 -6
  25. package/carousel/index.umd.js +1 -1
  26. package/cascader/index.es.js +5393 -773
  27. package/cascader/index.umd.js +27 -1
  28. package/checkbox/index.es.js +1 -1
  29. package/checkbox/index.umd.js +1 -1
  30. package/checkbox/style.css +1 -1
  31. package/color-picker/index.d.ts +7 -0
  32. package/color-picker/index.es.js +8187 -0
  33. package/color-picker/index.umd.js +27 -0
  34. package/color-picker/package.json +7 -0
  35. package/color-picker/style.css +1 -0
  36. package/comment/index.es.js +42 -13
  37. package/comment/index.umd.js +1 -1
  38. package/comment/style.css +1 -1
  39. package/countdown/index.d.ts +7 -0
  40. package/countdown/index.es.js +176 -0
  41. package/countdown/index.umd.js +1 -0
  42. package/countdown/package.json +7 -0
  43. package/countdown/style.css +1 -0
  44. package/date-picker/index.es.js +11 -12
  45. package/date-picker/index.umd.js +1 -1
  46. package/date-picker/style.css +1 -1
  47. package/dragdrop/index.es.js +135 -10
  48. package/dragdrop/index.umd.js +1 -1
  49. package/drawer/index.es.js +173 -203
  50. package/drawer/index.umd.js +1 -1
  51. package/drawer/style.css +1 -1
  52. package/dropdown/index.es.js +412 -302
  53. package/dropdown/index.umd.js +1 -1
  54. package/dropdown/style.css +1 -1
  55. package/editable-select/index.es.js +275 -5610
  56. package/editable-select/index.umd.js +1 -27
  57. package/editable-select/style.css +1 -1
  58. package/form/index.es.js +6129 -461
  59. package/form/index.umd.js +27 -1
  60. package/form/style.css +1 -1
  61. package/fullscreen/index.es.js +111 -119
  62. package/fullscreen/index.umd.js +1 -1
  63. package/fullscreen/style.css +1 -1
  64. package/gantt/index.es.js +6 -18
  65. package/gantt/index.umd.js +1 -1
  66. package/gantt/style.css +1 -1
  67. package/grid/index.es.js +3 -3
  68. package/grid/index.umd.js +1 -1
  69. package/grid/style.css +1 -1
  70. package/icon/index.es.js +3 -2
  71. package/icon/index.umd.js +1 -1
  72. package/image-preview/index.es.js +78 -20
  73. package/image-preview/index.umd.js +1 -1
  74. package/image-preview/style.css +1 -1
  75. package/input/index.es.js +5 -6
  76. package/input/index.umd.js +1 -1
  77. package/input/style.css +1 -1
  78. package/input-icon/index.es.js +6 -6
  79. package/input-icon/index.umd.js +1 -1
  80. package/input-icon/style.css +1 -1
  81. package/input-number/index.es.js +2 -1
  82. package/input-number/index.umd.js +1 -1
  83. package/layout/index.es.js +1 -1
  84. package/layout/index.umd.js +1 -1
  85. package/list/index.d.ts +7 -0
  86. package/list/index.es.js +39 -0
  87. package/list/index.umd.js +1 -0
  88. package/{toast → list}/package.json +1 -1
  89. package/list/style.css +1 -0
  90. package/loading/index.es.js +3 -3
  91. package/loading/index.umd.js +1 -1
  92. package/modal/index.es.js +297 -761
  93. package/modal/index.umd.js +1 -1
  94. package/modal/style.css +1 -1
  95. package/nav-sprite/index.es.js +1 -675
  96. package/nav-sprite/index.umd.js +1 -1
  97. package/notification/index.d.ts +7 -0
  98. package/notification/index.es.js +286 -0
  99. package/notification/index.umd.js +1 -0
  100. package/notification/package.json +7 -0
  101. package/notification/style.css +1 -0
  102. package/nuxt/components/Accordion.js +3 -0
  103. package/nuxt/components/Alert.js +3 -0
  104. package/nuxt/components/Anchor.js +3 -0
  105. package/nuxt/components/Aside.js +3 -0
  106. package/nuxt/components/AutoComplete.js +3 -0
  107. package/nuxt/components/Avatar.js +3 -0
  108. package/nuxt/components/BackTop.js +3 -0
  109. package/nuxt/components/Badge.js +3 -0
  110. package/nuxt/components/Breadcrumb.js +3 -0
  111. package/nuxt/components/Button.js +3 -0
  112. package/nuxt/components/Card.js +3 -0
  113. package/nuxt/components/Carousel.js +3 -0
  114. package/nuxt/components/CarouselItem.js +3 -0
  115. package/nuxt/components/Cascader.js +3 -0
  116. package/nuxt/components/Checkbox.js +3 -0
  117. package/nuxt/components/Col.js +3 -0
  118. package/nuxt/components/ColorPicker.js +3 -0
  119. package/nuxt/components/Column.js +3 -0
  120. package/nuxt/components/Comment.js +3 -0
  121. package/nuxt/components/Content.js +3 -0
  122. package/nuxt/components/Countdown.js +3 -0
  123. package/nuxt/components/DatePicker.js +3 -0
  124. package/nuxt/components/Drawer.js +3 -0
  125. package/nuxt/components/DrawerService.js +3 -0
  126. package/nuxt/components/Dropdown.js +3 -0
  127. package/nuxt/components/DropdownMenu.js +3 -0
  128. package/nuxt/components/EditableSelect.js +3 -0
  129. package/nuxt/components/FixedOverlay.js +3 -0
  130. package/nuxt/components/FlexibleOverlay.js +3 -0
  131. package/nuxt/components/Footer.js +3 -0
  132. package/nuxt/components/Form.js +3 -0
  133. package/nuxt/components/FormControl.js +3 -0
  134. package/nuxt/components/FormItem.js +3 -0
  135. package/nuxt/components/FormLabel.js +3 -0
  136. package/nuxt/components/FormOperation.js +3 -0
  137. package/nuxt/components/Fullscreen.js +3 -0
  138. package/nuxt/components/Gantt.js +3 -0
  139. package/nuxt/components/Header.js +3 -0
  140. package/nuxt/components/IFileOptions.js +3 -0
  141. package/nuxt/components/IUploadOptions.js +3 -0
  142. package/nuxt/components/Icon.js +2 -0
  143. package/nuxt/components/ImagePreviewService.js +3 -0
  144. package/nuxt/components/Input.js +3 -0
  145. package/nuxt/components/InputIcon.js +3 -0
  146. package/nuxt/components/InputNumber.js +3 -0
  147. package/nuxt/components/Layout.js +3 -0
  148. package/nuxt/components/List.js +3 -0
  149. package/nuxt/components/ListItem.js +3 -0
  150. package/nuxt/components/Loading.js +3 -0
  151. package/nuxt/components/LoadingService.js +3 -0
  152. package/nuxt/components/Modal.js +3 -0
  153. package/nuxt/components/NavSprite.js +2 -0
  154. package/nuxt/components/Notification.js +3 -0
  155. package/nuxt/components/NotificationService.js +3 -0
  156. package/nuxt/components/Pagination.js +3 -0
  157. package/nuxt/components/Panel.js +3 -0
  158. package/nuxt/components/Popover.js +3 -0
  159. package/nuxt/components/Progress.js +3 -0
  160. package/nuxt/components/QuadrantDiagram.js +3 -0
  161. package/nuxt/components/Radio.js +3 -0
  162. package/nuxt/components/RadioGroup.js +3 -0
  163. package/nuxt/components/Rate.js +3 -0
  164. package/nuxt/components/ReadTip.js +3 -0
  165. package/nuxt/components/Result.js +3 -0
  166. package/nuxt/components/Row.js +3 -0
  167. package/nuxt/components/Search.js +3 -0
  168. package/nuxt/components/Select.js +3 -0
  169. package/nuxt/components/Skeleton.js +3 -0
  170. package/nuxt/components/SkeletonItem.js +3 -0
  171. package/nuxt/components/Slider.js +3 -0
  172. package/nuxt/components/Splitter.js +3 -0
  173. package/nuxt/components/Statistic.js +3 -0
  174. package/nuxt/components/Status.js +3 -0
  175. package/nuxt/components/StepsGuide.js +3 -0
  176. package/nuxt/components/StickSlider.js +3 -0
  177. package/nuxt/components/Sticky.js +2 -0
  178. package/nuxt/components/Switch.js +3 -0
  179. package/nuxt/components/Table.js +3 -0
  180. package/nuxt/components/Tabs.js +3 -0
  181. package/nuxt/components/Tag.js +3 -0
  182. package/nuxt/components/TagInput.js +3 -0
  183. package/nuxt/components/Textarea.js +3 -0
  184. package/nuxt/components/TimeAxis.js +3 -0
  185. package/nuxt/components/TimeAxisItem.js +3 -0
  186. package/nuxt/components/TimePicker.js +3 -0
  187. package/nuxt/components/Tooltip.js +3 -0
  188. package/nuxt/components/Transfer.js +3 -0
  189. package/nuxt/components/Tree.js +3 -0
  190. package/nuxt/components/TreeSelect.js +3 -0
  191. package/nuxt/components/Upload.js +3 -0
  192. package/nuxt/components/UploadStatus.js +3 -0
  193. package/nuxt/components/badgeProps.js +3 -0
  194. package/nuxt/components/buttonProps.js +3 -0
  195. package/nuxt/components/dropdownMenuProps.js +3 -0
  196. package/nuxt/components/fixedOverlayProps.js +3 -0
  197. package/nuxt/components/flexibleOverlayProps.js +3 -0
  198. package/nuxt/components/notificationProps.js +3 -0
  199. package/nuxt/components/overlayEmits.js +3 -0
  200. package/nuxt/components/overlayProps.js +3 -0
  201. package/nuxt/components/popoverProps.js +3 -0
  202. package/nuxt/components/tooltipProps.js +3 -0
  203. package/nuxt/components/uploadProps.js +3 -0
  204. package/nuxt/index.js +13 -0
  205. package/overlay/index.es.js +146 -200
  206. package/overlay/index.umd.js +1 -1
  207. package/overlay/style.css +1 -1
  208. package/package.json +10 -18
  209. package/pagination/index.es.js +4 -4
  210. package/pagination/index.umd.js +1 -1
  211. package/pagination/style.css +1 -1
  212. package/panel/index.es.js +3 -3
  213. package/panel/index.umd.js +1 -1
  214. package/popover/index.es.js +5948 -190
  215. package/popover/index.umd.js +27 -1
  216. package/popover/style.css +1 -1
  217. package/progress/index.es.js +9 -9
  218. package/progress/index.umd.js +3 -3
  219. package/quadrant-diagram/index.es.js +5405 -166
  220. package/quadrant-diagram/index.umd.js +27 -1
  221. package/radio/index.es.js +6 -6
  222. package/radio/index.umd.js +1 -1
  223. package/radio/style.css +1 -1
  224. package/rate/index.es.js +1 -1
  225. package/rate/index.umd.js +1 -1
  226. package/read-tip/index.es.js +21 -7
  227. package/read-tip/index.umd.js +1 -1
  228. package/read-tip/style.css +1 -1
  229. package/result/index.d.ts +7 -0
  230. package/result/index.es.js +119 -0
  231. package/result/index.umd.js +1 -0
  232. package/result/package.json +7 -0
  233. package/result/style.css +1 -0
  234. package/ripple/index.es.js +6 -3
  235. package/ripple/index.umd.js +1 -1
  236. package/search/index.es.js +5435 -201
  237. package/search/index.umd.js +27 -1
  238. package/search/style.css +1 -1
  239. package/select/index.es.js +3 -2
  240. package/select/index.umd.js +1 -1
  241. package/select/style.css +1 -1
  242. package/skeleton/index.es.js +1 -1
  243. package/skeleton/index.umd.js +1 -1
  244. package/slider/index.es.js +3 -6
  245. package/slider/index.umd.js +1 -1
  246. package/slider/style.css +1 -1
  247. package/splitter/index.es.js +5904 -60
  248. package/splitter/index.umd.js +27 -1
  249. package/splitter/style.css +1 -1
  250. package/statistic/index.d.ts +7 -0
  251. package/statistic/index.es.js +267 -0
  252. package/statistic/index.umd.js +1 -0
  253. package/statistic/package.json +7 -0
  254. package/statistic/style.css +1 -0
  255. package/status/index.es.js +2 -2
  256. package/status/index.umd.js +1 -1
  257. package/status/style.css +1 -1
  258. package/steps-guide/index.es.js +8 -6
  259. package/steps-guide/index.umd.js +1 -1
  260. package/sticky/index.umd.js +1 -1
  261. package/style.css +1 -1
  262. package/switch/index.es.js +1 -1
  263. package/switch/index.umd.js +1 -1
  264. package/table/index.es.js +701 -359
  265. package/table/index.umd.js +1 -1
  266. package/table/style.css +1 -1
  267. package/tabs/index.es.js +3 -4
  268. package/tabs/index.umd.js +1 -1
  269. package/tabs/style.css +1 -1
  270. package/tag/index.es.js +37 -11
  271. package/tag/index.umd.js +1 -1
  272. package/tag/style.css +1 -1
  273. package/tag-input/index.es.js +1 -13
  274. package/tag-input/index.umd.js +1 -1
  275. package/textarea/index.es.js +1 -1
  276. package/textarea/index.umd.js +1 -1
  277. package/textarea/style.css +1 -1
  278. package/{theme → theme/theme.scss} +0 -0
  279. package/time-axis/index.es.js +5 -2
  280. package/time-axis/index.umd.js +1 -1
  281. package/time-picker/index.es.js +269 -84
  282. package/time-picker/index.umd.js +1 -1
  283. package/time-picker/style.css +1 -1
  284. package/tooltip/index.es.js +5798 -141
  285. package/tooltip/index.umd.js +27 -1
  286. package/tooltip/style.css +1 -1
  287. package/transfer/index.es.js +6522 -635
  288. package/transfer/index.umd.js +27 -1
  289. package/transfer/style.css +1 -1
  290. package/tree/index.es.js +5858 -146
  291. package/tree/index.umd.js +27 -1
  292. package/tree/style.css +1 -1
  293. package/tree-select/index.es.js +130 -35
  294. package/tree-select/index.umd.js +1 -1
  295. package/tree-select/style.css +1 -1
  296. package/upload/index.es.js +464 -2681
  297. package/upload/index.umd.js +1 -1
  298. package/upload/style.css +1 -1
  299. package/vue-devui.es.js +15597 -14569
  300. package/vue-devui.umd.js +16 -16
  301. package/toast/index.es.js +0 -2059
  302. package/toast/index.umd.js +0 -1
  303. package/toast/style.css +0 -1
package/icon/index.es.js CHANGED
@@ -49,7 +49,8 @@ var Icon = defineComponent({
49
49
  "src": name,
50
50
  "alt": name.split("/")[name.split("/").length - 1],
51
51
  "style": {
52
- width: size
52
+ width: size,
53
+ verticalAlign: "text-bottom"
53
54
  }
54
55
  }, null) : createVNode("i", {
55
56
  "class": `${classPrefix} ${classPrefix}-${name}`,
@@ -66,7 +67,7 @@ Icon.install = function(app) {
66
67
  var index = {
67
68
  title: "Icon \u56FE\u6807",
68
69
  category: "\u901A\u7528",
69
- status: "\u5DF2\u5B8C\u6210",
70
+ status: "100%",
70
71
  install(app) {
71
72
  app.use(Icon);
72
73
  }
package/icon/index.umd.js CHANGED
@@ -1 +1 @@
1
- var f=Object.defineProperty;var r=Object.getOwnPropertySymbols;var a=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var s=(t,e,n)=>e in t?f(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,l=(t,e)=>{for(var n in e||(e={}))a.call(e,n)&&s(t,n,e[n]);if(r)for(var n of r(e))p.call(e,n)&&s(t,n,e[n]);return t};(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";var n=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(i){return l({},i)},render(){const{name:i,size:u,color:c,classPrefix:o}=this;return/^((https?):)?\/\//.test(i)?e.createVNode("img",{src:i,alt:i.split("/")[i.split("/").length-1],style:{width:u}},null):e.createVNode("i",{class:`${o} ${o}-${i}`,style:{fontSize:u,color:c}},null)}});n.install=function(i){i.component(n.name,n)};var d={title:"Icon \u56FE\u6807",category:"\u901A\u7528",status:"\u5DF2\u5B8C\u6210",install(i){i.use(n)}};t.Icon=n,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
1
+ var a=Object.defineProperty;var s=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var u=(t,e,n)=>e in t?a(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,l=(t,e)=>{for(var n in e||(e={}))f.call(e,n)&&u(t,n,e[n]);if(s)for(var n of s(e))p.call(e,n)&&u(t,n,e[n]);return t};(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";var n=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(i){return l({},i)},render(){const{name:i,size:o,color:c,classPrefix:r}=this;return/^((https?):)?\/\//.test(i)?e.createVNode("img",{src:i,alt:i.split("/")[i.split("/").length-1],style:{width:o,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${r} ${r}-${i}`,style:{fontSize:o,color:c}},null)}});n.install=function(i){i.component(n.name,n)};var d={title:"Icon \u56FE\u6807",category:"\u901A\u7528",status:"100%",install(i){i.use(n)}};t.Icon=n,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
@@ -4,16 +4,26 @@ var __publicField = (obj, key, value) => {
4
4
  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
5
  return value;
6
6
  };
7
- import { defineComponent, ref, computed, onMounted, onUnmounted, createVNode, createTextVNode, createApp } from "vue";
7
+ import { defineComponent, ref, computed, onMounted, onUnmounted, createVNode, Fragment, createTextVNode, createApp } from "vue";
8
8
  var imagePreview$1 = "";
9
9
  const imagePreviewProps = {
10
10
  url: {
11
11
  type: String,
12
- default: ""
12
+ default: "",
13
+ required: true
13
14
  },
14
15
  previewUrlList: {
15
16
  type: Array,
16
- default: () => []
17
+ default: () => [],
18
+ required: true
19
+ },
20
+ zIndex: {
21
+ type: Number,
22
+ required: false
23
+ },
24
+ backDropZIndex: {
25
+ type: Number,
26
+ required: false
17
27
  }
18
28
  };
19
29
  class Transform {
@@ -140,6 +150,12 @@ var imagePreview = defineComponent({
140
150
  let transform = null;
141
151
  const index2 = ref(0);
142
152
  const url = computed(() => props.previewUrlList[index2.value]);
153
+ const imageStyle = props.zIndex ? {
154
+ zIndex: props.zIndex
155
+ } : {};
156
+ const bgStyle = props.backDropZIndex ? {
157
+ zIndex: props.backDropZIndex
158
+ } : {};
143
159
  function initTransform() {
144
160
  const imageElement = document.querySelector(".devui-image-preview-main-image");
145
161
  transform = new Transform(imageElement);
@@ -197,8 +213,9 @@ var imagePreview = defineComponent({
197
213
  unKeyBoard();
198
214
  });
199
215
  return () => {
200
- return createVNode("div", {
201
- "class": "devui-image-preview"
216
+ return createVNode(Fragment, null, [createVNode("div", {
217
+ "class": "devui-image-preview",
218
+ "style": imageStyle
202
219
  }, [createVNode("img", {
203
220
  "class": "devui-image-preview-main-image",
204
221
  "src": url.value
@@ -356,7 +373,10 @@ var imagePreview = defineComponent({
356
373
  "fill-rule": "nonzero"
357
374
  }, null)])])]), createVNode("button", {
358
375
  "onClick": onZoomOriginal
359
- }, [createVNode("span", null, [createTextVNode("1:1")])])])]);
376
+ }, [createVNode("span", null, [createTextVNode("1:1")])])])]), createVNode("div", {
377
+ "class": "devui-image-preview-bg",
378
+ "style": bgStyle
379
+ }, null)]);
360
380
  };
361
381
  }
362
382
  });
@@ -384,8 +404,13 @@ class ImagePreviewService {
384
404
  __publicField(ImagePreviewService, "$body", null);
385
405
  __publicField(ImagePreviewService, "$div", null);
386
406
  __publicField(ImagePreviewService, "$overflow", "");
387
- function mountedPreviewImages(url, urlList) {
388
- ImagePreviewService.open({ url, previewUrlList: urlList });
407
+ function mountedPreviewImages(props) {
408
+ ImagePreviewService.open({
409
+ url: props.url,
410
+ previewUrlList: props.previewUrlList,
411
+ zIndex: props.zIndex,
412
+ backDropZIndex: props.backDropZIndex
413
+ });
389
414
  }
390
415
  function unmountedPreviewImages() {
391
416
  ImagePreviewService.close();
@@ -395,16 +420,26 @@ function getImgByEl(el) {
395
420
  return urlList;
396
421
  }
397
422
  function handleImgByEl(el) {
398
- el.addEventListener("click", (e) => {
399
- var _a;
400
- e.stopPropagation();
401
- const target = e.target;
402
- if (((_a = target == null ? void 0 : target.nodeName) == null ? void 0 : _a.toLowerCase()) === "img") {
403
- const urlList = getImgByEl(el);
404
- const url = target.getAttribute("src");
405
- mountedPreviewImages(url, urlList);
406
- }
407
- });
423
+ el.addEventListener("click", handleImg);
424
+ }
425
+ function removeHandle(el) {
426
+ el.removeEventListener("click", handleImg);
427
+ }
428
+ function handleImg(e) {
429
+ var _a;
430
+ e.stopPropagation();
431
+ const el = e.currentTarget;
432
+ const target = e.target;
433
+ if (((_a = target == null ? void 0 : target.nodeName) == null ? void 0 : _a.toLowerCase()) === "img") {
434
+ const urlList = getImgByEl(el);
435
+ const url = target.getAttribute("src");
436
+ mountedPreviewImages({
437
+ url,
438
+ previewUrlList: urlList,
439
+ zIndex: el == null ? void 0 : el.zIndex,
440
+ backDropZIndex: el == null ? void 0 : el.backDropZIndex
441
+ });
442
+ }
408
443
  }
409
444
  var ImagePreviewDirective = {
410
445
  mounted(el, binding) {
@@ -415,7 +450,12 @@ var ImagePreviewDirective = {
415
450
  if (custom instanceof Object) {
416
451
  custom.open = () => {
417
452
  const urlList = getImgByEl(el);
418
- mountedPreviewImages(urlList == null ? void 0 : urlList[0], urlList);
453
+ mountedPreviewImages({
454
+ url: urlList == null ? void 0 : urlList[0],
455
+ previewUrlList: urlList,
456
+ zIndex: el == null ? void 0 : el.zIndex,
457
+ backDropZIndex: el == null ? void 0 : el.backDropZIndex
458
+ });
419
459
  };
420
460
  custom.close = () => unmountedPreviewImages();
421
461
  }
@@ -426,12 +466,30 @@ var ImagePreviewDirective = {
426
466
  },
427
467
  unmounted() {
428
468
  unmountedPreviewImages();
469
+ },
470
+ updated(el, binding) {
471
+ var _a, _b;
472
+ el.zIndex = (_a = binding.value) == null ? void 0 : _a.zIndex;
473
+ el.backDropZIndex = (_b = binding.value) == null ? void 0 : _b.backDropZIndex;
474
+ if (binding.value) {
475
+ const {
476
+ value: { disableDefault },
477
+ oldValue: { disableDefault: oldDisableDefault }
478
+ } = binding;
479
+ if (disableDefault !== oldDisableDefault) {
480
+ if (disableDefault) {
481
+ removeHandle(el);
482
+ } else {
483
+ handleImgByEl(el);
484
+ }
485
+ }
486
+ }
429
487
  }
430
488
  };
431
489
  var index = {
432
490
  title: "ImagePreview \u56FE\u7247\u9884\u89C8",
433
491
  category: "\u6570\u636E\u5C55\u793A",
434
- status: "\u5DF2\u5B8C\u6210",
492
+ status: "100%",
435
493
  install(app) {
436
494
  app.directive("d-image-preview", ImagePreviewDirective);
437
495
  app.config.globalProperties.$imagePreviewService = ImagePreviewService;
@@ -1 +1 @@
1
- var E=Object.defineProperty;var O=(r,e,c)=>e in r?E(r,e,{enumerable:!0,configurable:!0,writable:!0,value:c}):r[e]=c;var n=(r,e,c)=>(O(r,typeof e!="symbol"?e+"":e,c),c);(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";var c="";const N={url:{type:String,default:""},previewUrlList:{type:Array,default:()=>[]}};class V{constructor(t,o={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=t,this.transformX=o.transformX||this.TRANSFORMX,this.transformY=o.transformY||this.TRANSFORMY,this.zoom=o.zoom||this.ZOOM,this.rotate=o.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=t=>{const o=t.clientX,s=t.clientY;document.onmousemove=l=>{const h=l.clientX-o,u=l.clientY-s;this.transformX=this.oTransformX+h,this.transformY=this.oTransformY+u,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const t=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=o=>{const s=-o.wheelDelta||o.deltaY||o.detail;t(s)}}throttle(t,o){let s=null;return(...l)=>{s||setTimeout(()=>{s=null,t.apply(this,l)},o)}}setMouseWheel(t){if(t<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(t=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+t),this.setPosition()}setZoomOut(t=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-t),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var y=e.defineComponent({name:"DImagePreview",props:N,emits:[],setup(i){let t=null;const o=e.ref(0),s=e.computed(()=>i.previewUrlList[o.value]);function l(){const d=document.querySelector(".devui-image-preview-main-image");t=new V(d)}function h(){o.value=i.previewUrlList.findIndex(d=>d===i.url)}function u(){o.value=o.value<=0?i.previewUrlList.length-1:o.value-1}function f(){o.value=o.value>=i.previewUrlList.length-1?0:o.value+1}function v(){a.close()}function b(){t.setZoomIn()}function k(){t.setZoomOut()}function P(){t.setRotate()}function Z(){t.setZoomBest()}function T(){t.setZoomOriginal()}function C(d){d.defaultPrevented||(d.code=="Escape"?v():d.code=="ArrowLeft"?u():d.code=="ArrowRight"&&f())}function A(){document.addEventListener("keydown",C,!1)}function $(){document.removeEventListener("keydown",C,!1)}return e.onMounted(()=>{h(),l(),A()}),e.onUnmounted(()=>{$()}),()=>e.createVNode("div",{class:"devui-image-preview"},[e.createVNode("img",{class:"devui-image-preview-main-image",src:s.value},null),e.createVNode("button",{class:"devui-image-preview-close-btn",onClick:v},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-left",onClick:u},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-right",onClick:f},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:b},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:k},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:P},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:u},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:"devui-image-preview-index"},[o.value+1,e.createTextVNode(":"),i.previewUrlList.length]),e.createVNode("button",{class:"devui-next",onClick:f},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:Z},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:T},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])])}});function x(i){return e.createApp(y,i)}class a{static open(t){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),x(t).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var t;(t=this.$body)==null||t.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function m(i,t){a.open({url:i,previewUrlList:t})}function g(){a.close()}function L(i){return[...i.querySelectorAll("img")].map(o=>o.getAttribute("src"))}function w(i){i.addEventListener("click",t=>{var s;t.stopPropagation();const o=t.target;if(((s=o==null?void 0:o.nodeName)==null?void 0:s.toLowerCase())==="img"){const l=L(i),h=o.getAttribute("src");m(h,l)}})}var p={mounted(i,t){if(!t.value)return w(i);const{custom:o,disableDefault:s}=t.value;o instanceof Object&&(o.open=()=>{const l=L(i);m(l==null?void 0:l[0],l)},o.close=()=>g()),!s&&w(i)},unmounted(){g()}},M={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"\u5DF2\u5B8C\u6210",install(i){i.directive("d-image-preview",p),i.config.globalProperties.$imagePreviewService=a}};r.ImagePreviewDirective=p,r.ImagePreviewService=a,r.default=M,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
1
+ var S=Object.defineProperty;var O=(r,e,u)=>e in r?S(r,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):r[e]=u;var n=(r,e,u)=>(O(r,typeof e!="symbol"?e+"":e,u),u);(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";var u="";const y={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class b{constructor(o,i={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=o,this.transformX=i.transformX||this.TRANSFORMX,this.transformY=i.transformY||this.TRANSFORMY,this.zoom=i.zoom||this.ZOOM,this.rotate=i.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=o=>{const i=o.clientX,s=o.clientY;document.onmousemove=l=>{const c=l.clientX-i,f=l.clientY-s;this.transformX=this.oTransformX+c,this.transformY=this.oTransformY+f,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const o=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=i=>{const s=-i.wheelDelta||i.deltaY||i.detail;o(s)}}throttle(o,i){let s=null;return(...l)=>{s||setTimeout(()=>{s=null,o.apply(this,l)},i)}}setMouseWheel(o){if(o<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(o=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+o),this.setPosition()}setZoomOut(o=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-o),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var V=e.defineComponent({name:"DImagePreview",props:y,emits:[],setup(t){let o=null;const i=e.ref(0),s=e.computed(()=>t.previewUrlList[i.value]),l=t.zIndex?{zIndex:t.zIndex}:{},c=t.backDropZIndex?{zIndex:t.backDropZIndex}:{};function f(){const d=document.querySelector(".devui-image-preview-main-image");o=new b(d)}function M(){i.value=t.previewUrlList.findIndex(d=>d===t.url)}function m(){i.value=i.value<=0?t.previewUrlList.length-1:i.value-1}function g(){i.value=i.value>=t.previewUrlList.length-1?0:i.value+1}function N(){a.close()}function z(){o.setZoomIn()}function P(){o.setZoomOut()}function T(){o.setRotate()}function D(){o.setZoomBest()}function A(){o.setZoomOriginal()}function C(d){d.defaultPrevented||(d.code=="Escape"?N():d.code=="ArrowLeft"?m():d.code=="ArrowRight"&&g())}function $(){document.addEventListener("keydown",C,!1)}function E(){document.removeEventListener("keydown",C,!1)}return e.onMounted(()=>{M(),f(),$()}),e.onUnmounted(()=>{E()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"devui-image-preview",style:l},[e.createVNode("img",{class:"devui-image-preview-main-image",src:s.value},null),e.createVNode("button",{class:"devui-image-preview-close-btn",onClick:N},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-left",onClick:m},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-right",onClick:g},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:z},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:P},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:T},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:m},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:"devui-image-preview-index"},[i.value+1,e.createTextVNode(":"),t.previewUrlList.length]),e.createVNode("button",{class:"devui-next",onClick:g},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:D},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:A},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])]),e.createVNode("div",{class:"devui-image-preview-bg",style:c},null)])}});function k(t){return e.createApp(V,t)}class a{static open(o){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),k(o).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var o;(o=this.$body)==null||o.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function L(t){a.open({url:t.url,previewUrlList:t.previewUrlList,zIndex:t.zIndex,backDropZIndex:t.backDropZIndex})}function w(){a.close()}function v(t){return[...t.querySelectorAll("img")].map(i=>i.getAttribute("src"))}function h(t){t.addEventListener("click",p)}function I(t){t.removeEventListener("click",p)}function p(t){var s;t.stopPropagation();const o=t.currentTarget,i=t.target;if(((s=i==null?void 0:i.nodeName)==null?void 0:s.toLowerCase())==="img"){const l=v(o),c=i.getAttribute("src");L({url:c,previewUrlList:l,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})}}var x={mounted(t,o){if(!o.value)return h(t);const{custom:i,disableDefault:s}=o.value;i instanceof Object&&(i.open=()=>{const l=v(t);L({url:l==null?void 0:l[0],previewUrlList:l,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})},i.close=()=>w()),!s&&h(t)},unmounted(){w()},updated(t,o){var i,s;if(t.zIndex=(i=o.value)==null?void 0:i.zIndex,t.backDropZIndex=(s=o.value)==null?void 0:s.backDropZIndex,o.value){const{value:{disableDefault:l},oldValue:{disableDefault:c}}=o;l!==c&&(l?I(t):h(t))}}},Z={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.directive("d-image-preview",x),t.config.globalProperties.$imagePreviewService=a}};r.ImagePreviewDirective=x,r.ImagePreviewService=a,r.default=Z,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
@@ -1 +1 @@
1
- .devui-image-preview{position:fixed;left:0;top:0;right:0;bottom:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1);background:var(--devui-shadow, rgba(0, 0, 0, .2));border-radius:var(--devui-border-radius, 2px);box-shadow:var(--devui-shadow-fullscreen-overlay, 0 8px 40px 0) var(--devui-shadow, rgba(0, 0, 0, .2));display:flex;align-items:center;justify-content:center;overflow:hidden}.devui-image-preview svg,.devui-image-preview polygon,.devui-image-preview g,.devui-image-preview path{fill:var(--devui-icon-text, #252b3a)}.devui-image-preview-main-image{width:auto;height:auto;max-width:90%;max-height:90%;margin-top:-20px;cursor:grab}.devui-image-preview-close-btn{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:15px;right:20px}.devui-image-preview-close-btn:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-close-btn svg{width:38px;height:18px}.devui-image-preview-arrow-left{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:50%;left:20px;transform:translateY(-50%)}.devui-image-preview-arrow-left:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-arrow-left svg{width:38px;height:18px}.devui-image-preview-arrow-right{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:50%;right:20px;transform:translateY(-50%)}.devui-image-preview-arrow-right:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-arrow-right svg{width:38px;height:18px}.devui-image-preview-toolbar{position:fixed;bottom:0;left:0;width:100%;height:50px;display:flex;align-items:center;justify-content:center;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-fullscreen-overlay, 0 8px 40px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1))}.devui-image-preview-toolbar button{display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;color:var(--devui-text, #252b3a)}.devui-image-preview-toolbar .devui-image-preview-index{display:inline-flex;width:100px;justify-content:center;align-items:center;cursor:pointer}.devui-image-preview-toolbar>:not(:first-child){margin-left:20px}
1
+ .devui-image-preview{position:fixed;left:0;top:0;right:0;bottom:0;z-index:calc(var(--devui-z-index-modal, 1050));display:flex;align-items:center;justify-content:center;overflow:hidden}.devui-image-preview svg,.devui-image-preview polygon,.devui-image-preview g,.devui-image-preview path{fill:var(--devui-icon-text, #252b3a)}.devui-image-preview-main-image{width:auto;height:auto;max-width:90%;max-height:90%;margin-top:-20px;cursor:grab}.devui-image-preview-close-btn{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:15px;right:20px}.devui-image-preview-close-btn:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-close-btn svg{width:38px;height:18px}.devui-image-preview-arrow-left{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:50%;left:20px;transform:translateY(-50%)}.devui-image-preview-arrow-left:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-arrow-left svg{width:38px;height:18px}.devui-image-preview-arrow-right{position:fixed;z-index:var(--devui-z-index-modal, 1050);cursor:pointer;width:36px;height:36px;border-radius:50%;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-length-base, 0 1px 4px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1));display:inline-flex;align-items:center;justify-content:center;top:50%;right:20px;transform:translateY(-50%)}.devui-image-preview-arrow-right:hover{background:var(--devui-area, #f8f8f8)}.devui-image-preview-arrow-right svg{width:38px;height:18px}.devui-image-preview-toolbar{position:fixed;bottom:0;left:0;width:100%;height:50px;display:flex;align-items:center;justify-content:center;background:var(--devui-highlight-overlay, rgba(255, 255, 255, .8));box-shadow:var(--devui-shadow-fullscreen-overlay, 0 8px 40px 0) var(--devui-light-shadow, rgba(0, 0, 0, .1))}.devui-image-preview-toolbar button{display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;color:var(--devui-text, #252b3a)}.devui-image-preview-toolbar .devui-image-preview-index{display:inline-flex;width:100px;justify-content:center;align-items:center;cursor:pointer}.devui-image-preview-toolbar>:not(:first-child){margin-left:20px}.devui-image-preview-bg{position:fixed;left:0;top:0;right:0;bottom:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1);background:var(--devui-shadow, rgba(0, 0, 0, .2));border-radius:var(--devui-border-radius, 2px);box-shadow:var(--devui-shadow-fullscreen-overlay, 0 8px 40px 0) var(--devui-shadow, rgba(0, 0, 0, .2))}
package/input/index.es.js CHANGED
@@ -87,18 +87,17 @@ var Input = defineComponent({
87
87
  return {
88
88
  error: props.error,
89
89
  [props.cssClass]: true,
90
+ "devui-input-restore": showPwdIcon.value,
90
91
  [sizeCls.value]: props.size !== ""
91
92
  };
92
93
  });
93
94
  const showPreviewIcon = computed(() => inputType.value === "password");
94
95
  watch(() => props.showPassword, (flg) => {
95
96
  inputType.value = flg ? "password" : "text";
97
+ showPwdIcon.value = props.showPassword;
96
98
  }, {
97
99
  immediate: true
98
100
  });
99
- watch(() => props.modelValue, (value) => {
100
- value && value.length > 0 && showPreviewIcon.value ? showPwdIcon.value = true : showPwdIcon.value = false;
101
- });
102
101
  const onInput = ($event) => {
103
102
  ctx.emit("update:modelValue", $event.target.value);
104
103
  hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.input);
@@ -166,11 +165,11 @@ var Input = defineComponent({
166
165
  "class": "devui-input__preview",
167
166
  "onClick": onChangeInputType
168
167
  }, [showPreviewIcon ? createVNode(resolveComponent("d-icon"), {
169
- "name": "preview",
168
+ "name": "preview-forbidden",
170
169
  "size": "12px",
171
170
  "key": 1
172
171
  }, null) : createVNode(resolveComponent("d-icon"), {
173
- "name": "preview-forbidden",
172
+ "name": "preview",
174
173
  "size": "12px",
175
174
  "key": 2
176
175
  }, null)])]);
@@ -182,7 +181,7 @@ Input.install = function(app) {
182
181
  var index = {
183
182
  title: "Input \u8F93\u5165\u6846",
184
183
  category: "\u6570\u636E\u5F55\u5165",
185
- status: "\u5DF2\u5B8C\u6210",
184
+ status: "100%",
186
185
  install(app) {
187
186
  app.use(Input);
188
187
  }
@@ -1 +1 @@
1
- (function(o,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis!="undefined"?globalThis:o||self,e(o.index={},o.Vue))})(this,function(o,e){"use strict";const F={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update: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 b="";const C=Symbol("dFormItem"),c={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var i=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(n,u){u.value&&n.focus()}}},props:F,emits:["update:modelValue","focus","blur","change","keydown"],setup(n,u){const d=e.inject(C,{}),l=Object.keys(d).length>0,p=e.computed(()=>`devui-input-${n.size}`),s=e.ref(!1),a=e.ref("text"),f=e.computed(()=>({error:n.error,[n.cssClass]:!0,[p.value]:n.size!==""})),r=e.computed(()=>a.value==="password");return e.watch(()=>n.showPassword,t=>{a.value=t?"password":"text"},{immediate:!0}),e.watch(()=>n.modelValue,t=>{t&&t.length>0&&r.value?s.value=!0:s.value=!1}),{inputCls:f,inputType:a,showPreviewIcon:r,showPwdIcon:s,onInput:t=>{u.emit("update:modelValue",t.target.value),l&&d.formItemMitt.emit(c.input)},onFocus:()=>{u.emit("focus")},onBlur:()=>{u.emit("blur"),l&&d.formItemMitt.emit(c.blur)},onChange:t=>{u.emit("change",t.target.value),l&&d.formItemMitt.emit(c.change)},onKeydown:t=>{u.emit("keydown",t)},onChangeInputType:()=>{a.value=a.value==="password"?"text":"password"}}},render(){const{modelValue:n,showPreviewIcon:u,showPwdIcon:d,inputCls:l,inputType:p,maxLength:s,autoFocus:a,placeholder:f,disabled:r,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g,onChangeInputType:I}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:n,disabled:r,type:p,maxlength:s,placeholder:f,class:l,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g}),null),[[e.resolveDirective("focus"),a]]),d&&e.createVNode("div",{class:"devui-input__preview",onClick:I},[u?e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:2},null)])])}});i.install=function(n){n.component(i.name,i)};var v={title:"Input \u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"\u5DF2\u5B8C\u6210",install(n){n.use(i)}};o.Input=i,o.default=v,Object.defineProperty(o,"__esModule",{value:!0}),o[Symbol.toStringTag]="Module"});
1
+ (function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";const v={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update: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 b="";const F=Symbol("dFormItem"),r={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var a=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(n,o){o.value&&n.focus()}}},props:v,emits:["update:modelValue","focus","blur","change","keydown"],setup(n,o){const i=e.inject(F,{}),s=Object.keys(i).length>0,p=e.computed(()=>`devui-input-${n.size}`),l=e.ref(!1),u=e.ref("text"),c=e.computed(()=>({error:n.error,[n.cssClass]:!0,"devui-input-restore":l.value,[p.value]:n.size!==""})),f=e.computed(()=>u.value==="password");return e.watch(()=>n.showPassword,d=>{u.value=d?"password":"text",l.value=n.showPassword},{immediate:!0}),{inputCls:c,inputType:u,showPreviewIcon:f,showPwdIcon:l,onInput:d=>{o.emit("update:modelValue",d.target.value),s&&i.formItemMitt.emit(r.input)},onFocus:()=>{o.emit("focus")},onBlur:()=>{o.emit("blur"),s&&i.formItemMitt.emit(r.blur)},onChange:d=>{o.emit("change",d.target.value),s&&i.formItemMitt.emit(r.change)},onKeydown:d=>{o.emit("keydown",d)},onChangeInputType:()=>{u.value=u.value==="password"?"text":"password"}}},render(){const{modelValue:n,showPreviewIcon:o,showPwdIcon:i,inputCls:s,inputType:p,maxLength:l,autoFocus:u,placeholder:c,disabled:f,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g,onChangeInputType:I}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:n,disabled:f,type:p,maxlength:l,placeholder:c,class:s,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g}),null),[[e.resolveDirective("focus"),u]]),i&&e.createVNode("div",{class:"devui-input__preview",onClick:I},[o?e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:2},null)])])}});a.install=function(n){n.component(a.name,a)};var C={title:"Input \u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(n){n.use(a)}};t.Input=a,t.default=C,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
package/input/style.css CHANGED
@@ -1 +1 @@
1
- @charset "UTF-8";.devui-form-controls input[type=text],.devui-form-controls input[type=password],[dInput]{width:100%;height:28px;font-size:var(--devui-font-size, 12px)}.devui-form-controls input[type=text].devui-input-sm,.devui-form-controls input[type=password].devui-input-sm,[dInput].devui-input-sm{font-size:var(--devui-font-size-sm, 12px);height:26px}.devui-form-controls input[type=text].devui-input-lg,.devui-form-controls input[type=password].devui-input-lg,[dInput].devui-input-lg{font-size:var(--devui-font-size-lg, 14px);height:46px}[dTextArea]{width:100%}.devui-form-controls textarea,[dInput],[dTextarea]{box-sizing:border-box;padding:4px 10px;color:var(--devui-text, #252b3a);vertical-align:middle;border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);outline:none;background-color:var(--devui-base-bg, #ffffff);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-form-controls textarea:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-form-controls textarea:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-form-controls textarea[disabled],.devui-form-controls textarea[disabled]:hover,.devui-form-controls textarea.disabled,.devui-form-controls textarea.disabled:hover,.devui-form-controls textarea.devui-disabled,.devui-form-controls textarea.devui-disabled:hover,[dInput][disabled],[dInput][disabled]:hover,[dInput].disabled,[dInput].disabled:hover,[dInput].devui-disabled,[dInput].devui-disabled:hover,[dTextarea][disabled],[dTextarea][disabled]:hover,[dTextarea].disabled,[dTextarea].disabled:hover,[dTextarea].devui-disabled,[dTextarea].devui-disabled:hover{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f6);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8)}.devui-form-controls textarea,[dTextarea]{width:100%}.devui-input-group{position:relative;display:table;border-collapse:separate}.devui-input-group-addon{border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);display:table-cell;padding:0 10px;text-align:center}.devui-input-group-addon:last-child{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}.devui-input-group-addon:first-child{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.devui-input{outline:none;background-color:var(--devui-base-bg, #ffffff);border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);padding:5px 10px;line-height:16px;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);width:100%;display:block;cursor:text;height:28px;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-input:hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-input:focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-input[disabled],.devui-input[disabled]:hover,.devui-input[disabled]:focus,.devui-input[disabled]:hover:focus,.devui-input.disabled,.devui-input.disabled:hover,.devui-input.disabled:focus,.devui-input.disabled:hover:focus,.devui-input.devui-disabled,.devui-input.devui-disabled:hover,.devui-input.devui-disabled:focus,.devui-input.devui-disabled:hover:focus{border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8);background-color:var(--devui-disabled-bg, #f5f5f6);cursor:not-allowed}.devui-input::placeholder{color:var(--devui-placeholder, #8a8e99)}.devui-input.devui-search-in-dropdown{margin:0;border:none;padding:5px 26px 5px 10px;background-color:var(--devui-embed-search-bg, #f2f5fc);color:var(--devui-text, #252b3a)}.devui-input.devui-search-in-dropdown:-ms-input-placeholder{color:var(--devui-placeholder, #8a8e99)}.devui-input.devui-search-in-dropdown:hover{background-color:var(--devui-embed-search-bg-hover, #eef0f5)}.devui-input-group>.devui-input{display:table-cell}.devui-input-group>.devui-input:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.devui-input-group>.devui-input:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.devui-input-group>.devui-input:not(:first-child):not(:last-child){border-radius:0}.devui-input-lg{font-size:var(--devui-font-size-page-title, 16px);line-height:20px;height:32px}.devui-input-sm{font-size:var(--devui-font-size, 12px);line-height:14px;height:26px}.devui-dropup,.devui-dropdown{position:relative}.devui-form-group{position:relative}.devui-form-control{color:var(--devui-text, #252b3a);background-color:var(--devui-base-bg, #ffffff);padding:5px 10px;border:1px solid var(--devui-form-control-line, #adb0b8);display:block;width:100%;height:28px;border-radius:var(--devui-border-radius, 2px);outline:0;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-form-control[disabled],.devui-form-control[disabled]:hover,.devui-form-control[disabled]:focus,.devui-form-control.disabled,.devui-form-control.disabled:hover,.devui-form-control.disabled:focus,.devui-form-control.devui-disabled,.devui-form-control.devui-disabled:hover,.devui-form-control.devui-disabled:focus{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-form-control[disabled],.devui-form-control[disabled]>input,.devui-form-control[disabled]:hover,.devui-form-control[disabled]:hover>input,.devui-form-control[disabled]:focus,.devui-form-control[disabled]:focus>input,.devui-form-control.disabled,.devui-form-control.disabled>input,.devui-form-control.disabled:hover,.devui-form-control.disabled:hover>input,.devui-form-control.disabled:focus,.devui-form-control.disabled:focus>input,.devui-form-control.devui-disabled,.devui-form-control.devui-disabled>input,.devui-form-control.devui-disabled:hover,.devui-form-control.devui-disabled:hover>input,.devui-form-control.devui-disabled:focus,.devui-form-control.devui-disabled:focus>input{color:var(--devui-disabled-text, #adb0b8);background-color:var(--devui-disabled-bg, #f5f5f6);cursor:not-allowed}.devui-form-control:hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-form-control:focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border){border-color:var(--devui-form-control-line, #adb0b8);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):hover:not(:focus):not(.devui-dropdown-origin-open){border-color:var(--devui-form-control-line-hover, #575d6c)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus,:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus-within{outline:none;border-color:var(--devui-form-control-line-active, #5e7ce0)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border).devui-dropdown-origin-open{outline:none;border-color:var(--devui-connected-overlay-line, #526ecc)}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]){min-height:28px}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled){color:var(--devui-text, #252b3a)}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-input,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-form-control{height:26px}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not(.devui-select-underlined-border):not(.devui-dropdown-no-border):not(.devui-no-border){border-radius:var(--devui-border-radius, 2px);border-width:1px;border-style:solid}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:focus{border-color:transparent}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:focus{background-color:var(--devui-disabled-bg, #f5f5f6)}input::-moz-placeholder{color:var(--devui-placeholder, #8a8e99)}input:-ms-input-placeholder{color:var(--devui-placeholder, #8a8e99)}input::-webkit-input-placeholder{color:var(--devui-placeholder, #8a8e99)}[dInput]:not([disabled]):not(.disabled):not(.devui-disabled).error,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).error,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}[dDatePicker]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{background-color:var(--devui-danger-bg, #ffeeed)}d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup,d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown{border-color:var(--devui-danger-line, #f66f6a)}d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-select-input:not(.devui-select-search)+.devui-form-control-feedback,d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown .devui-form-group .devui-select-input:not(.devui-select-search)+.devui-form-control-feedback{background-color:var(--devui-danger-bg, #ffeeed)}d-editable-select:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-form-group:not(.multiple-label-auto-complete-disabled) input.devui-form-control.devui-dropdown-origin{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-single-picker{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-single-picker .devui-input:not(.devui-disabled){background-color:var(--devui-danger-bg, #ffeeed)}d-range-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-range-picker{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-range-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-range-picker .devui-input:not(.devui-disabled){background-color:var(--devui-danger-bg, #ffeeed)}d-input-number:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .input-box:not(:disabled){border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-multi-auto-complete:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled).multiple-label-auto-complete.multiple-label-auto-complete-border ul.devui-dropdown-origin{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-multi-auto-complete:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) input[dAutoComplete]{background-color:var(--devui-danger-bg, #ffeeed)}d-tags-input:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) div.devui-tags.devui-form-control{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-tags-input:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) input.devui-input{background-color:var(--devui-danger-bg, #ffeeed)}d-tree-select:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled)>div.devui-select-input.devui-dropdown-origin.devui-tree-select-input{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-search:not([disabled]):not(.disabled):not(.devui-disabled).devui-error input.devui-input{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-editor-md:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{border-color:var(--devui-danger-line, #f66f6a)}d-editor:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .ql-toolbar,d-editor:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .ql-container{border-color:var(--devui-danger-line, #f66f6a)}d-form-control d-search{width:100%}.devui-form-controls.devui-form-control-has-suffix [dInput],.devui-form-controls.devui-form-control-has-suffix [dTextArea]{padding-right:28px}.devui-form-controls.devui-form-control-has-suffix.devui-form-control-has-feedback [dInput],.devui-form-controls.devui-form-control-has-suffix.devui-form-control-has-feedback [dTextArea]{padding-right:56px}.devui-form-controls.devui-form-control-has-feedback [dInput],.devui-form-controls.devui-form-control-has-feedback [dTextarea]{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-icon{right:24px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-icon-left{padding-right:30px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input{padding-right:54px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit{padding-right:84px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line.devui-search-line-sm{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear.devui-search-clear-sm{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-input-sm{padding-right:54px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit.devui-input-sm{padding-right:84px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line.devui-search-line-lg{right:70px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear.devui-search-clear-lg{right:70px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-input-lg{padding-right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit.devui-input-lg{padding-right:95px}.devui-form-controls.devui-form-control-has-feedback d-select .devui-form-group .devui-select-input{padding-right:48px}.devui-form-controls.devui-form-control-has-feedback d-select .devui-form-group .devui-form-control-feedback{right:24px}.devui-form-controls.devui-form-control-has-feedback d-tree-select{vertical-align:middle}.devui-form-controls.devui-form-control-has-feedback d-tree-select .devui-tree-select .devui-select-input.devui-tree-select-input{padding-right:52px}.devui-form-controls.devui-form-control-has-feedback d-tree-select .devui-tree-select .devui-select-chevron-icon{right:34px}.devui-form-controls.devui-form-control-has-feedback d-input-number{width:100%}.devui-form-controls.devui-form-control-has-feedback d-input-number .input-control-buttons{right:32px}.devui-form-controls.devui-form-control-has-feedback d-input-number .input-box{padding-right:32px}.devui-form-controls.devui-form-control-has-feedback d-input-number:hover .input-box:not(.disabled){padding-right:58px}.devui-form-controls.devui-form-control-has-feedback d-tags-input .devui-tags{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-multi-auto-complete .multiple-label-auto-complete ul{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-editable-select .devui-form-group.devui-has-feedback>.devui-form-control-feedback{right:24px}.devui-form-controls.devui-form-control-has-feedback d-editable-select>div>.devui-form-control{padding-right:48px}.devui-form-controls.devui-form-control-has-feedback [dDatePicker].devui-form-control{padding-right:32px}.devui-input__wrap{position:relative;display:flex;justify-content:"space-between";align-items:center}.devui-input__preview{position:absolute;width:32px;height:16px;right:0;text-align:center;line-height:16px;cursor:pointer;display:flex;justify-content:center;align-items:center;flex-direction:column}
1
+ @charset "UTF-8";.devui-form-controls input[type=text],.devui-form-controls input[type=password],[dInput]{width:100%;height:28px;font-size:var(--devui-font-size, 12px)}.devui-form-controls input[type=text].devui-input-sm,.devui-form-controls input[type=password].devui-input-sm,[dInput].devui-input-sm{font-size:var(--devui-font-size-sm, 12px);height:26px}.devui-form-controls input[type=text].devui-input-lg,.devui-form-controls input[type=password].devui-input-lg,[dInput].devui-input-lg{font-size:var(--devui-font-size-lg, 14px);height:46px}[dTextArea]{width:100%}.devui-form-controls textarea,[dInput],[dTextarea]{box-sizing:border-box;padding:4px 10px;color:var(--devui-text, #252b3a);vertical-align:middle;border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);outline:none;background-color:var(--devui-base-bg, #ffffff);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-form-controls textarea:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-form-controls textarea:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-form-controls textarea[disabled],.devui-form-controls textarea[disabled]:hover,.devui-form-controls textarea.disabled,.devui-form-controls textarea.disabled:hover,.devui-form-controls textarea.devui-disabled,.devui-form-controls textarea.devui-disabled:hover,[dInput][disabled],[dInput][disabled]:hover,[dInput].disabled,[dInput].disabled:hover,[dInput].devui-disabled,[dInput].devui-disabled:hover,[dTextarea][disabled],[dTextarea][disabled]:hover,[dTextarea].disabled,[dTextarea].disabled:hover,[dTextarea].devui-disabled,[dTextarea].devui-disabled:hover{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f6);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8)}.devui-form-controls textarea,[dTextarea]{width:100%}.devui-input-group{position:relative;display:table;border-collapse:separate}.devui-input-group-addon{border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);display:table-cell;padding:0 10px;text-align:center}.devui-input-group-addon:last-child{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}.devui-input-group-addon:first-child{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.devui-input{outline:none;background-color:var(--devui-base-bg, #ffffff);border:1px solid var(--devui-form-control-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);padding:5px 10px;line-height:16px;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);width:100%;display:block;cursor:text;height:28px;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-input:hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-input:focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-input[disabled],.devui-input[disabled]:hover,.devui-input[disabled]:focus,.devui-input[disabled]:hover:focus,.devui-input.disabled,.devui-input.disabled:hover,.devui-input.disabled:focus,.devui-input.disabled:hover:focus,.devui-input.devui-disabled,.devui-input.devui-disabled:hover,.devui-input.devui-disabled:focus,.devui-input.devui-disabled:hover:focus{border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8);background-color:var(--devui-disabled-bg, #f5f5f6);cursor:not-allowed}.devui-input::placeholder{color:var(--devui-placeholder, #8a8e99)}.devui-input.devui-search-in-dropdown{margin:0;border:none;padding:5px 26px 5px 10px;background-color:var(--devui-embed-search-bg, #f2f5fc);color:var(--devui-text, #252b3a)}.devui-input.devui-search-in-dropdown:-ms-input-placeholder{color:var(--devui-placeholder, #8a8e99)}.devui-input.devui-search-in-dropdown:hover{background-color:var(--devui-embed-search-bg-hover, #eef0f5)}.devui-input-group>.devui-input{display:table-cell}.devui-input-group>.devui-input:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.devui-input-group>.devui-input:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.devui-input-group>.devui-input:not(:first-child):not(:last-child){border-radius:0}.devui-input-lg{font-size:var(--devui-font-size-page-title, 16px);line-height:20px;height:32px}.devui-input-sm{font-size:var(--devui-font-size, 12px);line-height:14px;height:26px}.devui-dropup,.devui-dropdown,.devui-form-group{position:relative}.devui-form-control{color:var(--devui-text, #252b3a);background-color:var(--devui-base-bg, #ffffff);display:block;border-radius:var(--devui-border-radius, 2px);outline:0;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-form-control[disabled],.devui-form-control[disabled]:hover,.devui-form-control[disabled]:focus,.devui-form-control.disabled,.devui-form-control.disabled:hover,.devui-form-control.disabled:focus,.devui-form-control.devui-disabled,.devui-form-control.devui-disabled:hover,.devui-form-control.devui-disabled:focus{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-form-control[disabled],.devui-form-control[disabled]>input,.devui-form-control[disabled]:hover,.devui-form-control[disabled]:hover>input,.devui-form-control[disabled]:focus,.devui-form-control[disabled]:focus>input,.devui-form-control.disabled,.devui-form-control.disabled>input,.devui-form-control.disabled:hover,.devui-form-control.disabled:hover>input,.devui-form-control.disabled:focus,.devui-form-control.disabled:focus>input,.devui-form-control.devui-disabled,.devui-form-control.devui-disabled>input,.devui-form-control.devui-disabled:hover,.devui-form-control.devui-disabled:hover>input,.devui-form-control.devui-disabled:focus,.devui-form-control.devui-disabled:focus>input{color:var(--devui-disabled-text, #adb0b8);background-color:var(--devui-disabled-bg, #f5f5f6);cursor:not-allowed}.devui-form-control:hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-form-control:focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border){border-color:var(--devui-form-control-line, #adb0b8);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):hover:not(:focus):not(.devui-dropdown-origin-open){border-color:var(--devui-form-control-line-hover, #575d6c)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus,:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus-within{outline:none;border-color:var(--devui-form-control-line-active, #5e7ce0)}:not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border).devui-dropdown-origin-open{outline:none;border-color:var(--devui-connected-overlay-line, #526ecc)}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]){min-height:28px}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled){color:var(--devui-text, #252b3a)}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-input,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-form-control{height:26px}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not(.devui-select-underlined-border):not(.devui-dropdown-no-border):not(.devui-no-border){border-radius:var(--devui-border-radius, 2px);border-width:1px;border-style:solid}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])>.devui-dropdown-default:focus{border-color:transparent}.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled]>.devui-dropdown-default:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled>.devui-dropdown-default:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-input-group-addon,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:hover,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:active,.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled>.devui-dropdown-default:focus{background-color:var(--devui-disabled-bg, #f5f5f6)}input::-moz-placeholder{color:var(--devui-placeholder, #8a8e99)}input:-ms-input-placeholder{color:var(--devui-placeholder, #8a8e99)}input::-webkit-input-placeholder{color:var(--devui-placeholder, #8a8e99)}[dInput]:not([disabled]):not(.disabled):not(.devui-disabled).error,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).error,[dInput]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error,[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}[dDatePicker]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{background-color:var(--devui-danger-bg, #ffeeed)}d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup,d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown{border-color:var(--devui-danger-line, #f66f6a)}d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-select-input:not(.devui-select-search)+.devui-form-control-feedback,d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown .devui-form-group .devui-select-input:not(.devui-select-search)+.devui-form-control-feedback{background-color:var(--devui-danger-bg, #ffeeed)}d-editable-select:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-form-group:not(.multiple-label-auto-complete-disabled) input.devui-form-control.devui-dropdown-origin{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-single-picker{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-single-picker .devui-input:not(.devui-disabled){background-color:var(--devui-danger-bg, #ffeeed)}d-range-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-range-picker{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-range-datepicker-pro:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .devui-datepicker-pro-wrapper:not([disabled]):not(.disabled):not(.devui-disabled) .devui-dropdown-toggle .devui-range-picker .devui-input:not(.devui-disabled){background-color:var(--devui-danger-bg, #ffeeed)}d-input-number:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .input-box:not(:disabled){border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-multi-auto-complete:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled).multiple-label-auto-complete.multiple-label-auto-complete-border ul.devui-dropdown-origin{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-multi-auto-complete:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) input[dAutoComplete]{background-color:var(--devui-danger-bg, #ffeeed)}d-tags-input:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) div.devui-tags.devui-form-control{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-tags-input:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled) input.devui-input{background-color:var(--devui-danger-bg, #ffeeed)}d-tree-select:not([disabled]):not(.disabled):not(.devui-disabled).devui-error :not(.multiple-label-auto-complete-disabled)>div.devui-select-input.devui-dropdown-origin.devui-tree-select-input{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-search:not([disabled]):not(.disabled):not(.devui-disabled).devui-error input.devui-input{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}d-editor-md:not([disabled]):not(.disabled):not(.devui-disabled).devui-error{border-color:var(--devui-danger-line, #f66f6a)}d-editor:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .ql-toolbar,d-editor:not([disabled]):not(.disabled):not(.devui-disabled).devui-error .ql-container{border-color:var(--devui-danger-line, #f66f6a)}d-form-control d-search{width:100%}.devui-form-controls.devui-form-control-has-suffix [dInput],.devui-form-controls.devui-form-control-has-suffix [dTextArea]{padding-right:28px}.devui-form-controls.devui-form-control-has-suffix.devui-form-control-has-feedback [dInput],.devui-form-controls.devui-form-control-has-suffix.devui-form-control-has-feedback [dTextArea]{padding-right:56px}.devui-form-controls.devui-form-control-has-feedback [dInput],.devui-form-controls.devui-form-control-has-feedback [dTextarea]{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-icon{right:24px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-icon-left{padding-right:30px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input{padding-right:54px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit{padding-right:84px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line.devui-search-line-sm{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear.devui-search-clear-sm{right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-input-sm{padding-right:54px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit.devui-input-sm{padding-right:84px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-line.devui-search-line-lg{right:70px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-search-clear.devui-search-clear-lg{right:70px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-input-lg{padding-right:60px}.devui-form-controls.devui-form-control-has-feedback d-search .devui-search .devui-input.devui-clear-exit.devui-input-lg{padding-right:95px}.devui-form-controls.devui-form-control-has-feedback d-select .devui-form-group .devui-select-input{padding-right:48px}.devui-form-controls.devui-form-control-has-feedback d-select .devui-form-group .devui-form-control-feedback{right:24px}.devui-form-controls.devui-form-control-has-feedback d-tree-select{vertical-align:middle}.devui-form-controls.devui-form-control-has-feedback d-tree-select .devui-tree-select .devui-select-input.devui-tree-select-input{padding-right:52px}.devui-form-controls.devui-form-control-has-feedback d-tree-select .devui-tree-select .devui-select-chevron-icon{right:34px}.devui-form-controls.devui-form-control-has-feedback d-input-number{width:100%}.devui-form-controls.devui-form-control-has-feedback d-input-number .input-control-buttons{right:32px}.devui-form-controls.devui-form-control-has-feedback d-input-number .input-box{padding-right:32px}.devui-form-controls.devui-form-control-has-feedback d-input-number:hover .input-box:not(.disabled){padding-right:58px}.devui-form-controls.devui-form-control-has-feedback d-tags-input .devui-tags{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-multi-auto-complete .multiple-label-auto-complete ul{padding-right:28px}.devui-form-controls.devui-form-control-has-feedback d-editable-select .devui-form-group.devui-has-feedback>.devui-form-control-feedback{right:24px}.devui-form-controls.devui-form-control-has-feedback d-editable-select>div>.devui-form-control{padding-right:48px}.devui-form-controls.devui-form-control-has-feedback [dDatePicker].devui-form-control{padding-right:32px}.devui-input__wrap{position:relative;display:flex;justify-content:"space-between";align-items:center}.devui-input__wrap .devui-input-restore{padding-right:32px}.devui-input__preview{position:absolute;width:32px;height:16px;right:0;text-align:center;line-height:16px;cursor:pointer;display:flex;justify-content:center;align-items:center;flex-direction:column}
@@ -118,18 +118,17 @@ var Input = defineComponent({
118
118
  return {
119
119
  error: props.error,
120
120
  [props.cssClass]: true,
121
+ "devui-input-restore": showPwdIcon.value,
121
122
  [sizeCls.value]: props.size !== ""
122
123
  };
123
124
  });
124
125
  const showPreviewIcon = computed(() => inputType.value === "password");
125
126
  watch(() => props.showPassword, (flg) => {
126
127
  inputType.value = flg ? "password" : "text";
128
+ showPwdIcon.value = props.showPassword;
127
129
  }, {
128
130
  immediate: true
129
131
  });
130
- watch(() => props.modelValue, (value) => {
131
- value && value.length > 0 && showPreviewIcon.value ? showPwdIcon.value = true : showPwdIcon.value = false;
132
- });
133
132
  const onInput = ($event) => {
134
133
  ctx.emit("update:modelValue", $event.target.value);
135
134
  hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.input);
@@ -197,11 +196,11 @@ var Input = defineComponent({
197
196
  "class": "devui-input__preview",
198
197
  "onClick": onChangeInputType
199
198
  }, [showPreviewIcon ? createVNode(resolveComponent("d-icon"), {
200
- "name": "preview",
199
+ "name": "preview-forbidden",
201
200
  "size": "12px",
202
201
  "key": 1
203
202
  }, null) : createVNode(resolveComponent("d-icon"), {
204
- "name": "preview-forbidden",
203
+ "name": "preview",
205
204
  "size": "12px",
206
205
  "key": 2
207
206
  }, null)])]);
@@ -241,7 +240,8 @@ var Icon = defineComponent({
241
240
  "src": name,
242
241
  "alt": name.split("/")[name.split("/").length - 1],
243
242
  "style": {
244
- width: size
243
+ width: size,
244
+ verticalAlign: "text-bottom"
245
245
  }
246
246
  }, null) : createVNode("i", {
247
247
  "class": `${classPrefix} ${classPrefix}-${name}`,
@@ -1 +1 @@
1
- var K=Object.defineProperty,M=Object.defineProperties;var j=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var v=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var N=(n,e,o)=>e in n?K(n,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[e]=o,F=(n,e)=>{for(var o in e||(e={}))v.call(e,o)&&N(n,o,e[o]);if(w)for(var o of w(e))S.call(e,o)&&N(n,o,e[o]);return n},P=(n,e)=>M(n,j(e));var k=(n,e)=>{var o={};for(var l in n)v.call(n,l)&&e.indexOf(l)<0&&(o[l]=n[l]);if(n!=null&&w)for(var l of w(n))e.indexOf(l)<0&&S.call(n,l)&&(o[l]=n[l]);return o};(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const o={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update: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 l="";const B=Symbol("dFormItem"),C={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var z=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(t,a){a.value&&t.focus()}}},props:o,emits:["update:modelValue","focus","blur","change","keydown"],setup(t,a){const u=e.inject(B,{}),i=Object.keys(u).length>0,p=e.computed(()=>`devui-input-${t.size}`),c=e.ref(!1),s=e.ref("text"),y=e.computed(()=>({error:t.error,[t.cssClass]:!0,[p.value]:t.size!==""})),d=e.computed(()=>s.value==="password");return e.watch(()=>t.showPassword,r=>{s.value=r?"password":"text"},{immediate:!0}),e.watch(()=>t.modelValue,r=>{r&&r.length>0&&d.value?c.value=!0:c.value=!1}),{inputCls:y,inputType:s,showPreviewIcon:d,showPwdIcon:c,onInput:r=>{a.emit("update:modelValue",r.target.value),i&&u.formItemMitt.emit(C.input)},onFocus:()=>{a.emit("focus")},onBlur:()=>{a.emit("blur"),i&&u.formItemMitt.emit(C.blur)},onChange:r=>{a.emit("change",r.target.value),i&&u.formItemMitt.emit(C.change)},onKeydown:r=>{a.emit("keydown",r)},onChangeInputType:()=>{s.value=s.value==="password"?"text":"password"}}},render(){const{modelValue:t,showPreviewIcon:a,showPwdIcon:u,inputCls:i,inputType:p,maxLength:c,autoFocus:s,placeholder:y,disabled:d,onInput:g,onFocus:I,onBlur:h,onChange:f,onKeydown:V,onChangeInputType:b}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:t,disabled:d,type:p,maxlength:c,placeholder:y,class:i,onInput:g,onFocus:I,onBlur:h,onChange:f,onKeydown:V}),null),[[e.resolveDirective("focus"),s]]),u&&e.createVNode("div",{class:"devui-input__preview",onClick:b},[a?e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:2},null)])])}}),x=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(t){return F({},t)},render(){const{name:t,size:a,color:u,classPrefix:i}=this;return/^((https?):)?\/\//.test(t)?e.createVNode("img",{src:t,alt:t.split("/")[t.split("/").length-1],style:{width:a}},null):e.createVNode("i",{class:`${i} ${i}-${t}`,style:{fontSize:a,color:u}},null)}}),D="";const T=P(F({},o),{name:{type:String,value:"calendar",required:!1},onIconclick:{type:Function,required:!1},iconBgColor:{type:String,value:"transparent"},iconColor:{type:String,value:"#000000"}});var m=e.defineComponent({name:"DInputIcon",props:T,setup(t,a){const h=t,{name:u,onIconclick:i,onChange:p,iconBgColor:c,iconColor:s}=h,y=k(h,["name","onIconclick","onChange","iconBgColor","iconColor"]),d=e.reactive({value:""}),g=f=>{d.value=f,typeof p=="function"&&p(d.value)},I=f=>{typeof i=="function"&&i(d.value,f)};return()=>e.createVNode("div",{class:"d-input-icon-container"},[e.createVNode("label",null,[e.createVNode(z,e.mergeProps(y,{onChange:g}),null)]),e.createVNode("span",{onClick:I,style:{backgroundColor:c}},[e.createVNode(x,{size:"small",name:u,color:s},null)])])}});m.install=function(t){t.component(m.name,m)};var _={title:"InputIcon\u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"75%",install(t){t.use(m)}};n.InputIcon=m,n.default=_,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
1
+ var K=Object.defineProperty,M=Object.defineProperties;var j=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,N=Object.prototype.propertyIsEnumerable;var V=(n,e,o)=>e in n?K(n,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[e]=o,v=(n,e)=>{for(var o in e||(e={}))S.call(e,o)&&V(n,o,e[o]);if(w)for(var o of w(e))N.call(e,o)&&V(n,o,e[o]);return n},P=(n,e)=>M(n,j(e));var k=(n,e)=>{var o={};for(var r in n)S.call(n,r)&&e.indexOf(r)<0&&(o[r]=n[r]);if(n!=null&&w)for(var r of w(n))e.indexOf(r)<0&&N.call(n,r)&&(o[r]=n[r]);return o};(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const o={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update: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 r="";const B=Symbol("dFormItem"),C={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var x=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(t,i){i.value&&t.focus()}}},props:o,emits:["update:modelValue","focus","blur","change","keydown"],setup(t,i){const u=e.inject(B,{}),a=Object.keys(u).length>0,p=e.computed(()=>`devui-input-${t.size}`),s=e.ref(!1),l=e.ref("text"),y=e.computed(()=>({error:t.error,[t.cssClass]:!0,"devui-input-restore":s.value,[p.value]:t.size!==""})),d=e.computed(()=>l.value==="password");return e.watch(()=>t.showPassword,c=>{l.value=c?"password":"text",s.value=t.showPassword},{immediate:!0}),{inputCls:y,inputType:l,showPreviewIcon:d,showPwdIcon:s,onInput:c=>{i.emit("update:modelValue",c.target.value),a&&u.formItemMitt.emit(C.input)},onFocus:()=>{i.emit("focus")},onBlur:()=>{i.emit("blur"),a&&u.formItemMitt.emit(C.blur)},onChange:c=>{i.emit("change",c.target.value),a&&u.formItemMitt.emit(C.change)},onKeydown:c=>{i.emit("keydown",c)},onChangeInputType:()=>{l.value=l.value==="password"?"text":"password"}}},render(){const{modelValue:t,showPreviewIcon:i,showPwdIcon:u,inputCls:a,inputType:p,maxLength:s,autoFocus:l,placeholder:y,disabled:d,onInput:h,onFocus:I,onBlur:g,onChange:f,onKeydown:F,onChangeInputType:b}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:t,disabled:d,type:p,maxlength:s,placeholder:y,class:a,onInput:h,onFocus:I,onBlur:g,onChange:f,onKeydown:F}),null),[[e.resolveDirective("focus"),l]]),u&&e.createVNode("div",{class:"devui-input__preview",onClick:b},[i?e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:2},null)])])}}),z=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(t){return v({},t)},render(){const{name:t,size:i,color:u,classPrefix:a}=this;return/^((https?):)?\/\//.test(t)?e.createVNode("img",{src:t,alt:t.split("/")[t.split("/").length-1],style:{width:i,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${a} ${a}-${t}`,style:{fontSize:i,color:u}},null)}}),D="";const T=P(v({},o),{name:{type:String,value:"calendar",required:!1},onIconclick:{type:Function,required:!1},iconBgColor:{type:String,value:"transparent"},iconColor:{type:String,value:"#000000"}});var m=e.defineComponent({name:"DInputIcon",props:T,setup(t,i){const g=t,{name:u,onIconclick:a,onChange:p,iconBgColor:s,iconColor:l}=g,y=k(g,["name","onIconclick","onChange","iconBgColor","iconColor"]),d=e.reactive({value:""}),h=f=>{d.value=f,typeof p=="function"&&p(d.value)},I=f=>{typeof a=="function"&&a(d.value,f)};return()=>e.createVNode("div",{class:"d-input-icon-container"},[e.createVNode("label",null,[e.createVNode(x,e.mergeProps(y,{onChange:h}),null)]),e.createVNode("span",{onClick:I,style:{backgroundColor:s}},[e.createVNode(z,{size:"small",name:u,color:l},null)])])}});m.install=function(t){t.component(m.name,m)};var _={title:"InputIcon\u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"75%",install(t){t.use(m)}};n.InputIcon=m,n.default=_,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});