@element-plus/nightly 0.0.20240220 → 0.0.20240222

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 (346) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.full.js +4 -3
  3. package/dist/index.full.min.js +10 -10
  4. package/dist/index.full.min.js.map +1 -1
  5. package/dist/index.full.min.mjs +10 -10
  6. package/dist/index.full.min.mjs.map +1 -1
  7. package/dist/index.full.mjs +4 -3
  8. package/dist/locale/af.js +1 -1
  9. package/dist/locale/af.min.js +1 -1
  10. package/dist/locale/af.min.mjs +1 -1
  11. package/dist/locale/af.mjs +1 -1
  12. package/dist/locale/ar-eg.js +1 -1
  13. package/dist/locale/ar-eg.min.js +1 -1
  14. package/dist/locale/ar-eg.min.mjs +1 -1
  15. package/dist/locale/ar-eg.mjs +1 -1
  16. package/dist/locale/ar.js +1 -1
  17. package/dist/locale/ar.min.js +1 -1
  18. package/dist/locale/ar.min.mjs +1 -1
  19. package/dist/locale/ar.mjs +1 -1
  20. package/dist/locale/az.js +1 -1
  21. package/dist/locale/az.min.js +1 -1
  22. package/dist/locale/az.min.mjs +1 -1
  23. package/dist/locale/az.mjs +1 -1
  24. package/dist/locale/bg.js +1 -1
  25. package/dist/locale/bg.min.js +1 -1
  26. package/dist/locale/bg.min.mjs +1 -1
  27. package/dist/locale/bg.mjs +1 -1
  28. package/dist/locale/bn.js +1 -1
  29. package/dist/locale/bn.min.js +1 -1
  30. package/dist/locale/bn.min.mjs +1 -1
  31. package/dist/locale/bn.mjs +1 -1
  32. package/dist/locale/ca.js +1 -1
  33. package/dist/locale/ca.min.js +1 -1
  34. package/dist/locale/ca.min.mjs +1 -1
  35. package/dist/locale/ca.mjs +1 -1
  36. package/dist/locale/ckb.js +1 -1
  37. package/dist/locale/ckb.min.js +1 -1
  38. package/dist/locale/ckb.min.mjs +1 -1
  39. package/dist/locale/ckb.mjs +1 -1
  40. package/dist/locale/cs.js +1 -1
  41. package/dist/locale/cs.min.js +1 -1
  42. package/dist/locale/cs.min.mjs +1 -1
  43. package/dist/locale/cs.mjs +1 -1
  44. package/dist/locale/da.js +1 -1
  45. package/dist/locale/da.min.js +1 -1
  46. package/dist/locale/da.min.mjs +1 -1
  47. package/dist/locale/da.mjs +1 -1
  48. package/dist/locale/de.js +1 -1
  49. package/dist/locale/de.min.js +1 -1
  50. package/dist/locale/de.min.mjs +1 -1
  51. package/dist/locale/de.mjs +1 -1
  52. package/dist/locale/el.js +1 -1
  53. package/dist/locale/el.min.js +1 -1
  54. package/dist/locale/el.min.mjs +1 -1
  55. package/dist/locale/el.mjs +1 -1
  56. package/dist/locale/en.js +1 -1
  57. package/dist/locale/en.min.js +1 -1
  58. package/dist/locale/en.min.mjs +1 -1
  59. package/dist/locale/en.mjs +1 -1
  60. package/dist/locale/eo.js +1 -1
  61. package/dist/locale/eo.min.js +1 -1
  62. package/dist/locale/eo.min.mjs +1 -1
  63. package/dist/locale/eo.mjs +1 -1
  64. package/dist/locale/es.js +1 -1
  65. package/dist/locale/es.min.js +1 -1
  66. package/dist/locale/es.min.mjs +1 -1
  67. package/dist/locale/es.mjs +1 -1
  68. package/dist/locale/et.js +1 -1
  69. package/dist/locale/et.min.js +1 -1
  70. package/dist/locale/et.min.mjs +1 -1
  71. package/dist/locale/et.mjs +1 -1
  72. package/dist/locale/eu.js +1 -1
  73. package/dist/locale/eu.min.js +1 -1
  74. package/dist/locale/eu.min.mjs +1 -1
  75. package/dist/locale/eu.mjs +1 -1
  76. package/dist/locale/fa.js +1 -1
  77. package/dist/locale/fa.min.js +1 -1
  78. package/dist/locale/fa.min.mjs +1 -1
  79. package/dist/locale/fa.mjs +1 -1
  80. package/dist/locale/fi.js +1 -1
  81. package/dist/locale/fi.min.js +1 -1
  82. package/dist/locale/fi.min.mjs +1 -1
  83. package/dist/locale/fi.mjs +1 -1
  84. package/dist/locale/fr.js +1 -1
  85. package/dist/locale/fr.min.js +1 -1
  86. package/dist/locale/fr.min.mjs +1 -1
  87. package/dist/locale/fr.mjs +1 -1
  88. package/dist/locale/he.js +1 -1
  89. package/dist/locale/he.min.js +1 -1
  90. package/dist/locale/he.min.mjs +1 -1
  91. package/dist/locale/he.mjs +1 -1
  92. package/dist/locale/hr.js +1 -1
  93. package/dist/locale/hr.min.js +1 -1
  94. package/dist/locale/hr.min.mjs +1 -1
  95. package/dist/locale/hr.mjs +1 -1
  96. package/dist/locale/hu.js +1 -1
  97. package/dist/locale/hu.min.js +1 -1
  98. package/dist/locale/hu.min.mjs +1 -1
  99. package/dist/locale/hu.mjs +1 -1
  100. package/dist/locale/hy-am.js +1 -1
  101. package/dist/locale/hy-am.min.js +1 -1
  102. package/dist/locale/hy-am.min.mjs +1 -1
  103. package/dist/locale/hy-am.mjs +1 -1
  104. package/dist/locale/id.js +1 -1
  105. package/dist/locale/id.min.js +1 -1
  106. package/dist/locale/id.min.mjs +1 -1
  107. package/dist/locale/id.mjs +1 -1
  108. package/dist/locale/it.js +1 -1
  109. package/dist/locale/it.min.js +1 -1
  110. package/dist/locale/it.min.mjs +1 -1
  111. package/dist/locale/it.mjs +1 -1
  112. package/dist/locale/ja.js +1 -1
  113. package/dist/locale/ja.min.js +1 -1
  114. package/dist/locale/ja.min.mjs +1 -1
  115. package/dist/locale/ja.mjs +1 -1
  116. package/dist/locale/kk.js +1 -1
  117. package/dist/locale/kk.min.js +1 -1
  118. package/dist/locale/kk.min.mjs +1 -1
  119. package/dist/locale/kk.mjs +1 -1
  120. package/dist/locale/km.js +1 -1
  121. package/dist/locale/km.min.js +1 -1
  122. package/dist/locale/km.min.mjs +1 -1
  123. package/dist/locale/km.mjs +1 -1
  124. package/dist/locale/ko.js +1 -1
  125. package/dist/locale/ko.min.js +1 -1
  126. package/dist/locale/ko.min.mjs +1 -1
  127. package/dist/locale/ko.mjs +1 -1
  128. package/dist/locale/ku.js +1 -1
  129. package/dist/locale/ku.min.js +1 -1
  130. package/dist/locale/ku.min.mjs +1 -1
  131. package/dist/locale/ku.mjs +1 -1
  132. package/dist/locale/ky.js +1 -1
  133. package/dist/locale/ky.min.js +1 -1
  134. package/dist/locale/ky.min.mjs +1 -1
  135. package/dist/locale/ky.mjs +1 -1
  136. package/dist/locale/lt.js +1 -1
  137. package/dist/locale/lt.min.js +1 -1
  138. package/dist/locale/lt.min.mjs +1 -1
  139. package/dist/locale/lt.mjs +1 -1
  140. package/dist/locale/lv.js +1 -1
  141. package/dist/locale/lv.min.js +1 -1
  142. package/dist/locale/lv.min.mjs +1 -1
  143. package/dist/locale/lv.mjs +1 -1
  144. package/dist/locale/mg.js +1 -1
  145. package/dist/locale/mg.min.js +1 -1
  146. package/dist/locale/mg.min.mjs +1 -1
  147. package/dist/locale/mg.mjs +1 -1
  148. package/dist/locale/mn.js +1 -1
  149. package/dist/locale/mn.min.js +1 -1
  150. package/dist/locale/mn.min.mjs +1 -1
  151. package/dist/locale/mn.mjs +1 -1
  152. package/dist/locale/nb-no.js +1 -1
  153. package/dist/locale/nb-no.min.js +1 -1
  154. package/dist/locale/nb-no.min.mjs +1 -1
  155. package/dist/locale/nb-no.mjs +1 -1
  156. package/dist/locale/nl.js +1 -1
  157. package/dist/locale/nl.min.js +1 -1
  158. package/dist/locale/nl.min.mjs +1 -1
  159. package/dist/locale/nl.mjs +1 -1
  160. package/dist/locale/pa.js +1 -1
  161. package/dist/locale/pa.min.js +1 -1
  162. package/dist/locale/pa.min.mjs +1 -1
  163. package/dist/locale/pa.mjs +1 -1
  164. package/dist/locale/pl.js +1 -1
  165. package/dist/locale/pl.min.js +1 -1
  166. package/dist/locale/pl.min.mjs +1 -1
  167. package/dist/locale/pl.mjs +1 -1
  168. package/dist/locale/pt-br.js +1 -1
  169. package/dist/locale/pt-br.min.js +1 -1
  170. package/dist/locale/pt-br.min.mjs +1 -1
  171. package/dist/locale/pt-br.mjs +1 -1
  172. package/dist/locale/pt.js +1 -1
  173. package/dist/locale/pt.min.js +1 -1
  174. package/dist/locale/pt.min.mjs +1 -1
  175. package/dist/locale/pt.mjs +1 -1
  176. package/dist/locale/ro.js +1 -1
  177. package/dist/locale/ro.min.js +1 -1
  178. package/dist/locale/ro.min.mjs +1 -1
  179. package/dist/locale/ro.mjs +1 -1
  180. package/dist/locale/ru.js +1 -1
  181. package/dist/locale/ru.min.js +1 -1
  182. package/dist/locale/ru.min.mjs +1 -1
  183. package/dist/locale/ru.mjs +1 -1
  184. package/dist/locale/sk.js +1 -1
  185. package/dist/locale/sk.min.js +1 -1
  186. package/dist/locale/sk.min.mjs +1 -1
  187. package/dist/locale/sk.mjs +1 -1
  188. package/dist/locale/sl.js +1 -1
  189. package/dist/locale/sl.min.js +1 -1
  190. package/dist/locale/sl.min.mjs +1 -1
  191. package/dist/locale/sl.mjs +1 -1
  192. package/dist/locale/sr.js +1 -1
  193. package/dist/locale/sr.min.js +1 -1
  194. package/dist/locale/sr.min.mjs +1 -1
  195. package/dist/locale/sr.mjs +1 -1
  196. package/dist/locale/sv.js +1 -1
  197. package/dist/locale/sv.min.js +1 -1
  198. package/dist/locale/sv.min.mjs +1 -1
  199. package/dist/locale/sv.mjs +1 -1
  200. package/dist/locale/sw.js +1 -1
  201. package/dist/locale/sw.min.js +1 -1
  202. package/dist/locale/sw.min.mjs +1 -1
  203. package/dist/locale/sw.mjs +1 -1
  204. package/dist/locale/ta.js +1 -1
  205. package/dist/locale/ta.min.js +1 -1
  206. package/dist/locale/ta.min.mjs +1 -1
  207. package/dist/locale/ta.mjs +1 -1
  208. package/dist/locale/th.js +1 -1
  209. package/dist/locale/th.min.js +1 -1
  210. package/dist/locale/th.min.mjs +1 -1
  211. package/dist/locale/th.mjs +1 -1
  212. package/dist/locale/tk.js +1 -1
  213. package/dist/locale/tk.min.js +1 -1
  214. package/dist/locale/tk.min.mjs +1 -1
  215. package/dist/locale/tk.mjs +1 -1
  216. package/dist/locale/tr.js +1 -1
  217. package/dist/locale/tr.min.js +1 -1
  218. package/dist/locale/tr.min.mjs +1 -1
  219. package/dist/locale/tr.mjs +1 -1
  220. package/dist/locale/ug-cn.js +1 -1
  221. package/dist/locale/ug-cn.min.js +1 -1
  222. package/dist/locale/ug-cn.min.mjs +1 -1
  223. package/dist/locale/ug-cn.mjs +1 -1
  224. package/dist/locale/uk.js +1 -1
  225. package/dist/locale/uk.min.js +1 -1
  226. package/dist/locale/uk.min.mjs +1 -1
  227. package/dist/locale/uk.mjs +1 -1
  228. package/dist/locale/uz-uz.js +1 -1
  229. package/dist/locale/uz-uz.min.js +1 -1
  230. package/dist/locale/uz-uz.min.mjs +1 -1
  231. package/dist/locale/uz-uz.mjs +1 -1
  232. package/dist/locale/vi.js +1 -1
  233. package/dist/locale/vi.min.js +1 -1
  234. package/dist/locale/vi.min.mjs +1 -1
  235. package/dist/locale/vi.mjs +1 -1
  236. package/dist/locale/zh-cn.js +1 -1
  237. package/dist/locale/zh-cn.min.js +1 -1
  238. package/dist/locale/zh-cn.min.mjs +1 -1
  239. package/dist/locale/zh-cn.mjs +1 -1
  240. package/dist/locale/zh-tw.js +1 -1
  241. package/dist/locale/zh-tw.min.js +1 -1
  242. package/dist/locale/zh-tw.min.mjs +1 -1
  243. package/dist/locale/zh-tw.mjs +1 -1
  244. package/es/components/breadcrumb/index.mjs +2 -2
  245. package/es/components/breadcrumb/src/breadcrumb-item.mjs +11 -56
  246. package/es/components/breadcrumb/src/breadcrumb-item.mjs.map +1 -1
  247. package/es/components/breadcrumb/src/breadcrumb-item2.mjs +56 -11
  248. package/es/components/breadcrumb/src/breadcrumb-item2.mjs.map +1 -1
  249. package/es/components/cascader-panel/src/index.mjs +1 -1
  250. package/es/components/cascader-panel/src/menu.mjs +1 -1
  251. package/es/components/cascader-panel/src/node.mjs +116 -209
  252. package/es/components/cascader-panel/src/node.mjs.map +1 -1
  253. package/es/components/cascader-panel/src/node2.mjs +209 -116
  254. package/es/components/cascader-panel/src/node2.mjs.map +1 -1
  255. package/es/components/cascader-panel/src/store.mjs +1 -1
  256. package/es/components/color-picker/index.mjs +2 -2
  257. package/es/components/color-picker/src/color-picker.mjs +40 -402
  258. package/es/components/color-picker/src/color-picker.mjs.map +1 -1
  259. package/es/components/color-picker/src/color-picker2.mjs +402 -40
  260. package/es/components/color-picker/src/color-picker2.mjs.map +1 -1
  261. package/es/components/color-picker/src/components/predefine.mjs +1 -1
  262. package/es/components/countdown/index.mjs +2 -2
  263. package/es/components/countdown/src/countdown.mjs +23 -74
  264. package/es/components/countdown/src/countdown.mjs.map +1 -1
  265. package/es/components/countdown/src/countdown2.mjs +74 -23
  266. package/es/components/countdown/src/countdown2.mjs.map +1 -1
  267. package/es/components/drawer/index.d.ts +1 -0
  268. package/es/components/drawer/src/drawer.vue.d.ts +1 -0
  269. package/es/components/drawer/src/drawer2.mjs +2 -1
  270. package/es/components/drawer/src/drawer2.mjs.map +1 -1
  271. package/es/components/form/index.mjs +2 -2
  272. package/es/components/form/src/form-item.mjs +43 -318
  273. package/es/components/form/src/form-item.mjs.map +1 -1
  274. package/es/components/form/src/form-item2.mjs +318 -43
  275. package/es/components/form/src/form-item2.mjs.map +1 -1
  276. package/es/components/index.mjs +5 -5
  277. package/es/components/tooltip-v2/index.mjs +2 -2
  278. package/es/components/tooltip-v2/src/tooltip.mjs +20 -73
  279. package/es/components/tooltip-v2/src/tooltip.mjs.map +1 -1
  280. package/es/components/tooltip-v2/src/tooltip2.mjs +73 -20
  281. package/es/components/tooltip-v2/src/tooltip2.mjs.map +1 -1
  282. package/es/components/upload/index.mjs +1 -1
  283. package/es/components/upload/src/upload-list.mjs +29 -178
  284. package/es/components/upload/src/upload-list.mjs.map +1 -1
  285. package/es/components/upload/src/upload-list2.mjs +178 -29
  286. package/es/components/upload/src/upload-list2.mjs.map +1 -1
  287. package/es/components/upload/src/upload2.mjs +1 -1
  288. package/es/index.mjs +5 -5
  289. package/es/version.d.ts +1 -1
  290. package/es/version.mjs +1 -1
  291. package/es/version.mjs.map +1 -1
  292. package/lib/components/breadcrumb/index.js +2 -2
  293. package/lib/components/breadcrumb/src/breadcrumb-item.js +11 -56
  294. package/lib/components/breadcrumb/src/breadcrumb-item.js.map +1 -1
  295. package/lib/components/breadcrumb/src/breadcrumb-item2.js +56 -11
  296. package/lib/components/breadcrumb/src/breadcrumb-item2.js.map +1 -1
  297. package/lib/components/cascader-panel/src/index.js +1 -1
  298. package/lib/components/cascader-panel/src/menu.js +1 -1
  299. package/lib/components/cascader-panel/src/node.js +116 -209
  300. package/lib/components/cascader-panel/src/node.js.map +1 -1
  301. package/lib/components/cascader-panel/src/node2.js +209 -116
  302. package/lib/components/cascader-panel/src/node2.js.map +1 -1
  303. package/lib/components/cascader-panel/src/store.js +1 -1
  304. package/lib/components/color-picker/index.js +2 -2
  305. package/lib/components/color-picker/src/color-picker.js +40 -400
  306. package/lib/components/color-picker/src/color-picker.js.map +1 -1
  307. package/lib/components/color-picker/src/color-picker2.js +400 -40
  308. package/lib/components/color-picker/src/color-picker2.js.map +1 -1
  309. package/lib/components/color-picker/src/components/predefine.js +1 -1
  310. package/lib/components/countdown/index.js +2 -2
  311. package/lib/components/countdown/src/countdown.js +24 -74
  312. package/lib/components/countdown/src/countdown.js.map +1 -1
  313. package/lib/components/countdown/src/countdown2.js +74 -24
  314. package/lib/components/countdown/src/countdown2.js.map +1 -1
  315. package/lib/components/drawer/index.d.ts +1 -0
  316. package/lib/components/drawer/src/drawer.vue.d.ts +1 -0
  317. package/lib/components/drawer/src/drawer2.js +2 -1
  318. package/lib/components/drawer/src/drawer2.js.map +1 -1
  319. package/lib/components/form/index.js +2 -2
  320. package/lib/components/form/src/form-item.js +44 -322
  321. package/lib/components/form/src/form-item.js.map +1 -1
  322. package/lib/components/form/src/form-item2.js +322 -44
  323. package/lib/components/form/src/form-item2.js.map +1 -1
  324. package/lib/components/index.js +5 -5
  325. package/lib/components/tooltip-v2/index.js +2 -2
  326. package/lib/components/tooltip-v2/src/tooltip.js +20 -73
  327. package/lib/components/tooltip-v2/src/tooltip.js.map +1 -1
  328. package/lib/components/tooltip-v2/src/tooltip2.js +73 -20
  329. package/lib/components/tooltip-v2/src/tooltip2.js.map +1 -1
  330. package/lib/components/upload/index.js +1 -1
  331. package/lib/components/upload/src/upload-list.js +30 -178
  332. package/lib/components/upload/src/upload-list.js.map +1 -1
  333. package/lib/components/upload/src/upload-list2.js +178 -30
  334. package/lib/components/upload/src/upload-list2.js.map +1 -1
  335. package/lib/components/upload/src/upload2.js +1 -1
  336. package/lib/index.js +5 -5
  337. package/lib/version.d.ts +1 -1
  338. package/lib/version.js +1 -1
  339. package/lib/version.js.map +1 -1
  340. package/package.json +2 -2
  341. package/theme-chalk/el-select-v2.css +1 -1
  342. package/theme-chalk/el-select.css +1 -1
  343. package/theme-chalk/index.css +1 -1
  344. package/theme-chalk/src/common/var.scss +1 -0
  345. package/theme-chalk/src/select.scss +4 -0
  346. package/web-types.json +1 -1
