vxe-pc-ui 4.6.39 → 4.6.40

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 (44) hide show
  1. package/es/color-picker/src/color-picker.js +175 -110
  2. package/es/color-picker/style.css +80 -20
  3. package/es/color-picker/style.min.css +1 -1
  4. package/es/icon/style.css +1 -1
  5. package/es/style.css +1 -1
  6. package/es/style.min.css +1 -1
  7. package/es/ui/index.js +5 -3
  8. package/es/ui/src/log.js +1 -1
  9. package/es/vxe-color-picker/style.css +80 -20
  10. package/es/vxe-color-picker/style.min.css +1 -1
  11. package/lib/color-picker/src/color-picker.js +84 -19
  12. package/lib/color-picker/src/color-picker.min.js +1 -1
  13. package/lib/color-picker/style/style.css +80 -20
  14. package/lib/color-picker/style/style.min.css +1 -1
  15. package/lib/icon/style/style.css +1 -1
  16. package/lib/icon/style/style.min.css +1 -1
  17. package/lib/index.umd.js +90 -23
  18. package/lib/index.umd.min.js +1 -1
  19. package/lib/style.css +1 -1
  20. package/lib/style.min.css +1 -1
  21. package/lib/ui/index.js +5 -3
  22. package/lib/ui/index.min.js +1 -1
  23. package/lib/ui/src/log.js +1 -1
  24. package/lib/ui/src/log.min.js +1 -1
  25. package/lib/vxe-color-picker/style/style.css +80 -20
  26. package/lib/vxe-color-picker/style/style.min.css +1 -1
  27. package/package.json +1 -1
  28. package/packages/color-picker/src/color-picker.ts +182 -111
  29. package/packages/ui/index.ts +4 -2
  30. package/styles/components/color-picker.scss +73 -21
  31. package/types/components/color-picker.d.ts +2 -0
  32. package/types/ui/global-icon.d.ts +4 -2
  33. /package/es/icon/{iconfont.1751277334874.ttf → iconfont.1751332695680.ttf} +0 -0
  34. /package/es/icon/{iconfont.1751277334874.woff → iconfont.1751332695680.woff} +0 -0
  35. /package/es/icon/{iconfont.1751277334874.woff2 → iconfont.1751332695680.woff2} +0 -0
  36. /package/es/{iconfont.1751277334874.ttf → iconfont.1751332695680.ttf} +0 -0
  37. /package/es/{iconfont.1751277334874.woff → iconfont.1751332695680.woff} +0 -0
  38. /package/es/{iconfont.1751277334874.woff2 → iconfont.1751332695680.woff2} +0 -0
  39. /package/lib/icon/style/{iconfont.1751277334874.ttf → iconfont.1751332695680.ttf} +0 -0
  40. /package/lib/icon/style/{iconfont.1751277334874.woff → iconfont.1751332695680.woff} +0 -0
  41. /package/lib/icon/style/{iconfont.1751277334874.woff2 → iconfont.1751332695680.woff2} +0 -0
  42. /package/lib/{iconfont.1751277334874.ttf → iconfont.1751332695680.ttf} +0 -0
  43. /package/lib/{iconfont.1751277334874.woff → iconfont.1751332695680.woff} +0 -0
  44. /package/lib/{iconfont.1751277334874.woff2 → iconfont.1751332695680.woff2} +0 -0
package/lib/ui/index.js CHANGED
@@ -26,7 +26,7 @@ Object.keys(_core).forEach(function (key) {
26
26
  });
27
27
  var _dynamics = require("../dynamics");
28
28
  var _log = require("./src/log");
29
- const version = exports.version = "4.6.39";
29
+ const version = exports.version = "4.6.40";
30
30
  _core.VxeUI.uiVersion = version;
31
31
  _core.VxeUI.dynamicApp = _dynamics.dynamicApp;
