vue-devui 1.0.0-rc.10 → 1.0.0-rc.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 (94) hide show
  1. package/README.md +149 -149
  2. package/auto-complete/index.es.js +22 -14
  3. package/auto-complete/index.umd.js +8 -8
  4. package/auto-complete/style.css +1 -1
  5. package/badge/index.es.js +5 -1
  6. package/badge/index.umd.js +1 -1
  7. package/badge/style.css +1 -1
  8. package/button/index.es.js +1 -1
  9. package/button/index.umd.js +1 -1
  10. package/button/style.css +1 -1
  11. package/card/index.es.js +5 -1
  12. package/card/index.umd.js +1 -1
  13. package/card/style.css +1 -1
  14. package/checkbox/index.es.js +21 -13
  15. package/checkbox/index.umd.js +7 -7
  16. package/checkbox/style.css +1 -1
  17. package/collapse/index.es.js +1 -1
  18. package/collapse/index.umd.js +1 -1
  19. package/collapse/style.css +1 -1
  20. package/date-picker/index.es.js +22 -14
  21. package/date-picker/index.umd.js +9 -9
  22. package/date-picker/style.css +1 -1
  23. package/editable-select/style.css +1 -1
  24. package/form/index.es.js +21 -13
  25. package/form/index.umd.js +11 -11
  26. package/icon/index.es.js +1 -1
  27. package/icon/index.umd.js +1 -1
  28. package/icon/style.css +1 -1
  29. package/image-preview/style.css +1 -1
  30. package/input/index.es.js +22 -14
  31. package/input/index.umd.js +7 -7
  32. package/input/style.css +1 -1
  33. package/input-number/style.css +1 -1
  34. package/modal/index.es.js +1 -1
  35. package/modal/index.umd.js +1 -1
  36. package/modal/style.css +1 -1
  37. package/notification/index.es.js +1 -1
  38. package/notification/index.umd.js +1 -1
  39. package/notification/style.css +1 -1
  40. package/nuxt/components/TABLE_TOKEN.js +3 -0
  41. package/nuxt/components/TimeSelect.js +3 -0
  42. package/nuxt/components/tableProps.js +3 -0
  43. package/package.json +2 -1
  44. package/pagination/style.css +1 -1
  45. package/panel/style.css +1 -1
  46. package/radio/index.es.js +21 -13
  47. package/radio/index.umd.js +7 -7
  48. package/radio/style.css +1 -1
  49. package/rate/style.css +1 -1
  50. package/result/index.es.js +1 -1
  51. package/result/index.umd.js +1 -1
  52. package/result/style.css +1 -1
  53. package/search/index.es.js +23 -14
  54. package/search/index.umd.js +7 -7
  55. package/search/style.css +1 -1
  56. package/select/index.es.js +45 -18
  57. package/select/index.umd.js +11 -11
  58. package/select/style.css +1 -1
  59. package/slider/index.es.js +116 -143
  60. package/slider/index.umd.js +1 -1
  61. package/slider/style.css +1 -1
  62. package/statistic/index.es.js +34 -16
  63. package/statistic/index.umd.js +1 -1
  64. package/statistic/style.css +1 -1
  65. package/status/style.css +1 -1
  66. package/style.css +1 -1
  67. package/switch/index.es.js +21 -13
  68. package/switch/index.umd.js +9 -9
  69. package/switch/style.css +1 -1
  70. package/table/index.es.js +212 -177
  71. package/table/index.umd.js +15 -15
  72. package/table/style.css +1 -1
  73. package/tabs/index.es.js +3 -1
  74. package/tabs/index.umd.js +1 -1
  75. package/tabs/style.css +1 -1
  76. package/textarea/index.es.js +21 -13
  77. package/textarea/index.umd.js +9 -9
  78. package/textarea/style.css +1 -1
  79. package/time-select/index.d.ts +7 -0
  80. package/time-select/index.es.js +9460 -0
  81. package/time-select/index.umd.js +27 -0
  82. package/time-select/package.json +7 -0
  83. package/time-select/style.css +1 -0
  84. package/timeline/index.es.js +1 -1
  85. package/timeline/index.umd.js +1 -1
  86. package/timeline/style.css +1 -1
  87. package/tree/index.es.js +1073 -63
  88. package/tree/index.umd.js +17 -17
  89. package/tree/style.css +1 -1
  90. package/upload/index.es.js +49 -11
  91. package/upload/index.umd.js +1 -1
  92. package/upload/style.css +1 -1
  93. package/vue-devui.es.js +1756 -493
  94. package/vue-devui.umd.js +21 -21