@@ -1,409 +1,47 @@
1
- import { defineComponent, ref, reactive, computed, nextTick, onMounted, watch, provide, openBlock, createBlock, unref, withCtx, withDirectives, createElementBlock, withKeys, createElementVNode, normalizeClass, createVNode, createCommentVNode, createTextVNode, toDisplayString, normalizeStyle, vShow } from 'vue';
2
- import { debounce } from 'lodash-unified';
3
- import { ElButton } from '../../button/index.mjs';
4
- import { ElIcon } from '../../icon/index.mjs';
5
- import '../../../directives/index.mjs';
6
- import { ElTooltip } from '../../tooltip/index.mjs';
7
- import { ElInput } from '../../input/index.mjs';
8
- import '../../form/index.mjs';
1
+ import { isNil } from 'lodash-unified';
2
+ import '../../../utils/index.mjs';
9
3
  import '../../../hooks/index.mjs';
10
4
  import '../../../constants/index.mjs';
11
- import '../../../utils/index.mjs';
12
- import { ArrowDown, Close } from '@element-plus/icons-vue';
13
- import AlphaSlider from './components/alpha-slider.mjs';
14
- import HueSlider from './components/hue-slider.mjs';
15
- import Predefine from './components/predefine.mjs';
16
- import SvPanel from './components/sv-panel.mjs';
17
- import Color from './utils/color.mjs';
18
- import { colorPickerProps, colorPickerEmits, colorPickerContextKey } from './color-picker2.mjs';
19
- import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
20
- import { useLocale } from '../../../hooks/use-locale/index.mjs';
21
- import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
22
- import { useFormItem, useFormItemInputId } from '../../form/src/hooks/use-form-item.mjs';
23
- import { useFormSize, useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
24
- import { useFocusController } from '../../../hooks/use-focus-controller/index.mjs';
25
- import { UPDATE_MODEL_EVENT } from '../../../constants/event.mjs';
26
- import { debugWarn } from '../../../utils/error.mjs';
27
- import { EVENT_CODE } from '../../../constants/aria.mjs';
28
- import ClickOutside from '../../../directives/click-outside/index.mjs';
5
+ import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
6
+ import { useSizeProp } from '../../../hooks/use-size/index.mjs';
7
+ import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
8
+ import { isString } from '@vue/shared';
29
9
 
30
- const _hoisted_1 = ["onKeydown"];
31
- const _hoisted_2 = ["id", "aria-label", "aria-labelledby", "aria-description", "aria-disabled", "tabindex"];
32
- const __default__ = defineComponent({
33
- name: "ElColorPicker"
34
- });
35
- const _sfc_main = /* @__PURE__ */ defineComponent({
36
- ...__default__,
37
- props: colorPickerProps,
38
- emits: colorPickerEmits,
39
- setup(__props, { expose, emit }) {
40
- const props = __props;
41
- const { t } = useLocale();
42
- const ns = useNamespace("color");
43
- const { formItem } = useFormItem();
44
- const colorSize = useFormSize();
45
- const colorDisabled = useFormDisabled();
46
- const { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, {
47
- formItemContext: formItem
48
- });
49
- const hue = ref();
50
- const sv = ref();
51
- const alpha = ref();
52
- const popper = ref();
53
- const triggerRef = ref();
54
- const inputRef = ref();
55
- const {
56
- isFocused,
57
- handleFocus: _handleFocus,
58
- handleBlur
59
- } = useFocusController(triggerRef, {
60
- beforeBlur(event) {
61
- var _a;
62
- return (_a = popper.value) == null ? void 0 : _a.isFocusInsideContent(event);
63
- },
64
- afterBlur() {
65
- setShowPicker(false);
66
- resetColor();
67
- }
68
- });
69
- const handleFocus = (event) => {
70
- if (colorDisabled.value)
71
- return blur();
72
- _handleFocus(event);
73
- };
74
- let shouldActiveChange = true;
75
- const color = reactive(new Color({
76
- enableAlpha: props.showAlpha,
77
- format: props.colorFormat || "",
78
- value: props.modelValue
79
- }));
80
- const showPicker = ref(false);
81
- const showPanelColor = ref(false);
82
- const customInput = ref("");
83
- const displayedColor = computed(() => {
84
- if (!props.modelValue && !showPanelColor.value) {
85
- return "transparent";
86
- }
87
- return displayedRgb(color, props.showAlpha);
88
- });
89
- const currentColor = computed(() => {
90
- return !props.modelValue && !showPanelColor.value ? "" : color.value;
91
- });
92
- const buttonAriaLabel = computed(() => {
93
- return !isLabeledByFormItem.value ? props.label || t("el.colorpicker.defaultLabel") : void 0;
94
- });
95
- const buttonAriaLabelledby = computed(() => {
96
- return isLabeledByFormItem.value ? formItem == null ? void 0 : formItem.labelId : void 0;
97
- });
98
- const btnKls = computed(() => {
99
- return [
100
- ns.b("picker"),
101
- ns.is("disabled", colorDisabled.value),
102
- ns.bm("picker", colorSize.value),
103
- ns.is("focused", isFocused.value)
104
- ];
105
- });
106
- function displayedRgb(color2, showAlpha) {
107
- if (!(color2 instanceof Color)) {
108
- throw new TypeError("color should be instance of _color Class");
109
- }
110
- const { r, g, b } = color2.toRgb();
111
- return showAlpha ? `rgba(${r}, ${g}, ${b}, ${color2.get("alpha") / 100})` : `rgb(${r}, ${g}, ${b})`;
112
- }
113
- function setShowPicker(value) {
114
- showPicker.value = value;
115
- }
116
- const debounceSetShowPicker = debounce(setShowPicker, 100, { leading: true });
117
- function show() {
118
- if (colorDisabled.value)
119
- return;
120
- setShowPicker(true);
121
- }
122
- function hide() {
123
- debounceSetShowPicker(false);
124
- resetColor();
125
- }
126
- function resetColor() {
127
- nextTick(() => {
128
- if (props.modelValue) {
129
- color.fromString(props.modelValue);
130
- } else {
131
- color.value = "";
132
- nextTick(() => {
133
- showPanelColor.value = false;
134
- });
135
- }
136
- });
137
- }
138
- function handleTrigger() {
139
- if (colorDisabled.value)
140
- return;
141
- debounceSetShowPicker(!showPicker.value);
142
- }
143
- function handleConfirm() {
144
- color.fromString(customInput.value);
145
- }
146
- function confirmValue() {
147
- const value = color.value;
148
- emit(UPDATE_MODEL_EVENT, value);
149
- emit("change", value);
150
- if (props.validateEvent) {
151
- formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
152
- }
153
- debounceSetShowPicker(false);
154
- nextTick(() => {
155
- const newColor = new Color({
156
- enableAlpha: props.showAlpha,
157
- format: props.colorFormat || "",
158
- value: props.modelValue
159
- });
160
- if (!color.compare(newColor)) {
161
- resetColor();
162
- }
163
- });
164
- }
165
- function clear() {
166
- debounceSetShowPicker(false);
167
- emit(UPDATE_MODEL_EVENT, null);
168
- emit("change", null);
169
- if (props.modelValue !== null && props.validateEvent) {
170
- formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
171
- }
172
- resetColor();
173
- }
174
- function handleClickOutside(event) {
175
- if (!showPicker.value)
176
- return;
177
- hide();
178
- if (isFocused.value) {
179
- const _event = new FocusEvent("focus", event);
180
- handleBlur(_event);
181
- }
182
- }
183
- function handleEsc(event) {
184
- event.preventDefault();
185
- event.stopPropagation();
186
- setShowPicker(false);
187
- resetColor();
188
- }
189
- function handleKeyDown(event) {
190
- switch (event.code) {
191
- case EVENT_CODE.enter:
192
- case EVENT_CODE.space:
193
- event.preventDefault();
194
- event.stopPropagation();
195
- show();
196
- inputRef.value.focus();
197
- break;
198
- case EVENT_CODE.esc:
199
- handleEsc(event);
200
- break;
201
- }
202
- }
203
- function focus() {
204
- triggerRef.value.focus();
205
- }
206
- function blur() {
207
- triggerRef.value.blur();
208
- }
209
- onMounted(() => {
210
- if (props.modelValue) {
211
- customInput.value = currentColor.value;
212
- }
213
- });
214
- watch(() => props.modelValue, (newVal) => {
215
- if (!newVal) {
216
- showPanelColor.value = false;
217
- } else if (newVal && newVal !== color.value) {
218
- shouldActiveChange = false;
219
- color.fromString(newVal);
220
- }
221
- });
222
- watch(() => currentColor.value, (val) => {
223
- customInput.value = val;
224
- shouldActiveChange && emit("activeChange", val);
225
- shouldActiveChange = true;
226
- });
227
- watch(() => color.value, () => {
228
- if (!props.modelValue && !showPanelColor.value) {
229
- showPanelColor.value = true;
230
- }
231
- });
232
- watch(() => showPicker.value, () => {
233
- nextTick(() => {
234
- var _a, _b, _c;
235
- (_a = hue.value) == null ? void 0 : _a.update();
236
- (_b = sv.value) == null ? void 0 : _b.update();
237
- (_c = alpha.value) == null ? void 0 : _c.update();
238
- });
239
- });
240
- provide(colorPickerContextKey, {
241
- currentColor
242
- });
243
- expose({
244
- color,
245
- show,
246
- hide,
247
- focus,
248
- blur
249
- });
250
- return (_ctx, _cache) => {
251
- return openBlock(), createBlock(unref(ElTooltip), {
252
- ref_key: "popper",
253
- ref: popper,
254
- visible: showPicker.value,
255
- "show-arrow": false,
256
- "fallback-placements": ["bottom", "top", "right", "left"],
257
- offset: 0,
258
- "gpu-acceleration": false,
259
- "popper-class": [unref(ns).be("picker", "panel"), unref(ns).b("dropdown"), _ctx.popperClass],
260
- "stop-popper-mouse-event": false,
261
- effect: "light",
262
- trigger: "click",
263
- transition: `${unref(ns).namespace.value}-zoom-in-top`,
264
- persistent: "",
265
- onHide: _cache[2] || (_cache[2] = ($event) => setShowPicker(false))
266
- }, {
267
- content: withCtx(() => [
268
- withDirectives((openBlock(), createElementBlock("div", {
269
- onKeydown: withKeys(handleEsc, ["esc"])
270
- }, [
271
- createElementVNode("div", {
272
- class: normalizeClass(unref(ns).be("dropdown", "main-wrapper"))
273
- }, [
274
- createVNode(HueSlider, {
275
- ref_key: "hue",
276
- ref: hue,
277
- class: "hue-slider",
278
- color: unref(color),
279
- vertical: ""
280
- }, null, 8, ["color"]),
281
- createVNode(SvPanel, {
282
- ref_key: "sv",
283
- ref: sv,
284
- color: unref(color)
285
- }, null, 8, ["color"])
286
- ], 2),
287
- _ctx.showAlpha ? (openBlock(), createBlock(AlphaSlider, {
288
- key: 0,
289
- ref_key: "alpha",
290
- ref: alpha,
291
- color: unref(color)
292
- }, null, 8, ["color"])) : createCommentVNode("v-if", true),
293
- _ctx.predefine ? (openBlock(), createBlock(Predefine, {
294
- key: 1,
295
- ref: "predefine",
296
- color: unref(color),
297
- colors: _ctx.predefine
298
- }, null, 8, ["color", "colors"])) : createCommentVNode("v-if", true),
299
- createElementVNode("div", {
300
- class: normalizeClass(unref(ns).be("dropdown", "btns"))
301
- }, [
302
- createElementVNode("span", {
303
- class: normalizeClass(unref(ns).be("dropdown", "value"))
304
- }, [
305
- createVNode(unref(ElInput), {
306
- ref_key: "inputRef",
307
- ref: inputRef,
308
- modelValue: customInput.value,
309
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => customInput.value = $event),
310
- "validate-event": false,
311
- size: "small",
312
- onKeyup: withKeys(handleConfirm, ["enter"]),
313
- onBlur: handleConfirm
314
- }, null, 8, ["modelValue", "onKeyup"])
315
- ], 2),
316
- createVNode(unref(ElButton), {
317
- class: normalizeClass(unref(ns).be("dropdown", "link-btn")),
318
- text: "",
319
- size: "small",
320
- onClick: clear
321
- }, {
322
- default: withCtx(() => [
323
- createTextVNode(toDisplayString(unref(t)("el.colorpicker.clear")), 1)
324
- ]),
325
- _: 1
326
- }, 8, ["class"]),
327
- createVNode(unref(ElButton), {
328
- plain: "",
329
- size: "small",
330
- class: normalizeClass(unref(ns).be("dropdown", "btn")),
331
- onClick: confirmValue
332
- }, {
333
- default: withCtx(() => [
334
- createTextVNode(toDisplayString(unref(t)("el.colorpicker.confirm")), 1)
335
- ]),
336
- _: 1
337
- }, 8, ["class"])
338
- ], 2)
339
- ], 40, _hoisted_1)), [
340
- [unref(ClickOutside), handleClickOutside]
341
- ])
342
- ]),
343
- default: withCtx(() => [
344
- createElementVNode("div", {
345
- id: unref(buttonId),
346
- ref_key: "triggerRef",
347
- ref: triggerRef,
348
- class: normalizeClass(unref(btnKls)),
349
- role: "button",
350
- "aria-label": unref(buttonAriaLabel),
351
- "aria-labelledby": unref(buttonAriaLabelledby),
352
- "aria-description": unref(t)("el.colorpicker.description", { color: _ctx.modelValue || "" }),
353
- "aria-disabled": unref(colorDisabled),
354
- tabindex: unref(colorDisabled) ? -1 : _ctx.tabindex,
355
- onKeydown: handleKeyDown,
356
- onFocus: handleFocus,
357
- onBlur: _cache[1] || (_cache[1] = (...args) => unref(handleBlur) && unref(handleBlur)(...args))
358
- }, [
359
- unref(colorDisabled) ? (openBlock(), createElementBlock("div", {
360
- key: 0,
361
- class: normalizeClass(unref(ns).be("picker", "mask"))
362
- }, null, 2)) : createCommentVNode("v-if", true),
363
- createElementVNode("div", {
364
- class: normalizeClass(unref(ns).be("picker", "trigger")),
365
- onClick: handleTrigger
366
- }, [
367
- createElementVNode("span", {
368
- class: normalizeClass([unref(ns).be("picker", "color"), unref(ns).is("alpha", _ctx.showAlpha)])
369
- }, [
370
- createElementVNode("span", {
371
- class: normalizeClass(unref(ns).be("picker", "color-inner")),
372
- style: normalizeStyle({
373
- backgroundColor: unref(displayedColor)
374
- })
375
- }, [
376
- withDirectives(createVNode(unref(ElIcon), {
377
- class: normalizeClass([unref(ns).be("picker", "icon"), unref(ns).is("icon-arrow-down")])
378
- }, {
379
- default: withCtx(() => [
380
- createVNode(unref(ArrowDown))
381
- ]),
382
- _: 1
383
- }, 8, ["class"]), [
384
- [vShow, _ctx.modelValue || showPanelColor.value]
385
- ]),
386
- withDirectives(createVNode(unref(ElIcon), {
387
- class: normalizeClass([unref(ns).be("picker", "empty"), unref(ns).is("icon-close")])
388
- }, {
389
- default: withCtx(() => [
390
- createVNode(unref(Close))
391
- ]),
392
- _: 1
393
- }, 8, ["class"]), [
394
- [vShow, !_ctx.modelValue && !showPanelColor.value]
395
- ])
396
- ], 6)
397
- ], 2)
398
- ], 2)
399
- ], 42, _hoisted_2)
400
- ]),
401
- _: 1
402
- }, 8, ["visible", "popper-class", "transition"]);
403
- };
10
+ const colorPickerProps = buildProps({
11
+ modelValue: String,
12
+ id: String,
13
+ showAlpha: Boolean,
14
+ colorFormat: String,
15
+ disabled: Boolean,
16
+ size: useSizeProp,
17
+ popperClass: {
18
+ type: String,
19
+ default: ""
20
+ },
21
+ label: {
22
+ type: String,
23
+ default: void 0
24
+ },
25
+ tabindex: {
26
+ type: [String, Number],
27
+ default: 0
28
+ },
29
+ predefine: {
30
+ type: definePropType(Array)
31
+ },
32
+ validateEvent: {
33
+ type: Boolean,
34
+ default: true
404
35
  }
405
36
  });
406
- var ColorPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "color-picker.vue"]]);
37
+ const colorPickerEmits = {
38
+ [UPDATE_MODEL_EVENT]: (val) => isString(val) || isNil(val),
39
+ [CHANGE_EVENT]: (val) => isString(val) || isNil(val),
40
+ activeChange: (val) => isString(val) || isNil(val),
41
+ focus: (event) => event instanceof FocusEvent,
42
+ blur: (event) => event instanceof FocusEvent
43
+ };
44
+ const colorPickerContextKey = Symbol("colorPickerContextKey");
407
45
 