32
32
  function config(options) {
@@ -580,8 +580,10 @@ const iconPrefix = 'vxe-icon-';
580
580
  RATE_CHECKED: iconPrefix + 'star-fill',
581
581
  RATE_UNCHECKED: iconPrefix + 'star',
582
582
  // color-picker
583
- COLOR_COPY: iconPrefix + 'copy',
584
- EYE_DROPPER: iconPrefix + 'dropper',
583
+ COLOR_PICKER_COLOR_COPY: iconPrefix + 'copy',
584
+ COLOR_PICKER_EYE_DROPPER: iconPrefix + 'dropper',
585
+ COLOR_PICKER_TPTY_OPEN: iconPrefix + 'arrow-down rotate180',
586
+ COLOR_PICKER_TPTY_CLOSE: iconPrefix + 'arrow-down',
585
587
  // split
586
588
  SPLIT_TOP_ACTION: iconPrefix + 'arrow-up',
587
589
  SPLIT_BOTTOM_ACTION: iconPrefix + 'arrow-down',
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _exportNames={version:!0,config:!0,setup:!0},_core=(exports.config=config,exports.default=void 0,exports.setup=setup,exports.version=void 0,require("@vxe-ui/core")),_dynamics=(Object.keys(_core).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_core[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _core[e]}})}),require("../dynamics")),_log=require("./src/log");const version=exports.version="4.6.39";function config(e){return(0,_log.warnLog)("vxe.error.delFunc",["config","setConfig"]),(0,_core.setConfig)(e)}function setup(e){return(0,_log.warnLog)("vxe.error.delFunc",["setup","setConfig"]),(0,_core.setConfig)(e)}_core.VxeUI.uiVersion=version,_core.VxeUI.dynamicApp=_dynamics.dynamicApp,_core.VxeUI.config=config,_core.VxeUI.setup=setup,(0,_core.setConfig)({alert:{},anchor:{},anchorLink:{},avatar:{},badge:{},breadcrumb:{separator:"/"},breadcrumbItem:{},button:{trigger:"hover",prefixTooltip:{enterable:!0},suffixTooltip:{enterable:!0}},buttonGroup:{},calendar:{minDate:new Date(1900,0,1),maxDate:new Date(2100,0,1),startDay:1,selectDay:1},card:{border:!0,padding:!0},carousel:{height:200,loop:!0,interval:5e3},carouselItem:{},checkbox:{},checkboxButton:{},checkboxGroup:{},col:{},collapse:{padding:!0,expandConfig:{showIcon:!0}},collapsePane:{},countdown:{},colorPicker:{type:"hex",clearable:!0,showAlpha:!0,clickToCopy:!0,showColorExtractor:!0,showQuick:!0},datePanel:{startDate:new Date(1900,0,1),endDate:new Date(2100,0,1),startDay:1,selectDay:1},datePicker:{shortcutConfig:{align:"left",mode:"text",autoClose:!0},startDay:1,selectDay:1,autoClose:!0,showClearButton:null,showConfirmButton:null},dateRangePicker:{shortcutConfig:{align:"left",mode:"text",autoClose:!0},startDay:1,selectDay:1,separator:" ~ ",autoClose:!0,showClearButton:null,showConfirmButton:null},drawer:{position:"right",showHeader:!0,lockView:!0,mask:!0,showTitleOverflow:!0,showClose:!0,padding:!0,cancelClosable:!0,confirmClosable:!0},empty:{},form:{validConfig:{showMessage:!0,autoPos:!0,theme:"beautify"},tooltipConfig:{enterable:!0},titleAsterisk:!0,titleOverflow:!1,padding:!0},formDesign:{height:400,showHeader:!0,showPc:!0},formGather:{},formGroup:{},formItem:{},formView:{},icon:{},iconPicker:{icons:["home","company","comment","setting","send","envelope","envelope-open","bell","search","print","pc","goods","chart-line","edit","delete","save","folder","microphone","flag","link","location","sunny","rmb","usd","user","add-user","add-users","star","unlock","time","text","feedback","calendar","association-form","cloud-download","cloud-upload","file","subtable","chart-bar-x","chart-bar-y","chart-line","chart-pie","chart-radar"]},image:{showPreview:!0,showPrintButton:!0,maskClosable:!0},imageGroup:{showPreview:!0,showPrintButton:!0},imagePreview:{showPrintButton:!0},input:{startDate:new Date(1900,0,1),endDate:new Date(2100,0,1),startDay:1,selectDay:1,digits:2,controls:!0},layoutAside:{},layoutBody:{},layoutContainer:{},layoutFooter:{},layoutHeader:{},link:{underline:!0},listDesign:{height:400,showPc:!0},listView:{},list:{virtualYConfig:{enabled:!0,gt:100}},loading:{showIcon:!0,showText:!0},modal:{top:16,showHeader:!0,minWidth:340,minHeight:140,lockView:!0,mask:!0,duration:3e3,marginSize:0,dblclickZoom:!0,showTitleOverflow:!0,animat:!0,showClose:!0,padding:!0,draggable:!0,showConfirmButton:null,cancelClosable:!0,confirmClosable:!0,zoomConfig:{minimizeMaxSize:10,minimizeVerticalOffset:{top:-24,left:0},minimizeHorizontalOffset:{top:0,left:32}},storageKey:"VXE_MODAL_POSITION"},noticeBar:{},numberInput:{digits:2,autoFill:!0,controlConfig:{enabled:!0,layout:"right",showButton:!0,isWheel:!0}},optgroup:{},option:{},pager:{pageSizePlacement:"top"},print:{pageStyle:{}},passwordInput:{controls:!0},printPageBreak:{},pulldown:{destroyOnClose:!0},radio:{strict:!0},radioButton:{strict:!0},radioGroup:{strict:!0},rate:{},result:{},row:{},select:{multiCharOverflow:8,remoteConfig:{enabled:!0,autoLoad:!0},virtualYConfig:{enabled:!0,gt:100,oSize:2}},split:{resize:!0,itemConfig:{minWidth:40,minHeight:40}},splitPane:{},slider:{max:100,min:0},steps:{},switch:{},tabPane:{},tableSelect:{gridConfig:{showOverflow:!0,showHeaderOverflow:!0,showFooterOverflow:!0,rowConfig:{isHover:!0},virtualXConfig:{enabled:!0,gt:0},virtualYConfig:{enabled:!0,gt:0}}},tabs:{},tag:{},textEllipsis:{underline:!0},text:{},textarea:{resize:"none"},tip:{},tooltip:{trigger:"hover",theme:"dark",enterDelay:500,leaveDelay:300,isArrow:!0},tree:{indent:20,minHeight:60,radioConfig:{strict:!0}},treeSelect:{treeConfig:{radioConfig:{},checkboxConfig:{}}},upload:{mode:"all",imageTypes:["jpg","jpeg","png","gif"],showList:!0,showUploadButton:!0,showButtonText:!0,showRemoveButton:!0,showButtonIcon:!0,showPreview:!0,dragToUpload:!0,showLimitSize:!0,showLimitCount:!0},watermark:{rotate:-30,gap:[100,100]},table:{},colgroup:{},column:{},toolbar:{},grid:{}});const iconPrefix="vxe-icon-";(0,_core.setIcon)({LOADING:iconPrefix+"spinner roll vxe-loading--default-icon",BUTTON_DROPDOWN:iconPrefix+"arrow-down",BUTTON_LOADING:iconPrefix+"spinner roll",BUTTON_TOOLTIP_ICON:iconPrefix+"question-circle-fill",MENU_ITEM_EXPAND_OPEN:iconPrefix+"arrow-down rotate180",MENU_ITEM_EXPAND_CLOSE:iconPrefix+"arrow-down",SELECT_LOADED:iconPrefix+"spinner roll",SELECT_OPEN:iconPrefix+"caret-down rotate180",SELECT_CLOSE:iconPrefix+"caret-down",ADD_OPTION:iconPrefix+"add",ICON_PICKER_OPEN:iconPrefix+"caret-down rotate180",ICON_PICKER_CLOSE:iconPrefix+"caret-down",PAGER_HOME:iconPrefix+"home-page",PAGER_END:iconPrefix+"end-page",PAGER_JUMP_PREV:iconPrefix+"arrow-double-left",PAGER_JUMP_NEXT:iconPrefix+"arrow-double-right",PAGER_PREV_PAGE:iconPrefix+"arrow-left",PAGER_NEXT_PAGE:iconPrefix+"arrow-right",PAGER_JUMP_MORE:iconPrefix+"ellipsis-h",RADIO_CHECKED:iconPrefix+"radio-checked-fill",RADIO_UNCHECKED:iconPrefix+"radio-unchecked",RADIO_DISABLED_UNCHECKED:iconPrefix+"radio-unchecked-fill",CHECKBOX_INDETERMINATE:iconPrefix+"checkbox-indeterminate-fill",CHECKBOX_CHECKED:iconPrefix+"checkbox-checked-fill",CHECKBOX_UNCHECKED:iconPrefix+"checkbox-unchecked",CHECKBOX_DISABLED_UNCHECKED:iconPrefix+"checkbox-unchecked-fill",INPUT_CLEAR:iconPrefix+"error-circle-fill",INPUT_SEARCH:iconPrefix+"search",INPUT_PLUS_NUM:iconPrefix+"caret-up",INPUT_MINUS_NUM:iconPrefix+"caret-down",NUMBER_INPUT_MINUS_NUM:iconPrefix+"minus",NUMBER_INPUT_PLUS_NUM:iconPrefix+"add",DATE_PICKER_DATE:iconPrefix+"calendar",PASSWORD_INPUT_SHOW_PWD:iconPrefix+"eye-fill-close",PASSWORD_INPUT_HIDE_PWD:iconPrefix+"eye-fill",MODAL_ZOOM_MIN:iconPrefix+"minus",MODAL_ZOOM_REVERT:iconPrefix+"recover",MODAL_ZOOM_IN:iconPrefix+"square",MODAL_ZOOM_OUT:iconPrefix+"maximize",MODAL_CLOSE:iconPrefix+"close",MODAL_INFO:iconPrefix+"info-circle-fill",MODAL_SUCCESS:iconPrefix+"success-circle-fill",MODAL_WARNING:iconPrefix+"warning-circle-fill",MODAL_ERROR:iconPrefix+"error-circle-fill",MODAL_QUESTION:iconPrefix+"question-circle-fill",MODAL_LOADING:iconPrefix+"spinner roll",DRAWER_CLOSE:iconPrefix+"close",FORM_PREFIX:iconPrefix+"question-circle-fill",FORM_SUFFIX:iconPrefix+"question-circle-fill",FORM_FOLDING:iconPrefix+"arrow-up rotate180",FORM_UNFOLDING:iconPrefix+"arrow-up",FORM_DESIGN_STYLE_SETTING:iconPrefix+"layout",FORM_DESIGN_PROPS_PC:iconPrefix+"pc",FORM_DESIGN_PROPS_MOBILE:iconPrefix+"mobile",FORM_DESIGN_PROPS_ADD:iconPrefix+"add",FORM_DESIGN_PROPS_EDIT:iconPrefix+"edit",FORM_DESIGN_WIDGET_ADD:iconPrefix+"square-plus-fill",FORM_DESIGN_WIDGET_COPY:iconPrefix+"copy",FORM_DESIGN_WIDGET_DELETE:iconPrefix+"delete",FORM_DESIGN_WIDGET_SWAP_LR:iconPrefix+"swap",FORM_DESIGN_WIDGET_OPTION_DELETE:iconPrefix+"delete",FORM_DESIGN_WIDGET_OPTION_EXPAND_OPEN:iconPrefix+"square-plus",FORM_DESIGN_WIDGET_OPTION_EXPAND_CLOSE:iconPrefix+"square-minus",LIST_DESIGN_FIELD_SETTING:iconPrefix+"custom-column",LIST_DESIGN_LIST_SETTING:iconPrefix+"menu",LIST_DESIGN_LIST_SETTING_SEARCH_DELETE:iconPrefix+"delete",LIST_DESIGN_LIST_SETTING_ACTIVE_DELETE:iconPrefix+"delete",UPLOAD_FILE_ERROR:iconPrefix+"warning-circle-fill",UPLOAD_FILE_ADD:iconPrefix+"upload",UPLOAD_FILE_REMOVE:iconPrefix+"delete",UPLOAD_FILE_DOWNLOAD:iconPrefix+"download",UPLOAD_IMAGE_RE_UPLOAD:iconPrefix+"repeat",UPLOAD_IMAGE_ADD:iconPrefix+"add",UPLOAD_IMAGE_REMOVE:iconPrefix+"close",UPLOAD_LOADING:iconPrefix+"spinner roll vxe-loading--default-icon",UPLOAD_FILE_TYPE_DEFAULT:iconPrefix+"file",UPLOAD_FILE_TYPE_XLSX:iconPrefix+"file-excel",UPLOAD_FILE_TYPE_XLS:iconPrefix+"file-excel",UPLOAD_FILE_TYPE_PDF:iconPrefix+"file-pdf",UPLOAD_FILE_TYPE_PNG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_GIF:iconPrefix+"file-image",UPLOAD_FILE_TYPE_JPG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_JPEG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_MD:iconPrefix+"file-markdown",UPLOAD_FILE_TYPE_PPD:iconPrefix+"file-ppt",UPLOAD_FILE_TYPE_DOCX:iconPrefix+"file-word",UPLOAD_FILE_TYPE_DOC:iconPrefix+"file-word",UPLOAD_FILE_TYPE_ZIP:iconPrefix+"file-zip",UPLOAD_FILE_TYPE_TXT:iconPrefix+"file-txt",IMAGE_PREVIEW_CLOSE:iconPrefix+"close",IMAGE_PREVIEW_PREVIOUS:iconPrefix+"arrow-left",IMAGE_PREVIEW_NEXT:iconPrefix+"arrow-right",IMAGE_PREVIEW_PCT_FULL:iconPrefix+"pct-full",IMAGE_PREVIEW_PCT_1_1:iconPrefix+"pct-1-1",IMAGE_PREVIEW_ZOOM_OUT:iconPrefix+"search-zoom-out",IMAGE_PREVIEW_ZOOM_IN:iconPrefix+"search-zoom-in",IMAGE_PREVIEW_ROTATE_LEFT:iconPrefix+"rotate-left",IMAGE_PREVIEW_ROTATE_RIGHT:iconPrefix+"rotate-right",IMAGE_PREVIEW_PRINT:iconPrefix+"print",IMAGE_PREVIEW_DOWNLOAD:iconPrefix+"download",ALERT_CLOSE:iconPrefix+"close",ALERT_INFO:iconPrefix+"info-circle-fill",ALERT_SUCCESS:iconPrefix+"success-circle-fill",ALERT_WARNING:iconPrefix+"warning-circle-fill",ALERT_ERROR:iconPrefix+"error-circle-fill",TREE_NODE_OPEN:iconPrefix+"caret-right rotate90",TREE_NODE_CLOSE:iconPrefix+"caret-right",TREE_NODE_LOADED:iconPrefix+"spinner roll",TREE_SELECT_LOADED:iconPrefix+"spinner roll",TREE_SELECT_OPEN:iconPrefix+"caret-down rotate180",TREE_SELECT_CLOSE:iconPrefix+"caret-down",TABLE_SELECT_LOADED:iconPrefix+"spinner roll",TABLE_SELECT_OPEN:iconPrefix+"caret-down rotate180",TABLE_SELECT_CLOSE:iconPrefix+"caret-down",TABS_TAB_BUTTON_TOP:iconPrefix+"arrow-up",TABS_TAB_BUTTON_BOTTOM:iconPrefix+"arrow-down",TABS_TAB_BUTTON_LEFT:iconPrefix+"arrow-left",TABS_TAB_BUTTON_RIGHT:iconPrefix+"arrow-right",TABS_TAB_CLOSE:iconPrefix+"close",TABS_TAB_REFRESH:iconPrefix+"refresh",TABS_TAB_REFRESH_LOADING:iconPrefix+"refresh roll",TEXT_COPY:iconPrefix+"copy",TEXT_LOADING:iconPrefix+"spinner roll",CAROUSEL_HORIZONTAL_PREVIOUS:iconPrefix+"arrow-left",CAROUSEL_HORIZONTAL_NEXT:iconPrefix+"arrow-right",CAROUSEL_VERTICAL_PREVIOUS:iconPrefix+"arrow-up",CAROUSEL_VERTICAL_NEXT:iconPrefix+"arrow-down",COLLAPSE_OPEN:iconPrefix+"arrow-right rotate90",COLLAPSE_CLOSE:iconPrefix+"arrow-right",EMPTY_DEFAULT:iconPrefix+"empty",RESULT_INFO:iconPrefix+"info-circle-fill",RESULT_SUCCESS:iconPrefix+"success-circle-fill",RESULT_WARNING:iconPrefix+"warning-circle-fill",RESULT_ERROR:iconPrefix+"error-circle-fill",RESULT_QUESTION:iconPrefix+"question-circle-fill",RESULT_LOADING:iconPrefix+"spinner roll",RATE_CHECKED:iconPrefix+"star-fill",RATE_UNCHECKED:iconPrefix+"star",COLOR_COPY:iconPrefix+"copy",EYE_DROPPER:iconPrefix+"dropper",SPLIT_TOP_ACTION:iconPrefix+"arrow-up",SPLIT_BOTTOM_ACTION:iconPrefix+"arrow-down",SPLIT_LEFT_ACTION:iconPrefix+"arrow-left",SPLIT_RIGHT_ACTION:iconPrefix+"arrow-right"});var _default=exports.default=_core.VxeUI;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _exportNames={version:!0,config:!0,setup:!0},_core=(exports.config=config,exports.default=void 0,exports.setup=setup,exports.version=void 0,require("@vxe-ui/core")),_dynamics=(Object.keys(_core).forEach(function(e){"default"===e||"__esModule"===e||Object.prototype.hasOwnProperty.call(_exportNames,e)||e in exports&&exports[e]===_core[e]||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _core[e]}})}),require("../dynamics")),_log=require("./src/log");const version=exports.version="4.6.40";function config(e){return(0,_log.warnLog)("vxe.error.delFunc",["config","setConfig"]),(0,_core.setConfig)(e)}function setup(e){return(0,_log.warnLog)("vxe.error.delFunc",["setup","setConfig"]),(0,_core.setConfig)(e)}_core.VxeUI.uiVersion=version,_core.VxeUI.dynamicApp=_dynamics.dynamicApp,_core.VxeUI.config=config,_core.VxeUI.setup=setup,(0,_core.setConfig)({alert:{},anchor:{},anchorLink:{},avatar:{},badge:{},breadcrumb:{separator:"/"},breadcrumbItem:{},button:{trigger:"hover",prefixTooltip:{enterable:!0},suffixTooltip:{enterable:!0}},buttonGroup:{},calendar:{minDate:new Date(1900,0,1),maxDate:new Date(2100,0,1),startDay:1,selectDay:1},card:{border:!0,padding:!0},carousel:{height:200,loop:!0,interval:5e3},carouselItem:{},checkbox:{},checkboxButton:{},checkboxGroup:{},col:{},collapse:{padding:!0,expandConfig:{showIcon:!0}},collapsePane:{},countdown:{},colorPicker:{type:"hex",clearable:!0,showAlpha:!0,clickToCopy:!0,showColorExtractor:!0,showQuick:!0},datePanel:{startDate:new Date(1900,0,1),endDate:new Date(2100,0,1),startDay:1,selectDay:1},datePicker:{shortcutConfig:{align:"left",mode:"text",autoClose:!0},startDay:1,selectDay:1,autoClose:!0,showClearButton:null,showConfirmButton:null},dateRangePicker:{shortcutConfig:{align:"left",mode:"text",autoClose:!0},startDay:1,selectDay:1,separator:" ~ ",autoClose:!0,showClearButton:null,showConfirmButton:null},drawer:{position:"right",showHeader:!0,lockView:!0,mask:!0,showTitleOverflow:!0,showClose:!0,padding:!0,cancelClosable:!0,confirmClosable:!0},empty:{},form:{validConfig:{showMessage:!0,autoPos:!0,theme:"beautify"},tooltipConfig:{enterable:!0},titleAsterisk:!0,titleOverflow:!1,padding:!0},formDesign:{height:400,showHeader:!0,showPc:!0},formGather:{},formGroup:{},formItem:{},formView:{},icon:{},iconPicker:{icons:["home","company","comment","setting","send","envelope","envelope-open","bell","search","print","pc","goods","chart-line","edit","delete","save","folder","microphone","flag","link","location","sunny","rmb","usd","user","add-user","add-users","star","unlock","time","text","feedback","calendar","association-form","cloud-download","cloud-upload","file","subtable","chart-bar-x","chart-bar-y","chart-line","chart-pie","chart-radar"]},image:{showPreview:!0,showPrintButton:!0,maskClosable:!0},imageGroup:{showPreview:!0,showPrintButton:!0},imagePreview:{showPrintButton:!0},input:{startDate:new Date(1900,0,1),endDate:new Date(2100,0,1),startDay:1,selectDay:1,digits:2,controls:!0},layoutAside:{},layoutBody:{},layoutContainer:{},layoutFooter:{},layoutHeader:{},link:{underline:!0},listDesign:{height:400,showPc:!0},listView:{},list:{virtualYConfig:{enabled:!0,gt:100}},loading:{showIcon:!0,showText:!0},modal:{top:16,showHeader:!0,minWidth:340,minHeight:140,lockView:!0,mask:!0,duration:3e3,marginSize:0,dblclickZoom:!0,showTitleOverflow:!0,animat:!0,showClose:!0,padding:!0,draggable:!0,showConfirmButton:null,cancelClosable:!0,confirmClosable:!0,zoomConfig:{minimizeMaxSize:10,minimizeVerticalOffset:{top:-24,left:0},minimizeHorizontalOffset:{top:0,left:32}},storageKey:"VXE_MODAL_POSITION"},noticeBar:{},numberInput:{digits:2,autoFill:!0,controlConfig:{enabled:!0,layout:"right",showButton:!0,isWheel:!0}},optgroup:{},option:{},pager:{pageSizePlacement:"top"},print:{pageStyle:{}},passwordInput:{controls:!0},printPageBreak:{},pulldown:{destroyOnClose:!0},radio:{strict:!0},radioButton:{strict:!0},radioGroup:{strict:!0},rate:{},result:{},row:{},select:{multiCharOverflow:8,remoteConfig:{enabled:!0,autoLoad:!0},virtualYConfig:{enabled:!0,gt:100,oSize:2}},split:{resize:!0,itemConfig:{minWidth:40,minHeight:40}},splitPane:{},slider:{max:100,min:0},steps:{},switch:{},tabPane:{},tableSelect:{gridConfig:{showOverflow:!0,showHeaderOverflow:!0,showFooterOverflow:!0,rowConfig:{isHover:!0},virtualXConfig:{enabled:!0,gt:0},virtualYConfig:{enabled:!0,gt:0}}},tabs:{},tag:{},textEllipsis:{underline:!0},text:{},textarea:{resize:"none"},tip:{},tooltip:{trigger:"hover",theme:"dark",enterDelay:500,leaveDelay:300,isArrow:!0},tree:{indent:20,minHeight:60,radioConfig:{strict:!0}},treeSelect:{treeConfig:{radioConfig:{},checkboxConfig:{}}},upload:{mode:"all",imageTypes:["jpg","jpeg","png","gif"],showList:!0,showUploadButton:!0,showButtonText:!0,showRemoveButton:!0,showButtonIcon:!0,showPreview:!0,dragToUpload:!0,showLimitSize:!0,showLimitCount:!0},watermark:{rotate:-30,gap:[100,100]},table:{},colgroup:{},column:{},toolbar:{},grid:{}});const iconPrefix="vxe-icon-";(0,_core.setIcon)({LOADING:iconPrefix+"spinner roll vxe-loading--default-icon",BUTTON_DROPDOWN:iconPrefix+"arrow-down",BUTTON_LOADING:iconPrefix+"spinner roll",BUTTON_TOOLTIP_ICON:iconPrefix+"question-circle-fill",MENU_ITEM_EXPAND_OPEN:iconPrefix+"arrow-down rotate180",MENU_ITEM_EXPAND_CLOSE:iconPrefix+"arrow-down",SELECT_LOADED:iconPrefix+"spinner roll",SELECT_OPEN:iconPrefix+"caret-down rotate180",SELECT_CLOSE:iconPrefix+"caret-down",ADD_OPTION:iconPrefix+"add",ICON_PICKER_OPEN:iconPrefix+"caret-down rotate180",ICON_PICKER_CLOSE:iconPrefix+"caret-down",PAGER_HOME:iconPrefix+"home-page",PAGER_END:iconPrefix+"end-page",PAGER_JUMP_PREV:iconPrefix+"arrow-double-left",PAGER_JUMP_NEXT:iconPrefix+"arrow-double-right",PAGER_PREV_PAGE:iconPrefix+"arrow-left",PAGER_NEXT_PAGE:iconPrefix+"arrow-right",PAGER_JUMP_MORE:iconPrefix+"ellipsis-h",RADIO_CHECKED:iconPrefix+"radio-checked-fill",RADIO_UNCHECKED:iconPrefix+"radio-unchecked",RADIO_DISABLED_UNCHECKED:iconPrefix+"radio-unchecked-fill",CHECKBOX_INDETERMINATE:iconPrefix+"checkbox-indeterminate-fill",CHECKBOX_CHECKED:iconPrefix+"checkbox-checked-fill",CHECKBOX_UNCHECKED:iconPrefix+"checkbox-unchecked",CHECKBOX_DISABLED_UNCHECKED:iconPrefix+"checkbox-unchecked-fill",INPUT_CLEAR:iconPrefix+"error-circle-fill",INPUT_SEARCH:iconPrefix+"search",INPUT_PLUS_NUM:iconPrefix+"caret-up",INPUT_MINUS_NUM:iconPrefix+"caret-down",NUMBER_INPUT_MINUS_NUM:iconPrefix+"minus",NUMBER_INPUT_PLUS_NUM:iconPrefix+"add",DATE_PICKER_DATE:iconPrefix+"calendar",PASSWORD_INPUT_SHOW_PWD:iconPrefix+"eye-fill-close",PASSWORD_INPUT_HIDE_PWD:iconPrefix+"eye-fill",MODAL_ZOOM_MIN:iconPrefix+"minus",MODAL_ZOOM_REVERT:iconPrefix+"recover",MODAL_ZOOM_IN:iconPrefix+"square",MODAL_ZOOM_OUT:iconPrefix+"maximize",MODAL_CLOSE:iconPrefix+"close",MODAL_INFO:iconPrefix+"info-circle-fill",MODAL_SUCCESS:iconPrefix+"success-circle-fill",MODAL_WARNING:iconPrefix+"warning-circle-fill",MODAL_ERROR:iconPrefix+"error-circle-fill",MODAL_QUESTION:iconPrefix+"question-circle-fill",MODAL_LOADING:iconPrefix+"spinner roll",DRAWER_CLOSE:iconPrefix+"close",FORM_PREFIX:iconPrefix+"question-circle-fill",FORM_SUFFIX:iconPrefix+"question-circle-fill",FORM_FOLDING:iconPrefix+"arrow-up rotate180",FORM_UNFOLDING:iconPrefix+"arrow-up",FORM_DESIGN_STYLE_SETTING:iconPrefix+"layout",FORM_DESIGN_PROPS_PC:iconPrefix+"pc",FORM_DESIGN_PROPS_MOBILE:iconPrefix+"mobile",FORM_DESIGN_PROPS_ADD:iconPrefix+"add",FORM_DESIGN_PROPS_EDIT:iconPrefix+"edit",FORM_DESIGN_WIDGET_ADD:iconPrefix+"square-plus-fill",FORM_DESIGN_WIDGET_COPY:iconPrefix+"copy",FORM_DESIGN_WIDGET_DELETE:iconPrefix+"delete",FORM_DESIGN_WIDGET_SWAP_LR:iconPrefix+"swap",FORM_DESIGN_WIDGET_OPTION_DELETE:iconPrefix+"delete",FORM_DESIGN_WIDGET_OPTION_EXPAND_OPEN:iconPrefix+"square-plus",FORM_DESIGN_WIDGET_OPTION_EXPAND_CLOSE:iconPrefix+"square-minus",LIST_DESIGN_FIELD_SETTING:iconPrefix+"custom-column",LIST_DESIGN_LIST_SETTING:iconPrefix+"menu",LIST_DESIGN_LIST_SETTING_SEARCH_DELETE:iconPrefix+"delete",LIST_DESIGN_LIST_SETTING_ACTIVE_DELETE:iconPrefix+"delete",UPLOAD_FILE_ERROR:iconPrefix+"warning-circle-fill",UPLOAD_FILE_ADD:iconPrefix+"upload",UPLOAD_FILE_REMOVE:iconPrefix+"delete",UPLOAD_FILE_DOWNLOAD:iconPrefix+"download",UPLOAD_IMAGE_RE_UPLOAD:iconPrefix+"repeat",UPLOAD_IMAGE_ADD:iconPrefix+"add",UPLOAD_IMAGE_REMOVE:iconPrefix+"close",UPLOAD_LOADING:iconPrefix+"spinner roll vxe-loading--default-icon",UPLOAD_FILE_TYPE_DEFAULT:iconPrefix+"file",UPLOAD_FILE_TYPE_XLSX:iconPrefix+"file-excel",UPLOAD_FILE_TYPE_XLS:iconPrefix+"file-excel",UPLOAD_FILE_TYPE_PDF:iconPrefix+"file-pdf",UPLOAD_FILE_TYPE_PNG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_GIF:iconPrefix+"file-image",UPLOAD_FILE_TYPE_JPG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_JPEG:iconPrefix+"file-image",UPLOAD_FILE_TYPE_MD:iconPrefix+"file-markdown",UPLOAD_FILE_TYPE_PPD:iconPrefix+"file-ppt",UPLOAD_FILE_TYPE_DOCX:iconPrefix+"file-word",UPLOAD_FILE_TYPE_DOC:iconPrefix+"file-word",UPLOAD_FILE_TYPE_ZIP:iconPrefix+"file-zip",UPLOAD_FILE_TYPE_TXT:iconPrefix+"file-txt",IMAGE_PREVIEW_CLOSE:iconPrefix+"close",IMAGE_PREVIEW_PREVIOUS:iconPrefix+"arrow-left",IMAGE_PREVIEW_NEXT:iconPrefix+"arrow-right",IMAGE_PREVIEW_PCT_FULL:iconPrefix+"pct-full",IMAGE_PREVIEW_PCT_1_1:iconPrefix+"pct-1-1",IMAGE_PREVIEW_ZOOM_OUT:iconPrefix+"search-zoom-out",IMAGE_PREVIEW_ZOOM_IN:iconPrefix+"search-zoom-in",IMAGE_PREVIEW_ROTATE_LEFT:iconPrefix+"rotate-left",IMAGE_PREVIEW_ROTATE_RIGHT:iconPrefix+"rotate-right",IMAGE_PREVIEW_PRINT:iconPrefix+"print",IMAGE_PREVIEW_DOWNLOAD:iconPrefix+"download",ALERT_CLOSE:iconPrefix+"close",ALERT_INFO:iconPrefix+"info-circle-fill",ALERT_SUCCESS:iconPrefix+"success-circle-fill",ALERT_WARNING:iconPrefix+"warning-circle-fill",ALERT_ERROR:iconPrefix+"error-circle-fill",TREE_NODE_OPEN:iconPrefix+"caret-right rotate90",TREE_NODE_CLOSE:iconPrefix+"caret-right",TREE_NODE_LOADED:iconPrefix+"spinner roll",TREE_SELECT_LOADED:iconPrefix+"spinner roll",TREE_SELECT_OPEN:iconPrefix+"caret-down rotate180",TREE_SELECT_CLOSE:iconPrefix+"caret-down",TABLE_SELECT_LOADED:iconPrefix+"spinner roll",TABLE_SELECT_OPEN:iconPrefix+"caret-down rotate180",TABLE_SELECT_CLOSE:iconPrefix+"caret-down",TABS_TAB_BUTTON_TOP:iconPrefix+"arrow-up",TABS_TAB_BUTTON_BOTTOM:iconPrefix+"arrow-down",TABS_TAB_BUTTON_LEFT:iconPrefix+"arrow-left",TABS_TAB_BUTTON_RIGHT:iconPrefix+"arrow-right",TABS_TAB_CLOSE:iconPrefix+"close",TABS_TAB_REFRESH:iconPrefix+"refresh",TABS_TAB_REFRESH_LOADING:iconPrefix+"refresh roll",TEXT_COPY:iconPrefix+"copy",TEXT_LOADING:iconPrefix+"spinner roll",CAROUSEL_HORIZONTAL_PREVIOUS:iconPrefix+"arrow-left",CAROUSEL_HORIZONTAL_NEXT:iconPrefix+"arrow-right",CAROUSEL_VERTICAL_PREVIOUS:iconPrefix+"arrow-up",CAROUSEL_VERTICAL_NEXT:iconPrefix+"arrow-down",COLLAPSE_OPEN:iconPrefix+"arrow-right rotate90",COLLAPSE_CLOSE:iconPrefix+"arrow-right",EMPTY_DEFAULT:iconPrefix+"empty",RESULT_INFO:iconPrefix+"info-circle-fill",RESULT_SUCCESS:iconPrefix+"success-circle-fill",RESULT_WARNING:iconPrefix+"warning-circle-fill",RESULT_ERROR:iconPrefix+"error-circle-fill",RESULT_QUESTION:iconPrefix+"question-circle-fill",RESULT_LOADING:iconPrefix+"spinner roll",RATE_CHECKED:iconPrefix+"star-fill",RATE_UNCHECKED:iconPrefix+"star",COLOR_PICKER_COLOR_COPY:iconPrefix+"copy",COLOR_PICKER_EYE_DROPPER:iconPrefix+"dropper",COLOR_PICKER_TPTY_OPEN:iconPrefix+"arrow-down rotate180",COLOR_PICKER_TPTY_CLOSE:iconPrefix+"arrow-down",SPLIT_TOP_ACTION:iconPrefix+"arrow-up",SPLIT_BOTTOM_ACTION:iconPrefix+"arrow-down",SPLIT_LEFT_ACTION:iconPrefix+"arrow-left",SPLIT_RIGHT_ACTION:iconPrefix+"arrow-right"});var _default=exports.default=_core.VxeUI;
package/lib/ui/src/log.js CHANGED
@@ -5,6 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.warnLog = exports.errLog = void 0;
7
7
  var _core = require("@vxe-ui/core");
