element-plus-secondary 0.2.6 → 0.2.8
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.
- package/dist/index.css +1 -1
- package/es/components/alert/index.mjs +2 -2
- package/es/components/alert/src/alert.mjs +36 -96
- package/es/components/alert/src/alert.mjs.map +1 -1
- package/es/components/alert/src/alert2.mjs +96 -36
- package/es/components/alert/src/alert2.mjs.map +1 -1
- package/es/components/autocomplete/index.mjs +2 -2
- package/es/components/autocomplete/src/autocomplete.mjs +71 -353
- package/es/components/autocomplete/src/autocomplete.mjs.map +1 -1
- package/es/components/autocomplete/src/autocomplete2.mjs +353 -71
- package/es/components/autocomplete/src/autocomplete2.mjs.map +1 -1
- package/es/components/avatar/index.mjs +2 -2
- package/es/components/avatar/src/avatar.mjs +32 -67
- package/es/components/avatar/src/avatar.mjs.map +1 -1
- package/es/components/avatar/src/avatar2.mjs +67 -32
- package/es/components/avatar/src/avatar2.mjs.map +1 -1
- package/es/components/backtop/index.mjs +2 -2
- package/es/components/backtop/src/backtop.mjs +21 -54
- package/es/components/backtop/src/backtop.mjs.map +1 -1
- package/es/components/backtop/src/backtop2.mjs +54 -21
- package/es/components/backtop/src/backtop2.mjs.map +1 -1
- package/es/components/badge/index.mjs +2 -2
- package/es/components/badge/src/badge.mjs +17 -55
- package/es/components/badge/src/badge.mjs.map +1 -1
- package/es/components/badge/src/badge2.mjs +55 -17
- package/es/components/badge/src/badge2.mjs.map +1 -1
- package/es/components/breadcrumb/index.d.ts +2 -2
- package/es/components/breadcrumb/index.mjs +2 -2
- package/es/components/breadcrumb/src/breadcrumb-item.vue.d.ts +1 -1
- package/es/components/breadcrumb/src/breadcrumb.mjs +37 -11
- package/es/components/breadcrumb/src/breadcrumb.mjs.map +1 -1
- package/es/components/breadcrumb/src/breadcrumb2.mjs +11 -37
- package/es/components/breadcrumb/src/breadcrumb2.mjs.map +1 -1
- package/es/components/button/index.mjs +3 -3
- package/es/components/button/src/button-group.mjs +6 -31
- package/es/components/button/src/button-group.mjs.map +1 -1
- package/es/components/button/src/button-group2.mjs +31 -6
- package/es/components/button/src/button-group2.mjs.map +1 -1
- package/es/components/button/src/button.mjs +78 -54
- package/es/components/button/src/button.mjs.map +1 -1
- package/es/components/button/src/button2.mjs +54 -78
- package/es/components/button/src/button2.mjs.map +1 -1
- package/es/components/calendar/index.mjs +2 -2
- package/es/components/calendar/src/calendar.mjs +131 -18
- package/es/components/calendar/src/calendar.mjs.map +1 -1
- package/es/components/calendar/src/calendar2.mjs +18 -131
- package/es/components/calendar/src/calendar2.mjs.map +1 -1
- package/es/components/card/index.mjs +2 -2
- package/es/components/card/src/card.mjs +16 -35
- package/es/components/card/src/card.mjs.map +1 -1
- package/es/components/card/src/card2.mjs +35 -16
- package/es/components/card/src/card2.mjs.map +1 -1
- package/es/components/carousel/index.mjs +2 -2
- package/es/components/carousel/src/carousel.mjs +159 -60
- package/es/components/carousel/src/carousel.mjs.map +1 -1
- package/es/components/carousel/src/carousel2.mjs +60 -159
- package/es/components/carousel/src/carousel2.mjs.map +1 -1
- package/es/components/cascader/src/index.mjs +1 -1
- package/es/components/cascader-panel/src/index.mjs +1 -1
- package/es/components/cascader-panel/src/menu.mjs +1 -1
- package/es/components/cascader-panel/src/node.mjs +116 -209
- package/es/components/cascader-panel/src/node.mjs.map +1 -1
- package/es/components/cascader-panel/src/node2.mjs +209 -116
- package/es/components/cascader-panel/src/node2.mjs.map +1 -1
- package/es/components/cascader-panel/src/store.mjs +1 -1
- package/es/components/check-tag/index.mjs +2 -2
- package/es/components/check-tag/src/check-tag.mjs +30 -12
- package/es/components/check-tag/src/check-tag.mjs.map +1 -1
- package/es/components/check-tag/src/check-tag2.mjs +12 -30
- package/es/components/check-tag/src/check-tag2.mjs.map +1 -1
- package/es/components/checkbox/index.mjs +2 -2
- package/es/components/checkbox/src/checkbox-group.mjs +72 -28
- package/es/components/checkbox/src/checkbox-group.mjs.map +1 -1
- package/es/components/checkbox/src/checkbox-group2.mjs +28 -72
- package/es/components/checkbox/src/checkbox-group2.mjs.map +1 -1
- package/es/components/collapse/index.mjs +4 -4
- package/es/components/collapse/src/collapse-item.mjs +19 -96
- package/es/components/collapse/src/collapse-item.mjs.map +1 -1
- package/es/components/collapse/src/collapse-item2.mjs +96 -19
- package/es/components/collapse/src/collapse-item2.mjs.map +1 -1
- package/es/components/collapse/src/collapse.mjs +30 -17
- package/es/components/collapse/src/collapse.mjs.map +1 -1
- package/es/components/collapse/src/collapse2.mjs +17 -30
- package/es/components/collapse/src/collapse2.mjs.map +1 -1
- package/es/components/color-picker/index.mjs +2 -2
- package/es/components/color-picker/src/color-picker.mjs +372 -42
- package/es/components/color-picker/src/color-picker.mjs.map +1 -1
- package/es/components/color-picker/src/color-picker2.mjs +42 -372
- package/es/components/color-picker/src/color-picker2.mjs.map +1 -1
- package/es/components/color-picker/src/components/predefine.mjs +1 -1
- package/es/components/descriptions/index.mjs +2 -2
- package/es/components/descriptions/src/description.mjs +110 -25
- package/es/components/descriptions/src/description.mjs.map +1 -1
- package/es/components/descriptions/src/description2.mjs +25 -110
- package/es/components/descriptions/src/description2.mjs.map +1 -1
- package/es/components/divider/index.mjs +2 -2
- package/es/components/divider/src/divider.mjs +35 -17
- package/es/components/divider/src/divider.mjs.map +1 -1
- package/es/components/divider/src/divider2.mjs +17 -35
- package/es/components/divider/src/divider2.mjs.map +1 -1
- package/es/components/drawer/index.mjs +2 -2
- package/es/components/drawer/src/drawer.mjs +165 -22
- package/es/components/drawer/src/drawer.mjs.map +1 -1
- package/es/components/drawer/src/drawer2.mjs +22 -165
- package/es/components/drawer/src/drawer2.mjs.map +1 -1
- package/es/components/dropdown/src/dropdown-item-impl.mjs +1 -1
- package/es/components/dropdown/src/dropdown-menu.mjs +1 -1
- package/es/components/dropdown/src/dropdown.mjs +2 -2
- package/es/components/dropdown/src/dropdown2.mjs +1 -1
- package/es/components/form/index.mjs +2 -2
- package/es/components/form/src/form.mjs +53 -150
- package/es/components/form/src/form.mjs.map +1 -1
- package/es/components/form/src/form2.mjs +150 -53
- package/es/components/form/src/form2.mjs.map +1 -1
- package/es/components/icon/index.mjs +2 -2
- package/es/components/icon/src/icon.mjs +8 -36
- package/es/components/icon/src/icon.mjs.map +1 -1
- package/es/components/icon/src/icon2.mjs +36 -8
- package/es/components/icon/src/icon2.mjs.map +1 -1
- package/es/components/image/index.d.ts +1 -1
- package/es/components/image/src/image.vue.d.ts +1 -1
- package/es/components/image-viewer/index.d.ts +1 -1
- package/es/components/image-viewer/index.mjs +2 -2
- package/es/components/image-viewer/src/image-viewer.mjs +405 -35
- package/es/components/image-viewer/src/image-viewer.mjs.map +1 -1
- package/es/components/image-viewer/src/image-viewer.vue.d.ts +1 -1
- package/es/components/image-viewer/src/image-viewer2.mjs +35 -405
- package/es/components/image-viewer/src/image-viewer2.mjs.map +1 -1
- package/es/components/index.mjs +38 -38
- package/es/components/input-number/index.mjs +2 -2
- package/es/components/input-number/src/input-number.mjs +300 -62
- package/es/components/input-number/src/input-number.mjs.map +1 -1
- package/es/components/input-number/src/input-number2.mjs +62 -300
- package/es/components/input-number/src/input-number2.mjs.map +1 -1
- package/es/components/menu/index.mjs +2 -2
- package/es/components/menu/src/menu-item.mjs +14 -100
- package/es/components/menu/src/menu-item.mjs.map +1 -1
- package/es/components/menu/src/menu-item2.mjs +100 -14
- package/es/components/menu/src/menu-item2.mjs.map +1 -1
- package/es/components/notification/index.mjs +1 -1
- package/es/components/notification/src/notification.mjs +145 -69
- package/es/components/notification/src/notification.mjs.map +1 -1
- package/es/components/notification/src/notification2.mjs +69 -145
- package/es/components/notification/src/notification2.mjs.map +1 -1
- package/es/components/notification/src/notify.mjs +2 -2
- package/es/components/pagination/src/components/next.mjs +19 -34
- package/es/components/pagination/src/components/next.mjs.map +1 -1
- package/es/components/pagination/src/components/next2.mjs +34 -19
- package/es/components/pagination/src/components/next2.mjs.map +1 -1
- package/es/components/pagination/src/components/pager.mjs +17 -207
- package/es/components/pagination/src/components/pager.mjs.map +1 -1
- package/es/components/pagination/src/components/pager2.mjs +207 -17
- package/es/components/pagination/src/components/pager2.mjs.map +1 -1
- package/es/components/pagination/src/components/prev.mjs +18 -34
- package/es/components/pagination/src/components/prev.mjs.map +1 -1
- package/es/components/pagination/src/components/prev2.mjs +34 -18
- package/es/components/pagination/src/components/prev2.mjs.map +1 -1
- package/es/components/pagination/src/components/sizes.mjs +68 -22
- package/es/components/pagination/src/components/sizes.mjs.map +1 -1
- package/es/components/pagination/src/components/sizes2.mjs +22 -68
- package/es/components/pagination/src/components/sizes2.mjs.map +1 -1
- package/es/components/pagination/src/pagination.mjs +4 -4
- package/es/components/popconfirm/index.mjs +2 -2
- package/es/components/popconfirm/src/popconfirm.mjs +49 -111
- package/es/components/popconfirm/src/popconfirm.mjs.map +1 -1
- package/es/components/popconfirm/src/popconfirm2.mjs +111 -49
- package/es/components/popconfirm/src/popconfirm2.mjs.map +1 -1
- package/es/components/popover/src/popover.mjs +2 -2
- package/es/components/popper/index.mjs +2 -2
- package/es/components/popper/src/trigger.mjs +31 -120
- package/es/components/popper/src/trigger.mjs.map +1 -1
- package/es/components/popper/src/trigger2.mjs +120 -31
- package/es/components/popper/src/trigger2.mjs.map +1 -1
- package/es/components/roving-focus-group/index.mjs +3 -3
- package/es/components/roving-focus-group/src/roving-focus-group-impl.mjs +1 -1
- package/es/components/roving-focus-group/src/roving-focus-group.mjs +27 -29
- package/es/components/roving-focus-group/src/roving-focus-group.mjs.map +1 -1
- package/es/components/roving-focus-group/src/roving-focus-group2.mjs +29 -27
- package/es/components/roving-focus-group/src/roving-focus-group2.mjs.map +1 -1
- package/es/components/roving-focus-group/src/roving-focus-item.mjs +1 -1
- package/es/components/scrollbar/index.mjs +1 -1
- package/es/components/scrollbar/src/bar.mjs +42 -17
- package/es/components/scrollbar/src/bar.mjs.map +1 -1
- package/es/components/scrollbar/src/bar2.mjs +17 -42
- package/es/components/scrollbar/src/bar2.mjs.map +1 -1
- package/es/components/scrollbar/src/scrollbar.mjs +1 -1
- package/es/components/scrollbar/src/thumb.mjs +131 -11
- package/es/components/scrollbar/src/thumb.mjs.map +1 -1
- package/es/components/scrollbar/src/thumb2.mjs +11 -131
- package/es/components/scrollbar/src/thumb2.mjs.map +1 -1
- package/es/components/select/src/select.mjs +1 -1
- package/es/components/select-v2/src/defaults.mjs +1 -1
- package/es/components/skeleton/index.mjs +2 -2
- package/es/components/skeleton/src/skeleton-item.mjs +23 -18
- package/es/components/skeleton/src/skeleton-item.mjs.map +1 -1
- package/es/components/skeleton/src/skeleton-item2.mjs +18 -23
- package/es/components/skeleton/src/skeleton-item2.mjs.map +1 -1
- package/es/components/skeleton/src/skeleton2.mjs +1 -1
- package/es/components/slider/src/button.mjs +21 -93
- package/es/components/slider/src/button.mjs.map +1 -1
- package/es/components/slider/src/button2.mjs +93 -21
- package/es/components/slider/src/button2.mjs.map +1 -1
- package/es/components/slider/src/slider.mjs +1 -1
- package/es/components/steps/index.mjs +2 -2
- package/es/components/steps/src/steps.mjs +34 -36
- package/es/components/steps/src/steps.mjs.map +1 -1
- package/es/components/steps/src/steps2.mjs +36 -34
- package/es/components/steps/src/steps2.mjs.map +1 -1
- package/es/components/switch/index.mjs +2 -2
- package/es/components/switch/src/switch.mjs +88 -240
- package/es/components/switch/src/switch.mjs.map +1 -1
- package/es/components/switch/src/switch2.mjs +240 -88
- package/es/components/switch/src/switch2.mjs.map +1 -1
- package/es/components/tabs/index.mjs +3 -3
- package/es/components/tabs/src/tab-bar.mjs +7 -81
- package/es/components/tabs/src/tab-bar.mjs.map +1 -1
- package/es/components/tabs/src/tab-bar2.mjs +81 -7
- package/es/components/tabs/src/tab-bar2.mjs.map +1 -1
- package/es/components/tabs/src/tab-nav.mjs +1 -1
- package/es/components/tabs/src/tab-pane.mjs +73 -13
- package/es/components/tabs/src/tab-pane.mjs.map +1 -1
- package/es/components/tabs/src/tab-pane2.mjs +13 -73
- package/es/components/tabs/src/tab-pane2.mjs.map +1 -1
- package/es/components/teleport/index.mjs +2 -2
- package/es/components/teleport/src/teleport.mjs +18 -44
- package/es/components/teleport/src/teleport.mjs.map +1 -1
- package/es/components/teleport/src/teleport2.mjs +44 -18
- package/es/components/teleport/src/teleport2.mjs.map +1 -1
- package/es/components/tooltip/index.mjs +4 -4
- package/es/components/tooltip/src/content.mjs +167 -39
- package/es/components/tooltip/src/content.mjs.map +1 -1
- package/es/components/tooltip/src/content2.mjs +39 -167
- package/es/components/tooltip/src/content2.mjs.map +1 -1
- package/es/components/tooltip/src/tooltip.mjs +31 -170
- package/es/components/tooltip/src/tooltip.mjs.map +1 -1
- package/es/components/tooltip/src/tooltip2.mjs +170 -31
- package/es/components/tooltip/src/tooltip2.mjs.map +1 -1
- package/es/components/tooltip/src/trigger.mjs +74 -16
- package/es/components/tooltip/src/trigger.mjs.map +1 -1
- package/es/components/tooltip/src/trigger2.mjs +16 -74
- package/es/components/tooltip/src/trigger2.mjs.map +1 -1
- package/es/components/tooltip-v2/index.d.ts +5 -5
- package/es/components/tooltip-v2/index.mjs +4 -4
- package/es/components/tooltip-v2/src/arrow.mjs +38 -22
- package/es/components/tooltip-v2/src/arrow.mjs.map +1 -1
- package/es/components/tooltip-v2/src/arrow2.mjs +22 -38
- package/es/components/tooltip-v2/src/arrow2.mjs.map +1 -1
- package/es/components/tooltip-v2/src/content.mjs +113 -50
- package/es/components/tooltip-v2/src/content.mjs.map +1 -1
- package/es/components/tooltip-v2/src/content2.mjs +50 -113
- package/es/components/tooltip-v2/src/content2.mjs.map +1 -1
- package/es/components/tooltip-v2/src/root.mjs +17 -81
- package/es/components/tooltip-v2/src/root.mjs.map +1 -1
- package/es/components/tooltip-v2/src/root2.mjs +81 -17
- package/es/components/tooltip-v2/src/root2.mjs.map +1 -1
- package/es/components/tooltip-v2/src/tooltip.mjs +4 -4
- package/es/components/tooltip-v2/src/tooltip.vue.d.ts +5 -5
- package/es/components/tooltip-v2/src/tooltip2.mjs +8 -8
- package/es/components/tooltip-v2/src/trigger.mjs +12 -90
- package/es/components/tooltip-v2/src/trigger.mjs.map +1 -1
- package/es/components/tooltip-v2/src/trigger2.mjs +90 -12
- package/es/components/tooltip-v2/src/trigger2.mjs.map +1 -1
- package/es/components/transfer/index.mjs +2 -2
- package/es/components/transfer/src/composables/use-check.mjs +1 -1
- package/es/components/transfer/src/composables/use-checked-change.mjs +1 -1
- package/es/components/transfer/src/transfer-panel.mjs +131 -19
- package/es/components/transfer/src/transfer-panel.mjs.map +1 -1
- package/es/components/transfer/src/transfer-panel2.mjs +19 -131
- package/es/components/transfer/src/transfer-panel2.mjs.map +1 -1
- package/es/components/transfer/src/transfer.mjs +69 -159
- package/es/components/transfer/src/transfer.mjs.map +1 -1
- package/es/components/transfer/src/transfer2.mjs +159 -69
- package/es/components/transfer/src/transfer2.mjs.map +1 -1
- package/es/components/upload/index.mjs +1 -1
- package/es/components/upload/src/upload-content2.mjs +1 -1
- package/es/components/upload/src/upload-dragger.mjs +70 -11
- package/es/components/upload/src/upload-dragger.mjs.map +1 -1
- package/es/components/upload/src/upload-dragger2.mjs +11 -70
- package/es/components/upload/src/upload-dragger2.mjs.map +1 -1
- package/es/index.mjs +38 -38
- package/lib/components/alert/index.js +2 -2
- package/lib/components/alert/src/alert.js +37 -95
- package/lib/components/alert/src/alert.js.map +1 -1
- package/lib/components/alert/src/alert2.js +95 -37
- package/lib/components/alert/src/alert2.js.map +1 -1
- package/lib/components/autocomplete/index.js +2 -2
- package/lib/components/autocomplete/src/autocomplete.js +71 -352
- package/lib/components/autocomplete/src/autocomplete.js.map +1 -1
- package/lib/components/autocomplete/src/autocomplete2.js +352 -71
- package/lib/components/autocomplete/src/autocomplete2.js.map +1 -1
- package/lib/components/avatar/index.js +2 -2
- package/lib/components/avatar/src/avatar.js +33 -67
- package/lib/components/avatar/src/avatar.js.map +1 -1
- package/lib/components/avatar/src/avatar2.js +67 -33
- package/lib/components/avatar/src/avatar2.js.map +1 -1
- package/lib/components/backtop/index.js +2 -2
- package/lib/components/backtop/src/backtop.js +22 -54
- package/lib/components/backtop/src/backtop.js.map +1 -1
- package/lib/components/backtop/src/backtop2.js +54 -22
- package/lib/components/backtop/src/backtop2.js.map +1 -1
- package/lib/components/badge/index.js +2 -2
- package/lib/components/badge/src/badge.js +17 -55
- package/lib/components/badge/src/badge.js.map +1 -1
- package/lib/components/badge/src/badge2.js +55 -17
- package/lib/components/badge/src/badge2.js.map +1 -1
- package/lib/components/breadcrumb/index.d.ts +2 -2
- package/lib/components/breadcrumb/index.js +2 -2
- package/lib/components/breadcrumb/src/breadcrumb-item.vue.d.ts +1 -1
- package/lib/components/breadcrumb/src/breadcrumb.js +37 -11
- package/lib/components/breadcrumb/src/breadcrumb.js.map +1 -1
- package/lib/components/breadcrumb/src/breadcrumb2.js +11 -37
- package/lib/components/breadcrumb/src/breadcrumb2.js.map +1 -1
- package/lib/components/button/index.js +3 -3
- package/lib/components/button/src/button-group.js +6 -31
- package/lib/components/button/src/button-group.js.map +1 -1
- package/lib/components/button/src/button-group2.js +31 -6
- package/lib/components/button/src/button-group2.js.map +1 -1
- package/lib/components/button/src/button.js +78 -57
- package/lib/components/button/src/button.js.map +1 -1
- package/lib/components/button/src/button2.js +57 -78
- package/lib/components/button/src/button2.js.map +1 -1
- package/lib/components/calendar/index.js +2 -2
- package/lib/components/calendar/src/calendar.js +131 -19
- package/lib/components/calendar/src/calendar.js.map +1 -1
- package/lib/components/calendar/src/calendar2.js +19 -131
- package/lib/components/calendar/src/calendar2.js.map +1 -1
- package/lib/components/card/index.js +2 -2
- package/lib/components/card/src/card.js +16 -35
- package/lib/components/card/src/card.js.map +1 -1
- package/lib/components/card/src/card2.js +35 -16
- package/lib/components/card/src/card2.js.map +1 -1
- package/lib/components/carousel/index.js +2 -2
- package/lib/components/carousel/src/carousel.js +159 -61
- package/lib/components/carousel/src/carousel.js.map +1 -1
- package/lib/components/carousel/src/carousel2.js +61 -159
- package/lib/components/carousel/src/carousel2.js.map +1 -1
- package/lib/components/cascader/src/index.js +1 -1
- package/lib/components/cascader-panel/src/index.js +1 -1
- package/lib/components/cascader-panel/src/menu.js +1 -1
- package/lib/components/cascader-panel/src/node.js +116 -209
- package/lib/components/cascader-panel/src/node.js.map +1 -1
- package/lib/components/cascader-panel/src/node2.js +209 -116
- package/lib/components/cascader-panel/src/node2.js.map +1 -1
- package/lib/components/cascader-panel/src/store.js +1 -1
- package/lib/components/check-tag/index.js +2 -2
- package/lib/components/check-tag/src/check-tag.js +30 -13
- package/lib/components/check-tag/src/check-tag.js.map +1 -1
- package/lib/components/check-tag/src/check-tag2.js +13 -30
- package/lib/components/check-tag/src/check-tag2.js.map +1 -1
- package/lib/components/checkbox/index.js +2 -2
- package/lib/components/checkbox/src/checkbox-group.js +72 -29
- package/lib/components/checkbox/src/checkbox-group.js.map +1 -1
- package/lib/components/checkbox/src/checkbox-group2.js +29 -72
- package/lib/components/checkbox/src/checkbox-group2.js.map +1 -1
- package/lib/components/collapse/index.js +4 -4
- package/lib/components/collapse/src/collapse-item.js +19 -96
- package/lib/components/collapse/src/collapse-item.js.map +1 -1
- package/lib/components/collapse/src/collapse-item2.js +96 -19
- package/lib/components/collapse/src/collapse-item2.js.map +1 -1
- package/lib/components/collapse/src/collapse.js +30 -19
- package/lib/components/collapse/src/collapse.js.map +1 -1
- package/lib/components/collapse/src/collapse2.js +19 -30
- package/lib/components/collapse/src/collapse2.js.map +1 -1
- package/lib/components/color-picker/index.js +2 -2
- package/lib/components/color-picker/src/color-picker.js +370 -42
- package/lib/components/color-picker/src/color-picker.js.map +1 -1
- package/lib/components/color-picker/src/color-picker2.js +42 -370
- package/lib/components/color-picker/src/color-picker2.js.map +1 -1
- package/lib/components/color-picker/src/components/predefine.js +1 -1
- package/lib/components/descriptions/index.js +2 -2
- package/lib/components/descriptions/src/description.js +110 -25
- package/lib/components/descriptions/src/description.js.map +1 -1
- package/lib/components/descriptions/src/description2.js +25 -110
- package/lib/components/descriptions/src/description2.js.map +1 -1
- package/lib/components/divider/index.js +2 -2
- package/lib/components/divider/src/divider.js +35 -17
- package/lib/components/divider/src/divider.js.map +1 -1
- package/lib/components/divider/src/divider2.js +17 -35
- package/lib/components/divider/src/divider2.js.map +1 -1
- package/lib/components/drawer/index.js +2 -2
- package/lib/components/drawer/src/drawer.js +165 -23
- package/lib/components/drawer/src/drawer.js.map +1 -1
- package/lib/components/drawer/src/drawer2.js +23 -165
- package/lib/components/drawer/src/drawer2.js.map +1 -1
- package/lib/components/dropdown/src/dropdown-item-impl.js +1 -1
- package/lib/components/dropdown/src/dropdown-menu.js +1 -1
- package/lib/components/dropdown/src/dropdown.js +2 -2
- package/lib/components/dropdown/src/dropdown2.js +1 -1
- package/lib/components/form/index.js +2 -2
- package/lib/components/form/src/form.js +53 -149
- package/lib/components/form/src/form.js.map +1 -1
- package/lib/components/form/src/form2.js +149 -53
- package/lib/components/form/src/form2.js.map +1 -1
- package/lib/components/icon/index.js +2 -2
- package/lib/components/icon/src/icon.js +8 -36
- package/lib/components/icon/src/icon.js.map +1 -1
- package/lib/components/icon/src/icon2.js +36 -8
- package/lib/components/icon/src/icon2.js.map +1 -1
- package/lib/components/image/index.d.ts +1 -1
- package/lib/components/image/src/image.vue.d.ts +1 -1
- package/lib/components/image-viewer/index.d.ts +1 -1
- package/lib/components/image-viewer/index.js +2 -2
- package/lib/components/image-viewer/src/image-viewer.js +405 -36
- package/lib/components/image-viewer/src/image-viewer.js.map +1 -1
- package/lib/components/image-viewer/src/image-viewer.vue.d.ts +1 -1
- package/lib/components/image-viewer/src/image-viewer2.js +36 -405
- package/lib/components/image-viewer/src/image-viewer2.js.map +1 -1
- package/lib/components/index.js +38 -38
- package/lib/components/input-number/index.js +2 -2
- package/lib/components/input-number/src/input-number.js +299 -62
- package/lib/components/input-number/src/input-number.js.map +1 -1
- package/lib/components/input-number/src/input-number2.js +62 -299
- package/lib/components/input-number/src/input-number2.js.map +1 -1
- package/lib/components/menu/index.js +2 -2
- package/lib/components/menu/src/menu-item.js +15 -100
- package/lib/components/menu/src/menu-item.js.map +1 -1
- package/lib/components/menu/src/menu-item2.js +100 -15
- package/lib/components/menu/src/menu-item2.js.map +1 -1
- package/lib/components/notification/index.js +1 -1
- package/lib/components/notification/src/notification.js +144 -70
- package/lib/components/notification/src/notification.js.map +1 -1
- package/lib/components/notification/src/notification2.js +70 -144
- package/lib/components/notification/src/notification2.js.map +1 -1
- package/lib/components/notification/src/notify.js +2 -2
- package/lib/components/pagination/src/components/next.js +19 -34
- package/lib/components/pagination/src/components/next.js.map +1 -1
- package/lib/components/pagination/src/components/next2.js +34 -19
- package/lib/components/pagination/src/components/next2.js.map +1 -1
- package/lib/components/pagination/src/components/pager.js +17 -207
- package/lib/components/pagination/src/components/pager.js.map +1 -1
- package/lib/components/pagination/src/components/pager2.js +207 -17
- package/lib/components/pagination/src/components/pager2.js.map +1 -1
- package/lib/components/pagination/src/components/prev.js +19 -34
- package/lib/components/pagination/src/components/prev.js.map +1 -1
- package/lib/components/pagination/src/components/prev2.js +34 -19
- package/lib/components/pagination/src/components/prev2.js.map +1 -1
- package/lib/components/pagination/src/components/sizes.js +68 -22
- package/lib/components/pagination/src/components/sizes.js.map +1 -1
- package/lib/components/pagination/src/components/sizes2.js +22 -68
- package/lib/components/pagination/src/components/sizes2.js.map +1 -1
- package/lib/components/pagination/src/pagination.js +4 -4
- package/lib/components/popconfirm/index.js +2 -2
- package/lib/components/popconfirm/src/popconfirm.js +49 -111
- package/lib/components/popconfirm/src/popconfirm.js.map +1 -1
- package/lib/components/popconfirm/src/popconfirm2.js +111 -49
- package/lib/components/popconfirm/src/popconfirm2.js.map +1 -1
- package/lib/components/popover/src/popover.js +2 -2
- package/lib/components/popper/index.js +2 -2
- package/lib/components/popper/src/trigger.js +32 -120
- package/lib/components/popper/src/trigger.js.map +1 -1
- package/lib/components/popper/src/trigger2.js +120 -32
- package/lib/components/popper/src/trigger2.js.map +1 -1
- package/lib/components/roving-focus-group/index.js +2 -2
- package/lib/components/roving-focus-group/src/roving-focus-group-impl.js +1 -1
- package/lib/components/roving-focus-group/src/roving-focus-group.js +27 -33
- package/lib/components/roving-focus-group/src/roving-focus-group.js.map +1 -1
- package/lib/components/roving-focus-group/src/roving-focus-group2.js +33 -27
- package/lib/components/roving-focus-group/src/roving-focus-group2.js.map +1 -1
- package/lib/components/roving-focus-group/src/roving-focus-item.js +1 -1
- package/lib/components/scrollbar/index.js +1 -1
- package/lib/components/scrollbar/src/bar.js +42 -17
- package/lib/components/scrollbar/src/bar.js.map +1 -1
- package/lib/components/scrollbar/src/bar2.js +17 -42
- package/lib/components/scrollbar/src/bar2.js.map +1 -1
- package/lib/components/scrollbar/src/scrollbar.js +1 -1
- package/lib/components/scrollbar/src/thumb.js +131 -11
- package/lib/components/scrollbar/src/thumb.js.map +1 -1
- package/lib/components/scrollbar/src/thumb2.js +11 -131
- package/lib/components/scrollbar/src/thumb2.js.map +1 -1
- package/lib/components/select/src/select.js +1 -1
- package/lib/components/select-v2/src/defaults.js +1 -1
- package/lib/components/skeleton/index.js +2 -2
- package/lib/components/skeleton/src/skeleton-item.js +23 -18
- package/lib/components/skeleton/src/skeleton-item.js.map +1 -1
- package/lib/components/skeleton/src/skeleton-item2.js +18 -23
- package/lib/components/skeleton/src/skeleton-item2.js.map +1 -1
- package/lib/components/skeleton/src/skeleton2.js +1 -1
- package/lib/components/slider/src/button.js +22 -93
- package/lib/components/slider/src/button.js.map +1 -1
- package/lib/components/slider/src/button2.js +93 -22
- package/lib/components/slider/src/button2.js.map +1 -1
- package/lib/components/slider/src/slider.js +1 -1
- package/lib/components/steps/index.js +2 -2
- package/lib/components/steps/src/steps.js +34 -37
- package/lib/components/steps/src/steps.js.map +1 -1
- package/lib/components/steps/src/steps2.js +37 -34
- package/lib/components/steps/src/steps2.js.map +1 -1
- package/lib/components/switch/index.js +2 -2
- package/lib/components/switch/src/switch.js +88 -239
- package/lib/components/switch/src/switch.js.map +1 -1
- package/lib/components/switch/src/switch2.js +239 -88
- package/lib/components/switch/src/switch2.js.map +1 -1
- package/lib/components/tabs/index.js +3 -3
- package/lib/components/tabs/src/tab-bar.js +7 -81
- package/lib/components/tabs/src/tab-bar.js.map +1 -1
- package/lib/components/tabs/src/tab-bar2.js +81 -7
- package/lib/components/tabs/src/tab-bar2.js.map +1 -1
- package/lib/components/tabs/src/tab-nav.js +1 -1
- package/lib/components/tabs/src/tab-pane.js +73 -13
- package/lib/components/tabs/src/tab-pane.js.map +1 -1
- package/lib/components/tabs/src/tab-pane2.js +13 -73
- package/lib/components/tabs/src/tab-pane2.js.map +1 -1
- package/lib/components/teleport/index.js +2 -2
- package/lib/components/teleport/src/teleport.js +18 -44
- package/lib/components/teleport/src/teleport.js.map +1 -1
- package/lib/components/teleport/src/teleport2.js +44 -18
- package/lib/components/teleport/src/teleport2.js.map +1 -1
- package/lib/components/tooltip/index.js +4 -4
- package/lib/components/tooltip/src/content.js +167 -39
- package/lib/components/tooltip/src/content.js.map +1 -1
- package/lib/components/tooltip/src/content2.js +39 -167
- package/lib/components/tooltip/src/content2.js.map +1 -1
- package/lib/components/tooltip/src/tooltip.js +34 -169
- package/lib/components/tooltip/src/tooltip.js.map +1 -1
- package/lib/components/tooltip/src/tooltip2.js +169 -34
- package/lib/components/tooltip/src/tooltip2.js.map +1 -1
- package/lib/components/tooltip/src/trigger.js +74 -16
- package/lib/components/tooltip/src/trigger.js.map +1 -1
- package/lib/components/tooltip/src/trigger2.js +16 -74
- package/lib/components/tooltip/src/trigger2.js.map +1 -1
- package/lib/components/tooltip-v2/index.d.ts +5 -5
- package/lib/components/tooltip-v2/index.js +4 -4
- package/lib/components/tooltip-v2/src/arrow.js +38 -23
- package/lib/components/tooltip-v2/src/arrow.js.map +1 -1
- package/lib/components/tooltip-v2/src/arrow2.js +23 -38
- package/lib/components/tooltip-v2/src/arrow2.js.map +1 -1
- package/lib/components/tooltip-v2/src/content.js +113 -50
- package/lib/components/tooltip-v2/src/content.js.map +1 -1
- package/lib/components/tooltip-v2/src/content2.js +50 -113
- package/lib/components/tooltip-v2/src/content2.js.map +1 -1
- package/lib/components/tooltip-v2/src/root.js +17 -81
- package/lib/components/tooltip-v2/src/root.js.map +1 -1
- package/lib/components/tooltip-v2/src/root2.js +81 -17
- package/lib/components/tooltip-v2/src/root2.js.map +1 -1
- package/lib/components/tooltip-v2/src/tooltip.js +4 -4
- package/lib/components/tooltip-v2/src/tooltip.vue.d.ts +5 -5
- package/lib/components/tooltip-v2/src/tooltip2.js +8 -8
- package/lib/components/tooltip-v2/src/trigger.js +12 -90
- package/lib/components/tooltip-v2/src/trigger.js.map +1 -1
- package/lib/components/tooltip-v2/src/trigger2.js +90 -12
- package/lib/components/tooltip-v2/src/trigger2.js.map +1 -1
- package/lib/components/transfer/index.js +2 -2
- package/lib/components/transfer/src/composables/use-check.js +1 -1
- package/lib/components/transfer/src/composables/use-checked-change.js +1 -1
- package/lib/components/transfer/src/transfer-panel.js +131 -21
- package/lib/components/transfer/src/transfer-panel.js.map +1 -1
- package/lib/components/transfer/src/transfer-panel2.js +21 -131
- package/lib/components/transfer/src/transfer-panel2.js.map +1 -1
- package/lib/components/transfer/src/transfer.js +73 -159
- package/lib/components/transfer/src/transfer.js.map +1 -1
- package/lib/components/transfer/src/transfer2.js +159 -73
- package/lib/components/transfer/src/transfer2.js.map +1 -1
- package/lib/components/upload/index.js +1 -1
- package/lib/components/upload/src/upload-content2.js +1 -1
- package/lib/components/upload/src/upload-dragger.js +70 -12
- package/lib/components/upload/src/upload-dragger.js.map +1 -1
- package/lib/components/upload/src/upload-dragger2.js +12 -70
- package/lib/components/upload/src/upload-dragger2.js.map +1 -1
- package/lib/index.js +38 -38
- package/package.json +1 -1
- package/theme-chalk/el-message.css +1 -1
- package/theme-chalk/index.css +1 -1
- package/theme-chalk/src/message.scss +2 -0
|
@@ -1,35 +1,22 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
1
|
+
import '../../../utils/index.mjs';
|
|
2
|
+
import '../../../constants/index.mjs';
|
|
3
|
+
import { isNumber } from '@vueuse/core';
|
|
4
|
+
import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
|
|
5
|
+
import { mutable } from '../../../utils/typescript.mjs';
|
|
6
|
+
import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
|
|
5
7
|
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
emits: collapseEmits,
|
|
13
|
-
setup(__props, { expose, emit }) {
|
|
14
|
-
const props = __props;
|
|
15
|
-
const { activeNames, setActiveNames } = useCollapse(props, emit);
|
|
16
|
-
const { rootKls } = useCollapseDOM();
|
|
17
|
-
expose({
|
|
18
|
-
activeNames,
|
|
19
|
-
setActiveNames
|
|
20
|
-
});
|
|
21
|
-
return (_ctx, _cache) => {
|
|
22
|
-
return openBlock(), createElementBlock("div", {
|
|
23
|
-
class: normalizeClass(unref(rootKls)),
|
|
24
|
-
role: "tablist",
|
|
25
|
-
"aria-multiselectable": "true"
|
|
26
|
-
}, [
|
|
27
|
-
renderSlot(_ctx.$slots, "default")
|
|
28
|
-
], 2);
|
|
29
|
-
};
|
|
8
|
+
const emitChangeFn = (value) => typeof isNumber(value);
|
|
9
|
+
const collapseProps = buildProps({
|
|
10
|
+
accordion: Boolean,
|
|
11
|
+
modelValue: {
|
|
12
|
+
type: definePropType([Array, String, Number]),
|
|
13
|
+
default: () => mutable([])
|
|
30
14
|
}
|
|
31
15
|
});
|
|
32
|
-
|
|
16
|
+
const collapseEmits = {
|
|
17
|
+
[UPDATE_MODEL_EVENT]: emitChangeFn,
|
|
18
|
+
[CHANGE_EVENT]: emitChangeFn
|
|
19
|
+
};
|
|
33
20
|
|
|
34
|
-
export {
|
|
21
|
+
export { collapseEmits, collapseProps, emitChangeFn };
|
|
35
22
|
//# sourceMappingURL=collapse2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapse2.mjs","sources":["../../../../../../packages/components/collapse/src/collapse.
|
|
1
|
+
{"version":3,"file":"collapse2.mjs","sources":["../../../../../../packages/components/collapse/src/collapse.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n isNumber,\n isString,\n mutable,\n} from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Arrayable } from '@element-plus/utils'\n\nexport type CollapseActiveName = string | number\nexport type CollapseModelValue = Arrayable<CollapseActiveName>\n\nexport const emitChangeFn = (value: CollapseModelValue) =>\n typeof isNumber(value) || isString(value) || Array.isArray(value)\n\nexport const collapseProps = buildProps({\n accordion: Boolean,\n modelValue: {\n type: definePropType<CollapseModelValue>([Array, String, Number]),\n default: () => mutable([] as const),\n },\n} as const)\nexport type CollapseProps = ExtractPropTypes<typeof collapseProps>\n\nexport const collapseEmits = {\n [UPDATE_MODEL_EVENT]: emitChangeFn,\n [CHANGE_EVENT]: emitChangeFn,\n}\nexport type CollapseEmits = typeof collapseEmits\n"],"names":[],"mappings":";;;;;;;AAOY,MAAC,YAAY,GAAG,CAAC,KAAK,KAAK,OAAO,QAAQ,CAAC,KAAK,EAAE;AAClD,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AACjD,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC,EAAE,CAAC;AAC9B,GAAG;AACH,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,CAAC,kBAAkB,GAAG,YAAY;AACpC,EAAE,CAAC,YAAY,GAAG,YAAY;AAC9B;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../../utils/index.mjs';
|
|
2
|
-
import ColorPicker from './src/color-
|
|
3
|
-
export { colorPickerContextKey, colorPickerEmits, colorPickerProps } from './src/color-
|
|
2
|
+
import ColorPicker from './src/color-picker.mjs';
|
|
3
|
+
export { colorPickerContextKey, colorPickerEmits, colorPickerProps } from './src/color-picker2.mjs';
|
|
4
4
|
import { withInstall } from '../../utils/vue/install.mjs';
|
|
5
5
|
|
|
6
6
|
const ElColorPicker = withInstall(ColorPicker);
|
|
@@ -1,49 +1,379 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import '
|
|
1
|
+
import { defineComponent, ref, reactive, computed, nextTick, onMounted, watch, provide, openBlock, createBlock, unref, withCtx, withDirectives, createElementBlock, createElementVNode, normalizeClass, createVNode, createCommentVNode, withKeys, withModifiers, normalizeStyle, vShow } from 'vue';
|
|
2
|
+
import { debounce } from 'lodash-unified';
|
|
3
|
+
import { ElRadioGroup, ElRadioButton } from '../../radio/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';
|
|
3
8
|
import '../../../hooks/index.mjs';
|
|
4
9
|
import '../../../constants/index.mjs';
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import
|
|
8
|
-
import
|
|
10
|
+
import '../../../utils/index.mjs';
|
|
11
|
+
import { EditPen, ArrowDown, Close } from '@element-plus/icons-vue';
|
|
12
|
+
import AlphaSlider from './components/alpha-slider.mjs';
|
|
13
|
+
import HueSlider from './components/hue-slider.mjs';
|
|
14
|
+
import Predefine from './components/predefine.mjs';
|
|
15
|
+
import SvPanel from './components/sv-panel.mjs';
|
|
16
|
+
import Color from './utils/color.mjs';
|
|
17
|
+
import { colorPickerProps, colorPickerEmits, colorPickerContextKey } from './color-picker2.mjs';
|
|
18
|
+
import { useEyeDropper } from '@vueuse/core';
|
|
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 '../../../hooks/use-form-item/index.mjs';
|
|
23
|
+
import { useSize, useDisabled } from '../../../hooks/use-common-props/index.mjs';
|
|
24
|
+
import { UPDATE_MODEL_EVENT } from '../../../constants/event.mjs';
|
|
25
|
+
import { debugWarn } from '../../../utils/error.mjs';
|
|
26
|
+
import ClickOutside from '../../../directives/click-outside/index.mjs';
|
|
9
27
|
|
|
10
|
-
const
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
28
|
+
const _hoisted_1 = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex", "onKeydown"];
|
|
29
|
+
const __default__ = defineComponent({
|
|
30
|
+
name: "ElColorPicker"
|
|
31
|
+
});
|
|
32
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
33
|
+
...__default__,
|
|
34
|
+
props: colorPickerProps,
|
|
35
|
+
emits: colorPickerEmits,
|
|
36
|
+
setup(__props, { expose, emit }) {
|
|
37
|
+
var _a, _b;
|
|
38
|
+
const props = __props;
|
|
39
|
+
const { isSupported, open, sRGBHex } = useEyeDropper();
|
|
40
|
+
const { t } = useLocale();
|
|
41
|
+
const ns = useNamespace("color");
|
|
42
|
+
const { formItem } = useFormItem();
|
|
43
|
+
const colorSize = useSize();
|
|
44
|
+
const colorDisabled = useDisabled();
|
|
45
|
+
const { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, {
|
|
46
|
+
formItemContext: formItem
|
|
47
|
+
});
|
|
48
|
+
const hue = ref();
|
|
49
|
+
const sv = ref();
|
|
50
|
+
const alpha = ref();
|
|
51
|
+
const popper = ref();
|
|
52
|
+
let shouldActiveChange = true;
|
|
53
|
+
const color = reactive(new Color({
|
|
54
|
+
enableAlpha: props.showAlpha,
|
|
55
|
+
format: props.colorFormat || ((_a = props.modelValue) == null ? void 0 : _a.startsWith("#")) ? "hex" : "rgb",
|
|
56
|
+
value: props.modelValue
|
|
57
|
+
}));
|
|
58
|
+
const showPicker = ref(false);
|
|
59
|
+
const showPanelColor = ref(false);
|
|
60
|
+
const customInput = ref("");
|
|
61
|
+
const displayedColor = computed(() => {
|
|
62
|
+
if (!props.modelValue && !showPanelColor.value) {
|
|
63
|
+
return "transparent";
|
|
64
|
+
}
|
|
65
|
+
return displayedRgb(color, props.showAlpha);
|
|
66
|
+
});
|
|
67
|
+
const getEyeDropper = () => {
|
|
68
|
+
if (!isSupported)
|
|
69
|
+
return;
|
|
70
|
+
open();
|
|
71
|
+
};
|
|
72
|
+
const colorMode = ref(((_b = props.modelValue) == null ? void 0 : _b.startsWith("#")) ? "HEX" : "RGB");
|
|
73
|
+
const currentColor = computed(() => {
|
|
74
|
+
return !props.modelValue && !showPanelColor.value ? "" : color.value;
|
|
75
|
+
});
|
|
76
|
+
const modeChange = (val) => {
|
|
77
|
+
color.format = val.toLowerCase();
|
|
78
|
+
handleConfirm();
|
|
79
|
+
customInput.value = color.value;
|
|
80
|
+
};
|
|
81
|
+
function customInputChange() {
|
|
82
|
+
handleConfirm();
|
|
83
|
+
customInput.value = color.value;
|
|
84
|
+
confirmValue();
|
|
85
|
+
}
|
|
86
|
+
const buttonAriaLabel = computed(() => {
|
|
87
|
+
return !isLabeledByFormItem.value ? props.label || t("el.colorpicker.defaultLabel") : void 0;
|
|
88
|
+
});
|
|
89
|
+
const buttonAriaLabelledby = computed(() => {
|
|
90
|
+
return isLabeledByFormItem.value ? formItem == null ? void 0 : formItem.labelId : void 0;
|
|
91
|
+
});
|
|
92
|
+
const btnKls = computed(() => {
|
|
93
|
+
return [
|
|
94
|
+
ns.b("picker"),
|
|
95
|
+
ns.is("disabled", colorDisabled.value),
|
|
96
|
+
ns.is("custom", props.isCustom),
|
|
97
|
+
ns.bm("picker", colorSize.value)
|
|
98
|
+
];
|
|
99
|
+
});
|
|
100
|
+
function displayedRgb(color2, showAlpha) {
|
|
101
|
+
if (!(color2 instanceof Color)) {
|
|
102
|
+
throw new TypeError("color should be instance of _color Class");
|
|
103
|
+
}
|
|
104
|
+
const { r, g, b } = color2.toRgb();
|
|
105
|
+
return showAlpha ? `rgba(${r}, ${g}, ${b}, ${color2.get("alpha") / 100})` : `rgb(${r}, ${g}, ${b})`;
|
|
106
|
+
}
|
|
107
|
+
function setShowPicker(value) {
|
|
108
|
+
showPicker.value = value;
|
|
109
|
+
}
|
|
110
|
+
const debounceSetShowPicker = debounce(setShowPicker, 100);
|
|
111
|
+
function show() {
|
|
112
|
+
setTimeout(() => {
|
|
113
|
+
if (colorDisabled.value)
|
|
114
|
+
return;
|
|
115
|
+
setShowPicker(true);
|
|
116
|
+
}, 100);
|
|
117
|
+
}
|
|
118
|
+
function hide() {
|
|
119
|
+
debounceSetShowPicker(false);
|
|
120
|
+
resetColor();
|
|
121
|
+
}
|
|
122
|
+
function resetColor() {
|
|
123
|
+
nextTick(() => {
|
|
124
|
+
if (props.modelValue) {
|
|
125
|
+
color.fromString(props.modelValue);
|
|
126
|
+
} else {
|
|
127
|
+
color.value = "";
|
|
128
|
+
nextTick(() => {
|
|
129
|
+
showPanelColor.value = false;
|
|
130
|
+
});
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
function handleTrigger() {
|
|
135
|
+
if (colorDisabled.value)
|
|
136
|
+
return;
|
|
137
|
+
debounceSetShowPicker(!showPicker.value);
|
|
138
|
+
}
|
|
139
|
+
function handleConfirm() {
|
|
140
|
+
color.fromString(customInput.value);
|
|
141
|
+
}
|
|
142
|
+
function confirmValue() {
|
|
143
|
+
const value = color.value;
|
|
144
|
+
emit(UPDATE_MODEL_EVENT, value);
|
|
145
|
+
showPicker.value && emit("change", value);
|
|
146
|
+
if (props.validateEvent) {
|
|
147
|
+
formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
|
|
148
|
+
}
|
|
149
|
+
nextTick(() => {
|
|
150
|
+
const newColor = new Color({
|
|
151
|
+
enableAlpha: props.showAlpha,
|
|
152
|
+
format: props.colorFormat || "",
|
|
153
|
+
value: props.modelValue
|
|
154
|
+
});
|
|
155
|
+
if (!color.compare(newColor)) {
|
|
156
|
+
resetColor();
|
|
157
|
+
}
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
function clear() {
|
|
161
|
+
debounceSetShowPicker(false);
|
|
162
|
+
emit(UPDATE_MODEL_EVENT, null);
|
|
163
|
+
emit("change", null);
|
|
164
|
+
if (props.modelValue !== null && props.validateEvent) {
|
|
165
|
+
formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
|
|
166
|
+
}
|
|
167
|
+
resetColor();
|
|
168
|
+
}
|
|
169
|
+
onMounted(() => {
|
|
170
|
+
if (props.modelValue) {
|
|
171
|
+
customInput.value = currentColor.value;
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
watch(() => props.modelValue, (newVal) => {
|
|
175
|
+
if (!newVal) {
|
|
176
|
+
showPanelColor.value = false;
|
|
177
|
+
} else if (newVal && newVal !== color.value) {
|
|
178
|
+
shouldActiveChange = false;
|
|
179
|
+
color.fromString(newVal);
|
|
180
|
+
}
|
|
181
|
+
});
|
|
182
|
+
watch(sRGBHex, (newValue) => {
|
|
183
|
+
color.fromString(newValue);
|
|
184
|
+
customInput.value = color.value;
|
|
185
|
+
});
|
|
186
|
+
watch(() => customInput.value, (newValue, oldValue) => {
|
|
187
|
+
if (newValue !== oldValue) {
|
|
188
|
+
confirmValue();
|
|
189
|
+
}
|
|
190
|
+
});
|
|
191
|
+
watch(() => currentColor.value, (val) => {
|
|
192
|
+
customInput.value = val;
|
|
193
|
+
shouldActiveChange && emit("activeChange", val);
|
|
194
|
+
shouldActiveChange = true;
|
|
195
|
+
});
|
|
196
|
+
watch(() => color.value, () => {
|
|
197
|
+
if (!props.modelValue && !showPanelColor.value) {
|
|
198
|
+
showPanelColor.value = true;
|
|
199
|
+
}
|
|
200
|
+
});
|
|
201
|
+
watch(() => showPicker.value, () => {
|
|
202
|
+
nextTick(() => {
|
|
203
|
+
var _a2, _b2, _c;
|
|
204
|
+
(_a2 = hue.value) == null ? void 0 : _a2.update();
|
|
205
|
+
(_b2 = sv.value) == null ? void 0 : _b2.update();
|
|
206
|
+
(_c = alpha.value) == null ? void 0 : _c.update();
|
|
207
|
+
});
|
|
208
|
+
});
|
|
209
|
+
provide(colorPickerContextKey, {
|
|
210
|
+
currentColor
|
|
211
|
+
});
|
|
212
|
+
expose({
|
|
213
|
+
color,
|
|
214
|
+
show,
|
|
215
|
+
hide
|
|
216
|
+
});
|
|
217
|
+
return (_ctx, _cache) => {
|
|
218
|
+
return openBlock(), createBlock(unref(ElTooltip), {
|
|
219
|
+
ref_key: "popper",
|
|
220
|
+
ref: popper,
|
|
221
|
+
visible: showPicker.value,
|
|
222
|
+
"show-arrow": false,
|
|
223
|
+
"fallback-placements": ["bottom", "top", "right", "left"],
|
|
224
|
+
offset: 0,
|
|
225
|
+
"gpu-acceleration": false,
|
|
226
|
+
"popper-class": [unref(ns).be("picker", "panel"), unref(ns).b("dropdown"), _ctx.popperClass],
|
|
227
|
+
"stop-popper-mouse-event": false,
|
|
228
|
+
effect: "light",
|
|
229
|
+
trigger: "click",
|
|
230
|
+
transition: `${unref(ns).namespace.value}-zoom-in-top`,
|
|
231
|
+
persistent: ""
|
|
232
|
+
}, {
|
|
233
|
+
content: withCtx(() => [
|
|
234
|
+
withDirectives((openBlock(), createElementBlock("div", null, [
|
|
235
|
+
createElementVNode("div", {
|
|
236
|
+
class: normalizeClass(unref(ns).be("dropdown", "main-wrapper"))
|
|
237
|
+
}, [
|
|
238
|
+
createVNode(HueSlider, {
|
|
239
|
+
ref_key: "hue",
|
|
240
|
+
ref: hue,
|
|
241
|
+
class: "hue-slider",
|
|
242
|
+
color: unref(color),
|
|
243
|
+
vertical: ""
|
|
244
|
+
}, null, 8, ["color"]),
|
|
245
|
+
createVNode(SvPanel, {
|
|
246
|
+
ref_key: "sv",
|
|
247
|
+
ref: sv,
|
|
248
|
+
color: unref(color)
|
|
249
|
+
}, null, 8, ["color"])
|
|
250
|
+
], 2),
|
|
251
|
+
_ctx.showAlpha ? (openBlock(), createBlock(AlphaSlider, {
|
|
252
|
+
key: 0,
|
|
253
|
+
ref_key: "alpha",
|
|
254
|
+
ref: alpha,
|
|
255
|
+
color: unref(color)
|
|
256
|
+
}, null, 8, ["color"])) : createCommentVNode("v-if", true),
|
|
257
|
+
_ctx.predefine ? (openBlock(), createBlock(Predefine, {
|
|
258
|
+
key: 1,
|
|
259
|
+
ref: "predefine",
|
|
260
|
+
color: unref(color),
|
|
261
|
+
colors: _ctx.predefine
|
|
262
|
+
}, null, 8, ["color", "colors"])) : createCommentVNode("v-if", true),
|
|
263
|
+
createElementVNode("div", {
|
|
264
|
+
class: normalizeClass(unref(ns).be("dropdown", "btns"))
|
|
265
|
+
}, [
|
|
266
|
+
createElementVNode("span", {
|
|
267
|
+
class: normalizeClass(unref(ns).be("dropdown", "value"))
|
|
268
|
+
}, [
|
|
269
|
+
createVNode(unref(ElInput), {
|
|
270
|
+
modelValue: customInput.value,
|
|
271
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => customInput.value = $event),
|
|
272
|
+
"validate-event": false,
|
|
273
|
+
size: "small",
|
|
274
|
+
onKeyup: withKeys(handleConfirm, ["enter"]),
|
|
275
|
+
onBlur: customInputChange
|
|
276
|
+
}, null, 8, ["modelValue", "onKeyup"])
|
|
277
|
+
], 2),
|
|
278
|
+
createVNode(unref(ElIcon), {
|
|
279
|
+
onClick: withModifiers(getEyeDropper, ["stop"])
|
|
280
|
+
}, {
|
|
281
|
+
default: withCtx(() => [
|
|
282
|
+
createVNode(unref(EditPen))
|
|
283
|
+
]),
|
|
284
|
+
_: 1
|
|
285
|
+
}, 8, ["onClick"]),
|
|
286
|
+
createVNode(unref(ElRadioGroup), {
|
|
287
|
+
onChange: modeChange,
|
|
288
|
+
modelValue: colorMode.value,
|
|
289
|
+
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => colorMode.value = $event),
|
|
290
|
+
size: "small"
|
|
291
|
+
}, {
|
|
292
|
+
default: withCtx(() => [
|
|
293
|
+
createVNode(unref(ElRadioButton), { label: "HEX" }),
|
|
294
|
+
createVNode(unref(ElRadioButton), { label: "RGB" })
|
|
295
|
+
]),
|
|
296
|
+
_: 1
|
|
297
|
+
}, 8, ["modelValue"]),
|
|
298
|
+
createCommentVNode(` <el-button
|
|
299
|
+
:class="ns.be('dropdown', 'link-btn')"
|
|
300
|
+
text
|
|
301
|
+
size="small"
|
|
302
|
+
@click="clear"
|
|
303
|
+
>
|
|
304
|
+
{{ t('el.colorpicker.clear') }}
|
|
305
|
+
</el-button>
|
|
306
|
+
<el-button
|
|
307
|
+
plain
|
|
308
|
+
size="small"
|
|
309
|
+
:class="ns.be('dropdown', 'btn')"
|
|
310
|
+
@click="confirmValue"
|
|
311
|
+
>
|
|
312
|
+
{{ t('el.colorpicker.confirm') }}
|
|
313
|
+
</el-button> `)
|
|
314
|
+
], 2)
|
|
315
|
+
])), [
|
|
316
|
+
[unref(ClickOutside), hide]
|
|
317
|
+
])
|
|
318
|
+
]),
|
|
319
|
+
default: withCtx(() => [
|
|
320
|
+
createElementVNode("div", {
|
|
321
|
+
id: unref(buttonId),
|
|
322
|
+
class: normalizeClass(unref(btnKls)),
|
|
323
|
+
role: "button",
|
|
324
|
+
"aria-label": unref(buttonAriaLabel),
|
|
325
|
+
"aria-labelledby": unref(buttonAriaLabelledby),
|
|
326
|
+
"aria-description": unref(t)("el.colorpicker.description", { color: _ctx.modelValue || "" }),
|
|
327
|
+
tabindex: _ctx.tabindex,
|
|
328
|
+
onKeydown: withKeys(handleTrigger, ["enter"])
|
|
329
|
+
}, [
|
|
330
|
+
unref(colorDisabled) ? (openBlock(), createElementBlock("div", {
|
|
331
|
+
key: 0,
|
|
332
|
+
class: normalizeClass(unref(ns).be("picker", "mask"))
|
|
333
|
+
}, null, 2)) : createCommentVNode("v-if", true),
|
|
334
|
+
createElementVNode("div", {
|
|
335
|
+
class: normalizeClass(unref(ns).be("picker", "trigger")),
|
|
336
|
+
onClick: handleTrigger
|
|
337
|
+
}, [
|
|
338
|
+
createElementVNode("span", {
|
|
339
|
+
class: normalizeClass([unref(ns).be("picker", "color"), unref(ns).is("alpha", _ctx.showAlpha)])
|
|
340
|
+
}, [
|
|
341
|
+
createElementVNode("span", {
|
|
342
|
+
class: normalizeClass(unref(ns).be("picker", "color-inner")),
|
|
343
|
+
style: normalizeStyle({
|
|
344
|
+
backgroundColor: unref(displayedColor)
|
|
345
|
+
})
|
|
346
|
+
}, [
|
|
347
|
+
withDirectives(createVNode(unref(ElIcon), {
|
|
348
|
+
class: normalizeClass([unref(ns).be("picker", "icon"), unref(ns).is("icon-arrow-down")])
|
|
349
|
+
}, {
|
|
350
|
+
default: withCtx(() => [
|
|
351
|
+
createVNode(unref(ArrowDown))
|
|
352
|
+
]),
|
|
353
|
+
_: 1
|
|
354
|
+
}, 8, ["class"]), [
|
|
355
|
+
[vShow, _ctx.modelValue || showPanelColor.value]
|
|
356
|
+
]),
|
|
357
|
+
!_ctx.modelValue && !showPanelColor.value ? (openBlock(), createBlock(unref(ElIcon), {
|
|
358
|
+
key: 0,
|
|
359
|
+
class: normalizeClass([unref(ns).be("picker", "empty"), unref(ns).is("icon-close")])
|
|
360
|
+
}, {
|
|
361
|
+
default: withCtx(() => [
|
|
362
|
+
createVNode(unref(Close))
|
|
363
|
+
]),
|
|
364
|
+
_: 1
|
|
365
|
+
}, 8, ["class"])) : createCommentVNode("v-if", true)
|
|
366
|
+
], 6)
|
|
367
|
+
], 2)
|
|
368
|
+
], 2)
|
|
369
|
+
], 42, _hoisted_1)
|
|
370
|
+
]),
|
|
371
|
+
_: 1
|
|
372
|
+
}, 8, ["visible", "popper-class", "transition"]);
|
|
373
|
+
};
|
|
39
374
|
}
|
|
40
375
|
});
|
|
41
|
-
|
|
42
|
-
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNil(val),
|
|
43
|
-
[CHANGE_EVENT]: (val) => isString(val) || isNil(val),
|
|
44
|
-
activeChange: (val) => isString(val) || isNil(val)
|
|
45
|
-
};
|
|
46
|
-
const colorPickerContextKey = Symbol("colorPickerContextKey");
|
|
376
|
+
var ColorPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/st/Desktop/vue/nxx-ui/packages/components/color-picker/src/color-picker.vue"]]);
|
|
47
377
|
|
|
48
|
-
export {
|
|
378
|
+
export { ColorPicker as default };
|
|
49
379
|
//# sourceMappingURL=color-picker.mjs.map
|
|
@@ -1 +1 @@
|
|
|
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 isCustom: {\n type: Boolean,\n default: false,\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}\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,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,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;AACU,MAAC,qBAAqB,GAAG,MAAM,CAAC,uBAAuB;;;;"}
|
|
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 >\n <template #content>\n <div v-click-outside=\"hide\">\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 v-model=\"customInput\"\n :validate-event=\"false\"\n size=\"small\"\n @keyup.enter=\"handleConfirm\"\n @blur=\"customInputChange\"\n />\n </span>\n <el-icon @click.stop=\"getEyeDropper\"><EditPen /></el-icon> \n <el-radio-group @change=\"modeChange\" v-model=\"colorMode\" size=\"small\">\n <el-radio-button label=\"HEX\" />\n <el-radio-button label=\"RGB\" />\n </el-radio-group>\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 :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 :tabindex=\"tabindex\"\n @keydown.enter=\"handleTrigger\"\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-if=\"!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'\n// import { ElButton } from '@element-plus/components/button'\nimport { ElRadioGroup} from '@element-plus/components/radio'\nimport { ElRadioButton } from '@element-plus/components/radio'\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 useDisabled,\n useFormItem,\n useFormItemInputId,\n useSize,\n} from '@element-plus/hooks'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { debugWarn } from '@element-plus/utils'\nimport { ArrowDown, Close, EditPen } 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'\nimport { useEyeDropper } from '@vueuse/core'\ndefineOptions({\n name: 'ElColorPicker',\n})\nconst props = defineProps(colorPickerProps)\nconst emit = defineEmits(colorPickerEmits)\nconst { isSupported, open, sRGBHex } = useEyeDropper()\nconst { t } = useLocale()\nconst ns = useNamespace('color')\nconst { formItem } = useFormItem()\nconst colorSize = useSize()\nconst colorDisabled = useDisabled()\n\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>()\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 || props.modelValue?.startsWith('#') ? 'hex' : 'rgb',\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 getEyeDropper = () => {\n if (!isSupported) return\n open()\n}\nconst colorMode = ref(props.modelValue?.startsWith('#') ? 'HEX' : 'RGB')\n\nconst currentColor = computed(() => {\n return !props.modelValue && !showPanelColor.value ? '' : color.value\n})\n\nconst modeChange = (val: string | number | boolean) => {\n color.format = (val as string).toLowerCase()\n handleConfirm()\n customInput.value = color.value\n}\n\nfunction customInputChange() {\n handleConfirm()\n customInput.value = color.value\n confirmValue()\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.is('custom', props.isCustom),\n ns.bm('picker', colorSize.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)\n\nfunction show() {\n setTimeout(() => {\n if (colorDisabled.value) return\n setShowPicker(true)\n }, 100)\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 showPicker.value && 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\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\n\nwatch(sRGBHex, (newValue) => {\n color.fromString(newValue)\n customInput.value = color.value\n})\n\nwatch(\n () => customInput.value,\n (newValue, oldValue) => {\n if(newValue !== oldValue) {\n confirmValue()\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</script>"],"names":[],"mappings":"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"}
|