vxe-pc-ui 4.20.9 → 4.20.11

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 (102) hide show
  1. package/dist/all.esm.js +1874 -2040
  2. package/dist/style.css +1 -1
  3. package/dist/style.min.css +1 -1
  4. package/es/date-panel/src/date-panel.js +58 -36
  5. package/es/date-panel/style.css +22 -20
  6. package/es/date-panel/style.min.css +1 -1
  7. package/es/icon/style.css +1 -1
  8. package/es/icon-picker/src/icon-picker.js +74 -38
  9. package/es/icon-picker/style.css +9 -3
  10. package/es/icon-picker/style.min.css +1 -1
  11. package/es/list/src/list.js +12 -165
  12. package/es/scrollbar/src/scrollbar.js +20 -173
  13. package/es/select/src/select.js +246 -8
  14. package/es/select/style.css +44 -0
  15. package/es/select/style.min.css +1 -1
  16. package/es/style.css +1 -1
  17. package/es/style.min.css +1 -1
  18. package/es/tooltip/src/tooltip.js +2 -4
  19. package/es/tooltip/style.css +2 -0
  20. package/es/tooltip/style.min.css +1 -1
  21. package/es/tree/src/tree.js +21 -173
  22. package/es/ui/index.js +1 -1
  23. package/es/ui/src/log.js +1 -1
  24. package/es/vxe-date-panel/style.css +22 -20
  25. package/es/vxe-date-panel/style.min.css +1 -1
  26. package/es/vxe-icon-picker/style.css +9 -3
  27. package/es/vxe-icon-picker/style.min.css +1 -1
  28. package/es/vxe-select/style.css +44 -0
  29. package/es/vxe-select/style.min.css +1 -1
  30. package/es/vxe-tooltip/style.css +2 -0
  31. package/es/vxe-tooltip/style.min.css +1 -1
  32. package/lib/date-panel/src/date-panel.js +56 -34
  33. package/lib/date-panel/src/date-panel.min.js +1 -1
  34. package/lib/date-panel/style/style.css +22 -20
  35. package/lib/date-panel/style/style.min.css +1 -1
  36. package/lib/icon/style/style.css +1 -1
  37. package/lib/icon/style/style.min.css +1 -1
  38. package/lib/icon-picker/src/icon-picker.js +101 -45
  39. package/lib/icon-picker/src/icon-picker.min.js +1 -1
  40. package/lib/icon-picker/style/style.css +9 -3
  41. package/lib/icon-picker/style/style.min.css +1 -1
  42. package/lib/index.umd.js +827 -761
  43. package/lib/index.umd.min.js +1 -1
  44. package/lib/list/src/list.js +29 -195
  45. package/lib/list/src/list.min.js +1 -1
  46. package/lib/scrollbar/src/scrollbar.js +34 -199
  47. package/lib/scrollbar/src/scrollbar.min.js +1 -1
  48. package/lib/select/src/select.js +318 -68
  49. package/lib/select/src/select.min.js +1 -1
  50. package/lib/select/style/style.css +44 -0
  51. package/lib/select/style/style.min.css +1 -1
  52. package/lib/style.css +1 -1
  53. package/lib/style.min.css +1 -1
  54. package/lib/tooltip/src/tooltip.js +2 -4
  55. package/lib/tooltip/src/tooltip.min.js +1 -1
  56. package/lib/tooltip/style/style.css +2 -0
  57. package/lib/tooltip/style/style.min.css +1 -1
  58. package/lib/tree/src/tree.js +40 -202
  59. package/lib/tree/src/tree.min.js +1 -1
  60. package/lib/ui/index.js +1 -1
  61. package/lib/ui/index.min.js +1 -1
  62. package/lib/ui/src/log.js +1 -1
  63. package/lib/ui/src/log.min.js +1 -1
  64. package/lib/vxe-date-panel/style/style.css +22 -20
  65. package/lib/vxe-date-panel/style/style.min.css +1 -1
  66. package/lib/vxe-icon-picker/style/style.css +9 -3
  67. package/lib/vxe-icon-picker/style/style.min.css +1 -1
  68. package/lib/vxe-select/style/style.css +44 -0
  69. package/lib/vxe-select/style/style.min.css +1 -1
  70. package/lib/vxe-tooltip/style/style.css +2 -0
  71. package/lib/vxe-tooltip/style/style.min.css +1 -1
  72. package/package.json +2 -2
  73. package/packages/date-panel/src/date-panel.ts +58 -36
  74. package/packages/icon-picker/src/icon-picker.ts +80 -38
  75. package/packages/list/src/list.ts +28 -182
  76. package/packages/scrollbar/src/scrollbar.ts +36 -188
  77. package/packages/select/src/select.ts +281 -8
  78. package/packages/tooltip/src/tooltip.ts +2 -4
  79. package/packages/tree/src/tree.ts +37 -190
  80. package/styles/components/date-panel.scss +31 -29
  81. package/styles/components/icon-picker.scss +9 -3
  82. package/styles/components/select.scss +77 -0
  83. package/styles/components/tooltip.scss +1 -0
  84. package/types/components/gantt-module/gantt-view.d.ts +16 -16
  85. package/types/components/icon-picker.d.ts +21 -1
  86. package/types/components/list.d.ts +4 -0
  87. package/types/components/scrollbar.d.ts +7 -14
  88. package/types/components/select.d.ts +28 -3
  89. package/types/components/table.d.ts +30 -18
  90. package/types/components/tree.d.ts +7 -16
  91. /package/es/icon/{iconfont.1792139440389.ttf → iconfont.1792226845944.ttf} +0 -0
  92. /package/es/icon/{iconfont.1792139440389.woff → iconfont.1792226845944.woff} +0 -0
  93. /package/es/icon/{iconfont.1792139440389.woff2 → iconfont.1792226845944.woff2} +0 -0
  94. /package/es/{iconfont.1792139440389.ttf → iconfont.1792226845944.ttf} +0 -0
  95. /package/es/{iconfont.1792139440389.woff → iconfont.1792226845944.woff} +0 -0
  96. /package/es/{iconfont.1792139440389.woff2 → iconfont.1792226845944.woff2} +0 -0
  97. /package/lib/icon/style/{iconfont.1792139440389.ttf → iconfont.1792226845944.ttf} +0 -0
  98. /package/lib/icon/style/{iconfont.1792139440389.woff → iconfont.1792226845944.woff} +0 -0
  99. /package/lib/icon/style/{iconfont.1792139440389.woff2 → iconfont.1792226845944.woff2} +0 -0
  100. /package/lib/{iconfont.1792139440389.ttf → iconfont.1792226845944.ttf} +0 -0
  101. /package/lib/{iconfont.1792139440389.woff → iconfont.1792226845944.woff} +0 -0
  102. /package/lib/{iconfont.1792139440389.woff2 → iconfont.1792226845944.woff2} +0 -0