package/select/style.css CHANGED
@@ -1 +1 @@
1
- .devui-fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--devui-shadow, rgba(37, 43, 58, .2));z-index:1050}.devui-fixed-overlay--fade-enter-active,.devui-fixed-overlay--fade-leave-active{transition:opacity .1s cubic-bezier(0,0,1,1)}.devui-fixed-overlay--fade-enter-from,.devui-fixed-overlay--fade-leave-to{opacity:0}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 4px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 4px 8px 0) var(--devui-shadow, rgba(37, 43, 58, .2));z-index:1000}.devui-flexible-overlay__arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-popover__icon-wrap{width:16px;height:16px;margin-right:8px}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>path{fill:var(--devui-success, #50d4ab)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>circle,.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>path{fill:var(--devui-warning, #fac20a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>g{fill:var(--devui-info, #5e7ce0)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>path{fill:var(--devui-danger, #f66f6a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__content.devui-flexible-overlay{display:flex;flex-wrap:wrap;align-items:center;white-space:nowrap;padding:4px 12px;line-height:1.5;border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e);font-size:var(--devui-font-size-sm, 12px)}.devui-popover__content.devui-flexible-overlay.is-icon{flex-wrap:nowrap}.devui-popover--fade-bottom-enter-from,.devui-popover--fade-bottom-leave-to,.devui-popover--fade-top-enter-from,.devui-popover--fade-top-leave-to{opacity:.8;transform:scaleY(.8)}.devui-popover--fade-bottom-enter-to,.devui-popover--fade-bottom-leave-from,.devui-popover--fade-top-enter-to,.devui-popover--fade-top-leave-from{opacity:1;transform:scaleY(1)}.devui-popover--fade-bottom-enter-active,.devui-popover--fade-top-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-bottom-leave-active,.devui-popover--fade-top-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-popover--fade-left-enter-from,.devui-popover--fade-left-leave-to,.devui-popover--fade-right-enter-from,.devui-popover--fade-right-leave-to{opacity:.8;transform:scaleX(.8)}.devui-popover--fade-left-enter-to,.devui-popover--fade-left-leave-from,.devui-popover--fade-right-enter-to,.devui-popover--fade-right-leave-from{opacity:1;transform:scaleX(1)}.devui-popover--fade-left-enter-active,.devui-popover--fade-right-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-left-leave-active,.devui-popover--fade-right-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-form__label{align-self:flex-start}.devui-form__label--vertical{padding-bottom:8px}.devui-form__label--sm{flex:0 0 80px}.devui-form__label--md{flex:0 0 100px}.devui-form__label--lg{flex:0 0 150px}.devui-form__label--start{text-align:left}.devui-form__label--center{text-align:center}.devui-form__label--end{text-align:end}.devui-form__label-span{display:inline-block;vertical-align:middle;color:var(--devui-text, #252b3a)}.devui-form__label--required:before{content:"*";color:red;display:inline-block;margin-right:8px;margin-left:-12px}.devui-form__label-help{position:relative;top:-.1em;display:inline-block;vertical-align:middle;margin-left:4px;cursor:pointer}.devui-form__control{flex:1 1 auto;position:relative;width:100%}.devui-form__control--horizontal{margin-left:16px}.devui-form__control .devui-star{color:red}.devui-form__control .devui-form__control-container{position:relative}.devui-form__control .devui-form__control-container--horizontal{display:flex;width:100%}.devui-form__control .devui-form__control-container--horizontal .devui-validate-tip{margin:0}.devui-form__control .devui-form__control-container .devui-form__feedback-icon{position:absolute;top:50%;right:0;z-index:1;width:32px;height:16px;text-align:center;visibility:visible;pointer-events:none;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg circle{fill:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg circle{fill:var(--devui-success, #50d4ab)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg{animation:loading-keyframes 1s infinite linear}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg path{fill:var(--devui-brand, #5e7ce0)}.devui-form__control .devui-form__control-content{width:100%}.devui-form__control .devui-form__control-container--has-feedback{display:flex;align-items:center}.devui-form__control .devui-form__control-container--has-feedback input{padding-right:28px}.devui-form__control .devui-form__control-container--feedback-error{border:1px solid #f66f6a;border-radius:2px}.devui-form__control .devui-form__control-container--feedback-error input{background-color:#ffeeed;border-color:transparent}.devui-form__control .devui-form__control-container--feedback-error input:hover{border-color:transparent!important}.devui-form__control .devui-form__control-container--feedback-error input:focus{border-color:transparent!important}.devui-form__control .devui-form__control-container--feedback-error .devui-select-arrow{right:24px!important}.devui-form__control .devui-form__control-info{line-height:1}.devui-form__control .devui-form__control-info .error-message{display:inline-block;min-height:20px;line-height:1.5;font-size:var(--devui-font-size, 14px);color:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-info .devui-form__control-extra{font-size:var(--devui-font-size, 14px);color:var(--devui-aide-text, #71757f);min-height:20px;line-height:1.5;text-align:justify}@keyframes loading-keyframes{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.devui-form__item--horizontal{display:flex;align-items:center;margin-bottom:20px}.devui-form__item--vertical{display:flex;flex-direction:column;margin-bottom:20px}.devui-form__item--error{margin-bottom:0}.devui-form-operation .star{color:red}.devui-checkbox{position:relative;display:flex;display:-ms-flexbox;align-items:center;-ms-flex-align:center;height:100%;margin:0}.devui-checkbox .devui-checkbox__tick-wrap{position:absolute}.devui-checkbox .devui-checkbox__tick-wrap .devui-checkbox__tick{fill:var(--devui-light-text, #ffffff);stroke-dashoffset:50;opacity:0;transform:scale(0);transform-origin:50% 50%;transition:stroke-dashoffset .2s ease-in-out,opacity .2s ease-in-out,transform .2s ease-in-out}.devui-checkbox.active:not(.half-checked) .devui-checkbox__tick{opacity:1;stroke-dashoffset:0;transform:scale(1);transition:stroke-dashoffset .3s cubic-bezier(.755,.05,.855,.06),opacity .2s cubic-bezier(.755,.05,.855,.06)}.devui-checkbox.active:not(.disabled) .devui-checkbox__material:not(.custom-color),.devui-checkbox.half-checked:not(.disabled) .devui-checkbox__material:not(.custom-color){border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.active .devui-checkbox--bordered,.devui-checkbox.half-checked .devui-checkbox--bordered{border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.active:not(.disabled) .devui-checkbox__material{background-size:100% 100%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material:not(.custom-color){background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material:not(.custom-color):hover{border-color:var(--devui-icon-fill-active, #252b3a)}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material.custom-color{background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.half-checked .devui-checkbox__material:not(.custom-color){background-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.half-checked .devui-checkbox__material:not(.custom-color)>.devui-checkbox__halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox.half-checked .devui-checkbox__material.custom-color>.devui-checkbox__halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox .devui-checkbox__material{text-align:initial;height:14px;width:14px;position:relative;user-select:none;border:1px solid var(--devui-line, #d7d8da);border-radius:var(--devui-border-radius, 4px);background:linear-gradient(var(--devui-brand, #5e7ce0),var(--devui-brand, #5e7ce0)) no-repeat center/0%;margin-right:8px;vertical-align:text-bottom}.devui-checkbox .devui-checkbox__material.devui-checkbox__default-background{background-color:var(--devui-base-bg, #ffffff)}.devui-checkbox .devui-checkbox__material.devui-checkbox--no-label{margin-right:0}.devui-checkbox .devui-checkbox__material>.devui-checkbox__halfchecked-bg{display:inline-block;position:absolute;content:"";background-color:var(--devui-light-text, #ffffff);top:0;left:0;height:100%;width:100%;transform:scale(1);opacity:0}.devui-checkbox .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):focus,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover{background-color:var(--devui-icon-fill-active, #252b3a)}.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):focus,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover:active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover:focus{background-color:var(--devui-brand-active-focus, #344899)}.devui-checkbox__input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-checkbox label{position:relative;font-weight:400;height:18px;line-height:18px;cursor:pointer;color:var(--devui-text, #252b3a);margin:0;display:block}.devui-checkbox label.devui-checkbox--lg{font-size:var(--devui-font-size-lg, 14px)}.devui-checkbox label.devui-checkbox--lg .devui-checkbox__material{width:16px;height:16px}.devui-checkbox label.devui-checkbox--lg .devui-checkbox__material>svg{width:16px;height:16px}.devui-checkbox label.devui-checkbox--lg.devui-checkbox--bordered{height:40px;line-height:40px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--md{font-size:var(--devui-font-size-lg, 14px)}.devui-checkbox label.devui-checkbox--md .devui-checkbox__material{width:16px;height:16px}.devui-checkbox label.devui-checkbox--md .devui-checkbox__material>svg{width:16px;height:16px}.devui-checkbox label.devui-checkbox--md.devui-checkbox--bordered{height:36px;line-height:36px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--sm{font-size:var(--devui-font-size-sm, 12px)}.devui-checkbox label.devui-checkbox--sm .devui-checkbox__material{width:14px;height:14px}.devui-checkbox label.devui-checkbox--sm .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox label.devui-checkbox--sm.devui-checkbox--bordered{height:32px;line-height:32px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--xs{font-size:var(--devui-font-size-sm, 12px)}.devui-checkbox label.devui-checkbox--xs .devui-checkbox__material{width:14px;height:14px}.devui-checkbox label.devui-checkbox--xs .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox label.devui-checkbox--xs.devui-checkbox--bordered{height:28px;line-height:28px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--bordered{border:1px solid var(--devui-disabled-line, #dfe1e6);border-radius:var(--devui-border-radius, 4px)}.devui-checkbox label>span{display:inline-block;box-sizing:content-box;vertical-align:top}.devui-checkbox.disabled label{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3)}.devui-checkbox.disabled .devui-checkbox__material{border-color:var(--devui-icon-fill-active-disabled, #beccfa);background-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-checkbox.disabled.unchecked .devui-checkbox__material{border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-checkbox.disabled.half-checked .devui-checkbox__material{background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-checkbox.disabled.half-checked .devui-checkbox__material .devui-checkbox__halfchecked-bg{transform:scale(.4288);background-color:var(--devui-disabled-text, #cfd0d3);opacity:1}.devui-checkbox.disabled.active svg polygon{fill:var(--devui-light-text, #ffffff)}.devui-checkbox--no-animation{transition:none!important}.devui-checkbox__column-margin{height:28px;line-height:28px}.devui-checkbox__wrap .devui-checkbox label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:block}.devui-checkbox--list-inline{min-height:28px;line-height:28px;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;margin:-8px 0 0}.devui-checkbox--list-inline div:not(:last-child){margin-right:20px}.devui-checkbox--list-inline>*{margin-top:8px}.devui-checkbox-button{display:inline-block;position:relative}.devui-checkbox-button__input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-checkbox-button__content{font-size:14px;color:var(--devui-text, #252b3a);padding:10px 20px;cursor:pointer;border:1px solid var(--devui-disabled-line, #dfe1e6);border-left:none;display:inline-block;line-height:1;user-select:none;box-shadow:-1px 0 #dfe1e6}.devui-checkbox-button__content.devui-checkbox-button--lg{font-size:var(--devui-font-size-lg, 14px);padding:12px 20px}.devui-checkbox-button__content.devui-checkbox-button--md{font-size:var(--devui-font-size-lg, 14px);padding:10px 20px}.devui-checkbox-button__content.devui-checkbox-button--sm{font-size:var(--devui-font-size-sm, 12px);padding:9px 15px}.devui-checkbox-button__content.devui-checkbox-button--xs{font-size:var(--devui-font-size-sm, 12px);padding:7px 15px}.devui-checkbox-button.active .devui-checkbox-button__content{color:#fff;background-color:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox-button.active.disabled .devui-checkbox-button__content{color:#fff;background-color:var(--devui-icon-fill-active-disabled, #beccfa);border-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-checkbox-button.disabled .devui-checkbox-button__content{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3);background-color:#fff;border-color:var(--devui-disabled-line, #dfe1e6)}.devui-checkbox-button:first-child .devui-checkbox-button__content{border-top-left-radius:var(--devui-border-radius, 4px);border-bottom-left-radius:var(--devui-border-radius, 4px);border-left:1px solid var(--devui-disabled-line, #dfe1e6);box-shadow:none}.devui-checkbox-button:last-child .devui-checkbox-button__content{border-top-right-radius:var(--devui-border-radius, 4px);border-bottom-right-radius:var(--devui-border-radius, 4px)}.devui-icon__container{display:inline-flex;align-items:center;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--disabled{color:var(--devui-disabled-text, #cfd0d3);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #cfd0d3)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 4px);transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--spin{animation:iconSpin 2.5s linear infinite}.devui-svg-icon{vertical-align:middle}@keyframes iconSpin{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.devui-icon-group{display:inline-flex;align-items:center}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable){padding:8px;margin-left:0}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable):first-child{margin-left:-8px}.devui-icon-group>*:not(:first-child){margin-left:0}@charset "UTF-8";.devui-tag{display:inline-block;margin:4px}.devui-tag .devui-tag__item{display:block;position:relative;padding:0 8px;height:20px;border:1px solid;border-radius:var(--devui-border-radius, 4px);font-size:var(--devui-font-size, 14px);line-height:20px;cursor:default}.devui-tag .devui-tag__item.devui-tag--default{border:0;color:var(--devui-text, #252b3a);background-color:var(--devui-default-bg, #f7f8fa)}.devui-tag .devui-tag__item.devui-tag--primary{color:var(--devui-primary, #5e7ce0);background-color:var(--devui-primary-bg, #f2f5fc)}.devui-tag .devui-tag__item.devui-tag--success{color:var(--devui-success, #50d4ab);background-color:var(--devui-success-bg, #edfff9)}.devui-tag .devui-tag__item.devui-tag--warning{color:var(--devui-warning, #fac20a);background-color:var(--devui-warning-bg, #fff3e8)}.devui-tag .devui-tag__item.devui-tag--danger{color:var(--devui-danger, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}.devui-tag .devui-tag__item.devui-tag--colorful{background-color:#fff}.devui-tag .devui-tag__item.devui-tag--deletable{padding-right:32px}.devui-tag .devui-tag__item.devui-tag--lg{font-size:var(--devui-font-size-lg, 14px);height:32px;line-height:30px}.devui-tag .devui-tag__item.devui-tag--md{font-size:var(--devui-font-size-lg, 14px);height:28px;line-height:26px}.devui-tag .devui-tag__item.devui-tag--sm{font-size:var(--devui-font-size-sm, 12px);height:24px;line-height:22px}.devui-tag .devui-tag__item.devui-tag--xs{font-size:var(--devui-font-size-sm, 12px);height:20px;line-height:18px}.devui-tag .remove-button{display:inline-block;margin-left:12px;font-size:var(--devui-font-size-icon, 16px);cursor:pointer;width:12px;height:12px;line-height:12px;border-radius:50%;text-align:center;position:absolute;top:50%;transform:translateY(-50%)}.devui-tag .remove-button i{vertical-align:0}.devui-select{position:relative;width:100%}.devui-select__selection:hover{border-color:var(--devui-form-control-line-hover, #9b9fa8)}.devui-select--open .devui-select__selection:not(.devui-select__selection--error),.devui-select--focus .devui-select__selection:not(.devui-select__selection--error){border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--open .devui-select__selection:not(.devui-select__selection--error):hover,.devui-select--focus .devui-select__selection:not(.devui-select__selection--error):hover{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--underlined{border-bottom:1px solid var(--devui-form-control-line, #d7d8da);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-select--underlined:not([disabled]):not(.disabled):hover{border-color:var(--devui-form-control-line-hover, #9b9fa8)}.devui-select--underlined:not([disabled]):not(.disabled).devui-select--open{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--underlined .devui-select__input,.devui-select--underlined .devui-select__selection{border:none}.devui-select--disabled,.devui-select--disabled .devui-select__input,.devui-select--disabled .devui-select__selection{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #cfd0d3)}.devui-select--disabled .devui-select__arrow{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3)}.devui-select--open .devui-select__arrow{transform:rotate(180deg)}.devui-dropdown-menu-multiple .devui-select__item.active{color:var(--devui-list-item-active-text, #252b3a);background-color:transparent}.devui-select__selection{display:flex;align-items:center;position:relative;cursor:pointer;border:1px solid var(--devui-form-control-line, #d7d8da);border-radius:var(--devui-border-radius, 4px);background-color:var(--devui-form-control-bg, #ffffff);color:var(--devui-text, #252b3a)}.devui-select__selection--error{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}.devui-select__selection--error:hover{border-color:var(--devui-danger-line, #f66f6a)}.devui-select__multiple{display:flex;align-items:center;flex-wrap:wrap;cursor:pointer}.devui-select__multiple .devui-select__multiple--input{display:flex;max-width:100%;min-width:15px}.devui-select__input{cursor:pointer;width:100%;height:26px;padding:4px 28px 4px 10px;color:var(--devui-text, #252b3a);vertical-align:middle;outline:none;background:none;box-sizing:border-box;border:none;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-select__input:not([disabled]):not(.disabled):hover{border-color:var(--devui-form-control-line-hover, #9b9fa8)}.devui-select__input:not([disabled]):not(.disabled):focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select__input[disabled]:hover,.devui-select__input.disabled:hover{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #cfd0d3)}.devui-select__input.devui-select__input--lg{height:42px}.devui-select__input.devui-select__input--sm{height:22px}.devui-select__clearable:hover .devui-select__clear{display:inline-flex}.devui-select__clearable:hover .devui-select__arrow{display:none}.devui-select__clear,.devui-select__arrow{position:absolute;right:0;height:100%;width:28px;display:inline-flex;justify-content:center;align-items:center}.devui-select__clear{display:none}.devui-select__clear:hover{color:var(--devui-icon-fill-active, #252b3a)}.devui-select__clear--feedback{right:28px}.devui-select__arrow{transform:rotate(0);transition:transform .25s ease-out}.devui-select__arrow--feedback{right:28px}.devui-select__dropdown{position:absolute;width:calc(100% - 2px);overflow:auto;top:100%;left:0;margin:5px 0;border-radius:var(--devui-border-radius, 4px);background:var(--devui-base-bg, #ffffff);box-shadow:0 2px 5px 0 var(--devui-shadow, rgba(37, 43, 58, .2));z-index:999}.devui-select__dropdown-list{max-height:300px;width:100%;overflow-y:auto;padding:0;margin:0}.devui-select__item{font-size:var(--devui-font-size, 12px);display:block;min-height:36px;line-height:1.5;width:100%;padding:10px;clear:both;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border:0;color:var(--devui-text, #252b3a);box-sizing:border-box;cursor:pointer}.devui-select__item:hover:not(.active):not(.disabled){color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-select__item.active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-select__item.disabled{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);color:var(--devui-disabled-text, #cfd0d3)}.devui-scrollbar::-webkit-scrollbar{width:8px;height:8px}.devui-scrollbar::-webkit-scrollbar-corner{background-color:transparent}.devui-scrollbar::-webkit-scrollbar-thumb{border-radius:8px;background-color:var(--devui-line, #adb0b8)}.devui-scrollbar::-webkit-scrollbar-track{background-color:transparent}.fade-enter-active,.fade-leave-active{transform:scale3d(0,1,0,.9999) translate3d(0,1,0,0);transform-origin:0 0%;opacity:1;transition:transform,opacity .25s ease-out}.fade-enter-from,.fade-leave-to{transform:scale3d(0,1,0,0) translate3d(0,1,0,-4px);opacity:0;transition:transform,opacity .25s ease-in}.devui-select__dropdown--empty{text-align:center;font-size:var(--devui-font-size, 12px);color:var(--devui-disabled-text, #cfd0d3)}
1
+ .devui-fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--devui-shadow, rgba(37, 43, 58, .2));z-index:1050}.devui-fixed-overlay--fade-enter-active,.devui-fixed-overlay--fade-leave-active{transition:opacity .1s cubic-bezier(0,0,1,1)}.devui-fixed-overlay--fade-enter-from,.devui-fixed-overlay--fade-leave-to{opacity:0}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 4px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 4px 8px 0) var(--devui-shadow, rgba(37, 43, 58, .2));z-index:1000}.devui-flexible-overlay__arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-popover__icon-wrap{width:16px;height:16px;margin-right:8px}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>path{fill:var(--devui-success, #50d4ab)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>circle,.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>path{fill:var(--devui-warning, #fac20a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>g{fill:var(--devui-info, #5e7ce0)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>path{fill:var(--devui-danger, #f66f6a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__content.devui-flexible-overlay{display:flex;flex-wrap:wrap;align-items:center;white-space:nowrap;padding:4px 12px;line-height:1.5;border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e);font-size:var(--devui-font-size-sm, 12px)}.devui-popover__content.devui-flexible-overlay.is-icon{flex-wrap:nowrap}.devui-popover--fade-bottom-enter-from,.devui-popover--fade-bottom-leave-to,.devui-popover--fade-top-enter-from,.devui-popover--fade-top-leave-to{opacity:.8;transform:scaleY(.8)}.devui-popover--fade-bottom-enter-to,.devui-popover--fade-bottom-leave-from,.devui-popover--fade-top-enter-to,.devui-popover--fade-top-leave-from{opacity:1;transform:scaleY(1)}.devui-popover--fade-bottom-enter-active,.devui-popover--fade-top-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-bottom-leave-active,.devui-popover--fade-top-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-popover--fade-left-enter-from,.devui-popover--fade-left-leave-to,.devui-popover--fade-right-enter-from,.devui-popover--fade-right-leave-to{opacity:.8;transform:scaleX(.8)}.devui-popover--fade-left-enter-to,.devui-popover--fade-left-leave-from,.devui-popover--fade-right-enter-to,.devui-popover--fade-right-leave-from{opacity:1;transform:scaleX(1)}.devui-popover--fade-left-enter-active,.devui-popover--fade-right-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-left-leave-active,.devui-popover--fade-right-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-form__label{align-self:flex-start}.devui-form__label--vertical{padding-bottom:8px}.devui-form__label--sm{flex:0 0 80px}.devui-form__label--md{flex:0 0 100px}.devui-form__label--lg{flex:0 0 150px}.devui-form__label--start{text-align:left}.devui-form__label--center{text-align:center}.devui-form__label--end{text-align:end}.devui-form__label-span{display:inline-block;vertical-align:middle;color:var(--devui-text, #252b3a)}.devui-form__label--required:before{content:"*";color:red;display:inline-block;margin-right:8px;margin-left:-12px}.devui-form__label-help{position:relative;top:-.1em;display:inline-block;vertical-align:middle;margin-left:4px;cursor:pointer}.devui-form__control{flex:1 1 auto;position:relative;width:100%}.devui-form__control--horizontal{margin-left:16px}.devui-form__control .devui-star{color:red}.devui-form__control .devui-form__control-container{position:relative}.devui-form__control .devui-form__control-container--horizontal{display:flex;width:100%}.devui-form__control .devui-form__control-container--horizontal .devui-validate-tip{margin:0}.devui-form__control .devui-form__control-container .devui-form__feedback-icon{position:absolute;top:50%;right:0;z-index:1;width:32px;height:16px;text-align:center;visibility:visible;pointer-events:none;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg circle{fill:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg circle{fill:var(--devui-success, #50d4ab)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg{animation:loading-keyframes 1s infinite linear}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg path{fill:var(--devui-brand, #5e7ce0)}.devui-form__control .devui-form__control-content{width:100%}.devui-form__control .devui-form__control-container--has-feedback{display:flex;align-items:center}.devui-form__control .devui-form__control-container--has-feedback input{padding-right:28px}.devui-form__control .devui-form__control-container--feedback-error{border:1px solid #f66f6a;border-radius:2px}.devui-form__control .devui-form__control-container--feedback-error input{background-color:#ffeeed;border-color:transparent}.devui-form__control .devui-form__control-container--feedback-error input:hover{border-color:transparent!important}.devui-form__control .devui-form__control-container--feedback-error input:focus{border-color:transparent!important}.devui-form__control .devui-form__control-container--feedback-error .devui-select-arrow{right:24px!important}.devui-form__control .devui-form__control-info{line-height:1}.devui-form__control .devui-form__control-info .error-message{display:inline-block;min-height:20px;line-height:1.5;font-size:var(--devui-font-size, 14px);color:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-info .devui-form__control-extra{font-size:var(--devui-font-size, 14px);color:var(--devui-aide-text, #71757f);min-height:20px;line-height:1.5;text-align:justify}@keyframes loading-keyframes{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.devui-form__item--horizontal{display:flex;align-items:center;margin-bottom:20px}.devui-form__item--vertical{display:flex;flex-direction:column;margin-bottom:20px}.devui-form__item--error{margin-bottom:0}.devui-form-operation .star{color:red}.devui-checkbox{position:relative;display:flex;display:-ms-flexbox;align-items:center;-ms-flex-align:center;height:100%;margin:0}.devui-checkbox .devui-checkbox__tick-wrap{position:absolute}.devui-checkbox .devui-checkbox__tick-wrap .devui-checkbox__tick{fill:var(--devui-light-text, #ffffff);stroke-dashoffset:50;opacity:0;transform:scale(0);transform-origin:50% 50%;transition:stroke-dashoffset .2s ease-in-out,opacity .2s ease-in-out,transform .2s ease-in-out}.devui-checkbox.active:not(.half-checked) .devui-checkbox__tick{opacity:1;stroke-dashoffset:0;transform:scale(1);transition:stroke-dashoffset .3s cubic-bezier(.755,.05,.855,.06),opacity .2s cubic-bezier(.755,.05,.855,.06)}.devui-checkbox.active:not(.disabled) .devui-checkbox__material:not(.custom-color),.devui-checkbox.half-checked:not(.disabled) .devui-checkbox__material:not(.custom-color){border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.active .devui-checkbox--bordered,.devui-checkbox.half-checked .devui-checkbox--bordered{border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.active:not(.disabled) .devui-checkbox__material{background-size:100% 100%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material:not(.custom-color){background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material:not(.custom-color):hover{border-color:var(--devui-icon-fill-active, #252b3a)}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox__material.custom-color{background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.half-checked .devui-checkbox__material:not(.custom-color){background-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.half-checked .devui-checkbox__material:not(.custom-color)>.devui-checkbox__halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox.half-checked .devui-checkbox__material.custom-color>.devui-checkbox__halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox .devui-checkbox__material{text-align:initial;height:14px;width:14px;position:relative;user-select:none;border:1px solid var(--devui-line, #d7d8da);border-radius:var(--devui-border-radius, 4px);background:linear-gradient(var(--devui-brand, #5e7ce0),var(--devui-brand, #5e7ce0)) no-repeat 50%/0;margin-right:8px;vertical-align:text-bottom}.devui-checkbox .devui-checkbox__material.devui-checkbox__default-background{background-color:var(--devui-base-bg, #ffffff)}.devui-checkbox .devui-checkbox__material.devui-checkbox--no-label{margin-right:0}.devui-checkbox .devui-checkbox__material>.devui-checkbox__halfchecked-bg{display:inline-block;position:absolute;content:"";background-color:var(--devui-light-text, #ffffff);top:0;left:0;height:100%;width:100%;transform:scale(1);opacity:0}.devui-checkbox .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):focus,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover{background-color:var(--devui-icon-fill-active, #252b3a)}.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):focus,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover:active,.devui-checkbox:not(.disabled).half-checked .devui-checkbox__material:not(.custom-color):hover:focus{background-color:var(--devui-brand-active-focus, #344899)}.devui-checkbox__input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-checkbox label{position:relative;font-weight:400;height:16px;line-height:16px;cursor:pointer;color:var(--devui-text, #252b3a);margin:0;display:block}.devui-checkbox label.devui-checkbox--lg{font-size:var(--devui-font-size-lg, 14px)}.devui-checkbox label.devui-checkbox--lg .devui-checkbox__material{width:16px;height:16px}.devui-checkbox label.devui-checkbox--lg .devui-checkbox__material>svg{width:16px;height:16px}.devui-checkbox label.devui-checkbox--lg.devui-checkbox--bordered{height:40px;line-height:40px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--md{font-size:var(--devui-font-size-lg, 14px)}.devui-checkbox label.devui-checkbox--md .devui-checkbox__material{width:16px;height:16px}.devui-checkbox label.devui-checkbox--md .devui-checkbox__material>svg{width:16px;height:16px}.devui-checkbox label.devui-checkbox--md.devui-checkbox--bordered{height:36px;line-height:36px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--sm{font-size:var(--devui-font-size-sm, 12px)}.devui-checkbox label.devui-checkbox--sm .devui-checkbox__material{width:14px;height:14px}.devui-checkbox label.devui-checkbox--sm .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox label.devui-checkbox--sm.devui-checkbox--bordered{height:32px;line-height:32px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--xs{font-size:var(--devui-font-size-sm, 12px)}.devui-checkbox label.devui-checkbox--xs .devui-checkbox__material{width:14px;height:14px}.devui-checkbox label.devui-checkbox--xs .devui-checkbox__material>svg{width:14px;height:14px}.devui-checkbox label.devui-checkbox--xs.devui-checkbox--bordered{height:28px;line-height:28px;padding:0 15px 0 10px}.devui-checkbox label.devui-checkbox--bordered{border:1px solid var(--devui-disabled-line, #dfe1e6);border-radius:var(--devui-border-radius, 4px)}.devui-checkbox label>span{display:inline-block;box-sizing:content-box;vertical-align:top}.devui-checkbox.disabled label{cursor:not-allowed;color:var(--devui-disabled-text, #adb0b8)}.devui-checkbox.disabled .devui-checkbox__material{border-color:var(--devui-icon-fill-active-disabled, #beccfa);background-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-checkbox.disabled.unchecked .devui-checkbox__material{border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-checkbox.disabled.half-checked .devui-checkbox__material{background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-checkbox.disabled.half-checked .devui-checkbox__material .devui-checkbox__halfchecked-bg{transform:scale(.4288);background-color:var(--devui-disabled-text, #adb0b8);opacity:1}.devui-checkbox.disabled.active svg polygon{fill:var(--devui-light-text, #ffffff)}.devui-checkbox--no-animation{transition:none!important}.devui-checkbox__column-margin{height:28px;line-height:28px}.devui-checkbox__wrap .devui-checkbox label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:block}.devui-checkbox--list-inline{min-height:28px;line-height:28px;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;margin:-8px 0 0}.devui-checkbox--list-inline div:not(:last-child){margin-right:20px}.devui-checkbox--list-inline>*{margin-top:8px}.devui-checkbox-button{display:inline-block;position:relative}.devui-checkbox-button__input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-checkbox-button__content{font-size:14px;color:var(--devui-text, #252b3a);padding:10px 20px;cursor:pointer;border:1px solid var(--devui-disabled-line, #dfe1e6);border-left:none;display:inline-block;line-height:1;user-select:none;box-shadow:-1px 0 #dfe1e6}.devui-checkbox-button__content.devui-checkbox-button--lg{font-size:var(--devui-font-size-lg, 14px);padding:12px 20px}.devui-checkbox-button__content.devui-checkbox-button--md{font-size:var(--devui-font-size-lg, 14px);padding:10px 20px}.devui-checkbox-button__content.devui-checkbox-button--sm{font-size:var(--devui-font-size-sm, 12px);padding:9px 15px}.devui-checkbox-button__content.devui-checkbox-button--xs{font-size:var(--devui-font-size-sm, 12px);padding:7px 15px}.devui-checkbox-button.active .devui-checkbox-button__content{color:#fff;background-color:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox-button.active.disabled .devui-checkbox-button__content{color:#fff;background-color:var(--devui-icon-fill-active-disabled, #beccfa);border-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-checkbox-button.disabled .devui-checkbox-button__content{cursor:not-allowed;color:var(--devui-disabled-text, #adb0b8);background-color:#fff;border-color:var(--devui-disabled-line, #dfe1e6)}.devui-checkbox-button:first-child .devui-checkbox-button__content{border-top-left-radius:var(--devui-border-radius, 4px);border-bottom-left-radius:var(--devui-border-radius, 4px);border-left:1px solid var(--devui-disabled-line, #dfe1e6);box-shadow:none}.devui-checkbox-button:last-child .devui-checkbox-button__content{border-top-right-radius:var(--devui-border-radius, 4px);border-bottom-right-radius:var(--devui-border-radius, 4px)}.devui-icon__container{display:inline-flex;align-items:center;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 4px);transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--spin{animation:iconSpin 2.5s linear infinite}.devui-svg-icon{vertical-align:middle}@keyframes iconSpin{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.devui-icon-group{display:inline-flex;align-items:center}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable){padding:8px;margin-left:0}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable):first-child{margin-left:-8px}.devui-icon-group>*:not(:first-child){margin-left:0}@charset "UTF-8";.devui-tag{display:inline-block;margin:4px}.devui-tag .devui-tag__item{display:block;position:relative;padding:0 8px;height:20px;border:1px solid;border-radius:var(--devui-border-radius, 4px);font-size:var(--devui-font-size, 14px);line-height:20px;cursor:default}.devui-tag .devui-tag__item.devui-tag--default{border:0;color:var(--devui-text, #252b3a);background-color:var(--devui-default-bg, #f7f8fa)}.devui-tag .devui-tag__item.devui-tag--primary{color:var(--devui-primary, #5e7ce0);background-color:var(--devui-primary-bg, #f2f5fc)}.devui-tag .devui-tag__item.devui-tag--success{color:var(--devui-success, #50d4ab);background-color:var(--devui-success-bg, #edfff9)}.devui-tag .devui-tag__item.devui-tag--warning{color:var(--devui-warning, #fac20a);background-color:var(--devui-warning-bg, #fff3e8)}.devui-tag .devui-tag__item.devui-tag--danger{color:var(--devui-danger, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}.devui-tag .devui-tag__item.devui-tag--colorful{background-color:#fff}.devui-tag .devui-tag__item.devui-tag--deletable{padding-right:32px}.devui-tag .devui-tag__item.devui-tag--lg{font-size:var(--devui-font-size-lg, 14px);height:32px;line-height:30px}.devui-tag .devui-tag__item.devui-tag--md{font-size:var(--devui-font-size-lg, 14px);height:28px;line-height:26px}.devui-tag .devui-tag__item.devui-tag--sm{font-size:var(--devui-font-size-sm, 12px);height:24px;line-height:22px}.devui-tag .devui-tag__item.devui-tag--xs{font-size:var(--devui-font-size-sm, 12px);height:20px;line-height:18px}.devui-tag .remove-button{display:inline-block;margin-left:12px;font-size:var(--devui-font-size-icon, 16px);cursor:pointer;width:12px;height:12px;line-height:12px;border-radius:50%;text-align:center;position:absolute;top:50%;transform:translateY(-50%)}.devui-tag .remove-button i{vertical-align:0}.devui-select{position:relative;width:100%}.devui-select__selection:hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-select--open .devui-select__selection:not(.devui-select__selection--error),.devui-select--focus .devui-select__selection:not(.devui-select__selection--error){border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--open .devui-select__selection:not(.devui-select__selection--error):hover,.devui-select--focus .devui-select__selection:not(.devui-select__selection--error):hover{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--underlined{border-bottom:1px solid var(--devui-form-control-line, #d7d8da);transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-select--underlined:not([disabled]):not(.disabled):hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-select--underlined:not([disabled]):not(.disabled).devui-select--open{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select--underlined .devui-select__input,.devui-select--underlined .devui-select__selection{border:none}.devui-select--disabled,.devui-select--disabled .devui-select__input,.devui-select--disabled .devui-select__selection{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8)}.devui-select--disabled .devui-select__arrow{cursor:not-allowed;color:var(--devui-disabled-text, #adb0b8)}.devui-select--open .devui-select__arrow{transform:rotate(180deg)}.devui-dropdown-menu-multiple .devui-select__item.active{color:var(--devui-list-item-active-text, #252b3a);background-color:transparent}.devui-select__selection{display:flex;align-items:center;position:relative;cursor:pointer;border:1px solid var(--devui-form-control-line, #d7d8da);border-radius:var(--devui-border-radius, 4px);background-color:var(--devui-form-control-bg, #ffffff);color:var(--devui-text, #252b3a)}.devui-select__selection--error{border-color:var(--devui-danger-line, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}.devui-select__selection--error:hover{border-color:var(--devui-danger-line, #f66f6a)}.devui-select__multiple{display:flex;align-items:center;flex-wrap:wrap;cursor:pointer}.devui-select__multiple .devui-select__multiple--input{display:flex;max-width:100%;min-width:15px}.devui-select__input{cursor:pointer;width:100%;height:26px;padding:4px 28px 4px 10px;color:var(--devui-text, #252b3a);vertical-align:middle;outline:none;background:none;box-sizing:border-box;border:none;transition:border-color .3s cubic-bezier(.645,.045,.355,1)}.devui-select__input:not([disabled]):not(.disabled):hover{border-color:var(--devui-form-control-line-hover, #575d6c)}.devui-select__input:not([disabled]):not(.disabled):focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-select__input[disabled]:hover,.devui-select__input.disabled:hover{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);border-color:var(--devui-disabled-line, #dfe1e6);color:var(--devui-disabled-text, #adb0b8)}.devui-select__input.devui-select__input--lg{height:42px}.devui-select__input.devui-select__input--sm{height:22px}.devui-select__clearable:hover .devui-select__clear{display:inline-flex}.devui-select__clearable:hover .devui-select__arrow{display:none}.devui-select__clear,.devui-select__arrow{position:absolute;right:0;height:100%;width:28px;display:inline-flex;justify-content:center;align-items:center}.devui-select__clear{display:none}.devui-select__clear:hover{color:var(--devui-icon-fill-active, #252b3a)}.devui-select__clear--feedback{right:28px}.devui-select__arrow{transform:rotate(0);transition:transform .25s ease-out}.devui-select__arrow--feedback{right:28px}.devui-select__dropdown{position:absolute;width:calc(100% - 2px);overflow:auto;top:100%;left:0;margin:5px 0;border-radius:var(--devui-border-radius, 4px);background:var(--devui-base-bg, #ffffff);box-shadow:0 2px 5px 0 var(--devui-shadow, rgba(37, 43, 58, .2));z-index:999}.devui-select__dropdown-list{max-height:300px;width:100%;overflow-y:auto;padding:0;margin:0}.devui-select__item{font-size:var(--devui-font-size, 12px);display:block;min-height:36px;line-height:1.5;width:100%;padding:10px;clear:both;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border:0;color:var(--devui-text, #252b3a);box-sizing:border-box;cursor:pointer}.devui-select__item:hover:not(.active):not(.disabled){color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-select__item.active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-select__item.disabled{cursor:not-allowed;background-color:var(--devui-disabled-bg, #f5f5f5);color:var(--devui-disabled-text, #adb0b8)}.devui-scrollbar::-webkit-scrollbar{width:8px;height:8px}.devui-scrollbar::-webkit-scrollbar-corner{background-color:transparent}.devui-scrollbar::-webkit-scrollbar-thumb{border-radius:8px;background-color:var(--devui-line, #adb0b8)}.devui-scrollbar::-webkit-scrollbar-track{background-color:transparent}.fade-enter-active,.fade-leave-active{transform:scale3d(0,1,0,.9999) translate3d(0,1,0,0);transform-origin:0 0%;opacity:1;transition:transform,opacity .25s ease-out}.fade-enter-from,.fade-leave-to{transform:scale3d(0,1,0,0) translate3d(0,1,0,-4px);opacity:0;transition:transform,opacity .25s ease-in}.devui-select__dropdown--empty{text-align:center;font-size:var(--devui-font-size, 12px);color:var(--devui-disabled-text, #adb0b8)}
@@ -1,4 +1,4 @@
1
- import { defineComponent, ref, onMounted, computed, createVNode } from "vue";
1
+ import { ref, watch, onMounted, defineComponent, computed, createVNode } from "vue";
2
2
  const sliderProps = {
3
3
  disabled: {
4
4
  type: Boolean,
@@ -16,21 +16,13 @@ const sliderProps = {
16
16
  type: Number,
17
17
  default: 0
18
18
  },
19
- showInput: {
20
- type: Boolean,
21
- default: false
22
- },
23
19
  step: {
24
20
  type: Number,
25
21
  default: 1
26
22
  },
27
23
  tipsRenderer: {
28
- type: String,
29
- default: ""
30
- },
31
- color: {
32
- type: String,
33
- default: ""
24
+ type: [Function, null],
25
+ default: () => (value) => `${value}`
34
26
  }
35
27
  };
36
28
  function createBem(namespace, element, modifier) {
@@ -56,140 +48,118 @@ function useNamespace(block, needDot = false) {
56
48
  em
57
49
  };
58
50
  }
59
- var slider = "";
60
- var Slider = defineComponent({
61
- name: "DSlider",
62
- props: sliderProps,
63
- emits: ["update:modelValue"],
64
- setup(props, ctx) {
65
- let isClick = true;
66
- let startPosition = 0;
67
- let startX = 0;
68
- const ns = useNamespace("slider");
69
- const popoverShow = ref(false);
70
- const sliderRunway = ref(null);
71
- const inputValue = ref(props.modelValue);
72
- const currentPosition = ref(0);
73
- const newPostion = ref(0);
74
- const percentDispaly = ref("");
75
- function handleOnInput(event) {
76
- inputValue.value = parseInt(event.target.value);
77
- if (!inputValue.value) {
78
- inputValue.value = props.min;
79
- percentDispaly.value = "0%";
80
- } else {
81
- if (inputValue.value < props.min || inputValue.value > props.max) {
82
- return;
83
- }
84
- const re = /^(?:[1-9]?\d|100)$/;
85
- if (re.test(`${inputValue.value}`)) {
86
- percentDispaly.value = (inputValue.value - props.min) * 100 / (props.max - props.min) + "%";
87
- ctx.emit("update:modelValue", inputValue.value);
88
- }
89
- }
90
- }
91
- function setPostion(newPosition) {
92
- const clientWidth = !!sliderRunway.value ? sliderRunway.value.clientWidth : 0;
93
- const sliderWidth = Math.round(clientWidth);
94
- if (newPosition < 0) {
95
- newPosition = 0;
96
- }
97
- const LengthPerStep = sliderWidth / ((props.max - props.min) / props.step);
98
- const steps = Math.round(newPosition / LengthPerStep);
99
- const value = steps * LengthPerStep;
100
- if (Math.round(value) >= sliderWidth) {
101
- currentPosition.value = sliderWidth;
102
- inputValue.value = props.max;
103
- percentDispaly.value = "100%";
104
- ctx.emit("update:modelValue", props.max);
105
- return;
106
- }
107
- percentDispaly.value = Math.round(value * 100 / sliderWidth) + "%";
108
- inputValue.value = Math.round(value * (props.max - props.min) / sliderWidth) + props.min;
109
- currentPosition.value = newPosition;
110
- ctx.emit("update:modelValue", inputValue.value);
111
- }
112
- function dragStart(event) {
113
- isClick = false;
114
- startX = event.clientX;
115
- startPosition = currentPosition.value;
116
- newPostion.value = startPosition;
117
- }
118
- function onDragging(event) {
119
- popoverShow.value = true;
120
- const currentX = event.clientX;
121
- const pxOffset = currentX - startX;
122
- newPostion.value = startPosition + pxOffset;
123
- setPostion(newPostion.value);
124
- }
125
- function onDragEnd() {
126
- popoverShow.value = false;
127
- setTimeout(() => {
128
- isClick = true;
129
- }, 100);
130
- window.removeEventListener("mousemove", onDragging);
131
- window.removeEventListener("mouseup", onDragEnd);
51
+ const isFunction = (value) => Object.prototype.toString.call(value) === "[object Function]";
52
+ function useSliderEvent(props, ctx) {
53
+ let isClick = true;
54
+ let startPosition = 0;
55
+ let startX = 0;
56
+ const sliderRunway = ref();
57
+ const currentValue = ref(Number(props.modelValue));
58
+ const currentPosition = ref(0);
59
+ const percentDisplay = ref("");
60
+ const popoverShow = ref(false);
61
+ const newPosition = ref(0);
62
+ function getSliderWidth() {
63
+ var _a;
64
+ return Boolean(sliderRunway.value) ? ((_a = sliderRunway.value) == null ? void 0 : _a.clientWidth) || 0 : 0;
65
+ }
66
+ function initCurrentPosition() {
67
+ const sliderWidth = getSliderWidth();
68
+ currentPosition.value = sliderWidth * (currentValue.value - props.min) / (props.max - props.min);
69
+ }
70
+ function setPosition(position) {
71
+ const clientWidth = getSliderWidth();
72
+ const sliderWidth = Math.round(clientWidth);
73
+ if (position < 0) {
74
+ position = 0;
132
75
  }
133
- const renderShowInput = () => {
134
- return props.showInput ? createVNode("div", {
135
- "class": ns.e("input-wrap")
136
- }, [createVNode("input", {
137
- "onInput": handleOnInput,
138
- "value": inputValue.value + "",
139
- "disabled": props.disabled
140
- }, null)]) : "";
141
- };
142
- if (props.modelValue > props.max) {
143
- percentDispaly.value = "100%";
144
- } else if (props.modelValue < props.min) {
145
- percentDispaly.value = "0%";
146
- } else {
147
- percentDispaly.value = (props.modelValue - props.min) * 100 / (props.max - props.min) + "%";
76
+ const LengthPerStep = sliderWidth / ((props.max - props.min) / props.step);
77
+ const steps = Math.round(position / LengthPerStep);
78
+ const value = steps * LengthPerStep;
79
+ if (Math.round(value) >= sliderWidth) {
80
+ currentPosition.value = sliderWidth;
81
+ currentValue.value = props.max;
82
+ percentDisplay.value = "100%";
83
+ ctx.emit("update:modelValue", props.max);
84
+ return;
148
85
  }
149
- onMounted(() => {
150
- const sliderWidth = !!sliderRunway.value ? sliderRunway.value.clientWidth : 0;
151
- currentPosition.value = sliderWidth * (inputValue.value - props.min) / (props.max - props.min);
152
- });
153
- function handleButtonMousedown(event) {
154
- popoverShow.value = true;
155
- if (props.disabled) {
156
- return;
157
- }
86
+ percentDisplay.value = Math.round(value * 100 / sliderWidth) + "%";
87
+ currentValue.value = Math.round(value * (props.max - props.min) / sliderWidth) + props.min;
88
+ currentPosition.value = position;
89
+ ctx.emit("update:modelValue", currentValue.value);
90
+ }
91
+ function dragStart(event) {
92
+ isClick = false;
93
+ startX = event.clientX;
94
+ startPosition = currentPosition.value;
95
+ newPosition.value = startPosition;
96
+ }
97
+ function onDragging(event) {
98
+ popoverShow.value = true;
99
+ const currentX = event.clientX;
100
+ const pxOffset = currentX - startX;
101
+ newPosition.value = startPosition + pxOffset;
102
+ setPosition(newPosition.value);
103
+ }
104
+ function onDragEnd() {
105
+ popoverShow.value = false;
106
+ setTimeout(() => {
107
+ isClick = true;
108
+ }, 100);
109
+ window.removeEventListener("mousemove", onDragging);
110
+ window.removeEventListener("mouseup", onDragEnd);
111
+ }
112
+ function handleButtonMousedown(event) {
113
+ popoverShow.value = true;
114
+ if (!props.disabled) {
158
115
  event.preventDefault();
159
116
  dragStart(event);
160
117
  window.addEventListener("mousemove", onDragging);
161
118
  window.addEventListener("mouseup", onDragEnd);
162
119
  }
163
- function handleRunwayMousedown(event) {
164
- if (!props.disabled && isClick) {
165
- const _e = event.target;
166
- startX = _e.getBoundingClientRect().left;
167
- const currentX = event.clientX;
168
- setPostion(currentX - startX);
169
- handleButtonMousedown(event);
170
- } else {
171
- return;
172
- }
120
+ }
121
+ function handleRunwayMousedown(event) {
122
+ if (!props.disabled && isClick) {
123
+ const _e = event.target;
124
+ startX = _e.getBoundingClientRect().left;
125
+ const currentX = event.clientX;
126
+ setPosition(currentX - startX);
127
+ handleButtonMousedown(event);
128
+ }
129
+ }
130
+ watch(() => props.modelValue, () => {
131
+ currentValue.value = Number(props.modelValue);
132
+ if (currentValue.value > props.max) {
133
+ percentDisplay.value = "100%";
134
+ } else if (currentValue.value < props.min) {
135
+ percentDisplay.value = "0%";
136
+ } else {
137
+ percentDisplay.value = (currentValue.value - props.min) * 100 / (props.max - props.min) + "%";
173
138
  }
139
+ initCurrentPosition();
140
+ }, { immediate: true });
141
+ onMounted(initCurrentPosition);
142
+ return { sliderRunway, popoverShow, percentDisplay, currentValue, handleRunwayMousedown, handleButtonMousedown };
143
+ }
144
+ var slider = "";
145
+ var Slider = defineComponent({
146
+ name: "DSlider",
147
+ props: sliderProps,
148
+ emits: ["update:modelValue"],
149
+ setup(props, ctx) {
150
+ const ns = useNamespace("slider");
151
+ const {
152
+ sliderRunway,
153
+ popoverShow,
154
+ percentDisplay,
155
+ currentValue,
156
+ handleRunwayMousedown,
157
+ handleButtonMousedown
158
+ } = useSliderEvent(props, ctx);
174
159
  const disableClass = computed(() => {
175
160
  return props.disabled ? " disabled" : "";
176
161
  });
177
- const popover = () => {
178
- return createVNode("div", {
179
- "class": ns.e("popover"),
180
- "style": {
181
- left: percentDispaly.value,
182
- opacity: popoverShow.value ? 1 : 0
183
- }
184
- }, [createVNode("div", {
185
- "class": ns.e("popover-arrow")
186
- }, null), createVNode("div", {
187
- "class": ns.e("popover-content")
188
- }, [inputValue.value + " " + props.tipsRenderer])]);
189
- };
190
- const color = computed(() => {
191
- return props.disabled ? "" : props.color;
192
- });
162
+ const tipsContent = computed(() => isFunction(props.tipsRenderer) ? props.tipsRenderer(currentValue.value) : "");
193
163
  return () => createVNode("div", {
194
164
  "class": ns.b()
195
165
  }, [createVNode("div", {
@@ -200,23 +170,26 @@ var Slider = defineComponent({
200
170
  }, [createVNode("div", {
201
171
  "class": [ns.e("bar"), disableClass.value],
202
172
  "style": {
203
- width: percentDispaly.value,
204
- backgroundColor: color.value
173
+ width: percentDisplay.value
205
174
  }
206
175
  }, null), createVNode("div", {
207
176
  "class": [ns.e("button"), disableClass.value],
208
177
  "style": {
209
- left: percentDispaly.value,
210
- borderColor: color.value
178
+ left: percentDisplay.value
211
179
  },
212
180
  "onMousedown": handleButtonMousedown,
213
181
  "onMouseenter": () => popoverShow.value = true,
214
182
  "onMouseout": () => popoverShow.value = false
215
- }, null), props.tipsRenderer === "null" ? "" : popover()]), createVNode("span", {
216
- "class": ns.e("min-count")
217
- }, [props.min]), createVNode("span", {
218
- "class": ns.e("max-count")
219
- }, [props.max]), renderShowInput()]);
183
+ }, null), props.tipsRenderer === null ? null : popoverShow.value ? createVNode("div", {
184
+ "class": ns.e("popover"),
185
+ "style": {
186
+ left: percentDisplay.value
187
+ }
188
+ }, [createVNode("div", {
189
+ "class": ns.e("popover-arrow")
190
+ }, null), createVNode("div", {
191
+ "class": ns.e("popover-content")
192
+ }, [tipsContent.value])]) : null])]);
220
193
  }
221
194
  });
222
195
  var index = {
@@ -1 +1 @@
1
- (function(i,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(i=typeof globalThis!="undefined"?globalThis:i||self,t(i.index={},i.Vue))})(this,function(i,t){"use strict";const g={disabled:{type:Boolean,default:!1},max:{type:Number,default:100},min:{type:Number,default:0},modelValue:{type:Number,default:0},showInput:{type:Boolean,default:!1},step:{type:Number,default:1},tipsRenderer:{type:String,default:""},color:{type:String,default:""}};function v(e,r,u){let c=e;return r&&(c+=`__${r}`),u&&(c+=`--${u}`),c}function D(e,r=!1){const u=r?`.devui-${e}`:`devui-${e}`;return{b:()=>v(u),e:l=>l?v(u,l):"",m:l=>l?v(u,"",l):"",em:(l,a)=>l&&a?v(u,l,a):""}}var P="",b=t.defineComponent({name:"DSlider",props:g,emits:["update:modelValue"],setup(e,r){let u=!0,c=0,f=0;const d=D("slider"),m=t.ref(!1),l=t.ref(null),a=t.ref(e.modelValue),h=t.ref(0),y=t.ref(0),o=t.ref("");function R(n){if(a.value=parseInt(n.target.value),!a.value)a.value=e.min,o.value="0%";else{if(a.value<e.min||a.value>e.max)return;/^(?:[1-9]?\d|100)$/.test(`${a.value}`)&&(o.value=(a.value-e.min)*100/(e.max-e.min)+"%",r.emit("update:modelValue",a.value))}}function M(n){const V=l.value?l.value.clientWidth:0,s=Math.round(V);n<0&&(n=0);const C=s/((e.max-e.min)/e.step),N=Math.round(n/C)*C;if(Math.round(N)>=s){h.value=s,a.value=e.max,o.value="100%",r.emit("update:modelValue",e.max);return}o.value=Math.round(N*100/s)+"%",a.value=Math.round(N*(e.max-e.min)/s)+e.min,h.value=n,r.emit("update:modelValue",a.value)}function _(n){u=!1,f=n.clientX,c=h.value,y.value=c}function x(n){m.value=!0;const s=n.clientX-f;y.value=c+s,M(y.value)}function S(){m.value=!1,setTimeout(()=>{u=!0},100),window.removeEventListener("mousemove",x),window.removeEventListener("mouseup",S)}const $=()=>e.showInput?t.createVNode("div",{class:d.e("input-wrap")},[t.createVNode("input",{onInput:R,value:a.value+"",disabled:e.disabled},null)]):"";e.modelValue>e.max?o.value="100%":e.modelValue<e.min?o.value="0%":o.value=(e.modelValue-e.min)*100/(e.max-e.min)+"%",t.onMounted(()=>{const n=l.value?l.value.clientWidth:0;h.value=n*(a.value-e.min)/(e.max-e.min)});function E(n){m.value=!0,!e.disabled&&(n.preventDefault(),_(n),window.addEventListener("mousemove",x),window.addEventListener("mouseup",S))}function B(n){if(!e.disabled&&u){f=n.target.getBoundingClientRect().left;const s=n.clientX;M(s-f),E(n)}else return}const w=t.computed(()=>e.disabled?" disabled":""),L=()=>t.createVNode("div",{class:d.e("popover"),style:{left:o.value,opacity:m.value?1:0}},[t.createVNode("div",{class:d.e("popover-arrow")},null),t.createVNode("div",{class:d.e("popover-content")},[a.value+" "+e.tipsRenderer])]),X=t.computed(()=>e.disabled?"":e.color);return()=>t.createVNode("div",{class:d.b()},[t.createVNode("div",{ref:l,class:[d.e("runway"),w.value],onMousedown:B,onMouseout:()=>m.value=!1},[t.createVNode("div",{class:[d.e("bar"),w.value],style:{width:o.value,backgroundColor:X.value}},null),t.createVNode("div",{class:[d.e("button"),w.value],style:{left:o.value,borderColor:X.value},onMousedown:E,onMouseenter:()=>m.value=!0,onMouseout:()=>m.value=!1},null),e.tipsRenderer==="null"?"":L()]),t.createVNode("span",{class:d.e("min-count")},[e.min]),t.createVNode("span",{class:d.e("max-count")},[e.max]),$()])}}),I={title:"Slider \u6ED1\u5757",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(e){e.component(b.name,b)}};i.Slider=b,i.default=I,i.sliderProps=g,Object.defineProperty(i,"__esModule",{value:!0}),i[Symbol.toStringTag]="Module"});
1
+ (function(i,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(i=typeof globalThis!="undefined"?globalThis:i||self,t(i.index={},i.Vue))})(this,function(i,t){"use strict";const M={disabled:{type:Boolean,default:!1},max:{type:Number,default:100},min:{type:Number,default:0},modelValue:{type:Number,default:0},step:{type:Number,default:1},tipsRenderer:{type:[Function,null],default:()=>e=>`${e}`}};function w(e,r,u){let d=e;return r&&(d+=`__${r}`),u&&(d+=`--${u}`),d}function E(e,r=!1){const u=r?`.devui-${e}`:`devui-${e}`;return{b:()=>w(u),e:l=>l?w(u,l):"",m:l=>l?w(u,"",l):"",em:(l,o)=>l&&o?w(u,l,o):""}}const D=e=>Object.prototype.toString.call(e)==="[object Function]";function X(e,r){let u=!0,d=0,s=0;const f=t.ref(),a=t.ref(Number(e.modelValue)),l=t.ref(0),o=t.ref(""),m=t.ref(!1),v=t.ref(0);function V(){var n;return Boolean(f.value)&&((n=f.value)==null?void 0:n.clientWidth)||0}function N(){const n=V();l.value=n*(a.value-e.min)/(e.max-e.min)}function g(n){const y=V(),c=Math.round(y);n<0&&(n=0);const R=c/((e.max-e.min)/e.step),b=Math.round(n/R)*R;if(Math.round(b)>=c){l.value=c,a.value=e.max,o.value="100%",r.emit("update:modelValue",e.max);return}o.value=Math.round(b*100/c)+"%",a.value=Math.round(b*(e.max-e.min)/c)+e.min,l.value=n,r.emit("update:modelValue",a.value)}function C(n){u=!1,s=n.clientX,d=l.value,v.value=d}function S(n){m.value=!0;const c=n.clientX-s;v.value=d+c,g(v.value)}function x(){m.value=!1,setTimeout(()=>{u=!0},100),window.removeEventListener("mousemove",S),window.removeEventListener("mouseup",x)}function P(n){m.value=!0,e.disabled||(n.preventDefault(),C(n),window.addEventListener("mousemove",S),window.addEventListener("mouseup",x))}function _(n){if(!e.disabled&&u){s=n.target.getBoundingClientRect().left;const c=n.clientX;g(c-s),P(n)}}return t.watch(()=>e.modelValue,()=>{a.value=Number(e.modelValue),a.value>e.max?o.value="100%":a.value<e.min?o.value="0%":o.value=(a.value-e.min)*100/(e.max-e.min)+"%",N()},{immediate:!0}),t.onMounted(N),{sliderRunway:f,popoverShow:m,percentDisplay:o,currentValue:a,handleRunwayMousedown:_,handleButtonMousedown:P}}var L="",h=t.defineComponent({name:"DSlider",props:M,emits:["update:modelValue"],setup(e,r){const u=E("slider"),{sliderRunway:d,popoverShow:s,percentDisplay:f,currentValue:a,handleRunwayMousedown:l,handleButtonMousedown:o}=X(e,r),m=t.computed(()=>e.disabled?" disabled":""),v=t.computed(()=>D(e.tipsRenderer)?e.tipsRenderer(a.value):"");return()=>t.createVNode("div",{class:u.b()},[t.createVNode("div",{ref:d,class:[u.e("runway"),m.value],onMousedown:l,onMouseout:()=>s.value=!1},[t.createVNode("div",{class:[u.e("bar"),m.value],style:{width:f.value}},null),t.createVNode("div",{class:[u.e("button"),m.value],style:{left:f.value},onMousedown:o,onMouseenter:()=>s.value=!0,onMouseout:()=>s.value=!1},null),e.tipsRenderer===null?null:s.value?t.createVNode("div",{class:u.e("popover"),style:{left:f.value}},[t.createVNode("div",{class:u.e("popover-arrow")},null),t.createVNode("div",{class:u.e("popover-content")},[v.value])]):null])])}}),B={title:"Slider \u6ED1\u5757",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(e){e.component(h.name,h)}};i.Slider=h,i.default=B,i.sliderProps=M,Object.defineProperty(i,"__esModule",{value:!0}),i[Symbol.toStringTag]="Module"});
package/slider/style.css CHANGED
@@ -1 +1 @@
1
- .devui-slider{position:relative;width:90%;display:block}.devui-slider.disabled{cursor:not-allowed;background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway{position:relative;width:100%;padding:4px 0;margin:4px 0;cursor:pointer;box-sizing:border-box;height:5px;display:flex;align-items:center;background-color:var(--devui-default-bg, #f7f8fa)}.devui-slider__runway.disabled{cursor:not-allowed}.devui-slider__runway .devui-slider__bar{height:6px;background-color:var(--devui-default-line, #5e7ce0);border-top-left-radius:var(--devui-border-radius, 4px);border-bottom-left-radius:var(--devui-border-radius, 4px);position:absolute}.devui-slider__runway .devui-slider__bar.disabled{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__bar.disabled:hover{cursor:not-allowed}.devui-slider__runway .devui-slider__button{position:absolute;width:14px;height:14px;border:2px solid var(--devui-default-line, #5e7ce0);background-color:var(--devui-base-bg, #ffffff);border-radius:50%;margin-left:-7px;transition:transform .2s ease-in-out}.devui-slider__runway .devui-slider__button:hover{transform:scale(1.2)}.devui-slider__runway .devui-slider__button.disabled{background-color:var(--devui-base-bg, #ffffff);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__button.disabled:hover{cursor:not-allowed;transform:none}.devui-slider__runway .devui-slider__popover{position:relative;bottom:26px;transform:translate(-50%);border-radius:var(--devui-border-radius-feedback, 4px);font-size:var(--devui-font-size-sm, 12px);color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-slider__runway .devui-slider__popover .devui-slider__popover-arrow{position:absolute;left:50%;margin-left:-4px;bottom:-4px;width:8px;height:8px;transform:rotate(45deg);display:block;z-index:-1;background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider__runway .devui-slider__popover .devui-slider__popover-content{padding:5px 14px;text-align:center;border-radius:var(--devui-border-radius-feedback, 4px);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider .devui-slider__min-count{position:absolute;top:15px;left:0;font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a)}.devui-slider .devui-slider__max-count{position:absolute;top:15px;right:0;font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a)}.devui-slider .devui-slider__input-wrap{font-size:var(--devui-font-size, 14px);position:absolute;right:-60px;top:-12px;padding:5px 10px;cursor:text;margin-left:20px}.devui-slider .devui-slider__input-wrap input{width:40px;text-align:center}
1
+ .devui-slider{position:relative;width:100%;display:block}.devui-slider.disabled{cursor:not-allowed;background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway{position:relative;width:100%;padding:4px 0;margin:4px 0;cursor:pointer;box-sizing:border-box;height:5px;display:flex;align-items:center;border-radius:var(--devui-border-radius-full, 100px);background-color:var(--devui-area, #f8f8f8)}.devui-slider__runway.disabled{background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.devui-slider__runway:hover .devui-slider__bar:not(.disabled){background-color:var(--devui-brand-hover, #7693f5)}.devui-slider__runway .devui-slider__bar{height:6px;background-color:var(--devui-brand, #5e7ce0);border-top-left-radius:var(--devui-border-radius-full, 100px);border-bottom-left-radius:var(--devui-border-radius-full, 100px);position:absolute}.devui-slider__runway .devui-slider__bar.disabled{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__bar.disabled:hover{cursor:not-allowed}.devui-slider__runway .devui-slider__button{position:absolute;width:14px;height:14px;border:2px solid var(--devui-brand, #5e7ce0);background-color:var(--devui-base-bg, #ffffff);border-radius:50%;margin-left:-7px;transition:transform .2s ease-in-out}.devui-slider__runway .devui-slider__button:hover:not(.disabled){border-color:var(--devui-brand-hover, #7693f5);transform:scale(1.3)}.devui-slider__runway .devui-slider__button.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__button.disabled{cursor:not-allowed}.devui-slider__runway .devui-slider__popover{position:relative;bottom:26px;transform:translate(-50%);border-radius:var(--devui-border-radius-feedback, 4px);font-size:var(--devui-font-size-sm, 12px);color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-slider__runway .devui-slider__popover .devui-slider__popover-arrow{position:absolute;left:50%;margin-left:-4px;bottom:-4px;width:8px;height:8px;transform:rotate(45deg);display:block;z-index:-1;background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider__runway .devui-slider__popover .devui-slider__popover-content{padding:5px 14px;text-align:center;border-radius:var(--devui-border-radius-feedback, 4px);background-color:var(--devui-feedback-overlay-bg, #464d6e)}
@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
4
4
  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
5
  return value;
6
6
  };
7
- import { defineComponent, ref, computed, onMounted, watch, createVNode, mergeProps, createTextVNode } from "vue";
7
+ import { defineComponent, ref, computed, onMounted, watch, createVNode, createTextVNode } from "vue";
8
8
  const statisticProps = {
9
9
  title: {
10
10
  type: String,
@@ -26,9 +26,6 @@ const statisticProps = {
26
26
  type: String,
27
27
  default: ""
28
28
  },
29
- valueStyle: {
30
- type: Object
31
- },
32
29
  animationDuration: {
33
30
  type: Number,
34
31
  default: 2e3
@@ -179,15 +176,38 @@ class Tween {
179
176
  this.timer = null;
180
177
  }
181
178
  }
179
+ function createBem(namespace, element, modifier) {
180
+ let cls = namespace;
181
+ if (element) {
182
+ cls += `__${element}`;
183
+ }
184
+ if (modifier) {
185
+ cls += `--${modifier}`;
186
+ }
187
+ return cls;
188
+ }
189
+ function useNamespace(block, needDot = false) {
190
+ const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
191
+ const b = () => createBem(namespace);
192
+ const e = (element) => element ? createBem(namespace, element) : "";
193
+ const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
194
+ const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
195
+ return {
196
+ b,
197
+ e,
198
+ m,
199
+ em
200
+ };
201
+ }
182
202
  var statistic = "";
183
203
  var Statistic = defineComponent({
184
204
  name: "DStatistic",
185
- inheritAttrs: false,
186
205
  props: statisticProps,
187
206
  setup(props, ctx) {
188
207
  var _a;
189
208
  const innerValue = ref((_a = props.valueFrom) != null ? _a : props.value);
190
209
  const tween = ref(null);
210
+ const ns = useNamespace("statistic");
191
211
  const animation = (from = ((_b) => (_b = props.valueFrom) != null ? _b : 0)(), to = typeof props.value === "number" ? props.value : Number(props.value)) => {
192
212
  if (from !== to) {
193
213
  tween.value = new Tween({
@@ -225,22 +245,20 @@ var Statistic = defineComponent({
225
245
  });
226
246
  return () => {
227
247
  var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
228
- return createVNode("div", mergeProps({
229
- "class": "devui-statistic"
230
- }, ctx.attrs), [createVNode("div", {
231
- "class": "devui-statistic-title",
232
- "style": props.titleStyle
248
+ return createVNode("div", {
249
+ "class": ns.b()
250
+ }, [createVNode("div", {
251
+ "class": ns.e("title")
233
252
  }, [((_b = (_a2 = ctx.slots).title) == null ? void 0 : _b.call(_a2)) || props.title]), createVNode("div", {
234
- "class": "devui-statistic-content",
235
- "style": props.valueStyle
253
+ "class": ns.e("content")
236
254
  }, [props.prefix || ((_d = (_c = ctx.slots).prefix) == null ? void 0 : _d.call(_c)) ? createVNode("span", {
237
- "class": "devui-statistic-prefix"
255
+ "class": ns.e("prefix")
238
256
  }, [((_f = (_e = ctx.slots).prefix) == null ? void 0 : _f.call(_e)) || props.prefix]) : null, createVNode("span", {
239
- "class": "devui-statistic--value"
257
+ "class": ns.e("value")
240
258
  }, [statisticValue.value]), props.suffix || ((_h = (_g = ctx.slots).suffix) == null ? void 0 : _h.call(_g)) ? createVNode("span", {
241
- "class": "devui-statistic-suffix"
259
+ "class": ns.e("suffix")
242
260
  }, [((_j = (_i = ctx.slots).suffix) == null ? void 0 : _j.call(_i)) || props.suffix]) : null]), props.extra || ((_l = (_k = ctx.slots).extra) == null ? void 0 : _l.call(_k)) ? createVNode("div", {
243
- "class": "devui-statistic-extra"
261
+ "class": ns.e("extra")
244
262
  }, [createTextVNode(" "), ((_n = (_m = ctx.slots).extra) == null ? void 0 : _n.call(_m)) || props.extra]) : null]);
245
263
  };
246
264
  }
@@ -1 +1 @@
1
- var q=Object.defineProperty;var j=(s,i,d)=>i in s?q(s,i,{enumerable:!0,configurable:!0,writable:!0,value:d}):s[i]=d;var a=(s,i,d)=>(j(s,typeof i!="symbol"?i+"":i,d),d);(function(s,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(s=typeof globalThis!="undefined"?globalThis:s||self,i(s.index={},s.Vue))})(this,function(s,i){"use strict";const d={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},valueStyle:{type:Object},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!0},extra:{type:String,default:""}},m=(t,e)=>t.replace(/\d+/,function(n){return n.replace(/(\d)(?=(\d{3})+$)/g,function(f){return f+`${e}`})}),E=t=>isNaN(t)?!1:(t+"").indexOf(".")!==-1,A=(t,e,r,n)=>{const f=(e==null?void 0:e.toString().indexOf("."))!==-1?(e==null?void 0:e.toString().length)-(e==null?void 0:e.toString().indexOf("."))-1:0;return typeof t=="number"?E(t)?m(n?t.toFixed(n).toString():t.toFixed(f).toString(),r):m(n?t.toFixed(n).toString():t.toString(),r):t},c=Math.pow,v=Math.sqrt;var I={easeOutCubic:function(t){return 1-c(1-t,3)},linear:t=>t,easeOutExpo:function(t){return t===1?1:1-c(2,-10*t)},easeInOutExpo:function(t){return t===0?0:t===1?1:t<.5?c(2,20*t-10)/2:(2-c(2,-20*t+10))/2},easeInExpo:function(t){return t===0?0:c(2,10*t-10)},easeInOutCirc:function(t){return t<.5?(1-v(1-c(2*t,2)))/2:(v(1-c(-2*t+2,2))+1)/2}};class M{constructor(e){a(this,"from");a(this,"to");a(this,"duration");a(this,"delay");a(this,"easing");a(this,"onStart");a(this,"onUpdate");a(this,"onFinish");a(this,"startTime");a(this,"started");a(this,"finished");a(this,"timer");a(this,"time");a(this,"elapsed");a(this,"keys");const{from:r,to:n,duration:f,delay:g,easing:y,onStart:u,onUpdate:l,onFinish:h}=e;for(const o in r)n[o]===void 0&&(n[o]=r[o]);for(const o in n)r[o]===void 0&&(r[o]=n[o]);this.from=r,this.to=n,this.duration=f,this.delay=g,this.easing=y,this.onStart=u,this.onUpdate=l,this.onFinish=h,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const e in this.to)this.keys[e]=this.from[e]+(this.to[e]-this.from[e])*I[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const e=()=>{this.update(),this.timer=requestAnimationFrame(e),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};e()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}var G="",S=i.defineComponent({name:"DStatistic",inheritAttrs:!1,props:d,setup(t,e){var y;const r=i.ref((y=t.valueFrom)!=null?y:t.value),n=i.ref(null),f=(u=(h=>(h=t.valueFrom)!=null?h:0)(),l=typeof t.value=="number"?t.value:Number(t.value))=>{u!==l&&(n.value=new M({from:{value:u},to:{value:l},delay:0,duration:t.animationDuration,easing:"easeOutCubic",onUpdate:o=>{r.value=o.value},onFinish:()=>{r.value=l}}),n.value.start())},g=i.computed(()=>A(r.value,t.value,t.groupSeparator,t.precision));return i.onMounted(()=>{t.animation&&t.start&&f()}),i.watch(()=>t.start,u=>{u&&!n.value&&f()}),()=>{var u,l,h,o,x,F,O,N,b,T,k,w,C,D;return i.createVNode("div",i.mergeProps({class:"devui-statistic"},e.attrs),[i.createVNode("div",{class:"devui-statistic-title",style:t.titleStyle},[((l=(u=e.slots).title)==null?void 0:l.call(u))||t.title]),i.createVNode("div",{class:"devui-statistic-content",style:t.valueStyle},[t.prefix||((o=(h=e.slots).prefix)==null?void 0:o.call(h))?i.createVNode("span",{class:"devui-statistic-prefix"},[((F=(x=e.slots).prefix)==null?void 0:F.call(x))||t.prefix]):null,i.createVNode("span",{class:"devui-statistic--value"},[g.value]),t.suffix||((N=(O=e.slots).suffix)==null?void 0:N.call(O))?i.createVNode("span",{class:"devui-statistic-suffix"},[((T=(b=e.slots).suffix)==null?void 0:T.call(b))||t.suffix]):null]),t.extra||((w=(k=e.slots).extra)==null?void 0:w.call(k))?i.createVNode("div",{class:"devui-statistic-extra"},[i.createTextVNode(" "),((D=(C=e.slots).extra)==null?void 0:D.call(C))||t.extra]):null])}}}),U={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.component(S.name,S)}};s.Statistic=S,s.default=U,s.statisticProps=d,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
1
+ var _=Object.defineProperty;var j=(a,i,c)=>i in a?_(a,i,{enumerable:!0,configurable:!0,writable:!0,value:c}):a[i]=c;var r=(a,i,c)=>(j(a,typeof i!="symbol"?i+"":i,c),c);(function(a,i){typeof exports=="object"&&typeof module!="undefined"?i(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],i):(a=typeof globalThis!="undefined"?globalThis:a||self,i(a.index={},a.Vue))})(this,function(a,i){"use strict";const c={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!0},extra:{type:String,default:""}},y=(t,e)=>t.replace(/\d+/,function(s){return s.replace(/(\d)(?=(\d{3})+$)/g,function(o){return o+`${e}`})}),$=t=>isNaN(t)?!1:(t+"").indexOf(".")!==-1,A=(t,e,n,s)=>{const o=(e==null?void 0:e.toString().indexOf("."))!==-1?(e==null?void 0:e.toString().length)-(e==null?void 0:e.toString().indexOf("."))-1:0;return typeof t=="number"?$(t)?y(s?t.toFixed(s).toString():t.toFixed(o).toString(),n):y(s?t.toFixed(s).toString():t.toString(),n):t},l=Math.pow,v=Math.sqrt;var M={easeOutCubic:function(t){return 1-l(1-t,3)},linear:t=>t,easeOutExpo:function(t){return t===1?1:1-l(2,-10*t)},easeInOutExpo:function(t){return t===0?0:t===1?1:t<.5?l(2,20*t-10)/2:(2-l(2,-20*t+10))/2},easeInExpo:function(t){return t===0?0:l(2,10*t-10)},easeInOutCirc:function(t){return t<.5?(1-v(1-l(2*t,2)))/2:(v(1-l(-2*t+2,2))+1)/2}};class U{constructor(e){r(this,"from");r(this,"to");r(this,"duration");r(this,"delay");r(this,"easing");r(this,"onStart");r(this,"onUpdate");r(this,"onFinish");r(this,"startTime");r(this,"started");r(this,"finished");r(this,"timer");r(this,"time");r(this,"elapsed");r(this,"keys");const{from:n,to:s,duration:o,delay:m,easing:S,onStart:u,onUpdate:f,onFinish:h}=e;for(const d in n)s[d]===void 0&&(s[d]=n[d]);for(const d in s)n[d]===void 0&&(n[d]=s[d]);this.from=n,this.to=s,this.duration=o,this.delay=m,this.easing=S,this.onStart=u,this.onUpdate=f,this.onFinish=h,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const e in this.to)this.keys[e]=this.from[e]+(this.to[e]-this.from[e])*M[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const e=()=>{this.update(),this.timer=requestAnimationFrame(e),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};e()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}function g(t,e,n){let s=t;return e&&(s+=`__${e}`),n&&(s+=`--${n}`),s}function q(t,e=!1){const n=e?`.devui-${t}`:`devui-${t}`;return{b:()=>g(n),e:u=>u?g(n,u):"",m:u=>u?g(n,"",u):"",em:(u,f)=>u&&f?g(n,u,f):""}}var P="",F=i.defineComponent({name:"DStatistic",props:c,setup(t,e){var u;const n=i.ref((u=t.valueFrom)!=null?u:t.value),s=i.ref(null),o=q("statistic"),m=(f=(d=>(d=t.valueFrom)!=null?d:0)(),h=typeof t.value=="number"?t.value:Number(t.value))=>{f!==h&&(s.value=new U({from:{value:f},to:{value:h},delay:0,duration:t.animationDuration,easing:"easeOutCubic",onUpdate:x=>{n.value=x.value},onFinish:()=>{n.value=h}}),s.value.start())},S=i.computed(()=>A(n.value,t.value,t.groupSeparator,t.precision));return i.onMounted(()=>{t.animation&&t.start&&m()}),i.watch(()=>t.start,f=>{f&&!s.value&&m()}),()=>{var f,h,d,x,N,O,b,T,k,w,C,D,E,I;return i.createVNode("div",{class:o.b()},[i.createVNode("div",{class:o.e("title")},[((h=(f=e.slots).title)==null?void 0:h.call(f))||t.title]),i.createVNode("div",{class:o.e("content")},[t.prefix||((x=(d=e.slots).prefix)==null?void 0:x.call(d))?i.createVNode("span",{class:o.e("prefix")},[((O=(N=e.slots).prefix)==null?void 0:O.call(N))||t.prefix]):null,i.createVNode("span",{class:o.e("value")},[S.value]),t.suffix||((T=(b=e.slots).suffix)==null?void 0:T.call(b))?i.createVNode("span",{class:o.e("suffix")},[((w=(k=e.slots).suffix)==null?void 0:w.call(k))||t.suffix]):null]),t.extra||((D=(C=e.slots).extra)==null?void 0:D.call(C))?i.createVNode("div",{class:o.e("extra")},[i.createTextVNode(" "),((I=(E=e.slots).extra)==null?void 0:I.call(E))||t.extra]):null])}}}),B={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.component(F.name,F)}};a.Statistic=F,a.default=B,a.statisticProps=c,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
@@ -1 +1 @@
1
- .devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;font-size:14px}.devui-statistic-content{font-size:24px;display:flex;align-items:center}.devui-statistic-prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic-suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic--value{display:inline-block}
1
+ .devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic__title{margin-bottom:4px;font-size:14px}.devui-statistic__content{font-size:24px;display:flex;align-items:center}.devui-statistic__prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic__suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic__value{display:inline-block}
package/status/style.css CHANGED
@@ -1 +1 @@
1
- .devui-status{line-height:20px;height:20px;display:flex;align-items:center}.devui-status:before{display:inline-block;content:"";width:10px;height:10px;margin-right:5px;border-radius:100%}.devui-status.devui-status__bg--success:before{background-color:var(--devui-success, #50d4ab)}.devui-status.devui-status__bg--error:before{background-color:var(--devui-danger, #f66f6a)}.devui-status.devui-status__bg--warning:before{background-color:var(--devui-warning, #fac20a)}.devui-status.devui-status__bg--initial:before{background-color:var(--devui-initial, #e9edfa)}.devui-status.devui-status__bg--waiting:before{background-color:var(--devui-waiting, #beccfa)}.devui-status.devui-status__bg--running:before{background-color:var(--devui-info, #5e7ce0)}.devui-status.devui-status__bg--invalid:before{background-color:var(--devui-dividing-line, #f2f2f3)}
1
+ .devui-status{line-height:20px;height:20px;display:flex;align-items:center}.devui-status:before{display:inline-block;content:"";width:10px;height:10px;margin-right:5px;border-radius:100%}.devui-status.devui-status__bg--success:before{background-color:var(--devui-success, #50d4ab)}.devui-status.devui-status__bg--error:before{background-color:var(--devui-danger, #f66f6a)}.devui-status.devui-status__bg--warning:before{background-color:var(--devui-warning, #fac20a)}.devui-status.devui-status__bg--initial:before{background-color:var(--devui-initial, #e9edfa)}.devui-status.devui-status__bg--waiting:before{background-color:var(--devui-waiting, #9faad7)}.devui-status.devui-status__bg--running:before{background-color:var(--devui-info, #5e7ce0)}.devui-status.devui-status__bg--invalid:before{background-color:var(--devui-dividing-line, #f2f2f3)}