408
- export { ColorPicker as default };
46
+ export { colorPickerContextKey, colorPickerEmits, colorPickerProps };
409
47
  //# sourceMappingURL=color-picker.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"color-picker.mjs","sources":["../../../../../../packages/components/color-picker/src/color-picker.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"popper\"\n :visible=\"showPicker\"\n :show-arrow=\"false\"\n :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n :offset=\"0\"\n :gpu-acceleration=\"false\"\n :popper-class=\"[ns.be('picker', 'panel'), ns.b('dropdown'), popperClass]\"\n :stop-popper-mouse-event=\"false\"\n effect=\"light\"\n trigger=\"click\"\n :transition=\"`${ns.namespace.value}-zoom-in-top`\"\n persistent\n @hide=\"setShowPicker(false)\"\n >\n <template #content>\n <div v-click-outside=\"handleClickOutside\" @keydown.esc=\"handleEsc\">\n <div :class=\"ns.be('dropdown', 'main-wrapper')\">\n <hue-slider ref=\"hue\" class=\"hue-slider\" :color=\"color\" vertical />\n <sv-panel ref=\"sv\" :color=\"color\" />\n </div>\n <alpha-slider v-if=\"showAlpha\" ref=\"alpha\" :color=\"color\" />\n <predefine\n v-if=\"predefine\"\n ref=\"predefine\"\n :color=\"color\"\n :colors=\"predefine\"\n />\n <div :class=\"ns.be('dropdown', 'btns')\">\n <span :class=\"ns.be('dropdown', 'value')\">\n <el-input\n ref=\"inputRef\"\n v-model=\"customInput\"\n :validate-event=\"false\"\n size=\"small\"\n @keyup.enter=\"handleConfirm\"\n @blur=\"handleConfirm\"\n />\n </span>\n <el-button\n :class=\"ns.be('dropdown', 'link-btn')\"\n text\n size=\"small\"\n @click=\"clear\"\n >\n {{ t('el.colorpicker.clear') }}\n </el-button>\n <el-button\n plain\n size=\"small\"\n :class=\"ns.be('dropdown', 'btn')\"\n @click=\"confirmValue\"\n >\n {{ t('el.colorpicker.confirm') }}\n </el-button>\n </div>\n </div>\n </template>\n <template #default>\n <div\n :id=\"buttonId\"\n ref=\"triggerRef\"\n :class=\"btnKls\"\n role=\"button\"\n :aria-label=\"buttonAriaLabel\"\n :aria-labelledby=\"buttonAriaLabelledby\"\n :aria-description=\"\n t('el.colorpicker.description', { color: modelValue || '' })\n \"\n :aria-disabled=\"colorDisabled\"\n :tabindex=\"colorDisabled ? -1 : tabindex\"\n @keydown=\"handleKeyDown\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n >\n <div v-if=\"colorDisabled\" :class=\"ns.be('picker', 'mask')\" />\n <div :class=\"ns.be('picker', 'trigger')\" @click=\"handleTrigger\">\n <span :class=\"[ns.be('picker', 'color'), ns.is('alpha', showAlpha)]\">\n <span\n :class=\"ns.be('picker', 'color-inner')\"\n :style=\"{\n backgroundColor: displayedColor,\n }\"\n >\n <el-icon\n v-show=\"modelValue || showPanelColor\"\n :class=\"[ns.be('picker', 'icon'), ns.is('icon-arrow-down')]\"\n >\n <arrow-down />\n </el-icon>\n <el-icon\n v-show=\"!modelValue && !showPanelColor\"\n :class=\"[ns.be('picker', 'empty'), ns.is('icon-close')]\"\n >\n <close />\n </el-icon>\n </span>\n </span>\n </div>\n </div>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n nextTick,\n onMounted,\n provide,\n reactive,\n ref,\n watch,\n} from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { ElButton } from '@element-plus/components/button'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ClickOutside as vClickOutside } from '@element-plus/directives'\nimport { ElTooltip } from '@element-plus/components/tooltip'\nimport { ElInput } from '@element-plus/components/input'\nimport {\n useFormDisabled,\n useFormItem,\n useFormItemInputId,\n useFormSize,\n} from '@element-plus/components/form'\nimport {\n useFocusController,\n useLocale,\n useNamespace,\n} from '@element-plus/hooks'\nimport { EVENT_CODE, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { debugWarn } from '@element-plus/utils'\nimport { ArrowDown, Close } from '@element-plus/icons-vue'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport Color from './utils/color'\nimport {\n colorPickerContextKey,\n colorPickerEmits,\n colorPickerProps,\n} from './color-picker'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\n\ndefineOptions({\n name: 'ElColorPicker',\n})\nconst props = defineProps(colorPickerProps)\nconst emit = defineEmits(colorPickerEmits)\n\nconst { t } = useLocale()\nconst ns = useNamespace('color')\nconst { formItem } = useFormItem()\nconst colorSize = useFormSize()\nconst colorDisabled = useFormDisabled()\n\nconst { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: formItem,\n})\n\nconst hue = ref<InstanceType<typeof HueSlider>>()\nconst sv = ref<InstanceType<typeof SvPanel>>()\nconst alpha = ref<InstanceType<typeof AlphaSlider>>()\nconst popper = ref<TooltipInstance>()\nconst triggerRef = ref()\nconst inputRef = ref()\n\nconst {\n isFocused,\n handleFocus: _handleFocus,\n handleBlur,\n} = useFocusController(triggerRef, {\n beforeBlur(event) {\n return popper.value?.isFocusInsideContent(event)\n },\n afterBlur() {\n setShowPicker(false)\n resetColor()\n },\n})\n\nconst handleFocus = (event: FocusEvent) => {\n if (colorDisabled.value) return blur()\n _handleFocus(event)\n}\n\n// active-change is used to prevent modelValue changes from triggering.\nlet shouldActiveChange = true\n\nconst color = reactive(\n new Color({\n enableAlpha: props.showAlpha,\n format: props.colorFormat || '',\n value: props.modelValue,\n })\n) as Color\n\nconst showPicker = ref(false)\nconst showPanelColor = ref(false)\nconst customInput = ref('')\n\nconst displayedColor = computed(() => {\n if (!props.modelValue && !showPanelColor.value) {\n return 'transparent'\n }\n return displayedRgb(color, props.showAlpha)\n})\n\nconst currentColor = computed(() => {\n return !props.modelValue && !showPanelColor.value ? '' : color.value\n})\n\nconst buttonAriaLabel = computed<string | undefined>(() => {\n return !isLabeledByFormItem.value\n ? props.label || t('el.colorpicker.defaultLabel')\n : undefined\n})\n\nconst buttonAriaLabelledby = computed<string | undefined>(() => {\n return isLabeledByFormItem.value ? formItem?.labelId : undefined\n})\n\nconst btnKls = computed(() => {\n return [\n ns.b('picker'),\n ns.is('disabled', colorDisabled.value),\n ns.bm('picker', colorSize.value),\n ns.is('focused', isFocused.value),\n ]\n})\n\nfunction displayedRgb(color: Color, showAlpha: boolean) {\n if (!(color instanceof Color)) {\n throw new TypeError('color should be instance of _color Class')\n }\n\n const { r, g, b } = color.toRgb()\n return showAlpha\n ? `rgba(${r}, ${g}, ${b}, ${color.get('alpha') / 100})`\n : `rgb(${r}, ${g}, ${b})`\n}\n\nfunction setShowPicker(value: boolean) {\n showPicker.value = value\n}\n\nconst debounceSetShowPicker = debounce(setShowPicker, 100, { leading: true })\n\nfunction show() {\n if (colorDisabled.value) return\n setShowPicker(true)\n}\n\nfunction hide() {\n debounceSetShowPicker(false)\n resetColor()\n}\n\nfunction resetColor() {\n nextTick(() => {\n if (props.modelValue) {\n color.fromString(props.modelValue)\n } else {\n color.value = ''\n nextTick(() => {\n showPanelColor.value = false\n })\n }\n })\n}\n\nfunction handleTrigger() {\n if (colorDisabled.value) return\n debounceSetShowPicker(!showPicker.value)\n}\n\nfunction handleConfirm() {\n color.fromString(customInput.value)\n}\n\nfunction confirmValue() {\n const value = color.value\n emit(UPDATE_MODEL_EVENT, value)\n emit('change', value)\n if (props.validateEvent) {\n formItem?.validate('change').catch((err) => debugWarn(err))\n }\n debounceSetShowPicker(false)\n // check if modelValue change, if not change, then reset color.\n nextTick(() => {\n const newColor = new Color({\n enableAlpha: props.showAlpha,\n format: props.colorFormat || '',\n value: props.modelValue,\n })\n if (!color.compare(newColor)) {\n resetColor()\n }\n })\n}\n\nfunction clear() {\n debounceSetShowPicker(false)\n emit(UPDATE_MODEL_EVENT, null)\n emit('change', null)\n if (props.modelValue !== null && props.validateEvent) {\n formItem?.validate('change').catch((err) => debugWarn(err))\n }\n resetColor()\n}\n\nfunction handleClickOutside(event: Event) {\n if (!showPicker.value) return\n hide()\n\n if (isFocused.value) {\n const _event = new FocusEvent('focus', event)\n handleBlur(_event)\n }\n}\n\nfunction handleEsc(event: KeyboardEvent) {\n event.preventDefault()\n event.stopPropagation()\n setShowPicker(false)\n resetColor()\n}\n\nfunction handleKeyDown(event: KeyboardEvent) {\n switch (event.code) {\n case EVENT_CODE.enter:\n case EVENT_CODE.space:\n event.preventDefault()\n event.stopPropagation()\n show()\n inputRef.value.focus()\n break\n case EVENT_CODE.esc:\n handleEsc(event)\n break\n }\n}\n\nfunction focus() {\n triggerRef.value.focus()\n}\n\nfunction blur() {\n triggerRef.value.blur()\n}\n\nonMounted(() => {\n if (props.modelValue) {\n customInput.value = currentColor.value\n }\n})\n\nwatch(\n () => props.modelValue,\n (newVal) => {\n if (!newVal) {\n showPanelColor.value = false\n } else if (newVal && newVal !== color.value) {\n shouldActiveChange = false\n color.fromString(newVal)\n }\n }\n)\n\nwatch(\n () => currentColor.value,\n (val) => {\n customInput.value = val\n shouldActiveChange && emit('activeChange', val)\n shouldActiveChange = true\n }\n)\n\nwatch(\n () => color.value,\n () => {\n if (!props.modelValue && !showPanelColor.value) {\n showPanelColor.value = true\n }\n }\n)\n\nwatch(\n () => showPicker.value,\n () => {\n nextTick(() => {\n hue.value?.update()\n sv.value?.update()\n alpha.value?.update()\n })\n }\n)\n\nprovide(colorPickerContextKey, {\n currentColor,\n})\n\ndefineExpose({\n /**\n * @description current color object\n */\n color,\n /**\n * @description manually show ColorPicker\n */\n show,\n /**\n * @description manually hide ColorPicker\n */\n hide,\n /**\n * @description focus the input element\n */\n focus,\n /**\n * @description blur the input element\n */\n blur,\n})\n</script>\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"color-picker.mjs","sources":["../../../../../../packages/components/color-picker/src/color-picker.ts"],"sourcesContent":["import { isNil } from 'lodash-unified'\nimport { buildProps, definePropType, isString } from '@element-plus/utils'\nimport { useSizeProp } from '@element-plus/hooks'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\n\nimport type { ComputedRef, ExtractPropTypes, InjectionKey } from 'vue'\nimport type ColorPicker from './color-picker.vue'\n\nexport const colorPickerProps = buildProps({\n /**\n * @description binding value\n */\n modelValue: String,\n /**\n * @description ColorPicker id\n */\n id: String,\n /**\n * @description whether to display the alpha slider\n */\n showAlpha: Boolean,\n /**\n * @description color format of v-model\n */\n colorFormat: String,\n /**\n * @description whether to disable the ColorPicker\n */\n disabled: Boolean,\n /**\n * @description size of ColorPicker\n */\n size: useSizeProp,\n /**\n * @description custom class name for ColorPicker's dropdown\n */\n popperClass: {\n type: String,\n default: '',\n },\n /**\n * @description ColorPicker aria-label\n */\n label: {\n type: String,\n default: undefined,\n },\n /**\n * @description ColorPicker tabindex\n */\n tabindex: {\n type: [String, Number],\n default: 0,\n },\n /**\n * @description predefined color options\n */\n predefine: {\n type: definePropType<string[]>(Array),\n },\n /**\n * @description whether to trigger form validation\n */\n validateEvent: {\n type: Boolean,\n default: true,\n },\n} as const)\nexport const colorPickerEmits = {\n [UPDATE_MODEL_EVENT]: (val: string | null) => isString(val) || isNil(val),\n [CHANGE_EVENT]: (val: string | null) => isString(val) || isNil(val),\n activeChange: (val: string | null) => isString(val) || isNil(val),\n focus: (event: FocusEvent) => event instanceof FocusEvent,\n blur: (event: FocusEvent) => event instanceof FocusEvent,\n}\n\nexport type ColorPickerProps = ExtractPropTypes<typeof colorPickerProps>\nexport type ColorPickerEmits = typeof colorPickerEmits\nexport type ColorPickerInstance = InstanceType<typeof ColorPicker>\n\nexport interface ColorPickerContext {\n currentColor: ComputedRef<string>\n}\n\nexport const colorPickerContextKey: InjectionKey<ColorPickerContext> = Symbol(\n 'colorPickerContextKey'\n)\n"],"names":[],"mappings":";;;;;;;;;AAIY,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,UAAU,EAAE,MAAM;AACpB,EAAE,EAAE,EAAE,MAAM;AACZ,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,GAAG;AACH,EAAE,aAAa,EAAE;AACjB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,kBAAkB,GAAG,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC;AAC5D,EAAE,CAAC,YAAY,GAAG,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC;AACtD,EAAE,YAAY,EAAE,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC;AACpD,EAAE,KAAK,EAAE,CAAC,KAAK,KAAK,KAAK,YAAY,UAAU;AAC/C,EAAE,IAAI,EAAE,CAAC,KAAK,KAAK,KAAK,YAAY,UAAU;AAC9C,EAAE;AACU,MAAC,qBAAqB,GAAG,MAAM,CAAC,uBAAuB;;;;"}