@@ -143,6 +143,7 @@
143
143
  }
144
144
 
145
145
  .vxe-select--panel-body {
146
+ position: relative;
146
147
  display: flex;
147
148
  flex-direction: row;
148
149
  flex-grow: 1;
@@ -375,4 +376,47 @@
375
376
  .vxe-select--search-loading,
376
377
  .vxe-select--empty-placeholder {
377
378
  line-height: var(--vxe-ui-select-current-option-height);
379
+ }
380
+
381
+ .vxe-select--panel-body.ov-padding.overflow-x.sx-pos--top {
382
+ padding-top: var(--vxe-ui-scrollbar-x-height);
383
+ }
384
+ .vxe-select--panel-body.ov-padding.overflow-x.sx-pos--bottom {
385
+ padding-bottom: var(--vxe-ui-scrollbar-x-height);
386
+ }
387
+ .vxe-select--panel-body.ov-padding.overflow-y.sy-pos--left {
388
+ padding-left: var(--vxe-ui-scrollbar-y-width);
389
+ }
390
+ .vxe-select--panel-body.ov-padding.overflow-y.sy-pos--right {
391
+ padding-right: var(--vxe-ui-scrollbar-y-width);
392
+ }
393
+ .vxe-select--panel-body.ov-x--hidden > .vxe-select-option--wrapper {
394
+ overflow-x: hidden;
395
+ }
396
+ .vxe-select--panel-body.ov-y--hidden > .vxe-select-option--wrapper {
397
+ overflow-y: hidden;
398
+ }
399
+ .vxe-select--panel-body.is--virtual-scrollbar.ov-x--auto-hide:hover > .vxe-scrollbar > .vxe-scrollbar--track-x {
400
+ opacity: 1;
401
+ }
402
+ .vxe-select--panel-body.is--virtual-scrollbar.ov-x--auto-hide > .vxe-scrollbar > .vxe-scrollbar--track-x {
403
+ opacity: 0;
404
+ transition: opacity 0.8s ease-in-out;
405
+ }
406
+ .vxe-select--panel-body.is--virtual-scrollbar.ov-y--auto-hide:hover > .vxe-scrollbar > .vxe-scrollbar--track-y {
407
+ opacity: 1;
408
+ }
409
+ .vxe-select--panel-body.is--virtual-scrollbar.ov-y--auto-hide > .vxe-scrollbar > .vxe-scrollbar--track-y {
410
+ opacity: 0;
411
+ transition: opacity 0.8s ease-in-out;
412
+ }
413
+ .vxe-select--panel-body > .vxe-scrollbar {
414
+ position: unset;
415
+ }
416
+ .vxe-select--panel-body.is--virtual-scrollbar > .vxe-select-option--wrapper {
417
+ scrollbar-width: none;
418
+ -ms-overflow-style: none;
419
+ }
420
+ .vxe-select--panel-body.is--virtual-scrollbar > .vxe-select-option--wrapper::-webkit-scrollbar {
421
+ display: none;
378
422
  }
@@ -1 +1 @@
1
- .vxe-select,.vxe-select--panel{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-default);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-default)}.vxe-select--panel.size--xlarge,.vxe-select.size--xlarge{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-xlarge);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-xlarge)}.vxe-select--panel.size--large,.vxe-select.size--large{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-large);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-large)}.vxe-select--panel.size--medium,.vxe-select.size--medium{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-medium);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-medium)}.vxe-select--panel.size--small,.vxe-select.size--small{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-small);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-small)}.vxe-select--panel.size--mini,.vxe-select.size--mini{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-mini);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-mini)}.vxe-select,.vxe-select--panel{--vxe-ui-select-current-padding:var(--vxe-ui-layout-padding-default)}.vxe-select--panel.size--mini,.vxe-select--panel.size--small,.vxe-select.size--mini,.vxe-select.size--small{--vxe-ui-select-current-padding:var(--vxe-ui-layout-padding-half)}.vxe-select{position:relative;display:inline-block;width:180px;font-size:var(--vxe-ui-select-current-font-size);color:var(--vxe-ui-font-color);text-align:left}.vxe-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-select>.vxe-input{width:100%}.vxe-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-select-slots{display:none}.vxe-select--panel{font-size:var(--vxe-ui-select-current-font-size);display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-select--panel:not(.is--transfer){min-width:100%}.vxe-select--panel.is--transfer{position:fixed}.vxe-select--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-select--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-select--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-select--panel.ani--enter>div::after{display:none}.vxe-select--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-select--panel-search{display:block;flex-shrink:0;padding:var(--vxe-ui-layout-padding-default)}.vxe-select--panel-search .vxe-select-search--input{width:100%}.vxe-select--panel-wrapper{display:flex;flex-direction:column;position:relative;max-height:18em;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-select--panel-body{display:flex;flex-direction:row;flex-grow:1;overflow:hidden}.vxe-select--header-button{display:flex;flex-direction:row}.vxe-select--footer-button,.vxe-select--header-button{display:flex;flex-direction:row;white-space:nowrap;align-items:center;min-height:2em}.vxe-select--total-btns{padding-left:var(--vxe-ui-select-current-padding);flex-grow:1}.vxe-select--oper-btns,.vxe-select--total-btns{display:flex;flex-direction:row;align-items:center}.vxe-select--oper-btns{flex-shrink:0}.vxe-select--footer-button{display:flex;flex-direction:row}.vxe-select--panel-header{border-bottom:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-select--panel-footer{border-top:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-select--panel-footer,.vxe-select--panel-header{flex-shrink:0;padding:4px 0}.vxe-select-option--wrapper{flex-grow:1;position:relative;overflow-x:hidden;overflow-y:auto}.vxe-select--y-space{width:0;float:left}.vxe-select--body,.vxe-select-option--wrapper{padding:0;margin:0;border:0;outline:0}.vxe-select-option{position:relative;flex-direction:row;display:flex;padding:0 .6em;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.vxe-select-option.is--add{padding-right:2em}.vxe-select-option.is--add:hover .vxe-select-option--add-icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option.is--add .vxe-select-option--add-icon{display:block}.vxe-select-option.is--selected{color:var(--vxe-ui-font-primary-color)}.vxe-select-option:not(.is--disabled).is--hover{background-color:var(--vxe-ui-select-option-hover-background-color)}.vxe-select-option.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-select-optgroup{color:var(--vxe-ui-select-title-color);font-size:12px;cursor:default}.vxe-select-option--label{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-select-option--add-icon{display:none;position:absolute;top:0;right:.6em}.vxe-select-option--checkbox{padding-right:.4em}.vxe-select-option--checkbox{cursor:pointer}.vxe-select-option--checkbox .vxe-checkbox--icon{font-size:1.22em;transition:all .2s ease-in-out}.vxe-select-option--checkbox .vxe-checkbox--icon{color:var(--vxe-ui-input-border-color);vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-select-option--checkbox.is--checked,.vxe-select-option--checkbox.is--indeterminate{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox.is--checked .vxe-checkbox--icon,.vxe-select-option--checkbox.is--indeterminate .vxe-checkbox--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox:not(.is--disabled):hover .vxe-checkbox--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox.is--hidden{cursor:default}.vxe-select-option--checkbox.is--readonly{cursor:auto}.vxe-select-option--checkbox.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:not-allowed}.vxe-select-option--checkbox.is--disabled .vxe-checkbox--icon{color:var(--vxe-ui-input-disabled-color)}.vxe-select-option--checkbox .vxe-checkbox--label{padding-left:.4em;vertical-align:middle}.vxe-select-option--radio{padding-right:.4em}.vxe-select-option--radio{cursor:pointer}.vxe-select-option--radio .vxe-radio--icon{font-size:1.26em;transition:all .2s ease-in-out}.vxe-select-option--radio .vxe-radio--icon{color:var(--vxe-ui-input-border-color);border-radius:50%;vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-select-option--radio.is--checked{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio.is--checked .vxe-radio--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio:not(.is--disabled):hover .vxe-radio--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio.is--readonly{cursor:auto}.vxe-select-option--radio.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:not-allowed}.vxe-select-option--radio.is--disabled .vxe-radio--icon{color:var(--vxe-ui-input-disabled-color)}.vxe-select-option--radio .vxe-radio--label{padding-left:.4em;vertical-align:middle}.vxe-select--search-icon{margin-right:.5em}.vxe-select--empty-placeholder,.vxe-select--search-loading{padding:0 .6em;text-align:center;color:var(--vxe-ui-select-empty-color)}.vxe-select-option{height:var(--vxe-ui-select-current-option-height)}.vxe-select--empty-placeholder,.vxe-select--search-loading,.vxe-select-option{line-height:var(--vxe-ui-select-current-option-height)}
1
+ .vxe-select,.vxe-select--panel{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-default);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-default)}.vxe-select--panel.size--xlarge,.vxe-select.size--xlarge{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-xlarge);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-xlarge)}.vxe-select--panel.size--large,.vxe-select.size--large{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-large);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-large)}.vxe-select--panel.size--medium,.vxe-select.size--medium{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-medium);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-medium)}.vxe-select--panel.size--small,.vxe-select.size--small{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-small);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-small)}.vxe-select--panel.size--mini,.vxe-select.size--mini{--vxe-ui-select-current-font-size:var(--vxe-ui-font-size-mini);--vxe-ui-select-current-option-height:var(--vxe-ui-select-option-height-mini)}.vxe-select,.vxe-select--panel{--vxe-ui-select-current-padding:var(--vxe-ui-layout-padding-default)}.vxe-select--panel.size--mini,.vxe-select--panel.size--small,.vxe-select.size--mini,.vxe-select.size--small{--vxe-ui-select-current-padding:var(--vxe-ui-layout-padding-half)}.vxe-select{position:relative;display:inline-block;width:180px;font-size:var(--vxe-ui-select-current-font-size);color:var(--vxe-ui-font-color);text-align:left}.vxe-select>.vxe-input .vxe-input--inner{cursor:pointer}.vxe-select.is--disabled>.vxe-input .vxe-input--inner{cursor:no-drop}.vxe-select.is--loading>.vxe-input .vxe-input--inner{cursor:progress}.vxe-select>.vxe-input{width:100%}.vxe-select>.vxe-input .vxe-input--suffix-icon>i{display:inline-block;transition:transform .2s ease-in-out}.vxe-select.is--active:not(.is--filter)>.vxe-input{border-color:var(--vxe-ui-font-primary-color)}.vxe-select--readonly{color:var(--vxe-ui-font-color);display:inline-flex}.vxe-select-slots{display:none}.vxe-select--panel{font-size:var(--vxe-ui-select-current-font-size);display:none;position:absolute;left:0;padding:4px 0;color:var(--vxe-ui-font-color);text-align:left}.vxe-select--panel:not(.is--transfer){min-width:100%}.vxe-select--panel.is--transfer{position:fixed}.vxe-select--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-select--panel.ani--leave[placement=top]{transform-origin:center bottom}.vxe-select--panel.ani--enter{opacity:1;transform:scaleY(1)}.vxe-select--panel.ani--enter>div::after{display:none}.vxe-select--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-select--panel-search{display:block;flex-shrink:0;padding:var(--vxe-ui-layout-padding-default)}.vxe-select--panel-search .vxe-select-search--input{width:100%}.vxe-select--panel-wrapper{display:flex;flex-direction:column;position:relative;max-height:18em;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-select--panel-body{position:relative;display:flex;flex-direction:row;flex-grow:1;overflow:hidden}.vxe-select--header-button{display:flex;flex-direction:row}.vxe-select--footer-button,.vxe-select--header-button{display:flex;flex-direction:row;white-space:nowrap;align-items:center;min-height:2em}.vxe-select--total-btns{padding-left:var(--vxe-ui-select-current-padding);flex-grow:1}.vxe-select--oper-btns,.vxe-select--total-btns{display:flex;flex-direction:row;align-items:center}.vxe-select--oper-btns{flex-shrink:0}.vxe-select--footer-button{display:flex;flex-direction:row}.vxe-select--panel-header{border-bottom:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-select--panel-footer{border-top:1px solid var(--vxe-ui-base-popup-border-color)}.vxe-select--panel-footer,.vxe-select--panel-header{flex-shrink:0;padding:4px 0}.vxe-select-option--wrapper{flex-grow:1;position:relative;overflow-x:hidden;overflow-y:auto}.vxe-select--y-space{width:0;float:left}.vxe-select--body,.vxe-select-option--wrapper{padding:0;margin:0;border:0;outline:0}.vxe-select-option{position:relative;flex-direction:row;display:flex;padding:0 .6em;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.vxe-select-option.is--add{padding-right:2em}.vxe-select-option.is--add:hover .vxe-select-option--add-icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option.is--add .vxe-select-option--add-icon{display:block}.vxe-select-option.is--selected{color:var(--vxe-ui-font-primary-color)}.vxe-select-option:not(.is--disabled).is--hover{background-color:var(--vxe-ui-select-option-hover-background-color)}.vxe-select-option.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:no-drop}.vxe-select-optgroup{color:var(--vxe-ui-select-title-color);font-size:12px;cursor:default}.vxe-select-option--label{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-select-option--add-icon{display:none;position:absolute;top:0;right:.6em}.vxe-select-option--checkbox{padding-right:.4em}.vxe-select-option--checkbox{cursor:pointer}.vxe-select-option--checkbox .vxe-checkbox--icon{font-size:1.22em;transition:all .2s ease-in-out}.vxe-select-option--checkbox .vxe-checkbox--icon{color:var(--vxe-ui-input-border-color);vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-select-option--checkbox.is--checked,.vxe-select-option--checkbox.is--indeterminate{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox.is--checked .vxe-checkbox--icon,.vxe-select-option--checkbox.is--indeterminate .vxe-checkbox--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox:not(.is--disabled):hover .vxe-checkbox--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--checkbox.is--hidden{cursor:default}.vxe-select-option--checkbox.is--readonly{cursor:auto}.vxe-select-option--checkbox.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:not-allowed}.vxe-select-option--checkbox.is--disabled .vxe-checkbox--icon{color:var(--vxe-ui-input-disabled-color)}.vxe-select-option--checkbox .vxe-checkbox--label{padding-left:.4em;vertical-align:middle}.vxe-select-option--radio{padding-right:.4em}.vxe-select-option--radio{cursor:pointer}.vxe-select-option--radio .vxe-radio--icon{font-size:1.26em;transition:all .2s ease-in-out}.vxe-select-option--radio .vxe-radio--icon{color:var(--vxe-ui-input-border-color);border-radius:50%;vertical-align:middle;font-weight:700;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-select-option--radio.is--checked{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio.is--checked .vxe-radio--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio:not(.is--disabled):hover .vxe-radio--icon{color:var(--vxe-ui-font-primary-color)}.vxe-select-option--radio.is--readonly{cursor:auto}.vxe-select-option--radio.is--disabled{color:var(--vxe-ui-font-disabled-color);cursor:not-allowed}.vxe-select-option--radio.is--disabled .vxe-radio--icon{color:var(--vxe-ui-input-disabled-color)}.vxe-select-option--radio .vxe-radio--label{padding-left:.4em;vertical-align:middle}.vxe-select--search-icon{margin-right:.5em}.vxe-select--empty-placeholder,.vxe-select--search-loading{padding:0 .6em;text-align:center;color:var(--vxe-ui-select-empty-color)}.vxe-select-option{height:var(--vxe-ui-select-current-option-height)}.vxe-select--empty-placeholder,.vxe-select--search-loading,.vxe-select-option{line-height:var(--vxe-ui-select-current-option-height)}.vxe-select--panel-body.ov-padding.overflow-x.sx-pos--top{padding-top:var(--vxe-ui-scrollbar-x-height)}.vxe-select--panel-body.ov-padding.overflow-x.sx-pos--bottom{padding-bottom:var(--vxe-ui-scrollbar-x-height)}.vxe-select--panel-body.ov-padding.overflow-y.sy-pos--left{padding-left:var(--vxe-ui-scrollbar-y-width)}.vxe-select--panel-body.ov-padding.overflow-y.sy-pos--right{padding-right:var(--vxe-ui-scrollbar-y-width)}.vxe-select--panel-body.ov-x--hidden>.vxe-select-option--wrapper{overflow-x:hidden}.vxe-select--panel-body.ov-y--hidden>.vxe-select-option--wrapper{overflow-y:hidden}.vxe-select--panel-body.is--virtual-scrollbar.ov-x--auto-hide:hover>.vxe-scrollbar>.vxe-scrollbar--track-x{opacity:1}.vxe-select--panel-body.is--virtual-scrollbar.ov-x--auto-hide>.vxe-scrollbar>.vxe-scrollbar--track-x{opacity:0;transition:opacity .8s ease-in-out}.vxe-select--panel-body.is--virtual-scrollbar.ov-y--auto-hide:hover>.vxe-scrollbar>.vxe-scrollbar--track-y{opacity:1}.vxe-select--panel-body.is--virtual-scrollbar.ov-y--auto-hide>.vxe-scrollbar>.vxe-scrollbar--track-y{opacity:0;transition:opacity .8s ease-in-out}.vxe-select--panel-body>.vxe-scrollbar{position:unset}.vxe-select--panel-body.is--virtual-scrollbar>.vxe-select-option--wrapper{scrollbar-width:none;-ms-overflow-style:none}.vxe-select--panel-body.is--virtual-scrollbar>.vxe-select-option--wrapper::-webkit-scrollbar{display:none}
@@ -28,6 +28,8 @@
28
28
  .vxe-tooltip--wrapper .vxe-tooltip--content,
29
29
  .vxe-tooltip--wrapper .vxe-tooltip--scrollbar-content-view {
30
30
  padding: 8px 12px;
31
+ width: -moz-max-content;
32
+ width: max-content;
31
33
  max-width: 600px;
32
34
  max-height: 800px;
33
35
  white-space: pre-line;
@@ -1 +1 @@
1
- .vxe-tooltip--wrapper{display:none;position:absolute;top:-100%;left:-100%;font-size:12px;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family);pointer-events:none}.vxe-tooltip--wrapper.is--visible{display:inline-block}.vxe-tooltip--wrapper.is--arrow .vxe-tooltip--arrow{display:block}.vxe-tooltip--wrapper.is--enterable:after{content:"";position:absolute;left:0;width:100%;height:6px;background-color:transparent}.vxe-tooltip--wrapper.is--enterable .vxe-tooltip--body{pointer-events:all}.vxe-tooltip--wrapper .vxe-tooltip--content,.vxe-tooltip--wrapper .vxe-tooltip--scrollbar-content-view{padding:8px 12px;max-width:600px;max-height:800px;white-space:pre-line;border-radius:var(--vxe-ui-base-border-radius);overflow:auto}.vxe-tooltip--wrapper .vxe-tooltip--arrow{display:none;position:absolute;border-color:transparent;border-width:6px;border-style:solid;left:50%;transform:translateX(-6px)}.vxe-tooltip--wrapper .vxe-tooltip--arrow:before{content:"";position:absolute;border-color:transparent;border-width:5px;border-style:solid;left:-5px}.vxe-tooltip--wrapper.placement--top.is--arrow{padding-bottom:6px}.vxe-tooltip--wrapper.placement--top.is--enterable:after{bottom:-6px}.vxe-tooltip--wrapper.placement--top .vxe-tooltip--arrow{bottom:-11px}.vxe-tooltip--wrapper.placement--top .vxe-tooltip--arrow:before{top:-7px}.vxe-tooltip--wrapper.placement--bottom.is--arrow{padding-top:6px}.vxe-tooltip--wrapper.placement--bottom.is--enterable:after{top:-6px}.vxe-tooltip--wrapper.placement--bottom .vxe-tooltip--arrow{top:-11px}.vxe-tooltip--wrapper.placement--bottom .vxe-tooltip--arrow:before{top:-3px}.vxe-tooltip--body{position:relative;border-radius:var(--vxe-ui-base-border-radius);white-space:normal;word-break:break-word;box-shadow:2px 2px 4px -2px rgba(0,0,0,.2)}.vxe-tooltip--wrapper.theme--light .vxe-tooltip--body{background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--top .vxe-tooltip--arrow{border-top-color:var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--top .vxe-tooltip--arrow:before{border-top-color:var(--vxe-ui-layout-background-color)}.vxe-tooltip--wrapper.theme--light.placement--bottom .vxe-tooltip--arrow{border-bottom-color:var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--bottom .vxe-tooltip--arrow:before{border-bottom-color:var(--vxe-ui-layout-background-color)}.vxe-tooltip--wrapper.theme--dark .vxe-tooltip--body{background:var(--vxe-ui-tooltip-dark-background-color);color:var(--vxe-ui-tooltip-dark-color)}.vxe-tooltip--wrapper.theme--dark.placement--top .vxe-tooltip--arrow{border-top-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--top .vxe-tooltip--arrow:before{border-top-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--bottom .vxe-tooltip--arrow{border-bottom-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--bottom .vxe-tooltip--arrow:before{border-bottom-color:var(--vxe-ui-tooltip-dark-background-color)}
1
+ .vxe-tooltip--wrapper{display:none;position:absolute;top:-100%;left:-100%;font-size:12px;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family);pointer-events:none}.vxe-tooltip--wrapper.is--visible{display:inline-block}.vxe-tooltip--wrapper.is--arrow .vxe-tooltip--arrow{display:block}.vxe-tooltip--wrapper.is--enterable:after{content:"";position:absolute;left:0;width:100%;height:6px;background-color:transparent}.vxe-tooltip--wrapper.is--enterable .vxe-tooltip--body{pointer-events:all}.vxe-tooltip--wrapper .vxe-tooltip--content,.vxe-tooltip--wrapper .vxe-tooltip--scrollbar-content-view{padding:8px 12px;width:-moz-max-content;width:max-content;max-width:600px;max-height:800px;white-space:pre-line;border-radius:var(--vxe-ui-base-border-radius);overflow:auto}.vxe-tooltip--wrapper .vxe-tooltip--arrow{display:none;position:absolute;border-color:transparent;border-width:6px;border-style:solid;left:50%;transform:translateX(-6px)}.vxe-tooltip--wrapper .vxe-tooltip--arrow:before{content:"";position:absolute;border-color:transparent;border-width:5px;border-style:solid;left:-5px}.vxe-tooltip--wrapper.placement--top.is--arrow{padding-bottom:6px}.vxe-tooltip--wrapper.placement--top.is--enterable:after{bottom:-6px}.vxe-tooltip--wrapper.placement--top .vxe-tooltip--arrow{bottom:-11px}.vxe-tooltip--wrapper.placement--top .vxe-tooltip--arrow:before{top:-7px}.vxe-tooltip--wrapper.placement--bottom.is--arrow{padding-top:6px}.vxe-tooltip--wrapper.placement--bottom.is--enterable:after{top:-6px}.vxe-tooltip--wrapper.placement--bottom .vxe-tooltip--arrow{top:-11px}.vxe-tooltip--wrapper.placement--bottom .vxe-tooltip--arrow:before{top:-3px}.vxe-tooltip--body{position:relative;border-radius:var(--vxe-ui-base-border-radius);white-space:normal;word-break:break-word;box-shadow:2px 2px 4px -2px rgba(0,0,0,.2)}.vxe-tooltip--wrapper.theme--light .vxe-tooltip--body{background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--top .vxe-tooltip--arrow{border-top-color:var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--top .vxe-tooltip--arrow:before{border-top-color:var(--vxe-ui-layout-background-color)}.vxe-tooltip--wrapper.theme--light.placement--bottom .vxe-tooltip--arrow{border-bottom-color:var(--vxe-ui-input-border-color)}.vxe-tooltip--wrapper.theme--light.placement--bottom .vxe-tooltip--arrow:before{border-bottom-color:var(--vxe-ui-layout-background-color)}.vxe-tooltip--wrapper.theme--dark .vxe-tooltip--body{background:var(--vxe-ui-tooltip-dark-background-color);color:var(--vxe-ui-tooltip-dark-color)}.vxe-tooltip--wrapper.theme--dark.placement--top .vxe-tooltip--arrow{border-top-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--top .vxe-tooltip--arrow:before{border-top-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--bottom .vxe-tooltip--arrow{border-bottom-color:var(--vxe-ui-tooltip-dark-background-color)}.vxe-tooltip--wrapper.theme--dark.placement--bottom .vxe-tooltip--arrow:before{border-bottom-color:var(--vxe-ui-tooltip-dark-background-color)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vxe-pc-ui",
3
- "version": "4.20.9",
3
+ "version": "4.20.11",
4
4
  "description": "A vue based PC component library",
5
5
  "scripts": {
6
6
  "update": "npm install --legacy-peer-deps",
@@ -27,7 +27,7 @@
27
27
  "style": "lib/style.css",
28
28
  "typings": "types/index.d.ts",
29
29
  "dependencies": {
30
- "@vxe-ui/core": "^4.4.35"
30
+ "@vxe-ui/core": "^4.4.38"
31
31
  },
32
32
  "devDependencies": {
33
33
  "@rollup/plugin-commonjs": "^29.0.0",
@@ -4,6 +4,7 @@ import XEUtils from 'xe-utils'
4
4
  import { getConfig, getI18n, createEvent, useSize, renderEmptyElement } from '../../ui'
5
5
  import { toStringTimeDate, getDateQuarter, parseDateValue, parseDateObj, handleValueFormat, hasDateValueType, hasTimestampValueType } from './util'
6
6
  import { createComponentLog } from '../../ui/src/log'
7
+ import VxeScrollbarComponent from '../../scrollbar'
7
8
 
8
9
  import type { VxeDatePanelConstructor, DatePanelInternalData, DatePanelReactData, VxeDatePanelPropTypes, VxeDatePanelPrivateComputed, DatePanelMethods, ValueOf, VxeDatePanelEmits, VxeDatePanelDefines } from '../../../types'
9
10
 
@@ -1746,45 +1747,66 @@ export default defineVxeComponent({
1746
1747
  ref: refInputTimeBody,
1747
1748
  class: 'vxe-date-panel--time-body'
1748
1749
  }, [
1749
- h('ul', {
1750
- class: 'vxe-date-panel--time-hour-list'
1751
- }, hourList.map((item, index) => {
1752
- return h('li', {
1753
- key: index,
1754
- class: {
1755
- 'is--disabled': item.disabled,
1756
- 'is--selected': datetimePanelValue && datetimePanelValue.getHours() === item.value
1757
- },
1758
- onClick: (evnt: MouseEvent) => dateHourEvent(evnt, item)
1759
- }, item.label)
1760
- })),
1750
+ h(VxeScrollbarComponent, {
1751
+ autoHide: true,
1752
+ class: 'vxe-date-panel--time-hour-list',
1753
+ viewClassName: 'vxe-date-panel--time-list-view',
1754
+ viewInnerClassName: 'vxe-date-panel--time-list-inner'
1755
+ }, {
1756
+ default: () => {
1757
+ return hourList.map((item, index) => {
1758
+ return h('div', {
1759
+ key: index,
1760
+ class: ['vxe-date-panel--time-item', {
1761
+ 'is--disabled': item.disabled,
1762
+ 'is--selected': datetimePanelValue && datetimePanelValue.getHours() === item.value
1763
+ }],
1764
+ onClick: (evnt: MouseEvent) => dateHourEvent(evnt, item)
1765
+ }, item.label)
1766
+ })
1767
+ }
1768
+ }),
1761
1769
  hasTimeMinute
1762
- ? h('ul', {
1763
- class: 'vxe-date-panel--time-minute-list'
1764
- }, minuteList.map((item, index) => {
1765
- return h('li', {
1766
- key: index,
1767
- class: {
1768
- 'is--disabled': item.disabled,
1769
- 'is--selected': datetimePanelValue && datetimePanelValue.getMinutes() === item.value
1770
- },
1771
- onClick: (evnt: MouseEvent) => dateMinuteEvent(evnt, item)
1772
- }, item.label)
1773
- }))
1770
+ ? h(VxeScrollbarComponent, {
1771
+ autoHide: true,
1772
+ class: 'vxe-date-panel--time-minute-list',
1773
+ viewClassName: 'vxe-date-panel--time-list-view',
1774
+ viewInnerClassName: 'vxe-date-panel--time-list-inner'
1775
+ }, {
1776
+ default: () => {
1777
+ return minuteList.map((item, index) => {
1778
+ return h('div', {
1779
+ key: index,
1780
+ class: ['vxe-date-panel--time-item', {
1781
+ 'is--disabled': item.disabled,
1782
+ 'is--selected': datetimePanelValue && datetimePanelValue.getMinutes() === item.value
1783
+ }],
1784
+ onClick: (evnt: MouseEvent) => dateMinuteEvent(evnt, item)
1785
+ }, item.label)
1786
+ })
1787
+ }
1788
+ })
1774
1789
  : renderEmptyElement($xeDatePanel),
1775
1790
  hasTimeMinute && hasTimeSecond
1776
- ? h('ul', {
1777
- class: 'vxe-date-panel--time-second-list'
1778
- }, secondList.map((item, index) => {
1779
- return h('li', {
1780
- key: index,
1781
- class: {
1782
- 'is--disabled': item.disabled,
1783
- 'is--selected': datetimePanelValue && datetimePanelValue.getSeconds() === item.value
1784
- },
1785
- onClick: (evnt: MouseEvent) => dateSecondEvent(evnt, item)
1786
- }, item.label)
1787
- }))
1791
+ ? h(VxeScrollbarComponent, {
1792
+ autoHide: true,
1793
+ class: 'vxe-date-panel--time-second-list',
1794
+ viewClassName: 'vxe-date-panel--time-list-view',
1795
+ viewInnerClassName: 'vxe-date-panel--time-list-inner'
1796
+ }, {
1797
+ default: () => {
1798
+ return secondList.map((item, index) => {
1799
+ return h('div', {
1800
+ key: index,
1801
+ class: ['vxe-date-panel--time-item', {
1802
+ 'is--disabled': item.disabled,
1803
+ 'is--selected': datetimePanelValue && datetimePanelValue.getSeconds() === item.value
1804
+ }],
1805
+ onClick: (evnt: MouseEvent) => dateSecondEvent(evnt, item)
1806
+ }, item.label)
1807
+ })
1808
+ }
1809
+ })
1788
1810
  : renderEmptyElement($xeDatePanel)
1789
1811
  ])
1790
1812
  ]
@@ -1,15 +1,19 @@
1
1
  import { h, Teleport, PropType, ref, inject, watch, computed, provide, onBeforeUnmount, reactive, nextTick, onMounted } from 'vue'
2
2
  import { defineVxeComponent } from '../../ui/src/comp'
3
3
  import XEUtils from 'xe-utils'
4
- import { getConfig, getIcon, getI18n, globalEvents, createEvent, renderer, useSize, GLOBAL_EVENT_KEYS, renderEmptyElement } from '../../ui'
4
+ import { VxeUI } from '../../ui'
5
5
  import { getEventTargetNode, getPopupContainer, toCssUnit, updatePanelPlacement } from '../../ui/src/dom'
6
6
  import { getLastZIndex, nextZIndex, getFuncText } from '../../ui/src/utils'
7
7
  import { getSlotVNs } from '../../ui/src/vn'
8
8
  import VxeInputComponent from '../../input'
9
+ import VxeScrollbarComponent from '../../scrollbar'
9
10
 
10
11
  import type { VxeIconPickerPropTypes, VxeIconPickerConstructor, IconPickerInternalData, VxeInputConstructor, ValueOf, IconPickerReactData, VxeIconPickerEmits, IconPickerMethods, IconPickerPrivateRef, VxeIconPickerMethods, VxeIconPickerDefines, VxeDrawerConstructor, VxeDrawerMethods, VxeFormDefines, VxeFormConstructor, VxeFormPrivateMethods, VxeModalConstructor, VxeModalMethods, VxeComponentStyleType } from '../../../types'
11
12
  import type { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types/components/table'
12
13
 
14
+ const { getConfig, getIcon, getI18n, baseUtils, globalEvents, createEvent, renderer, useFns, GLOBAL_EVENT_KEYS, renderEmptyElement } = VxeUI
15
+ const { getDefVal } = baseUtils
16
+
13
17
  function createReactData (): IconPickerReactData {
14
18
  return {
15
19
  initialized: false,
@@ -72,7 +76,12 @@ export default defineVxeComponent({
72
76
  transfer: {
73
77
  type: Boolean as PropType<VxeIconPickerPropTypes.Transfer>,
74
78
  default: null
75
- }
79
+ },
80
+ useScrollbar: {
81
+ type: Boolean as PropType<VxeIconPickerPropTypes.UseScrollbar>,
82
+ default: () => getDefVal(getConfig().iconPicker.useScrollbar, getConfig().useScrollbar)
83
+ },
84
+ scrollbarConfig: Object as PropType<VxeIconPickerPropTypes.ScrollbarConfig>
76
85
  },
77
86
  emits: [
78
87
  'update:modelValue',
@@ -91,7 +100,8 @@ export default defineVxeComponent({
91
100
 
92
101
  const xID = XEUtils.uniqueId()
93
102
 
94
- const { computeSize } = useSize(props)
103
+ const { computeSize } = useFns.useSize(props)
104
+ const { computeIsVScrollbar } = useFns.useVScrollbar(props)
95
105
 
96
106
  const reactData = reactive(createReactData())
97
107
 
@@ -227,6 +237,27 @@ export default defineVxeComponent({
227
237
  return selectIcon ? iconList.find(item => item.icon === selectIcon) : null
228
238
  })
229
239
 
240
+ const computeScrollbarOpts = computed(() => {
241
+ return Object.assign({}, getConfig().iconPicker.scrollbarConfig, props.scrollbarConfig)
242
+ })
243
+
244
+ const computeScrollbarProps = computed(() => {
245
+ const scrollbarOpts = computeScrollbarOpts.value
246
+ const { viewClassName, viewInnerClassName } = scrollbarOpts
247
+ return {
248
+ width: scrollbarOpts.width,
249
+ height: scrollbarOpts.height,
250
+ autoHide: scrollbarOpts.autoHide,
251
+ visible: scrollbarOpts.visible,
252
+ xConfig: scrollbarOpts.xConfig,
253
+ yConfig: scrollbarOpts.yConfig,
254
+ className: scrollbarOpts.className,
255
+ viewAttrs: scrollbarOpts.viewAttrs,
256
+ viewClassName: 'vxe-ico-picker--scrollbar-list-wrapper-view' + (viewClassName ? (' ' + viewClassName) : ''),
257
+ viewInnerClassName: 'vxe-ico-picker--scrollbar-list-wrapper-inner' + (viewClassName ? (' ' + viewInnerClassName) : '')
258
+ }
259
+ })
260
+
230
261
  const updateZindex = () => {
231
262
  if (reactData.panelIndex < getLastZIndex()) {
232
263
  reactData.panelIndex = nextZIndex()
@@ -533,52 +564,63 @@ export default defineVxeComponent({
533
564
  const renderIconWrapper = () => {
534
565
  const { showIconTitle } = props
535
566
  const { selectIcon, iconList } = reactData
567
+ const isVScrollbar = computeIsVScrollbar.value
568
+ const scrollbarProps = computeScrollbarProps.value
536
569
 
537
570
  if (!iconList.length) {
538
571
  return h('div', {
539
572
  class: 'vxe-ico-picker--empty-placeholder'
540
573
  }, getI18n('vxe.iconPicker.emptyText'))
541
574
  }
575
+ const iconVNs = iconList.map(item => {
576
+ const { iconRender } = item
577
+ const compConf = iconRender ? renderer.get(iconRender.name) : null
578
+ const iconMethod = compConf ? compConf.renderIconPickerOptionIcon : null
579
+ return h('div', {
580
+ class: ['vxe-ico-picker--item', {
581
+ 'is--selected': selectIcon === item.icon
582
+ }]
583
+ }, [
584
+ h('div', {
585
+ class: 'vxe-ico-picker--item-inner',
586
+ onClick (evnt) {
587
+ const isDisabled = computeIsDisabled.value
588
+ if (!isDisabled) {
589
+ handleClickIconEvent(evnt, item)
590
+ }
591
+ }
592
+ }, [
593
+ h('div', {
594
+ class: 'vxe-ico-picker--item-icon'
595
+ }, iconMethod && iconRender
596
+ ? getSlotVNs(iconMethod(iconRender, { $iconPicker: $xeIconPicker, option: item }))
597
+ : [
598
+ h('i', {
599
+ class: item.icon || ''
600
+ })
601
+ ]),
602
+ showIconTitle
603
+ ? h('div', {
604
+ class: 'vxe-ico-picker--item-title'
605
+ }, `${item.title || ''}`)
606
+ : renderEmptyElement($xeIconPicker)
607
+ ])
608
+ ])
609
+ })
610
+ if (isVScrollbar) {
611
+ return h(VxeScrollbarComponent, {
612
+ class: 'vxe-ico-picker--scrollbar-list-wrapper',
613
+ ...scrollbarProps
614
+ }, {
615
+ default: () => iconVNs
616
+ })
617
+ }
542
618
  return h('div', {
543
619
  class: 'vxe-ico-picker--list-wrapper'
544
620
  }, [
545
621
  h('div', {
546
622
  class: 'vxe-ico-picker--list'
547
- }, iconList.map(item => {
548
- const { iconRender } = item
549
- const compConf = iconRender ? renderer.get(iconRender.name) : null
550
- const iconMethod = compConf ? compConf.renderIconPickerOptionIcon : null
551
- return h('div', {
552
- class: ['vxe-ico-picker--item', {
553
- 'is--selected': selectIcon === item.icon
554
- }]
555
- }, [
556
- h('div', {
557
- class: 'vxe-ico-picker--item-inner',
558
- onClick (evnt) {
559
- const isDisabled = computeIsDisabled.value
560
- if (!isDisabled) {
561
- handleClickIconEvent(evnt, item)
562
- }
563
- }
564
- }, [
565
- h('div', {
566
- class: 'vxe-ico-picker--item-icon'
567
- }, iconMethod && iconRender
568
- ? getSlotVNs(iconMethod(iconRender, { $iconPicker: $xeIconPicker, option: item }))
569
- : [
570
- h('i', {
571
- class: item.icon || ''
572
- })
573
- ]),
574
- showIconTitle
575
- ? h('div', {
576
- class: 'vxe-ico-picker--item-title'
577
- }, `${item.title || ''}`)
578
- : renderEmptyElement($xeIconPicker)
579
- ])
580
- ])
581
- }))
623
+ }, iconVNs)
582
624
  ])
583
625
  }
584
626