8
- const version = `ui v${"4.6.39"}`;
8
+ const version = `ui v${"4.6.40"}`;
9
9
  const warnLog = exports.warnLog = _core.log.create('warn', version);
10
10
  const errLog = exports.errLog = _core.log.create('error', version);
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core");const version="ui v4.6.39",warnLog=exports.warnLog=_core.log.create("warn",version),errLog=exports.errLog=_core.log.create("error",version);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core");const version="ui v4.6.40",warnLog=exports.warnLog=_core.log.create("warn",version),errLog=exports.errLog=_core.log.create("error",version);
@@ -322,44 +322,104 @@
322
322
  height: 100%;
323
323
  }
324
324
 
325
- .vxe-color-picker--hex-wrapper,
326
- .vxe-color-picker--rgb-wrapper {
327
- text-align: center;
325
+ .vxe-color-picker--custom-wrapper {
326
+ display: flex;
327
+ flex-direction: row;
328
+ padding: 0 0.8em;
329
+ }
330
+
331
+ .vxe-color-picker--type-switch {
332
+ position: relative;
333
+ flex-shrink: 0;
328
334
  margin-top: 0.4em;
329
335
  }
330
336
 
331
- .vxe-color-picker--hex-wrapper {
332
- display: flex;
333
- flex-direction: row;
334
- padding: 0 1.8em;
337
+ .vxe-color-picker--type-icon {
338
+ padding: 0.25em;
339
+ color: var(--vxe-ui-input-placeholder-color);
335
340
  }
336
- .vxe-color-picker--hex-wrapper .vxe-color-picker--input-wrapper > .vxe-input {
337
- width: 12em;
341
+ .vxe-color-picker--type-icon i {
342
+ display: inline-block;
343
+ transition: transform 0.2s ease-in-out;
338
344
  }
339
- .vxe-color-picker--hex-wrapper .vxe-color-picker--input-title {
340
- padding: 0 0.6em;
345
+
346
+ .vxe-color-picker--type-label {
347
+ padding: 0 0.25em;
348
+ line-height: 2em;
349
+ cursor: pointer;
350
+ -webkit-user-select: none;
351
+ -moz-user-select: none;
352
+ user-select: none;
341
353
  }
342
354
 
343
- .vxe-color-picker--input-title {
344
- color: var(--vxe-ui-input-placeholder-color);
355
+ .vxe-color-picker--type-popup {
356
+ position: absolute;
357
+ display: none;
358
+ border-radius: var(--vxe-ui-base-border-radius);
359
+ border: 1px solid var(--vxe-ui-base-popup-border-color);
360
+ box-shadow: var(--vxe-ui-base-popup-box-shadow);
361
+ background-color: var(--vxe-ui-layout-background-color);
362
+ padding: 0.25em 1em;
363
+ -webkit-user-select: none;
364
+ -moz-user-select: none;
365
+ user-select: none;
366
+ }
367
+ .vxe-color-picker--type-popup.is--visible {
368
+ display: block;
345
369
  }
346
370
 
347
- .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper {
371
+ .vxe-color-picker--type-item {
372
+ line-height: 1.6em;
373
+ cursor: pointer;
374
+ }
375
+ .vxe-color-picker--type-item:hover {
376
+ color: var(--vxe-ui-font-primary-lighten-color);
377
+ }
378
+
379
+ .vxe-color-picker--hex-wrapper,
380
+ .vxe-color-picker--rgb-wrapper {
381
+ flex-grow: 1;
382
+ text-align: center;
383
+ margin-top: 0.4em;
384
+ }
385
+
386
+ .vxe-color-picker--input-wrapper {
348
387
  display: flex;
349
388
  flex-direction: row;
350
389
  align-items: center;
351
- justify-content: center;
352
- }
353
- .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper > .vxe-input {
354
- width: 5.4em;
355
- margin: 0 0.4em;
390
+ justify-content: right;
356
391
  }
357
- .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-title {
392
+
393
+ .vxe-color-picker--input-title {
358
394
  display: flex;
359
395
  flex-direction: row;
360
396
  align-items: center;
361
397
  justify-content: center;
362
398
  line-height: 1.4em;
399
+ color: var(--vxe-ui-input-placeholder-color);
400
+ }
401
+
402
+ .vxe-color-picker--hex-wrapper {
403
+ display: flex;
404
+ flex-direction: column;
405
+ }
406
+ .vxe-color-picker--hex-wrapper .vxe-color-picker--input-wrapper > .vxe-input {
407
+ width: 20.2em;
408
+ }
409
+
410
+ .vxe-color-picker--rgb-wrapper {
411
+ display: flex;
412
+ flex-direction: column;
413
+ }
414
+ .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper > .vxe-input {
415
+ width: 4.6em;
416
+ margin-left: 0.6em;
417
+ }
418
+ .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper > .vxe-input:first-child {
419
+ margin-left: 0;
420
+ }
421
+ .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper > .vxe-input .vxe-input--control-icon {
422
+ min-width: 1.6em;
363
423
  }
364
424
  .vxe-color-picker--rgb-wrapper .vxe-color-picker--input-title > span {
365
425
  display: block;
@@ -1 +1 @@
1
- .vxe-color-picker.is--selected .vxe-color-picker--inner-color{color:#fff}.vxe-color-picker.is--active{border-color:var(--vxe-ui-font-primary-color)}.vxe-color-picker,.vxe-color-picker--readonly{position:relative;display:inline-block;width:2.4em;padding:.25em;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color)}.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--inner,.vxe-color-picker--preview-btn{background:#fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAWElEQVRIiWM8fubkfwYygKWJOSM5+mCAhRLNoxaPWjxq8ajFoxbTyeL/DAfJ0Xjs3Cl7Siwmu4Yht1aDgZEYx6MWj1o8avGoxaMWD3qLya5X//4nqx6HAQC7RBGFzolqTAAAAABJRU5ErkJggg==)}.vxe-color-picker--inner,.vxe-color-picker--readonly-color{width:100%;height:100%;background-size:1em 1em;border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--readonly-color{border:1px solid var(--vxe-ui-input-border-color)}.vxe-color-picker--inner{cursor:pointer}.vxe-color-picker--input{position:absolute;z-index:-1;width:1px;height:1px;outline:0;border:0}.vxe-color-picker--inner-color{width:100%;height:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--panel-wrapper{position:relative;width:23.4em;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:var(--vxe-ui-base-popup-box-shadow);background-color:var(--vxe-ui-layout-background-color)}.vxe-color-picker--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-color-picker--panel:not(.is--transfer){min-width:100%}.vxe-color-picker--panel.is--transfer{position:fixed}.vxe-color-picker--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-color-picker--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-color-picker--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-color-picker--panel.ani--enter>div::after{display:none}.vxe-color-picker--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-color-picker--color-wrapper{position:relative;height:160px;overflow:hidden}.vxe-color-picker--black-bg,.vxe-color-picker--color-bg,.vxe-color-picker--white-bg{position:absolute;top:0;left:0;width:100%;height:100%}.vxe-color-picker--white-bg{background:linear-gradient(to right,#fff,rgba(255,255,255,0))}.vxe-color-picker--black-bg{background:linear-gradient(to top,#000,rgba(255,255,255,0))}.vxe-color-picker--color-active{position:absolute;left:0;top:0;width:.8em;height:.8em;border-radius:50%;border:1px solid #fff;background-color:transparent;box-shadow:0 0 4px 1px rgba(0,0,0,.3);transform:translate(-.4em,-.4em)}.vxe-color-picker--quick-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start;overflow-x:hidden;overflow-y:auto;max-height:9.2em}.vxe-color-picker--quick-item{width:1.5em;height:1.5em;margin:.4em;border:1px solid var(--vxe-ui-base-popup-border-color);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer;transition:transform .1s ease-in-out}.vxe-color-picker--quick-item:hover{transform:scale(1.2);border-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-color-picker--quick-item:active{transform:scale(.8)}.vxe-color-picker--bar-wrapper{margin-top:.4em}.vxe-color-picker--slider-wrapper{display:flex;flex-direction:row}.vxe-color-picker--color-dropper,.vxe-color-picker--slider-preview{padding-left:.8em}.vxe-color-picker--color-dropper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding-left:.8em;font-size:1.2em;cursor:pointer;transition:transform .1s ease-in-out}.vxe-color-picker--color-dropper:hover{color:var(--vxe-ui-font-primary-color)}.vxe-color-picker--color-dropper:active{transform:scale(.8)}.vxe-color-picker--slider-preview{display:flex;flex-direction:row;flex-shrink:0;align-items:center;justify-content:center}.vxe-color-picker--preview-btn,.vxe-color-picker--preview-color{width:2.2em;height:2.2em;border-radius:50%}.vxe-color-picker--preview-btn{background-size:.8em .8em}.vxe-color-picker--preview-color{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;border:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-color-picker--preview-color:hover::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background-color:rgba(0,0,0,.3);z-index:0}.vxe-color-picker--preview-color:hover .vxe-color-picker--preview-copy-btn{display:block;z-index:1}.vxe-color-picker--preview-color:active .vxe-color-picker--preview-copy-btn{font-size:.8em}.vxe-color-picker--preview-copy-btn{display:none;color:#fff;cursor:pointer}.vxe-color-picker--slider-handle{display:flex;flex-direction:column;justify-content:center;flex-grow:1;padding:0 .8em}.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--bar-hue-slider{position:relative;height:1em;width:100%;margin:.4em 0;cursor:pointer}.vxe-color-picker--bar-alpha-bg,.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--bar-hue-slider{border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--bar-hue-slider{background:linear-gradient(to left,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.vxe-color-picker--bar-alpha-btn,.vxe-color-picker--bar-hue-btn{position:absolute;left:0;top:-4px;width:.6em;height:calc(100% + 8px);border-radius:.2em;background-color:#fff;border:1px solid var(--vxe-ui-base-popup-border-color);transform:translateX(-.3em);cursor:grab;box-shadow:0 0 8px 0 rgba(0,0,0,.3);transition:transform .1s ease-in-out}.vxe-color-picker--bar-alpha-btn:hover,.vxe-color-picker--bar-hue-btn:hover{transform:translateX(-.3em) scale(1.1)}.vxe-color-picker--bar-alpha-btn:active,.vxe-color-picker--bar-hue-btn:active{transform:translateX(-.3em) scale(1.2);cursor:grabbing}.vxe-color-picker--bar-alpha-slider{background-size:1em 1em}.vxe-color-picker--bar-alpha-slider .vxe-color-picker--bar-alpha-bg{position:absolute;top:0;left:0;width:100%;height:100%}.vxe-color-picker--hex-wrapper,.vxe-color-picker--rgb-wrapper{text-align:center;margin-top:.4em}.vxe-color-picker--hex-wrapper{display:flex;flex-direction:row;padding:0 1.8em}.vxe-color-picker--hex-wrapper .vxe-color-picker--input-wrapper>.vxe-input{width:12em}.vxe-color-picker--hex-wrapper .vxe-color-picker--input-title{padding:0 .6em}.vxe-color-picker--input-title{color:var(--vxe-ui-input-placeholder-color)}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:center}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper>.vxe-input{width:5.4em;margin:0 .4em}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-title{display:flex;flex-direction:row;align-items:center;justify-content:center;line-height:1.4em}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-title>span{display:block;width:50px;margin:0 .4em}.vxe-color-picker--footer-wrapper{text-align:right;margin-top:.4em;padding:0 .4em .4em .4em}.vxe-color-picker,.vxe-color-picker--readonly{height:var(--vxe-ui-input-height-default);line-height:var(--vxe-ui-input-height-default)}.vxe-color-picker--readonly.size--medium,.vxe-color-picker.size--medium{height:var(--vxe-ui-input-height-medium);line-height:var(--vxe-ui-input-height-medium)}.vxe-color-picker--readonly.size--small,.vxe-color-picker.size--small{height:var(--vxe-ui-input-height-small);line-height:var(--vxe-ui-input-height-small)}.vxe-color-picker--readonly.size--mini,.vxe-color-picker.size--mini{height:var(--vxe-ui-input-height-mini);line-height:var(--vxe-ui-input-height-mini)}.vxe-color-picker,.vxe-color-picker--panel,.vxe-color-picker--readonly{font-size:var(--vxe-ui-font-size-default)}.vxe-color-picker--panel.size--medium,.vxe-color-picker--readonly.size--medium,.vxe-color-picker.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-color-picker--panel.size--small,.vxe-color-picker--readonly.size--small,.vxe-color-picker.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-color-picker--panel.size--mini,.vxe-color-picker--readonly.size--mini,.vxe-color-picker.size--mini{font-size:var(--vxe-ui-font-size-mini)}
1
+ .vxe-color-picker.is--selected .vxe-color-picker--inner-color{color:#fff}.vxe-color-picker.is--active{border-color:var(--vxe-ui-font-primary-color)}.vxe-color-picker,.vxe-color-picker--readonly{position:relative;display:inline-block;width:2.4em;padding:.25em;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color)}.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--inner,.vxe-color-picker--preview-btn{background:#fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAWElEQVRIiWM8fubkfwYygKWJOSM5+mCAhRLNoxaPWjxq8ajFoxbTyeL/DAfJ0Xjs3Cl7Siwmu4Yht1aDgZEYx6MWj1o8avGoxaMWD3qLya5X//4nqx6HAQC7RBGFzolqTAAAAABJRU5ErkJggg==)}.vxe-color-picker--inner,.vxe-color-picker--readonly-color{width:100%;height:100%;background-size:1em 1em;border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--readonly-color{border:1px solid var(--vxe-ui-input-border-color)}.vxe-color-picker--inner{cursor:pointer}.vxe-color-picker--input{position:absolute;z-index:-1;width:1px;height:1px;outline:0;border:0}.vxe-color-picker--inner-color{width:100%;height:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--panel-wrapper{position:relative;width:23.4em;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:var(--vxe-ui-base-popup-box-shadow);background-color:var(--vxe-ui-layout-background-color)}.vxe-color-picker--panel{display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-color-picker--panel:not(.is--transfer){min-width:100%}.vxe-color-picker--panel.is--transfer{position:fixed}.vxe-color-picker--panel.ani--leave{display:block;opacity:0;transform:scaleY(.5);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top;backface-visibility:hidden}.vxe-color-picker--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-color-picker--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-color-picker--panel.ani--enter>div::after{display:none}.vxe-color-picker--panel>div::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-color-picker--color-wrapper{position:relative;height:160px;overflow:hidden}.vxe-color-picker--black-bg,.vxe-color-picker--color-bg,.vxe-color-picker--white-bg{position:absolute;top:0;left:0;width:100%;height:100%}.vxe-color-picker--white-bg{background:linear-gradient(to right,#fff,rgba(255,255,255,0))}.vxe-color-picker--black-bg{background:linear-gradient(to top,#000,rgba(255,255,255,0))}.vxe-color-picker--color-active{position:absolute;left:0;top:0;width:.8em;height:.8em;border-radius:50%;border:1px solid #fff;background-color:transparent;box-shadow:0 0 4px 1px rgba(0,0,0,.3);transform:translate(-.4em,-.4em)}.vxe-color-picker--quick-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start;overflow-x:hidden;overflow-y:auto;max-height:9.2em}.vxe-color-picker--quick-item{width:1.5em;height:1.5em;margin:.4em;border:1px solid var(--vxe-ui-base-popup-border-color);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer;transition:transform .1s ease-in-out}.vxe-color-picker--quick-item:hover{transform:scale(1.2);border-color:var(--vxe-ui-font-primary-lighten-color)}.vxe-color-picker--quick-item:active{transform:scale(.8)}.vxe-color-picker--bar-wrapper{margin-top:.4em}.vxe-color-picker--slider-wrapper{display:flex;flex-direction:row}.vxe-color-picker--color-dropper,.vxe-color-picker--slider-preview{padding-left:.8em}.vxe-color-picker--color-dropper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding-left:.8em;font-size:1.2em;cursor:pointer;transition:transform .1s ease-in-out}.vxe-color-picker--color-dropper:hover{color:var(--vxe-ui-font-primary-color)}.vxe-color-picker--color-dropper:active{transform:scale(.8)}.vxe-color-picker--slider-preview{display:flex;flex-direction:row;flex-shrink:0;align-items:center;justify-content:center}.vxe-color-picker--preview-btn,.vxe-color-picker--preview-color{width:2.2em;height:2.2em;border-radius:50%}.vxe-color-picker--preview-btn{background-size:.8em .8em}.vxe-color-picker--preview-color{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;border:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-color-picker--preview-color:hover::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background-color:rgba(0,0,0,.3);z-index:0}.vxe-color-picker--preview-color:hover .vxe-color-picker--preview-copy-btn{display:block;z-index:1}.vxe-color-picker--preview-color:active .vxe-color-picker--preview-copy-btn{font-size:.8em}.vxe-color-picker--preview-copy-btn{display:none;color:#fff;cursor:pointer}.vxe-color-picker--slider-handle{display:flex;flex-direction:column;justify-content:center;flex-grow:1;padding:0 .8em}.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--bar-hue-slider{position:relative;height:1em;width:100%;margin:.4em 0;cursor:pointer}.vxe-color-picker--bar-alpha-bg,.vxe-color-picker--bar-alpha-slider,.vxe-color-picker--bar-hue-slider{border-radius:var(--vxe-ui-base-border-radius)}.vxe-color-picker--bar-hue-slider{background:linear-gradient(to left,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.vxe-color-picker--bar-alpha-btn,.vxe-color-picker--bar-hue-btn{position:absolute;left:0;top:-4px;width:.6em;height:calc(100% + 8px);border-radius:.2em;background-color:#fff;border:1px solid var(--vxe-ui-base-popup-border-color);transform:translateX(-.3em);cursor:grab;box-shadow:0 0 8px 0 rgba(0,0,0,.3);transition:transform .1s ease-in-out}.vxe-color-picker--bar-alpha-btn:hover,.vxe-color-picker--bar-hue-btn:hover{transform:translateX(-.3em) scale(1.1)}.vxe-color-picker--bar-alpha-btn:active,.vxe-color-picker--bar-hue-btn:active{transform:translateX(-.3em) scale(1.2);cursor:grabbing}.vxe-color-picker--bar-alpha-slider{background-size:1em 1em}.vxe-color-picker--bar-alpha-slider .vxe-color-picker--bar-alpha-bg{position:absolute;top:0;left:0;width:100%;height:100%}.vxe-color-picker--custom-wrapper{display:flex;flex-direction:row;padding:0 .8em}.vxe-color-picker--type-switch{position:relative;flex-shrink:0;margin-top:.4em}.vxe-color-picker--type-icon{padding:.25em;color:var(--vxe-ui-input-placeholder-color)}.vxe-color-picker--type-icon i{display:inline-block;transition:transform .2s ease-in-out}.vxe-color-picker--type-label{padding:0 .25em;line-height:2em;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-color-picker--type-popup{position:absolute;display:none;border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-base-popup-border-color);box-shadow:var(--vxe-ui-base-popup-box-shadow);background-color:var(--vxe-ui-layout-background-color);padding:.25em 1em;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-color-picker--type-popup.is--visible{display:block}.vxe-color-picker--type-item{line-height:1.6em;cursor:pointer}.vxe-color-picker--type-item:hover{color:var(--vxe-ui-font-primary-lighten-color)}.vxe-color-picker--hex-wrapper,.vxe-color-picker--rgb-wrapper{flex-grow:1;text-align:center;margin-top:.4em}.vxe-color-picker--input-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:right}.vxe-color-picker--input-title{display:flex;flex-direction:row;align-items:center;justify-content:center;line-height:1.4em;color:var(--vxe-ui-input-placeholder-color)}.vxe-color-picker--hex-wrapper{display:flex;flex-direction:column}.vxe-color-picker--hex-wrapper .vxe-color-picker--input-wrapper>.vxe-input{width:20.2em}.vxe-color-picker--rgb-wrapper{display:flex;flex-direction:column}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper>.vxe-input{width:4.6em;margin-left:.6em}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper>.vxe-input:first-child{margin-left:0}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-wrapper>.vxe-input .vxe-input--control-icon{min-width:1.6em}.vxe-color-picker--rgb-wrapper .vxe-color-picker--input-title>span{display:block;width:50px;margin:0 .4em}.vxe-color-picker--footer-wrapper{text-align:right;margin-top:.4em;padding:0 .4em .4em .4em}.vxe-color-picker,.vxe-color-picker--readonly{height:var(--vxe-ui-input-height-default);line-height:var(--vxe-ui-input-height-default)}.vxe-color-picker--readonly.size--medium,.vxe-color-picker.size--medium{height:var(--vxe-ui-input-height-medium);line-height:var(--vxe-ui-input-height-medium)}.vxe-color-picker--readonly.size--small,.vxe-color-picker.size--small{height:var(--vxe-ui-input-height-small);line-height:var(--vxe-ui-input-height-small)}.vxe-color-picker--readonly.size--mini,.vxe-color-picker.size--mini{height:var(--vxe-ui-input-height-mini);line-height:var(--vxe-ui-input-height-mini)}.vxe-color-picker,.vxe-color-picker--panel,.vxe-color-picker--readonly{font-size:var(--vxe-ui-font-size-default)}.vxe-color-picker--panel.size--medium,.vxe-color-picker--readonly.size--medium,.vxe-color-picker.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-color-picker--panel.size--small,.vxe-color-picker--readonly.size--small,.vxe-color-picker.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-color-picker--panel.size--mini,.vxe-color-picker--readonly.size--mini,.vxe-color-picker.size--mini{font-size:var(--vxe-ui-font-size-mini)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vxe-pc-ui",
3
- "version": "4.6.39",
3
+ "version": "4.6.40",
4
4
  "description": "A vue based PC component library",
5
5
  "scripts": {
6
6
  "update": "npm install --legacy-peer-deps",
@@ -101,7 +101,9 @@ export default defineVxeComponent({
101
101
 
102
102
  const reactData = reactive<ColorPickerReactData>({
103
103
  initialized: false,
104
+ selectTyle: 'hex',
104
105
  selectColor: `${props.modelValue || ''}`,
106
+ showTypePopup: false,
105
107
  panelColor: '',
106
108
  hexValue: '',
107
109
  rValue: 0,
@@ -116,6 +118,11 @@ export default defineVxeComponent({
116
118
  isActivated: false
117
119
  })
118
120
 
121
+ const typeList = [
122
+ { label: 'HEX', value: 'hex' },
123
+ { label: 'RGB', value: 'rgb' }
124
+ ]
125
+
119
126
  const internalData: ColorPickerInternalData = {
120
127
  // hpTimeout: undefined
121
128
  }
@@ -175,17 +182,14 @@ export default defineVxeComponent({
175
182
  return []
176
183
  })
177
184
 
178
- const computeValueType = computed(() => {
179
- const { type } = props
180
- if (type === 'rgb' || type === 'rgba') {
181
- return 'rgb'
182
- }
183
- return 'hex'
185
+ const computeIsRgb = computed(() => {
186
+ const { selectTyle } = reactData
187
+ return selectTyle === 'rgb'
184
188
  })
185
189
 
186
- const computeIsRgb = computed(() => {
187
- const valueType = computeValueType.value
188
- return valueType === 'rgb'
190
+ const computeSelectTypeItem = computed(() => {
191
+ const { selectTyle } = reactData
192
+ return typeList.find(item => item.value === selectTyle)
189
193
  })
190
194
 
191
195
  const refMaps: ColorPickerPrivateRef = {
@@ -215,6 +219,16 @@ export default defineVxeComponent({
215
219
  updateModelColor()
216
220
  }
217
221
 
222
+ const updateType = () => {
223
+ const { type } = props
224
+ let selectTyle: VxeColorPickerPropTypes.Type = 'hex'
225
+ if (type === 'rgb' || type === 'rgba') {
226
+ selectTyle = 'rgb'
227
+ }
228
+ reactData.selectTyle = selectTyle
229
+ updateMode()
230
+ }
231
+
218
232
  const updateModelColor = () => {
219
233
  const { selectColor, isAniVisible } = reactData
220
234
  const isRgb = computeIsRgb.value
@@ -373,6 +387,24 @@ export default defineVxeComponent({
373
387
  dispatchEvent('click', {}, evnt)
374
388
  }
375
389
 
390
+ const handlePanelClickEvent = () => {
391
+ reactData.showTypePopup = false
392
+ }
393
+
394
+ const toggleTypeVisibleEvent = (evnt: MouseEvent) => {
395
+ evnt.stopPropagation()
396
+ reactData.showTypePopup = !reactData.showTypePopup
397
+ }
398
+
399
+ const handleChangeType = (type: VxeColorPickerPropTypes.Type) => {
400
+ const { selectTyle } = reactData
401
+ if (type !== selectTyle) {
402
+ reactData.selectTyle = type
403
+ updateModelColor()
404
+ }
405
+ reactData.showTypePopup = false
406
+ }
407
+
376
408
  const handleHueColor = (offsetLeft: number) => {
377
409
  const hueSliderEl = refHueSliderElem.value
378
410
  const hueSliderBtnEl = refHueSliderBtnElem.value
@@ -655,9 +687,9 @@ export default defineVxeComponent({
655
687
 
656
688
  const renderColorBar = () => {
657
689
  const { showAlpha, clickToCopy, showEyeDropper } = props
658
- const { hexValue, rValue, gValue, bValue, aValue, selectColor, panelColor } = reactData
659
- const valueType = computeValueType.value
690
+ const { selectTyle, showTypePopup, hexValue, rValue, gValue, bValue, aValue, selectColor, panelColor } = reactData
660
691
  const isRgb = computeIsRgb.value
692
+ const selectTypeItem = computeSelectTypeItem.value
661
693
  return h('div', {
662
694
  class: 'vxe-color-picker--bar-wrapper'
663
695
  }, [
@@ -673,7 +705,7 @@ export default defineVxeComponent({
673
705
  onClick: handleEyeDropperEvent
674
706
  }, [
675
707
  h('i', {
676
- class: getIcon().EYE_DROPPER
708
+ class: getIcon().COLOR_PICKER_EYE_DROPPER
677
709
  })
678
710
  ])
679
711
  ])
@@ -696,7 +728,7 @@ export default defineVxeComponent({
696
728
  onClick: handleCopyColorEvent
697
729
  }, [
698
730
  h('i', {
699
- class: getIcon().COLOR_COPY
731
+ class: getIcon().COLOR_PICKER_COLOR_COPY
700
732
  })
701
733
  ])
702
734
  ]
@@ -739,107 +771,141 @@ export default defineVxeComponent({
739
771
  ])
740
772
  ]),
741
773
  h('div', {
742
- class: `vxe-color-picker--${valueType}-wrapper`
743
- }, isRgb
744
- ? [
745
- h('div', {
746
- class: 'vxe-color-picker--input-wrapper'
774
+ class: 'vxe-color-picker--custom-wrapper'
775
+ }, [
776
+ h('div', {
777
+ class: 'vxe-color-picker--type-switch'
778
+ }, [
779
+ h('div', {
780
+ class: 'vxe-color-picker--type-label',
781
+ onClick: toggleTypeVisibleEvent
782
+ }, [
783
+ h('span', `${selectTypeItem ? selectTypeItem.label : selectTyle}`),
784
+ h('span', {
785
+ class: 'vxe-color-picker--type-icon'
747
786
  }, [
748
- h(VxeInputComponent, {
749
- type: 'integer',
750
- size: 'mini',
751
- align: 'center',
752
- min: 0,
753
- max: 255,
754
- maxLength: 3,
755
- placeholder: '',
756
- modelValue: rValue,
757
- 'onUpdate:modelValue' (val) {
758
- reactData.rValue = val
759
- },
760
- onChange: handleInputRgbEvent
761
- }),
762
- h(VxeInputComponent, {
763
- type: 'integer',
764
- size: 'mini',
765
- align: 'center',
766
- min: 0,
767
- max: 255,
768
- maxLength: 3,
769
- placeholder: '',
770
- modelValue: gValue,
771
- 'onUpdate:modelValue' (val) {
772
- reactData.gValue = val
773
- },
774
- onChange: handleInputRgbEvent
775
- }),
776
- h(VxeInputComponent, {
777
- type: 'integer',
778
- size: 'mini',
779
- align: 'center',
780
- min: 0,
781
- max: 255,
782
- maxLength: 3,
783
- placeholder: '',
784
- modelValue: bValue,
785
- 'onUpdate:modelValue' (val) {
786
- reactData.bValue = val
787
- },
788
- onChange: handleInputRgbEvent
789
- }),
790
- h(VxeInputComponent, {
791
- type: 'number',
792
- size: 'mini',
793
- align: 'center',
794
- min: 0,
795
- max: 1,
796
- step: 0.01,
797
- maxLength: 4,
798
- placeholder: '',
799
- modelValue: aValue,
800
- 'onUpdate:modelValue' (val) {
801
- reactData.aValue = val
802
- },
803
- onChange: handleInputAlphaEvent
787
+ h('i', {
788
+ class: showTypePopup ? getIcon().COLOR_PICKER_TPTY_OPEN : getIcon().COLOR_PICKER_TPTY_CLOSE
804
789
  })
805
- ]),
806
- h('div', {
807
- class: 'vxe-color-picker--input-title'
808
- }, [
809
- h('span', 'R'),
810
- h('span', 'G'),
811
- h('span', 'B'),
812
- h('span', 'A')
813
- ])]
814
- : [
815
- h('div', {
816
- class: 'vxe-color-picker--input-title'
817
- }, 'HEX'),
818
- h('div', {
819
- class: 'vxe-color-picker--input-wrapper'
820
- }, [
821
- h(VxeInputComponent, {
822
- type: 'text',
823
- size: 'mini',
824
- align: 'center',
825
- maxLength: 9,
826
- placeholder: '',
827
- modelValue: hexValue,
828
- 'onUpdate:modelValue' (val) {
829
- reactData.hexValue = val
830
- },
831
- onChange () {
832
- const colorRest = parseColor(reactData.hexValue)
833
- if (colorRest) {
834
- if (colorRest.value) {
835
- reactData.selectColor = colorRest.value
836
- updateModelColor()
790
+ ])
791
+ ]),
792
+ h('div', {
793
+ class: ['vxe-color-picker--type-popup', {
794
+ 'is--visible': showTypePopup
795
+ }]
796
+ }, typeList.map(item => {
797
+ return h('div', {
798
+ class: 'vxe-color-picker--type-item',
799
+ onClick (evnt) {
800
+ evnt.stopPropagation()
801
+ handleChangeType(item.value as VxeColorPickerPropTypes.Type)
802
+ }
803
+ }, item.label)
804
+ }))
805
+ ]),
806
+ h('div', {
807
+ class: `vxe-color-picker--${selectTyle}-wrapper`
808
+ }, isRgb
809
+ ? [
810
+ h('div', {
811
+ class: 'vxe-color-picker--input-wrapper'
812
+ }, [
813
+ h(VxeInputComponent, {
814
+ type: 'integer',
815
+ size: 'mini',
816
+ align: 'center',
817
+ min: 0,
818
+ max: 255,
819
+ maxLength: 3,
820
+ placeholder: '',
821
+ modelValue: rValue,
822
+ 'onUpdate:modelValue' (val) {
823
+ reactData.rValue = val
824
+ },
825
+ onChange: handleInputRgbEvent
826
+ }),
827
+ h(VxeInputComponent, {
828
+ type: 'integer',
829
+ size: 'mini',
830
+ align: 'center',
831
+ min: 0,
832
+ max: 255,
833
+ maxLength: 3,
834
+ placeholder: '',
835
+ modelValue: gValue,
836
+ 'onUpdate:modelValue' (val) {
837
+ reactData.gValue = val
838
+ },
839
+ onChange: handleInputRgbEvent
840
+ }),
841
+ h(VxeInputComponent, {
842
+ type: 'integer',
843
+ size: 'mini',
844
+ align: 'center',
845
+ min: 0,
846
+ max: 255,
847
+ maxLength: 3,
848
+ placeholder: '',
849
+ modelValue: bValue,
850
+ 'onUpdate:modelValue' (val) {
851
+ reactData.bValue = val
852
+ },
853
+ onChange: handleInputRgbEvent
854
+ }),
855
+ h(VxeInputComponent, {
856
+ type: 'number',
857
+ size: 'mini',
858
+ align: 'center',
859
+ min: 0,
860
+ max: 1,
861
+ step: 0.01,
862
+ maxLength: 4,
863
+ placeholder: '',
864
+ modelValue: aValue,
865
+ 'onUpdate:modelValue' (val) {
866
+ reactData.aValue = val
867
+ },
868
+ onChange: handleInputAlphaEvent
869
+ })
870
+ ]),
871
+ h('div', {
872
+ class: 'vxe-color-picker--input-title'
873
+ }, [
874
+ h('span', 'R'),
875
+ h('span', 'G'),
876
+ h('span', 'B'),
877
+ h('span', 'A')
878
+ ])]
879
+ : [
880
+ h('div', {
881
+ class: 'vxe-color-picker--input-wrapper'
882
+ }, [
883
+ h(VxeInputComponent, {
884
+ type: 'text',
885
+ size: 'mini',
886
+ align: 'center',
887
+ maxLength: 9,
888
+ placeholder: '',
889
+ modelValue: hexValue,
890
+ 'onUpdate:modelValue' (val) {
891
+ reactData.hexValue = val
892
+ },
893
+ onChange () {
894
+ const colorRest = parseColor(reactData.hexValue)
895
+ if (colorRest) {
896
+ if (colorRest.value) {
897
+ reactData.selectColor = colorRest.value
898
+ updateModelColor()
899
+ }
837
900
  }
838
901
  }
839
- }
840
- })
902
+ })
903
+ ]),
904
+ h('div', {
905
+ class: 'vxe-color-picker--input-title'
906
+ }, 'HEX')
841
907
  ])
842
- ])
908
+ ])
843
909
  ])
844
910
  }
845
911
 
@@ -931,7 +997,8 @@ export default defineVxeComponent({
931
997
  }, [
932
998
  initialized && (visiblePanel || isAniVisible)
933
999
  ? h('div', {
934
- class: 'vxe-color-picker--panel-wrapper'
1000
+ class: 'vxe-color-picker--panel-wrapper',
1001
+ onClick: handlePanelClickEvent
935
1002
  }, [
936
1003
  renderColorWrapper(),
937
1004
  renderColorBar(),
@@ -964,6 +1031,10 @@ export default defineVxeComponent({
964
1031
  updateMode()
965
1032
  })
966
1033
 
1034
+ watch(() => props.type, () => {
1035
+ updateType()
1036
+ })
1037
+
967
1038
  onMounted(() => {
968
1039
  globalEvents.on($xeColorPicker, 'mousewheel', handleGlobalMousewheelEvent)
969
1040
  globalEvents.on($xeColorPicker, 'mousedown', handleGlobalMousedownEvent)
@@ -978,7 +1049,7 @@ export default defineVxeComponent({
978
1049
  globalEvents.off($xeColorPicker, 'resize')
979
1050
  })
980
1051
 
981
- updateMode()
1052
+ updateType()
982
1053
 
983
1054
  provide('$xeColorPicker', $xeColorPicker)
984
1055