vue-devui 1.0.0-rc.10 → 1.0.0-rc.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +23 -0
- package/README.md +156 -149
- package/auto-complete/index.es.js +53 -23
- package/auto-complete/index.umd.js +15 -15
- package/auto-complete/style.css +1 -1
- package/badge/index.es.js +8 -2
- package/badge/index.umd.js +1 -1
- package/badge/style.css +1 -1
- package/button/index.es.js +5 -3
- package/button/index.umd.js +6 -6
- package/button/style.css +1 -1
- package/card/index.es.js +5 -1
- package/card/index.umd.js +1 -1
- package/card/style.css +1 -1
- package/checkbox/index.es.js +22 -14
- package/checkbox/index.umd.js +7 -7
- package/checkbox/style.css +1 -1
- package/collapse/index.es.js +20 -186
- package/collapse/index.umd.js +1 -1
- package/collapse/style.css +1 -1
- package/countdown/index.es.js +56 -13
- package/countdown/index.umd.js +1 -1
- package/{date-picker → date-picker-pro}/index.d.ts +0 -0
- package/date-picker-pro/index.es.js +10867 -0
- package/date-picker-pro/index.umd.js +27 -0
- package/date-picker-pro/package.json +7 -0
- package/date-picker-pro/style.css +1 -0
- package/dropdown/index.es.js +9 -2
- package/dropdown/index.umd.js +1 -1
- package/editable-select/index.es.js +98 -56
- package/editable-select/index.umd.js +1 -1
- package/editable-select/style.css +1 -1
- package/form/index.es.js +22 -14
- package/form/index.umd.js +11 -11
- package/icon/index.es.js +5 -3
- package/icon/index.umd.js +1 -1
- package/icon/style.css +1 -1
- package/image-preview/style.css +1 -1
- package/input/index.es.js +59 -23
- package/input/index.umd.js +7 -7
- package/input/style.css +1 -1
- package/input-number/index.es.js +1 -4
- package/input-number/index.umd.js +1 -1
- package/input-number/style.css +1 -1
- package/modal/index.es.js +5 -3
- package/modal/index.umd.js +1 -1
- package/modal/style.css +1 -1
- package/notification/index.es.js +32 -34
- package/notification/index.umd.js +1 -1
- package/notification/style.css +1 -1
- package/nuxt/components/DRangeDatePickerPro.js +3 -0
- package/nuxt/components/DatePickerPro.js +3 -0
- package/nuxt/components/OptionGroup.js +3 -0
- package/nuxt/components/Step.js +3 -0
- package/nuxt/components/Steps.js +3 -0
- package/nuxt/components/TABLE_TOKEN.js +3 -0
- package/nuxt/components/TimePicker.js +3 -0
- package/nuxt/components/TimeSelect.js +3 -0
- package/nuxt/components/datePickerProCommonProps.js +3 -0
- package/nuxt/components/datePickerProPanelProps.js +3 -0
- package/nuxt/components/datePickerProProps.js +3 -0
- package/nuxt/components/stepProps.js +3 -0
- package/nuxt/components/stepsProps.js +3 -0
- package/nuxt/components/tableProps.js +3 -0
- package/nuxt/components/timerPickerPanelProps.js +3 -0
- package/package.json +2 -1
- package/pagination/index.es.js +25 -7
- package/pagination/index.umd.js +1 -1
- package/pagination/style.css +1 -1
- package/panel/style.css +1 -1
- package/radio/index.es.js +22 -14
- package/radio/index.umd.js +8 -8
- package/radio/style.css +1 -1
- package/rate/style.css +1 -1
- package/result/index.es.js +5 -3
- package/result/index.umd.js +1 -1
- package/result/style.css +1 -1
- package/search/index.es.js +65 -26
- package/search/index.umd.js +7 -7
- package/search/style.css +1 -1
- package/select/index.es.js +270 -269
- package/select/index.umd.js +13 -13
- package/select/style.css +1 -1
- package/slider/index.es.js +116 -143
- package/slider/index.umd.js +1 -1
- package/slider/style.css +1 -1
- package/splitter/index.es.js +27 -7
- package/splitter/index.umd.js +10 -10
- package/statistic/index.es.js +34 -16
- package/statistic/index.umd.js +1 -1
- package/statistic/style.css +1 -1
- package/status/style.css +1 -1
- package/steps/index.d.ts +7 -0
- package/steps/index.es.js +386 -0
- package/steps/index.umd.js +1 -0
- package/{date-picker → steps}/package.json +1 -1
- package/steps/style.css +1 -0
- package/style.css +1 -1
- package/switch/index.es.js +22 -14
- package/switch/index.umd.js +9 -9
- package/switch/style.css +1 -1
- package/table/index.es.js +873 -441
- package/table/index.umd.js +15 -15
- package/table/style.css +1 -1
- package/tabs/index.es.js +25 -13
- package/tabs/index.umd.js +1 -1
- package/tabs/style.css +1 -1
- package/textarea/index.es.js +22 -14
- package/textarea/index.umd.js +10 -10
- package/textarea/style.css +1 -1
- package/time-picker/index.d.ts +7 -0
- package/{date-picker → time-picker}/index.es.js +1408 -1053
- package/time-picker/index.umd.js +27 -0
- package/time-picker/package.json +7 -0
- package/time-picker/style.css +1 -0
- package/time-select/index.d.ts +7 -0
- package/time-select/index.es.js +9435 -0
- package/time-select/index.umd.js +27 -0
- package/time-select/package.json +7 -0
- package/time-select/style.css +1 -0
- package/timeline/index.es.js +5 -3
- package/timeline/index.umd.js +1 -1
- package/timeline/style.css +1 -1
- package/tooltip/index.es.js +1 -1
- package/tooltip/index.umd.js +1 -1
- package/tree/index.es.js +1322 -126
- package/tree/index.umd.js +17 -17
- package/tree/style.css +1 -1
- package/upload/index.es.js +128 -67
- package/upload/index.umd.js +1 -1
- package/upload/style.css +1 -1
- package/vue-devui.es.js +6605 -2566
- package/vue-devui.umd.js +23 -23
- package/date-picker/index.umd.js +0 -27
- package/date-picker/style.css +0 -1
- package/nuxt/components/DatePicker.js +0 -3
- package/nuxt/components/StickSlider.js +0 -3
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 0 0 var(--devui-disabled-line, #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)}@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%;font-size:var(--devui-font-size, 14px)}.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 .devui-tag{margin:4px 0 4px 4px}.devui-select .devui-tag .devui-tag__item.devui-tag--md{height:18px;line-height:16px}.devui-select .devui-tag .devui-tag__item.devui-tag--default{background-color:var(--devui-label-bg, #e9edfa)}.devui-select--sm{font-size:var(--devui-font-size-sm, 12px)}.devui-select--sm .devui-tag{margin:2px 0 2px 4px}.devui-select--sm .devui-tag .devui-tag__item.devui-tag--sm{height:18px;line-height:16px}.devui-select--lg{font-size:var(--devui-font-size-lg, 14px)}.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,.devui-select--disabled .devui-select__clear{cursor:not-allowed}.devui-select--disabled .devui-select__arrow svg path,.devui-select--disabled .devui-select__clear svg path{fill: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 svg path{fill:var(--devui-text-weak, #575d6c)}.devui-select__clear--feedback{right:28px}.devui-select__arrow{transform:rotate(0);transition:transform .25s ease-out}.devui-select__arrow svg path{fill:var(--devui-icon-text, #71757f)}.devui-select__arrow--feedback{right:28px}.devui-select__dropdown{overflow:auto}.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:8px 12px;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-select--sm .devui-select__item{font-size:var(--devui-font-size-sm, 12px)}.devui-select--sm .devui-select__item .devui-checkbox .devui-checkbox__material{width:var(--devui-font-size-sm, 12px);height:var(--devui-font-size-sm, 12px)}.devui-select--sm .devui-select__item .devui-checkbox .devui-checkbox__material>svg{width:var(--devui-font-size-sm, 12px);height:var(--devui-font-size-sm, 12px)}.devui-select--lg .devui-select__item{font-size:var(--devui-font-size-lg, 14px);padding:11px 10px}.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)}.devui-select__group{position:relative;list-style:none;margin:0;padding:0}.devui-select__group:not(:last-of-type){padding-bottom:24px}.devui-select__group:not(:last-of-type):after{content:"";position:absolute;display:block;left:12px;right:12px;bottom:12px;height:1px;background:var(--devui-dividing-line, #f2f2f3)}.devui-select__group-title{padding:4px 12px;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}
|
package/slider/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
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:
|
|
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
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
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
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
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
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
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
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
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
|
|
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:
|
|
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:
|
|
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 ===
|
|
216
|
-
"class": ns.e("
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
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 = {
|
package/slider/index.umd.js
CHANGED
|
@@ -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
|
|
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:
|
|
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)}
|
package/splitter/index.es.js
CHANGED
|
@@ -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 { watch, onUnmounted, defineComponent, toRefs, createVNode, Transition, mergeProps, ref, unref, nextTick, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, provide, Teleport, reactive, resolveComponent, onUpdated } from "vue";
|
|
7
|
+
import { watch, onUnmounted, defineComponent, toRefs, createVNode, Transition, mergeProps, ref, unref, nextTick, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, provide, Teleport, getCurrentInstance, reactive, resolveComponent, onUpdated } from "vue";
|
|
8
8
|
import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
|
|
9
9
|
const fixedOverlayProps = {
|
|
10
10
|
modelValue: {
|
|
@@ -1448,7 +1448,7 @@ var lodash = { exports: {} };
|
|
|
1448
1448
|
function baseAt(object, paths) {
|
|
1449
1449
|
var index2 = -1, length = paths.length, result2 = Array2(length), skip = object == null;
|
|
1450
1450
|
while (++index2 < length) {
|
|
1451
|
-
result2[index2] = skip ? undefined$1 :
|
|
1451
|
+
result2[index2] = skip ? undefined$1 : get2(object, paths[index2]);
|
|
1452
1452
|
}
|
|
1453
1453
|
return result2;
|
|
1454
1454
|
}
|
|
@@ -1893,7 +1893,7 @@ var lodash = { exports: {} };
|
|
|
1893
1893
|
return matchesStrictComparable(toKey(path), srcValue);
|
|
1894
1894
|
}
|
|
1895
1895
|
return function(object) {
|
|
1896
|
-
var objValue =
|
|
1896
|
+
var objValue = get2(object, path);
|
|
1897
1897
|
return objValue === undefined$1 && objValue === srcValue ? hasIn(object, path) : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
|
|
1898
1898
|
};
|
|
1899
1899
|
}
|
|
@@ -4626,7 +4626,7 @@ var lodash = { exports: {} };
|
|
|
4626
4626
|
function functionsIn(object) {
|
|
4627
4627
|
return object == null ? [] : baseFunctions(object, keysIn(object));
|
|
4628
4628
|
}
|
|
4629
|
-
function
|
|
4629
|
+
function get2(object, path, defaultValue) {
|
|
4630
4630
|
var result2 = object == null ? undefined$1 : baseGet(object, path);
|
|
4631
4631
|
return result2 === undefined$1 ? defaultValue : result2;
|
|
4632
4632
|
}
|
|
@@ -5481,7 +5481,7 @@ var lodash = { exports: {} };
|
|
|
5481
5481
|
lodash2.forInRight = forInRight;
|
|
5482
5482
|
lodash2.forOwn = forOwn;
|
|
5483
5483
|
lodash2.forOwnRight = forOwnRight;
|
|
5484
|
-
lodash2.get =
|
|
5484
|
+
lodash2.get = get2;
|
|
5485
5485
|
lodash2.gt = gt;
|
|
5486
5486
|
lodash2.gte = gte;
|
|
5487
5487
|
lodash2.has = has;
|
|
@@ -6005,6 +6005,24 @@ const splitterBarProps = {
|
|
|
6005
6005
|
}
|
|
6006
6006
|
};
|
|
6007
6007
|
var splitterBar = "";
|
|
6008
|
+
const camelize = (name) => name.substring(1).replace(/^\S/, (s) => s.toLocaleLowerCase());
|
|
6009
|
+
function get(object, path) {
|
|
6010
|
+
const keys = path.split(".");
|
|
6011
|
+
let result = object;
|
|
6012
|
+
keys.forEach((key) => {
|
|
6013
|
+
var _a;
|
|
6014
|
+
result = (_a = result[key]) != null ? _a : "";
|
|
6015
|
+
});
|
|
6016
|
+
return result;
|
|
6017
|
+
}
|
|
6018
|
+
function createI18nTranslate(name, app, newPrefix) {
|
|
6019
|
+
const prefix = newPrefix || camelize(name) + ".";
|
|
6020
|
+
return (path) => {
|
|
6021
|
+
const messages = app == null ? void 0 : app.appContext.config.globalProperties.langMessages.value;
|
|
6022
|
+
const message = get(messages, prefix + path) || get(messages, path);
|
|
6023
|
+
return message;
|
|
6024
|
+
};
|
|
6025
|
+
}
|
|
6008
6026
|
var DSplitterBar = defineComponent({
|
|
6009
6027
|
name: "DSplitterBar",
|
|
6010
6028
|
components: {
|
|
@@ -6012,6 +6030,8 @@ var DSplitterBar = defineComponent({
|
|
|
6012
6030
|
},
|
|
6013
6031
|
props: splitterBarProps,
|
|
6014
6032
|
setup(props) {
|
|
6033
|
+
const app = getCurrentInstance();
|
|
6034
|
+
const t = createI18nTranslate("DSplitterBar", app);
|
|
6015
6035
|
const ns2 = useNamespace("splitter");
|
|
6016
6036
|
const store = inject("splitterStore");
|
|
6017
6037
|
const state = reactive({
|
|
@@ -6192,14 +6212,14 @@ var DSplitterBar = defineComponent({
|
|
|
6192
6212
|
const renderCollapsedTip = () => {
|
|
6193
6213
|
var _a, _b, _c, _d;
|
|
6194
6214
|
if (!props || props.index === void 0) {
|
|
6195
|
-
return "
|
|
6215
|
+
return t("collapse");
|
|
6196
6216
|
}
|
|
6197
6217
|
const {
|
|
6198
6218
|
pane,
|
|
6199
6219
|
nearPane
|
|
6200
6220
|
} = queryPanes(props.index, props.index + 1);
|
|
6201
6221
|
const isCollapsed = ((_b = (_a = pane == null ? void 0 : pane.component) == null ? void 0 : _a.props) == null ? void 0 : _b.collapsed) || ((_d = (_c = nearPane == null ? void 0 : nearPane.component) == null ? void 0 : _c.props) == null ? void 0 : _d.collapsed);
|
|
6202
|
-
return isCollapsed ? "
|
|
6222
|
+
return isCollapsed ? t("expand") : t("collapse");
|
|
6203
6223
|
};
|
|
6204
6224
|
return () => {
|
|
6205
6225
|
return withDirectives(createVNode("div", {
|