vue-devui 1.0.0 → 1.1.0

package/switch/style.css

@@ -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}:host{display:inline-block;font-size:0;vertical-align:middle}.devui-switch{width:36px;height:18px;border-radius:var(--devui-border-radius-full, 100px);background:var(--devui-line, #d7d8da);border:1px solid var(--devui-line, #d7d8da);position:relative;display:inline-block;box-sizing:content-box;overflow:visible;padding:0;margin:0;cursor:pointer;vertical-align:bottom;transition:var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) all}.devui-switch:not(.devui-switch--checked):hover{border-color:var(--devui-line, #d7d8da)}.devui-switch:active{border-color:var(--devui-brand-active-focus, #344899)}.devui-switch.devui-switch--checked:hover{border-color:var(--devui-brand-active, #526ecc)}.devui-switch .devui-switch__inner-wrapper{display:inline-block;width:100%;height:100%;padding-left:16px;font-size:var(--devui-font-size, 14px);box-sizing:border-box}.devui-switch .devui-switch__inner-wrapper .devui-switch__inner{color:var(--devui-light-text, #ffffff);width:100%;height:100%;text-align:center;overflow:hidden}.devui-switch.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:16px}.devui-switch small{width:16px;height:16px;background:var(--devui-light-text, #ffffff);border-radius:var(--devui-border-radius-full, 100px);position:absolute;top:1px;left:1px;transition:var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) all}.devui-switch.devui-switch--checked small{left:19px}.devui-switch.devui-switch--lg{width:58px;height:28px}.devui-switch.devui-switch--lg .devui-switch__inner-wrapper{padding-left:28px;padding-top:2px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-switch.devui-switch--lg.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:28px}.devui-switch.devui-switch--lg small{width:26px;height:26px;top:1px;left:1px}.devui-switch.devui-switch--lg.devui-switch--checked small{background:var(--devui-light-text, #ffffff);left:30px}.devui-switch.devui-switch--sm{width:30px;height:15px}.devui-switch.devui-switch--sm .devui-switch__inner-wrapper{padding-left:12px;font-size:var(--devui-font-size-sm, 12px);vertical-align:top}.devui-switch.devui-switch--sm.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:12px}.devui-switch.devui-switch--sm small{width:12px;height:12px;position:absolute}.devui-switch.devui-switch--sm.devui-switch--checked small{left:17px}.devui-switch.devui-switch--checked{background:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-switch.devui-switch--checked:hover{background:var(--devui-brand-active, #526ecc);border-color:var(--devui-brand-active, #526ecc)}.devui-switch.devui-switch--checked:active{background:var(--devui-brand-active-focus, #344899);border-color:var(--devui-brand-active-focus, #344899)}.devui-switch.devui-switch--disabled,.devui-switch.devui-switch--disabled:hover,.devui-switch.devui-switch--disabled:active,.devui-switch.devui-switch--disabled.devui-switch--checked{cursor:not-allowed}.devui-switch.devui-switch--disabled,.devui-switch.devui-switch--disabled:hover,.devui-switch.devui-switch--disabled:active{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-switch.devui-switch--disabled small,.devui-switch.devui-switch--disabled:hover small,.devui-switch.devui-switch--disabled:active small{background-color:var(--devui-unavailable, #f5f5f5)}.devui-switch.devui-switch--disabled.devui-switch--checked{background-color:var(--devui-icon-fill-active-disabled, #beccfa);border-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-switch.devui-switch--disabled.devui-switch--checked small{background-color:var(--devui-light-text, #ffffff)}
+.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, 2px);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-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}:host{display:inline-block;font-size:0;vertical-align:middle}.devui-switch{width:36px;height:18px;border-radius:var(--devui-border-radius-full, 100px);background:var(--devui-line, #d7d8da);border:1px solid var(--devui-line, #d7d8da);position:relative;display:inline-block;box-sizing:content-box;overflow:visible;padding:0;margin:0;cursor:pointer;vertical-align:bottom;transition:var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) all}.devui-switch:not(.devui-switch--checked):hover{border-color:var(--devui-line, #d7d8da)}.devui-switch:active{border-color:var(--devui-brand-active-focus, #344899)}.devui-switch.devui-switch--checked:hover{border-color:var(--devui-brand-active, #526ecc)}.devui-switch .devui-switch__inner-wrapper{display:inline-block;width:100%;height:100%;padding-left:16px;font-size:var(--devui-font-size, 14px);box-sizing:border-box}.devui-switch .devui-switch__inner-wrapper .devui-switch__inner{color:var(--devui-light-text, #ffffff);width:100%;height:100%;text-align:center;overflow:hidden}.devui-switch.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:16px}.devui-switch small{width:16px;height:16px;background:var(--devui-light-text, #ffffff);border-radius:var(--devui-border-radius-full, 100px);position:absolute;top:1px;left:1px;transition:var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) all}.devui-switch.devui-switch--checked small{left:19px}.devui-switch.devui-switch--lg{width:58px;height:28px}.devui-switch.devui-switch--lg .devui-switch__inner-wrapper{padding-left:28px;padding-top:2px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-switch.devui-switch--lg.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:28px}.devui-switch.devui-switch--lg small{width:26px;height:26px;top:1px;left:1px}.devui-switch.devui-switch--lg.devui-switch--checked small{background:var(--devui-light-text, #ffffff);left:30px}.devui-switch.devui-switch--sm{width:30px;height:15px}.devui-switch.devui-switch--sm .devui-switch__inner-wrapper{padding-left:12px;font-size:var(--devui-font-size-sm, 12px);vertical-align:top}.devui-switch.devui-switch--sm.devui-switch--checked .devui-switch__inner-wrapper{padding-left:unset;padding-right:12px}.devui-switch.devui-switch--sm small{width:12px;height:12px;position:absolute}.devui-switch.devui-switch--sm.devui-switch--checked small{left:17px}.devui-switch.devui-switch--checked{background:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-switch.devui-switch--checked:hover{background:var(--devui-brand-active, #526ecc);border-color:var(--devui-brand-active, #526ecc)}.devui-switch.devui-switch--checked:active{background:var(--devui-brand-active-focus, #344899);border-color:var(--devui-brand-active-focus, #344899)}.devui-switch.devui-switch--disabled,.devui-switch.devui-switch--disabled:hover,.devui-switch.devui-switch--disabled:active,.devui-switch.devui-switch--disabled.devui-switch--checked{cursor:not-allowed}.devui-switch.devui-switch--disabled,.devui-switch.devui-switch--disabled:hover,.devui-switch.devui-switch--disabled:active{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-switch.devui-switch--disabled small,.devui-switch.devui-switch--disabled:hover small,.devui-switch.devui-switch--disabled:active small{background-color:var(--devui-unavailable, #f5f5f5)}.devui-switch.devui-switch--disabled.devui-switch--checked{background-color:var(--devui-icon-fill-active-disabled, #beccfa);border-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-switch.devui-switch--disabled.devui-switch--checked small{background-color:var(--devui-light-text, #ffffff)}

package/table/index.es.js

@@ -33,7 +33,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { computed, ref, watchEffect, watch, getCurrentInstance, unref, defineComponent, inject, createVNode, mergeProps, toRefs, onMounted, onUnmounted, Transition, nextTick, Comment, Text, h, Fragment, withDirectives, cloneVNode, provide, Teleport, vShow, resolveDynamicComponent, render, resolveDirective, toRef, reactive, withModifiers, createTextVNode, onBeforeUnmount, isVNode, onBeforeMount, onUpdated } from "vue";
+import { computed, ref, watchEffect, watch, getCurrentInstance, unref, defineComponent, inject, createVNode, mergeProps, toRefs, onMounted, onUnmounted, Transition, nextTick, withModifiers, Comment, Text, h, Fragment, withDirectives, cloneVNode, provide, Teleport, vShow, resolveDynamicComponent, render, resolveDirective, toRef, reactive, createTextVNode, onBeforeUnmount, isVNode, onBeforeMount, onUpdated } from "vue";
 import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 import { onClickOutside } from "@vueuse/core";
 const tableProps = {
@@ -262,8 +262,42 @@ function useTableWatcher(props, store) {
   });
   watch(() => props.data, () => {
     store.updateRows();
+    store.updateColumns();
   }, { deep: true });
 }
+function useHorizontalScroll(table2) {
+  const ns2 = useNamespace("table");
+  const setScrollViewClass = (position) => {
+    const element = table2.vnode.el;
+    const className = ns2.m(`scroll-${position}`);
+    const elClassList = element.classList;
+    if (!elClassList.contains(className)) {
+      for (let i = 0; i < elClassList.length; i++) {
+        const clName = elClassList[i];
+        if (clName.startsWith(ns2.m("scroll-"))) {
+          elClassList.remove(clName);
+        }
+      }
+      elClassList.add(className);
+    }
+  };
+  const onTableScroll = (e) => {
+    const target = e.currentTarget;
+    const scrollLeft = target.scrollLeft;
+    if (scrollLeft === 0) {
+      if (target.clientWidth === target.scrollWidth) {
+        setScrollViewClass("none");
+      } else {
+        setScrollViewClass("left");
+      }
+    } else if (scrollLeft + target.clientWidth === target.scrollWidth) {
+      setScrollViewClass("right");
+    } else {
+      setScrollViewClass("middle");
+    }
+  };
+  return { onTableScroll };
+}
 const inBrowser = typeof window !== "undefined";
 function getElement(element) {
   if (element instanceof Element) {
@@ -459,6 +493,22 @@ function useEditTableCell() {
     resetCellMode
   };
 }
+function useSort$1(dataSource, _data) {
+  const thList = [];
+  const sortData = (direction, sortMethod) => {
+    if (direction === "ASC") {
+      _data.value = _data.value.sort((a, b) => sortMethod ? sortMethod(a, b) ? 1 : -1 : 0);
+    } else if (direction === "DESC") {
+      _data.value = _data.value.sort((a, b) => sortMethod ? sortMethod(a, b) ? -1 : 1 : 0);
+    } else {
+      _data.value = [...dataSource.value];
+    }
+  };
+  const collectTh = (th) => {
+    thList.push(th);
+  };
+  return { thList, collectTh, sortData };
+}
 function replaceColumn(array4, column2) {
   return array4.map((item) => {
     var _a;
@@ -643,40 +693,29 @@ function createSelection(dataSource, rowKey, flatRows) {
     toggleRowSelection
   };
 }
-function createSorter(dataSource, _data) {
-  const sortData = (direction, sortMethod) => {
-    if (direction === "ASC") {
-      _data.value = _data.value.sort((a, b) => sortMethod ? sortMethod(a, b) ? 1 : -1 : 0);
-    } else if (direction === "DESC") {
-      _data.value = _data.value.sort((a, b) => sortMethod ? sortMethod(a, b) ? -1 : 1 : 0);
-    } else {
-      _data.value = [...dataSource.value];
-    }
-  };
-  const thList = [];
-  return { sortData, thList };
-}
 function createFixedLogic(columns) {
   const isFixedLeft = computed(() => {
     return columns.value.reduce((prev, current) => prev || !!current.fixedLeft, false);
   });
   return { isFixedLeft };
 }
-function createStore(dataSource, table2) {
+function createStore(dataSource, table2, ctx) {
   const _data = ref([]);
   const { _columns, flatColumns, insertColumn, removeColumn, sortColumn, updateColumns } = createColumnGenerator();
   const { flatRows, hiddenRowKeys, rowLevelMap, updateRows, firstDefaultColumn, updateFirstDefaultColumn } = createRowGenerator(dataSource, table2.props.rowKey, flatColumns);
   const { _checkAll, _checkSet, _halfChecked, getCheckedRows, isRowChecked, checkRow, toggleRowSelection } = createSelection(_data, table2.props.rowKey, flatRows);
-  const { sortData, thList } = createSorter(dataSource, flatRows);
+  const { thList, collectTh, sortData } = useSort$1(dataSource, flatRows);
   const { isFixedLeft } = createFixedLogic(_columns);
   const { isRowExpanded, updateExpandRows, setExpandRows, toggleRowExpansion } = useExpand(_data, table2);
   const { tableCellModeMap, setCellMode, resetCellMode } = useEditTableCell();
+  const emitTableEvent = (eventName, ...params) => {
+    ctx.emit.apply(ctx, [eventName, ...params]);
+  };
   watch(dataSource, (value) => {
     _data.value = [...value];
     updateExpandRows();
   }, { deep: true, immediate: true });
   return {
-    _table: table2,
     states: {
       _data,
       flatRows,
@@ -698,6 +737,7 @@ function createStore(dataSource, table2) {
     updateColumns,
     updateRows,
     getCheckedRows,
+    collectTh,
     sortData,
     isRowChecked,
     checkRow,
@@ -707,7 +747,8 @@ function createStore(dataSource, table2) {
     toggleRowSelection,
     updateFirstDefaultColumn,
     setCellMode,
-    resetCellMode
+    resetCellMode,
+    emitTableEvent
   };
 }
 var ColGroup = defineComponent({
@@ -893,6 +934,7 @@ const useDropdownEvent = ({ id, isOpen, origin, dropdownRef, props, emit }) => {
     const subscriptions = [];
     setTimeout(() => {
       subscriptions.push(subscribeEvent(document, "click", (e) => {
+        e.stopPropagation();
         const dropdownValues = [...dropdownMap.values()];
         if (!isOpen.value || closeScope.value === "none" || (dropdownEl == null ? void 0 : dropdownEl.contains(e.target)) && closeScope.value === "blank" || dropdownValues.some((item) => {
           var _a;
@@ -993,7 +1035,8 @@ function useOverlayProps(props, currentPosition, isOpen) {
   const overlayModelValue = ref(false);
   const overlayShowValue = ref(false);
   const styles = computed(() => ({
-    transformOrigin: currentPosition.value === "top" ? "0% 100%" : "0% 0%"
+    transformOrigin: currentPosition.value === "top" ? "0% 100%" : "0% 0%",
+    zIndex: "var(--devui-z-index-dropdown, 1052)"
   }));
   const classes = computed(() => ({
     "fade-in-bottom": showAnimation.value && isOpen.value && currentPosition.value === "bottom",
@@ -1104,6 +1147,10 @@ const flexibleOverlayProps = {
   isArrowCenter: {
     type: Boolean,
     default: true
+  },
+  clickEventBubble: {
+    type: Boolean,
+    default: false
   }
 };
 function getScrollParent(element) {
@@ -1218,6 +1265,9 @@ const FlexibleOverlay = defineComponent({
     expose
   }) {
     const ns2 = useNamespace("flexible-overlay");
+    const {
+      clickEventBubble
+    } = toRefs(props);
     const {
       arrowRef,
       overlayRef,
@@ -1231,7 +1281,10 @@ const FlexibleOverlay = defineComponent({
       return props.modelValue && createVNode("div", mergeProps({
         "ref": overlayRef,
         "class": ns2.b()
-      }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
+      }, attrs, {
+        "onClick": withModifiers(() => ({}), [clickEventBubble.value ? "" : "stop"]),
+        "onPointerup": withModifiers(() => ({}), ["stop"])
+      }), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
         "ref": arrowRef,
         "class": ns2.e("arrow")
       }, null)]);
@@ -1370,6 +1423,7 @@ var Dropdown = defineComponent({
           "offset": offset2.value,
           "shiftOffset": shiftOffset == null ? void 0 : shiftOffset.value,
           "onPositionChange": handlePositionChange,
+          "click-event-bubble": true,
           "class": classes.value,
           "style": styles.value
         }, {
@@ -1637,7 +1691,8 @@ var Icon = defineComponent({
     const wrapClassed = computed(() => ({
       [ns2.e("container")]: true,
       [ns2.m("disabled")]: disabled.value,
-      [ns2.m("operable")]: operable.value
+      [ns2.m("operable")]: operable.value,
+      [ns2.m("no-slots")]: !Object.keys(ctx.slots).length
     }));
     const onClick = (e) => {
       if (disabled.value) {
@@ -1699,7 +1754,7 @@ class LoadingOptions {
 }
 var loading = "";
 var Loading = defineComponent({
-  name: "DLoading",
+  name: "Loading",
   inheritAttrs: false,
   props: loadingProps,
   setup(props) {
@@ -1852,12 +1907,12 @@ const handleProps = (el, vprops) => {
   const props = __spreadValues(__spreadValues({}, new LoadingOptions()), vprops);
   const loadingTemplateRef = props.loadingTemplateRef;
   const loadingInstance = createComponent(loadingConstructor, __spreadValues({}, props), loadingTemplateRef ? () => loadingTemplateRef : null);
-  el.style.position = props.positionType;
+  el.style.position = props.positionType || "relative";
   el.options = props;
   el.instance = loadingInstance;
   el.mask = (_a = loadingInstance == null ? void 0 : loadingInstance.proxy) == null ? void 0 : _a.$el;
 };
-const loadingDirective = {
+const LoadingDirective = {
   mounted: function(el, binding, vnode) {
     handleProps(el, vnode.props);
     removeAttribute(el);
@@ -7359,7 +7414,7 @@ var button = "";
 var Button = defineComponent({
   name: "DButton",
   directives: {
-    dLoading: loadingDirective
+    Loading: LoadingDirective
   },
   props: buttonProps,
   emits: ["click"],
@@ -7392,7 +7447,7 @@ var Button = defineComponent({
         "class": iconClass.value
       }, null), createVNode("span", {
         "class": "button-content"
-      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)])]), [[resolveDirective("dLoading"), loading2.value]]);
+      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)])]), [[resolveDirective("loading"), loading2.value]]);
     };
   }
 });
@@ -7766,7 +7821,7 @@ const popoverProps = {
     default: false
   }
 };
-const TransformOriginMap$1 = {
+const TransformOriginMap = {
   top: "50% calc(100% + 8px)",
   bottom: "50% -8px",
   left: "calc(100% + 8px)",
@@ -7775,8 +7830,8 @@ const TransformOriginMap$1 = {
 function usePopover(props, visible, placement, origin, popoverRef) {
   const { trigger, isOpen } = toRefs(props);
   const overlayStyles = computed(() => ({
-    zIndex: 1060,
-    transformOrigin: TransformOriginMap$1[placement.value]
+    zIndex: "var(--devui-z-index-pop-up, 1060)",
+    transformOrigin: TransformOriginMap[placement.value]
   }));
   const onDocumentClick = (e) => {
     var _a, _b;
@@ -8018,8 +8073,6 @@ var Popover = defineComponent({
           "style": overlayStyles.value
         }, attrs, {
           "onPositionChange": handlePositionChange,
-          "onClick": withModifiers(() => ({}), ["stop"]),
-          "onPointerup": withModifiers(() => ({}), ["stop"]),
           "onMouseenter": onMouseenter,
           "onMouseleave": onMouseleave
         }), {
@@ -8218,9 +8271,7 @@ var FormControl = defineComponent({
     }, {
       default: () => {
         var _a, _b;
-        return [createVNode("div", {
-          "class": ns2.e("control-content")
-        }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]), createTextVNode(",")];
+        return [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)];
       }
     }), showFeedback.value && createVNode("span", {
       "class": [ns2.e("feedback-icon"), ns2.em("feedback-icon", feedbackStatus.value)]
@@ -9762,12 +9813,11 @@ defineComponent({
         }
       };
       return createVNode("div", {
-        "class": ns2.e("group")
-      }, [createVNode("div", {
-        "class": {
-          [ns2.m("list-inline")]: props.direction === "row"
-        }
-      }, [getContent()])]);
+        "class": [ns2.e("group"), {
+          "is-row": props.direction === "row",
+          "is-column": props.direction === "column"
+        }]
+      }, [getContent()]);
     };
   }
 });
@@ -9921,7 +9971,8 @@ function deepAssign(...objects) {
 var zhCN = {
   pagination: {
     totalItemText: "\u6240\u6709\u6761\u76EE",
-    goToText: "\u8DF3\u81F3"
+    goToText: "\u8DF3\u81F3",
+    perPage: "\u6761/\u9875"
   },
   accordion: {
     loading: "\u52A0\u8F7D\u4E2D",
@@ -10246,14 +10297,15 @@ function useBaseRender(column2) {
 function useSort(column2) {
   const table2 = inject(TABLE_TOKEN);
   const store = table2.store;
-  const direction = ref(column2.value.sortDirection);
+  const direction = ref(column2.value.sortDirection || "");
   const sortClass = computed(() => ({
     "sort-active": Boolean(direction.value)
   }));
   const thInstance = getCurrentInstance();
-  thInstance && store.states.thList.push(thInstance);
-  onMounted(() => {
+  thInstance && store.collectTh(thInstance);
+  onMounted(async () => {
     var _a;
+    await nextTick();
     column2.value.sortable && column2.value.sortDirection && ((_a = store.sortData) == null ? void 0 : _a.call(store, direction.value, column2.value.sortMethod));
   });
   const execClearSortOrder = () => {
@@ -10512,11 +10564,16 @@ var TableHeader = defineComponent({
     return () => createVNode("thead", {
       "class": ns2.e("thead")
     }, [headerRows.value.map((subColumns) => createVNode("tr", null, [subColumns.map((column2, columnIndex) => {
+      var _a, _b;
       return createVNode(TH, {
         "key": columnIndex,
         "column": column2,
         "colspan": column2.colSpan,
-        "rowspan": column2.rowSpan
+        "rowspan": column2.rowSpan,
+        "class": {
+          [ns2.m("last-sticky-left")]: column2.fixedLeft && !((_a = subColumns[columnIndex + 1]) == null ? void 0 : _a.fixedLeft),
+          [ns2.m("first-sticky-right")]: column2.fixedRight && !((_b = subColumns[columnIndex - 1]) == null ? void 0 : _b.fixedRight)
+        }
       }, null);
     })]))]);
   }
@@ -10575,7 +10632,7 @@ const tooltipProps = {
     default: 0
   }
 };
-const TransformOriginMap = {
+const transformOriginMap = {
   top: "50% calc(100% + 8px)",
   bottom: "50% -8px",
   left: "calc(100% + 8px)",
@@ -10588,7 +10645,7 @@ function useTooltip(origin, props) {
   const positionArr = computed(() => typeof position.value === "string" ? [position.value] : position.value);
   const placement = ref(positionArr.value[0]);
   const overlayStyles = computed(() => ({
-    transformOrigin: TransformOriginMap[placement.value]
+    transformOrigin: transformOriginMap[placement.value]
   }));
   const enter = lodash.exports.debounce(() => {
     isEnter.value && (visible.value = true);
@@ -10632,7 +10689,16 @@ function useTooltip(origin, props) {
       timer = setTimeout(quickLeave, hideAfter.value);
     }
   });
-  return { visible, placement, positionArr, overlayStyles, onPositionChange, onMouseenter, onMouseleave, onMouseenterOverlay };
+  return {
+    visible,
+    placement,
+    positionArr,
+    overlayStyles,
+    onPositionChange,
+    onMouseenter,
+    onMouseleave,
+    onMouseenterOverlay
+  };
 }
 var tooltip = "";
 var Tooltip = defineComponent({
@@ -10657,6 +10723,9 @@ var Tooltip = defineComponent({
       onMouseenterOverlay
     } = useTooltip(origin, props);
     const ns2 = useNamespace("tooltip");
+    const className = computed(() => {
+      return [ns2.b(), ns2.m(placement.value)].join(" ");
+    });
     provide(POPPER_TRIGGER_TOKEN, origin);
     return () => createVNode(Fragment, null, [createVNode(PopperTrigger, null, {
       default: () => {
@@ -10673,7 +10742,7 @@ var Tooltip = defineComponent({
           "modelValue": visible.value,
           "onUpdate:modelValue": ($event) => visible.value = $event,
           "ref": tooltipRef,
-          "class": ns2.b(),
+          "class": className.value,
           "origin": origin.value,
           "position": positionArr.value,
           "offset": 6,
@@ -10781,7 +10850,7 @@ var TD = defineComponent({
           var _a, _b;
           return [createVNode("td", mergeProps({
             "ref": tdRef,
-            "class": stickyClass.value,
+            "class": [stickyClass.value, column2.value.cellClass],
             "style": stickyStyle.value
           }, ctx.attrs, {
             "rowspan": rowspan == null ? void 0 : rowspan.value,
@@ -10929,7 +10998,7 @@ var TableBody = defineComponent({
           row
         })
       }, [flatColumns.value.map((column2, columnIndex) => {
-        var _a2;
+        var _a2, _b2, _c2;
         const cellId = `${rowIndex}-${columnIndex}`;
         const [rowspan, colspan] = (_a2 = tableSpans.value[cellId]) != null ? _a2 : [1, 1];
         if (removeCells.value.includes(cellId)) {
@@ -10941,6 +11010,10 @@ var TableBody = defineComponent({
           "row": row,
           "rowspan": rowspan,
           "colspan": colspan,
+          "class": {
+            [ns2.m("last-sticky-left")]: column2.fixedLeft && !((_b2 = flatColumns.value[columnIndex + 1]) == null ? void 0 : _b2.fixedLeft),
+            [ns2.m("first-sticky-right")]: column2.fixedRight && !((_c2 = flatColumns.value[columnIndex - 1]) == null ? void 0 : _c2.fixedRight)
+          },
           "onCellClick": () => onCellClick({
             rowIndex,
             columnIndex,
@@ -10973,10 +11046,14 @@ var FixHeader = defineComponent({
     const ns2 = useNamespace("table");
     const table2 = inject(TABLE_TOKEN, void 0);
     const showHeader = computed(() => Boolean(table2 == null ? void 0 : table2.props.showHeader));
+    const {
+      onTableScroll
+    } = useHorizontalScroll(table2);
     return () => createVNode("div", {
-      "class": ns2.e("fix-header")
+      "class": ns2.e("fix-header"),
+      "onScroll": withModifiers(onTableScroll, ["stop"])
     }, [showHeader.value && createVNode("div", {
-      "style": "overflow:hidden scroll;"
+      "class": ns2.e("header-wrapper")
     }, [createVNode("table", {
       "class": props.classes,
       "cellpadding": "0",
@@ -11020,13 +11097,13 @@ let tableIdInit = 1;
 var Table = defineComponent({
   name: "DTable",
   directives: {
-    dLoading: loadingDirective
+    Loading: LoadingDirective
   },
   props: tableProps,
   emits: ["sort-change", "cell-click", "row-click", "check-change", "check-all-change", "expand-change", "load-more"],
   setup(props, ctx) {
     const table2 = getCurrentInstance();
-    const store = createStore(toRef(props, "data"), table2);
+    const store = createStore(toRef(props, "data"), table2, ctx);
     const tableId = `devui-table_${tableIdInit++}`;
     const tableRef = ref();
     table2.tableId = tableId;
@@ -11040,6 +11117,9 @@ var Table = defineComponent({
       classes,
       styles
     } = useTable(props, tableWidth);
+    const {
+      onTableScroll
+    } = useHorizontalScroll(table2);
     useTableWatcher(props, store);
     const isEmpty2 = computed(() => props.data.length === 0);
     const ns2 = useNamespace("table");
@@ -11063,7 +11143,8 @@ var Table = defineComponent({
       return withDirectives(createVNode("div", {
         "ref": tableRef,
         "class": ns2.b(),
-        "style": styles.value
+        "style": styles.value,
+        "onScroll": withModifiers(onTableScroll, ["stop"])
       }, [createVNode("div", {
         "class": ns2.e("container")
       }, [createVNode("div", {
@@ -11077,7 +11158,7 @@ var Table = defineComponent({
         "is-empty": isEmpty2.value
       }, null), isEmpty2.value && createVNode("div", {
         "class": ns2.e("empty")
-      }, [ctx.slots.empty ? ctx.slots.empty() : props.empty])])]), [[resolveDirective("dLoading"), props.showLoading]]);
+      }, [ctx.slots.empty ? ctx.slots.empty() : props.empty])])]), [[resolveDirective("loading"), props.showLoading]]);
     };
   }
 });
@@ -11159,6 +11240,10 @@ const tableColumnProps = {
   reserveCheck: {
     type: Boolean,
     default: false
+  },
+  cellClass: {
+    type: String,
+    default: ""
   }
 };
 var column = "";
@@ -11219,7 +11304,7 @@ const cellMap = {
         halfChecked: store.states._halfChecked.value,
         onChange: (val) => {
           store.states._checkAll.value = val;
-          store._table.emit("check-all-change", val, store.getCheckedRows());
+          store.emitTableEvent("check-all-change", val, store.getCheckedRows());
         }
       });
     },
@@ -11228,7 +11313,7 @@ const cellMap = {
         modelValue: store.isRowChecked(rowData, rowIndex),
         onChange: (val) => {
           store.checkRow(val, rowData, rowIndex);
-          store._table.emit("check-change", val, store.states._data.value[rowIndex], store.getCheckedRows());
+          store.emitTableEvent("check-change", val, store.states._data.value[rowIndex], store.getCheckedRows());
         }
       });
     }
@@ -11374,7 +11459,8 @@ function createColumn(id, props, ctx) {
     fixedRight,
     align,
     showOverflowTooltip,
-    resizeable
+    resizeable,
+    cellClass
   } = props;
   const column2 = reactive({ id });
   column2.type = type4.value;
@@ -11412,6 +11498,9 @@ function createColumn(id, props, ctx) {
   watch(align, (alignVal) => {
     column2.align = alignVal;
   }, { immediate: true });
+  watch(cellClass, (cellClassVal) => {
+    column2.cellClass = cellClassVal;
+  }, { immediate: true });
   watch(showOverflowTooltip, (showVal) => {
     column2.showOverflowTooltip = showVal;
   }, { immediate: true });
@@ -11491,12 +11580,16 @@ var Column = defineComponent({
     });
     return () => {
       var _a, _b;
-      const defaultSlot = (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a, {
-        row: {},
-        column: {},
-        $index: -1
-      });
-      return createVNode("div", null, [defaultSlot && Array.isArray(defaultSlot) ? defaultSlot.filter((child) => child.type.name === "DColumn").map((child) => createVNode(Fragment, null, [child])) : createVNode("div", null, null)]);
+      try {
+        const defaultSlot = (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a, {
+          row: {},
+          column: {},
+          $index: -1
+        });
+        return createVNode("div", null, [defaultSlot && Array.isArray(defaultSlot) ? defaultSlot.filter((child) => child.type.name === "DColumn").map((child) => createVNode(Fragment, null, [child])) : createVNode("div", null, null)]);
+      } catch {
+        return h("div", []);
+      }
     };
   }
 });