vue-devui 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/README.md +31 -6
  2. package/alert/style.css +1 -1
  3. package/auto-complete/index.es.js +27 -16
  4. package/auto-complete/index.umd.js +11 -11
  5. package/auto-complete/style.css +1 -1
  6. package/button/index.es.js +7 -6
  7. package/button/index.umd.js +5 -5
  8. package/button/style.css +1 -1
  9. package/card/style.css +1 -1
  10. package/checkbox/index.es.js +14 -8
  11. package/checkbox/index.umd.js +8 -8
  12. package/checkbox/style.css +1 -1
  13. package/date-picker-pro/index.es.js +135 -133
  14. package/date-picker-pro/index.umd.js +13 -13
  15. package/date-picker-pro/style.css +1 -1
  16. package/drawer/index.es.js +22 -5
  17. package/drawer/index.umd.js +1 -1
  18. package/drawer/style.css +1 -1
  19. package/dropdown/index.es.js +16 -3
  20. package/dropdown/index.umd.js +1 -1
  21. package/dropdown/style.css +1 -1
  22. package/editable-select/index.es.js +67 -62
  23. package/editable-select/index.umd.js +1 -1
  24. package/editable-select/style.css +1 -1
  25. package/form/index.es.js +14 -8
  26. package/form/index.umd.js +5 -5
  27. package/form/style.css +1 -1
  28. package/icon/index.es.js +2 -1
  29. package/icon/index.umd.js +1 -1
  30. package/icon/style.css +1 -1
  31. package/image-preview/style.css +1 -1
  32. package/input/index.es.js +19 -11
  33. package/input/index.umd.js +4 -4
  34. package/input/style.css +1 -1
  35. package/input-number/index.es.js +26 -23
  36. package/input-number/index.umd.js +1 -1
  37. package/input-number/style.css +1 -1
  38. package/loading/index.es.js +51 -51
  39. package/loading/index.umd.js +1 -1
  40. package/mention/index.es.js +19 -10
  41. package/mention/index.umd.js +6 -6
  42. package/mention/style.css +1 -1
  43. package/menu/index.es.js +131 -144
  44. package/menu/index.umd.js +1 -1
  45. package/menu/style.css +1 -1
  46. package/message/index.es.js +2 -1
  47. package/message/index.umd.js +1 -1
  48. package/message/style.css +1 -1
  49. package/modal/index.es.js +158 -43
  50. package/modal/index.umd.js +1 -1
  51. package/modal/style.css +1 -1
  52. package/notification/index.es.js +7 -9
  53. package/notification/index.umd.js +1 -1
  54. package/notification/style.css +1 -1
  55. package/nuxt/components/paginationInjectionKey.js +3 -0
  56. package/overlay/index.es.js +12 -2
  57. package/overlay/index.umd.js +1 -1
  58. package/overlay/style.css +1 -1
  59. package/package.json +2 -2
  60. package/pagination/index.es.js +10161 -278
  61. package/pagination/index.umd.js +27 -1
  62. package/pagination/style.css +1 -1
  63. package/panel/index.es.js +4 -0
  64. package/panel/index.umd.js +1 -1
  65. package/popover/index.es.js +13 -5
  66. package/popover/index.umd.js +9 -9
  67. package/popover/style.css +1 -1
  68. package/radio/index.es.js +14 -8
  69. package/radio/index.umd.js +4 -4
  70. package/radio/style.css +1 -1
  71. package/result/index.es.js +2 -1
  72. package/result/index.umd.js +1 -1
  73. package/result/style.css +1 -1
  74. package/search/index.es.js +20 -12
  75. package/search/index.umd.js +4 -4
  76. package/search/style.css +1 -1
  77. package/select/index.es.js +126 -104
  78. package/select/index.umd.js +10 -10
  79. package/select/style.css +1 -1
  80. package/skeleton/style.css +1 -1
  81. package/splitter/index.es.js +30 -7
  82. package/splitter/index.umd.js +16 -16
  83. package/splitter/style.css +1 -1
  84. package/status/index.es.js +4 -0
  85. package/status/index.umd.js +1 -1
  86. package/steps/index.es.js +2 -1
  87. package/steps/index.umd.js +1 -1
  88. package/steps/style.css +1 -1
  89. package/style.css +1 -1
  90. package/switch/index.es.js +14 -8
  91. package/switch/index.umd.js +13 -13
  92. package/switch/style.css +1 -1
  93. package/table/index.es.js +154 -60
  94. package/table/index.umd.js +7 -7
  95. package/table/style.css +1 -1
  96. package/tabs/index.es.js +54 -42
  97. package/tabs/index.umd.js +1 -1
  98. package/tabs/style.css +1 -1
  99. package/tag/style.css +1 -1
  100. package/textarea/index.es.js +17 -9
  101. package/textarea/index.umd.js +13 -13
  102. package/textarea/style.css +1 -1
  103. package/time-picker/index.es.js +151 -151
  104. package/time-picker/index.umd.js +14 -14
  105. package/time-picker/style.css +1 -1
  106. package/time-select/index.es.js +128 -106
  107. package/time-select/index.umd.js +13 -13
  108. package/time-select/style.css +1 -1
  109. package/timeline/index.es.js +2 -1
  110. package/timeline/index.umd.js +1 -1
  111. package/timeline/style.css +1 -1
  112. package/tooltip/index.es.js +28 -6
  113. package/tooltip/index.umd.js +7 -7
  114. package/tooltip/style.css +1 -1
  115. package/tree/index.es.js +42 -32
  116. package/tree/index.umd.js +7 -7
  117. package/tree/style.css +1 -1
  118. package/upload/index.es.js +9 -10
  119. package/upload/index.umd.js +1 -1
  120. package/upload/style.css +1 -1
  121. package/vue-devui.es.js +3580 -3269
  122. package/vue-devui.umd.js +20 -20
  123. package/nuxt/components/Loading.js +0 -3
package/table/style.css CHANGED
@@ -1 +1 @@
1
- .devui-table__sort-clickable{flex:1;height:20px;line-height:20px;margin-left:8px;margin-right:4px;vertical-align:-.55em;cursor:pointer}.devui-table__sort-default>svg g use{fill:var(--devui-dividing-line, #f2f2f3)}.devui-table__sort-default>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.devui-table__sort-default:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__sort-asc>svg g use,.devui-table__sort-desc>svg g use{fill:var(--devui-icon-fill-active, #252b3a)}.devui-table__sort-asc>svg g polygon,.devui-table__sort-desc>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.devui-table__sort-asc:hover>svg g use,.devui-table__sort-desc:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__sort-asc>svg g polygon:last-of-type{opacity:.3}.devui-table__sort-desc>svg g polygon:first-of-type{opacity:.3}.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-dropdown span.icon-chevron-down,.devui-dropdown span.icon-select-arrow{display:inline-block;vertical-align:text-top}.devui-dropdown__menu-wrap .devui-dropdown-menu{width:100%}.devui-dropdown-animation span.icon-chevron-down,.devui-dropdown-animation span.icon-select-arrow{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-dropdown.open span.icon-chevron-down,.devui-dropdown.open span.icon-select-arrow{transform:rotate(180deg)}.fade-in-top{animation:fadeInTop .2s cubic-bezier(.16,.75,.5,1)}.fade-in-bottom{animation:fadeInBottom .2s cubic-bezier(.16,.75,.5,1)}@keyframes fadeInTop{0%{opacity:.8;transform:scaleY(.8) translateY(4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}@keyframes fadeInBottom{0%{opacity:.8;transform:scaleY(.8) translateY(-4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}.devui-dropdown--fade-bottom-enter-from,.devui-dropdown--fade-bottom-leave-to{opacity:.8;transform:scaleY(.8) translateY(-4px)}.devui-dropdown--fade-bottom-enter-to,.devui-dropdown--fade-bottom-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown--fade-bottom-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown--fade-bottom-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-dropdown--fade-top-enter-from,.devui-dropdown--fade-top-leave-to{opacity:.8;transform:scaleY(.8) translateY(4px)}.devui-dropdown--fade-top-enter-to,.devui-dropdown--fade-top-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown--fade-top-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown--fade-top-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-icon__container{display:inline-block;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;line-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}@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.5)}to{transform:rotate(360deg) scale(1)}}.devui-loading__mask{z-index:var(--devui-z-index-full-page-overlay, 1080);position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #d7d8da);opacity:.3}.devui-loading__wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:var(--devui-z-index-full-page-overlay, 1080)}.devui-loading--hidden{overflow:hidden}.devui-loading__text{margin-left:10px}.devui-loading__area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-loading__busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-loading__busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-loading__busy-default-spinner .devui-loading__bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-loading__busy-default-spinner .devui-loading__bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-button{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 14px);line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-border-radius, 4px);border-width:1px;border-color:transparent;background-color:transparent}.devui-button:hover{cursor:pointer}.devui-button:disabled{cursor:not-allowed}.devui-button--is-loading{pointer-events:none}.devui-button--solid{color:var(--devui-light-text, #ffffff);min-width:64px}.devui-button--solid i{color:var(--devui-light-text, #ffffff)}.devui-button--solid--secondary{color:var(--devui-text, #252b3a);border-color:var(--devui-btn-common-border-color, var(--devui-line, #d7d8da));background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:hover{color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:focus{color:var(--devui-btn-common-color-active, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:active{color:var(--devui-btn-common-color-active, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:disabled{opacity:.8}.devui-button--solid--primary{background-color:var(--devui-primary, #5e7ce0)}.devui-button--solid--primary:hover{background-color:var(--devui-primary-hover, #7693f5)}.devui-button--solid--primary:focus{background-color:var(--devui-primary-hover, #7693f5)}.devui-button--solid--primary:active{background-color:var(--devui-primary-active, #344899)}.devui-button--solid--primary:disabled{color:var(--devui-light-text, #ffffff);background:var(--devui-primary-disabled, #beccfa);border:none}.devui-button--solid--danger{background-color:var(--devui-contrast, #c7000b)}.devui-button--solid--danger:hover{background-color:var(--devui-contrast-hover, #d64a52)}.devui-button--solid--danger:focus{background-color:var(--devui-contrast-hover, #d64a52)}.devui-button--solid--danger:active{background-color:var(--devui-contrast-active, #b12220)}.devui-button--solid--danger:disabled{background-color:var(--devui-contrast-disabled, #ffbcba)}.devui-button--outline{background-color:var(--devui-block, #ffffff);border-style:solid}.devui-button--outline--secondary{color:var(--devui-text, #252b3a);border-color:var(--devui-line, #d7d8da)}.devui-button--outline--secondary:hover{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:focus{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:active{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:disabled{color:var(--devui-disabled-text, #adb0b8);border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-button--outline--primary{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--primary:hover{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:focus{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:active{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:disabled{opacity:.8;color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--danger{color:var(--devui-contrast, #c7000b);border-color:var(--devui-contrast, #c7000b)}.devui-button--outline--danger:hover,.devui-button--outline--danger:focus,.devui-button--outline--danger:active,.devui-button--outline--danger:disabled{opacity:.8}.devui-button--text{padding:0}.devui-button--text--secondary{color:var(--devui-text, #252b3a)}.devui-button--text--secondary:hover{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:focus{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:active{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:disabled{color:var(--devui-disabled-text, #adb0b8)}.devui-button--text--primary{color:var(--devui-brand-active, #526ecc)}.devui-button--text--primary:hover{color:var(--devui-link-active, #526ecc)}.devui-button--text--primary:focus{color:var(--devui-brand-active-focus, #344899)}.devui-button--text--primary:active{color:var(--devui-brand-active-focus, #344899)}.devui-button--text--primary:disabled{opacity:.8}.devui-button--text--danger{color:var(--devui-contrast, #c7000b)}.devui-button--text--danger:hover,.devui-button--text--danger:focus,.devui-button--text--danger:active,.devui-button--text--danger:disabled{opacity:.8}.devui-button--xs{padding:0 4px;height:20px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-button--sm{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-button--lg{padding:var(--devui-btn-lg-padding, 0 24px);height:36px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-button.devui-button__icon:not(.devui-button--solid):hover,.devui-button.devui-button__icon:not(.devui-button--solid):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-button.devui-button__icon:not(.devui-button--solid):disabled{background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap{color:var(--devui-text, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap .devui-button__icon-fix{color:var(--devui-text-weak, #575d6c)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover .devui-button__icon-fix{color:var(--devui-icon-fill-active, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover .button-content{color:var(--devui-brand, #5e7ce0)}.devui-button--circle{border-radius:100%}.devui-button--round{border-radius:20px}.devui-loading .devui-loading-default-spinner div{background-color:var(--devui-text, #252b3a)}.devui-button{transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;border-style:solid}.devui-button.devui-button__icon{padding:8px;line-height:1em;min-width:unset}.devui-button.devui-button__icon:not(.devui-button--circle){border:1px solid transparent}.devui-button.devui-button__icon.devui-button--xs,.devui-button.devui-button__icon.devui-button--sm{padding:4px;min-width:24px}.devui-button.devui-button__icon.devui-button--lg{min-width:32px}.devui-button.devui-button__icon.devui-button--lg .icon{font-size:var(--devui-font-size-icon, 16px)}.devui-button.devui-button__icon.devui-button--circle.devui-button--xs,.devui-button.devui-button__icon.devui-button--circle.devui-button--sm{width:24px}.devui-button.devui-button__icon.devui-button--circle.devui-button--lg{width:32px}.devui-button:not(.devui-button__icon) .icon-fix{font-size:var(--devui-font-size-icon, 16px)}.devui-button__icon-fix{position:relative;font-size:var(--devui-font-size, 14px)}.button-content{display:inline-block;position:relative}.clear-right-5{margin-right:5px}.devui-button-group{display:flex}.devui-button-group>*{position:relative}.devui-button-group>*:not(:first-child),.devui-button-group>*:not(:first-child) .devui-button{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.devui-button-group>*:not(:first-child).devui-button--solid--primary,.devui-button-group>*:not(:first-child) .devui-button.devui-button--solid--primary{border-left:1px solid var(--devui-brand-hover, #7693f5);margin-left:0}.devui-button-group>*:not(:last-child),.devui-button-group>*:not(:last-child) .devui-button{border-top-right-radius:0;border-bottom-right-radius:0}.devui-button-group>*:hover,.devui-button-group>*:active{z-index:1}.devui-button-group>*:focus-within{z-index:1}.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)}.devui-list{padding-bottom:4px;border-radius:var(--devui-border-radius, 4px);box-sizing:border-box;background-clip:padding-box;background-color:var(--devui-connected-overlay-bg, #ffffff);outline:none}.devui-list-item{display:flex;align-items:center;width:100%;height:36px;line-height:36px;padding:0 8px;color:var(--devui-text, #252b3a);box-sizing:border-box;cursor:pointer;transition:color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-list-item:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-list-item:active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.filter-wrapper{width:200px;background-color:var(--devui-connected-overlay-bg, #ffffff);border-radius:var(--devui-border-radius, 4px)}.filter-wrapper .filter-all-check{padding:0 8px 4px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.filter-wrapper .filter-multiple-menu{width:100%;padding:4px 8px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.filter-wrapper .filter-operation{display:flex;justify-content:center;align-items:center;padding:0 8px;height:26px}.filter-wrapper .filter-single-menu{width:100%}.filter-wrapper .filter-item{display:flex;align-items:center;height:30px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.filter-icon{flex:1;display:block;height:16px;text-align:right;cursor:pointer}.filter-icon>svg g{fill:var(--devui-dividing-line, #f2f2f3)}.filter-icon:hover>svg g{fill:var(--devui-icon-fill-active-hover, #252b3a)}.filter-item-active{background:var(--devui-list-item-active-bg, #f2f5fc);color:var(--devui-list-item-active-text, #252b3a)}.filter-icon-active{visibility:visible!important}.filter-icon-active>svg g{fill:var(--devui-icon-fill-active, #252b3a)}.filter-icon-active:hover>svg g{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__thead tr{border:none;background-color:var(--devui-base-bg, #ffffff)}.devui-table__thead tr th{display:table-cell;text-align:left;padding:0;border:none;border-bottom:1px solid var(--devui-line, #d7d8da)}.devui-table__thead tr th.is-left{text-align:left}.devui-table__thead tr th.is-center{text-align:center}.devui-table__thead tr th.is-right{text-align:right}.devui-table__thead tr .operable:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-table__thead tr .resizeable:hover .resize-handle{border-right:1px solid var(--devui-line, #d7d8da)}.devui-table__thead tr .resizeable .resize-handle:hover{border-right:2px solid var(--devui-form-control-line-active, #5e7ce0)}.devui-table__thead tr .sort-active,.devui-table__thead tr .filter-active{background-color:var(--devui-list-item-hover-bg, #f2f2f3);border-radius:var(--devui-border-radius, 4px) 0 0 var(--devui-border-radius, 4px)}.devui-table__thead .header-container{position:relative;display:flex;align-items:center;padding-left:20px;padding-right:8px}.devui-table__thead .header-container .title{display:inline-block;max-width:calc(100% - 18px);font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a);font-weight:700;line-height:36px;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.devui-table__thead .header-container .resize-handle{display:inline-block;position:absolute;right:0;top:0;bottom:0;width:5px;cursor:col-resize}.devui-table__thead .header-container .resize-overlay{position:absolute;display:block;top:0;left:0;bottom:0;right:0;z-index:1000}.devui-table__thead .devui-table__checkable-cell .header-container{padding-left:0}.devui-table--header-bg thead.devui-table__thead tr{background:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-table__tbody tr{font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a);background-color:var(--devui-base-bg, #ffffff);border:none}.devui-table__tbody tr.hover-enabled:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-table__tbody tr td .icon-expand-row:hover{cursor:pointer}.devui-table__tbody tr.expanded td .icon-expand-row{transform:rotate(45deg)}.devui-table__tbody tr td{background-clip:padding-box;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:24px;border:none;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table__tbody tr td.is-left{text-align:left}.devui-table__tbody tr td.is-center{text-align:center}.devui-table__tbody tr td.is-right{text-align:right}.devui-table__tbody tr td .editable-cell{position:relative;cursor:pointer}.devui-table__tbody tr td .editable-cell:hover:after{content:"";display:block;position:absolute;width:100%;height:100%;top:0;left:0;border:1px solid var(--devui-line, #d7d8da);border-radius:var(--devui-border-radius, 4px);pointer-events:none}.devui-table__tbody tr td .devui-table__cell .cell-text{height:28px;line-height:28px;padding-left:8px;overflow:hidden;text-overflow:ellipsis}.devui-table__tbody .is-hidden{display:none}.devui-table__lazy__flag{width:0;height:0}.devui-table--sticky-cell{position:sticky;z-index:5;background-color:inherit}.devui-table--sticky-cell.left{box-shadow:#0000000d var(--devui-shadow-length-slide-right, 2px 0 8px 0)}.devui-table--sticky-cell.right{box-shadow:#0000000d var(--devui-shadow-length-slide-left, -2px 0 8px 0)}.devui-tooltip{max-width:200px;min-height:26px;padding:4px 16px;font-size:var(--devui-font-size, 14px);color:var(--devui-feedback-overlay-text, #dfe1e6);letter-spacing:0;line-height:1.5;background:var(--devui-feedback-overlay-bg, #464d6e);box-shadow:none;overflow-wrap:break-word;word-break:break-word;word-wrap:break-word;text-align:start;border-radius:var(--devui-border-radius-feedback, 4px);font-style:normal;font-weight:400;line-break:auto;text-decoration:none;text-shadow:none;text-transform:none;word-spacing:normal;white-space:normal;opacity:1;z-index:var(--devui-z-index-pop-up, 1060)}.devui-tooltip--fade-bottom-enter-from,.devui-tooltip--fade-bottom-leave-to,.devui-tooltip--fade-top-enter-from,.devui-tooltip--fade-top-leave-to{opacity:.8;transform:scaleY(.8)}.devui-tooltip--fade-bottom-enter-to,.devui-tooltip--fade-bottom-leave-from,.devui-tooltip--fade-top-enter-to,.devui-tooltip--fade-top-leave-from{opacity:1;transform:scaleY(1)}.devui-tooltip--fade-bottom-enter-active,.devui-tooltip--fade-top-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-tooltip--fade-bottom-leave-active,.devui-tooltip--fade-top-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-tooltip--fade-left-enter-from,.devui-tooltip--fade-left-leave-to,.devui-tooltip--fade-right-enter-from,.devui-tooltip--fade-right-leave-to{opacity:.8;transform:scaleX(.8)}.devui-tooltip--fade-left-enter-to,.devui-tooltip--fade-left-leave-from,.devui-tooltip--fade-right-enter-to,.devui-tooltip--fade-right-leave-from{opacity:1;transform:scaleX(1)}.devui-tooltip--fade-left-enter-active,.devui-tooltip--fade-right-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-tooltip--fade-left-leave-active,.devui-tooltip--fade-right-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-table{position:relative;display:flex;width:100%;overflow-x:auto}.devui-table .hidden-columns{position:absolute;visibility:hidden;z-index:-1}.devui-table__container{flex:1;overflow:auto}.devui-table__view{display:table;table-layout:fixed;width:100%;border-spacing:0;border-collapse:collapse;border:none;margin:0;padding:0}.devui-table--striped tbody tr:nth-child(even){background-color:var(--devui-list-item-strip-bg, #f2f5fc)}.devui-table__empty{padding:40px 0;background-color:var(--devui-base-bg, #ffffff)}.devui-table__fix-header{display:flex;flex-direction:column;position:relative;height:100%}.devui-table__scroll-view{flex:1;overflow:scroll}.devui-table--layout-auto{table-layout:auto}.devui-table--sm tbody>tr>td{font-size:var(--devui-font-size-sm, 12px);padding:7px 20px 8px}.devui-table--sm tbody>tr>td.devui-table__checkable-cell{padding:8px}.devui-table--sm thead>tr>th.devui-table__checkable-cell{padding:8px}.devui-table--md tbody>tr>td{font-size:var(--devui-font-size-md, 14px);padding:11px 20px 12px}.devui-table--md thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--lg tbody>tr>td{font-size:var(--devui-font-size-lg, 14px);padding:15px 20px 16px}.devui-table--lg thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--borderless tbody>tr>td{border-bottom:none}.devui-table--bordered tr{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered tr td{border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered thead tr th:first-child{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered thead tr th{border-top:1px solid var(--devui-dividing-line, #f2f2f3);border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table .resize-bar{display:none;position:absolute;top:0;bottom:0;width:2px;background-color:var(--devui-form-control-line-active, #5e7ce0);z-index:var(--devui-z-index-function-widget, 999);cursor:col-resize}.table-selector{user-select:none;cursor:col-resize}.devui-table__tbody tr .devui-table__tree-operate{padding-right:8px;cursor:pointer}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon rect{stroke:var(--devui-disabled-text, #adb0b8)}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon path{fill:var(--devui-disabled-text, #adb0b8)}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon.svg-icon-close rect:last-child{fill:var(--devui-disabled-text, #adb0b8);stroke:none}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon rect{stroke:var(--devui-icon-fill-active, #252b3a)}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon path{fill:var(--devui-icon-fill-active, #252b3a)}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon.svg-icon-close rect:last-child{fill:var(--devui-icon-fill-active, #252b3a);stroke:none}.devui-table__tbody tr .devui-table__tree-operate .svg-icon{transform:translateY(20%)}
1
+ .devui-table__sort-clickable{flex:1;height:20px;line-height:20px;margin-left:8px;margin-right:4px;vertical-align:-.55em;cursor:pointer}.devui-table__sort-default>svg g use{fill:var(--devui-dividing-line, #f2f2f3)}.devui-table__sort-default>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.devui-table__sort-default:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__sort-asc>svg g use,.devui-table__sort-desc>svg g use{fill:var(--devui-icon-fill-active, #252b3a)}.devui-table__sort-asc>svg g polygon,.devui-table__sort-desc>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.devui-table__sort-asc:hover>svg g use,.devui-table__sort-desc:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__sort-asc>svg g polygon:last-of-type{opacity:.3}.devui-table__sort-desc>svg g polygon:first-of-type{opacity:.3}.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-dropdown span.icon-chevron-down,.devui-dropdown span.icon-select-arrow{display:inline-block;vertical-align:text-top}.devui-dropdown__menu-wrap .devui-dropdown-menu{width:100%}.devui-dropdown-animation span.icon-chevron-down,.devui-dropdown-animation span.icon-select-arrow{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-dropdown.open span.icon-chevron-down,.devui-dropdown.open span.icon-select-arrow{transform:rotate(180deg)}.fade-in-top{animation:fadeInTop .2s cubic-bezier(.16,.75,.5,1)}.fade-in-bottom{animation:fadeInBottom .2s cubic-bezier(.16,.75,.5,1)}@keyframes fadeInTop{0%{opacity:.8;transform:scaleY(.8) translateY(4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}@keyframes fadeInBottom{0%{opacity:.8;transform:scaleY(.8) translateY(-4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}.devui-dropdown--fade-bottom-enter-from,.devui-dropdown--fade-bottom-leave-to{opacity:.8;transform:scaleY(.8) translateY(-4px)}.devui-dropdown--fade-bottom-enter-to,.devui-dropdown--fade-bottom-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown--fade-bottom-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown--fade-bottom-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-dropdown--fade-top-enter-from,.devui-dropdown--fade-top-leave-to{opacity:.8;transform:scaleY(.8) translateY(4px)}.devui-dropdown--fade-top-enter-to,.devui-dropdown--fade-top-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown--fade-top-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown--fade-top-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-icon__container{display:inline-block;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--no-slots i,.devui-icon--no-slots img{display:block}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;line-height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 2px);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}@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.5)}to{transform:rotate(360deg) scale(1)}}.devui-loading__mask{z-index:var(--devui-z-index-full-page-overlay, 1080);position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #d7d8da);opacity:.3}.devui-loading__wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:var(--devui-z-index-full-page-overlay, 1080)}.devui-loading--hidden{overflow:hidden}.devui-loading__text{margin-left:10px}.devui-loading__area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-loading__busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-loading__busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-loading__busy-default-spinner .devui-loading__bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-loading__busy-default-spinner .devui-loading__bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-button{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 14px);line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-border-radius, 2px);border-width:1px;border-color:transparent;background-color:transparent}.devui-button:hover{cursor:pointer}.devui-button:disabled{cursor:not-allowed}.devui-button--is-loading{pointer-events:none}.devui-button--solid{color:var(--devui-light-text, #ffffff);min-width:64px}.devui-button--solid i{color:var(--devui-light-text, #ffffff)}.devui-button--solid--secondary{color:var(--devui-text, #252b3a);border-color:var(--devui-btn-common-border-color, var(--devui-line, #d7d8da));background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:hover{color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:focus{color:var(--devui-btn-common-color-active, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:active{color:var(--devui-btn-common-color-active, var(--devui-brand-active, #526ecc));border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #5e7ce0));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-button--solid--secondary:disabled{opacity:.8}.devui-button--solid--primary{background-color:var(--devui-primary, #5e7ce0)}.devui-button--solid--primary:hover{background-color:var(--devui-primary-hover, #7693f5)}.devui-button--solid--primary:focus{background-color:var(--devui-primary-hover, #7693f5)}.devui-button--solid--primary:active{background-color:var(--devui-primary-active, #344899)}.devui-button--solid--primary:disabled{color:var(--devui-light-text, #ffffff);background:var(--devui-primary-disabled, #beccfa);border:none}.devui-button--solid--danger{background-color:var(--devui-contrast, #c7000b)}.devui-button--solid--danger:hover{background-color:var(--devui-contrast-hover, #d64a52)}.devui-button--solid--danger:focus{background-color:var(--devui-contrast-hover, #d64a52)}.devui-button--solid--danger:active{background-color:var(--devui-contrast-active, #b12220)}.devui-button--solid--danger:disabled{background-color:var(--devui-contrast-disabled, #ffbcba)}.devui-button--outline{background-color:var(--devui-block, #ffffff);border-style:solid}.devui-button--outline--secondary{color:var(--devui-text, #252b3a);border-color:var(--devui-line, #d7d8da)}.devui-button--outline--secondary:hover{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:focus{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:active{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--secondary:disabled{color:var(--devui-disabled-text, #adb0b8);border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-button--outline--primary{color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--primary:hover{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:focus{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:active{color:var(--devui-brand-active-focus, #344899);border-color:var(--devui-form-control-line-active-hover, #344899)}.devui-button--outline--primary:disabled{opacity:.8;color:var(--devui-brand-active, #526ecc);border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-button--outline--danger{color:var(--devui-contrast, #c7000b);border-color:var(--devui-contrast, #c7000b)}.devui-button--outline--danger:hover,.devui-button--outline--danger:focus,.devui-button--outline--danger:active,.devui-button--outline--danger:disabled{opacity:.8}.devui-button--text{padding:0}.devui-button--text--secondary{color:var(--devui-text, #252b3a)}.devui-button--text--secondary:hover{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:focus{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:active{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button--text--secondary:disabled{color:var(--devui-disabled-text, #adb0b8)}.devui-button--text--primary{color:var(--devui-brand-active, #526ecc)}.devui-button--text--primary:hover{color:var(--devui-link-active, #526ecc)}.devui-button--text--primary:focus{color:var(--devui-brand-active-focus, #344899)}.devui-button--text--primary:active{color:var(--devui-brand-active-focus, #344899)}.devui-button--text--primary:disabled{opacity:.8}.devui-button--text--danger{color:var(--devui-contrast, #c7000b)}.devui-button--text--danger:hover,.devui-button--text--danger:focus,.devui-button--text--danger:active,.devui-button--text--danger:disabled{opacity:.8}.devui-button--xs{padding:0 4px;height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-button--sm{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-button--lg{padding:var(--devui-btn-lg-padding, 0 24px);height:40px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-button.devui-button__icon:not(.devui-button--solid):hover,.devui-button.devui-button__icon:not(.devui-button--solid):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-button.devui-button__icon:not(.devui-button--solid):disabled{background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap{color:var(--devui-text, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap .devui-button__icon-fix{color:var(--devui-text-weak, #575d6c)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover{color:var(--devui-list-item-hover-text, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover .devui-button__icon-fix{color:var(--devui-icon-fill-active, #252b3a)}.devui-button:not(:disabled).devui-button--text.devui-button__icon-wrap:hover .button-content{color:var(--devui-brand, #5e7ce0)}.devui-button--circle{border-radius:100%}.devui-button--round{border-radius:20px}.devui-loading .devui-loading-default-spinner div{background-color:var(--devui-text, #252b3a)}.devui-button{transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;border-style:solid}.devui-button.devui-button__icon{padding:8px;line-height:1em;min-width:unset}.devui-button.devui-button__icon:not(.devui-button--circle){border:1px solid transparent}.devui-button.devui-button__icon.devui-button--xs,.devui-button.devui-button__icon.devui-button--sm{padding:4px;min-width:24px}.devui-button.devui-button__icon.devui-button--lg{min-width:32px}.devui-button.devui-button__icon.devui-button--lg .icon{font-size:var(--devui-font-size-icon, 16px)}.devui-button.devui-button__icon.devui-button--circle{width:32px}.devui-button.devui-button__icon.devui-button--circle.devui-button--xs,.devui-button.devui-button__icon.devui-button--circle.devui-button--sm{width:24px}.devui-button.devui-button__icon.devui-button--circle.devui-button--lg{width:40px}.devui-button:not(.devui-button__icon) .icon-fix{font-size:var(--devui-font-size-icon, 16px)}.devui-button__icon-fix{position:relative;font-size:var(--devui-font-size, 14px)}.button-content{display:inline-block;position:relative}.clear-right-5{margin-right:5px}.devui-button-group{display:flex}.devui-button-group>*{position:relative}.devui-button-group>*:not(:first-child),.devui-button-group>*:not(:first-child) .devui-button{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.devui-button-group>*:not(:first-child).devui-button--solid--primary,.devui-button-group>*:not(:first-child) .devui-button.devui-button--solid--primary{border-left:1px solid var(--devui-brand-hover, #7693f5);margin-left:0}.devui-button-group>*:not(:last-child),.devui-button-group>*:not(:last-child) .devui-button{border-top-right-radius:0;border-bottom-right-radius:0}.devui-button-group>*:hover,.devui-button-group>*:active{z-index:1}.devui-button-group>*:focus-within{z-index:1}.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}.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, 2px);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, 2px)}.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}.devui-checkbox__group{display:inline-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, 2px);border-bottom-left-radius:var(--devui-border-radius, 2px);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, 2px);border-bottom-right-radius:var(--devui-border-radius, 2px)}.devui-list{padding-bottom:4px;border-radius:var(--devui-border-radius, 2px);box-sizing:border-box;background-clip:padding-box;background-color:var(--devui-connected-overlay-bg, #ffffff);outline:none}.devui-list-item{display:flex;align-items:center;width:100%;height:36px;line-height:36px;padding:0 8px;color:var(--devui-text, #252b3a);box-sizing:border-box;cursor:pointer;transition:color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-list-item:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-list-item:active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.filter-wrapper{width:200px;background-color:var(--devui-connected-overlay-bg, #ffffff);border-radius:var(--devui-border-radius, 2px)}.filter-wrapper .filter-all-check{padding:0 8px 4px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.filter-wrapper .filter-multiple-menu{width:100%;padding:4px 8px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.filter-wrapper .filter-operation{display:flex;justify-content:center;align-items:center;padding:0 8px;height:26px}.filter-wrapper .filter-single-menu{width:100%}.filter-wrapper .filter-item{display:flex;align-items:center;height:30px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.filter-icon{flex:1;display:block;height:16px;text-align:right;cursor:pointer}.filter-icon>svg g{fill:var(--devui-dividing-line, #f2f2f3)}.filter-icon:hover>svg g{fill:var(--devui-icon-fill-active-hover, #252b3a)}.filter-item-active{background:var(--devui-list-item-active-bg, #f2f5fc);color:var(--devui-list-item-active-text, #252b3a)}.filter-icon-active{visibility:visible!important}.filter-icon-active>svg g{fill:var(--devui-icon-fill-active, #252b3a)}.filter-icon-active:hover>svg g{fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-table__thead tr{border:none;background-color:var(--devui-base-bg, #ffffff)}.devui-table__thead tr th{display:table-cell;text-align:left;padding:0;border:none;border-bottom:1px solid var(--devui-line, #d7d8da);background-color:inherit}.devui-table__thead tr th.is-left{text-align:left}.devui-table__thead tr th.is-center{text-align:center}.devui-table__thead tr th.is-right{text-align:right}.devui-table__thead tr .operable:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-table__thead tr .resizeable:hover .resize-handle{border-right:1px solid var(--devui-line, #d7d8da)}.devui-table__thead tr .resizeable .resize-handle:hover{border-right:2px solid var(--devui-form-control-line-active, #5e7ce0)}.devui-table__thead tr .sort-active,.devui-table__thead tr .filter-active{background-color:var(--devui-list-item-hover-bg, #f2f2f3);border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-table__thead .header-container{position:relative;display:flex;align-items:center;padding-left:20px;padding-right:8px}.devui-table__thead .header-container .title{display:inline-block;max-width:calc(100% - 18px);font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a);font-weight:700;line-height:36px;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.devui-table__thead .header-container .resize-handle{display:inline-block;position:absolute;right:0;top:0;bottom:0;width:5px;cursor:col-resize}.devui-table__thead .header-container .resize-overlay{position:absolute;display:block;top:0;left:0;bottom:0;right:0;z-index:1000}.devui-table__thead .devui-table__checkable-cell .header-container{padding-left:0}.devui-table--header-bg thead.devui-table__thead tr{background:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-table__tbody tr{font-size:var(--devui-font-size, 14px);color:var(--devui-text, #252b3a);background-color:var(--devui-base-bg, #ffffff);border:none}.devui-table__tbody tr.hover-enabled:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-table__tbody tr.hover-enabled:hover .devui-table--last-sticky-left{background:linear-gradient(to left,transparent,var(--devui-list-item-hover-bg, #f2f2f3) 10px)}.devui-table__tbody tr.hover-enabled:hover .devui-table--first-sticky-right{background:linear-gradient(to right,transparent,var(--devui-list-item-hover-bg, #f2f2f3) 10px)}.devui-table__tbody tr td .icon-expand-row:hover{cursor:pointer}.devui-table__tbody tr.expanded td .icon-expand-row{transform:rotate(45deg)}.devui-table__tbody tr td{background-clip:padding-box;background-color:inherit;vertical-align:middle;line-height:24px;border:none;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table__tbody tr td.is-left{text-align:left}.devui-table__tbody tr td.is-center{text-align:center}.devui-table__tbody tr td.is-right{text-align:right}.devui-table__tbody tr td .editable-cell{position:relative;margin-left:-8px;padding-left:8px;cursor:pointer}.devui-table__tbody tr td .editable-cell:hover:after{content:"";display:block;position:absolute;width:100%;height:100%;top:0;left:0;border:1px solid var(--devui-line, #d7d8da);border-radius:var(--devui-border-radius, 2px);pointer-events:none}.devui-table__tbody tr td .devui-table__cell{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.devui-table__tbody tr td .devui-table__cell .cell-text{height:32px;line-height:32px;overflow:hidden;text-overflow:ellipsis}.devui-table__tbody .is-hidden{display:none}.devui-table__lazy__flag{width:0;height:0}.devui-table--sticky-cell{position:sticky;z-index:5}.devui-table--scroll-middle .devui-table--last-sticky-left,.devui-table--scroll-right .devui-table--last-sticky-left{background:linear-gradient(to left,transparent,var(--devui-base-bg, #ffffff) 10px)}.devui-table--scroll-middle .devui-table--last-sticky-left:after,.devui-table--scroll-right .devui-table--last-sticky-left:after{content:"";position:absolute;top:0;right:0;bottom:0;width:10px;pointer-events:none;box-shadow:inset var(--devui-table-inset-shadow-left, 8px 0 8px -4px) var(--devui-light-shadow, rgba(37, 43, 58, .1))}.devui-table--scroll-middle .devui-table--first-sticky-right,.devui-table--scroll-left .devui-table--first-sticky-right{background:linear-gradient(to right,transparent,var(--devui-base-bg, #ffffff) 10px)}.devui-table--scroll-middle .devui-table--first-sticky-right:before,.devui-table--scroll-left .devui-table--first-sticky-right:before{content:"";position:absolute;top:0;left:0;bottom:0;width:10px;pointer-events:none;box-shadow:inset var(--devui-table-inset-shadow-right, -8px 0 8px -4px) var(--devui-light-shadow, rgba(37, 43, 58, .1))}.devui-tooltip{max-width:200px;min-height:26px;padding:4px 16px;font-size:var(--devui-font-size, 14px);color:var(--devui-feedback-overlay-text, #dfe1e6);letter-spacing:0;line-height:1.5;background:var(--devui-feedback-overlay-bg, #464d6e);box-shadow:none;overflow-wrap:break-word;word-break:break-word;word-wrap:break-word;text-align:start;border-radius:var(--devui-border-radius-feedback, 4px);font-style:normal;font-weight:400;line-break:auto;text-decoration:none;text-shadow:none;text-transform:none;word-spacing:normal;white-space:normal;opacity:1;z-index:var(--devui-z-index-pop-up, 1060)}.devui-tooltip--fade-bottom-enter-from,.devui-tooltip--fade-bottom-leave-to,.devui-tooltip--fade-top-enter-from,.devui-tooltip--fade-top-leave-to{opacity:.8;transform:scaleY(.8)}.devui-tooltip--fade-bottom-enter-to,.devui-tooltip--fade-bottom-leave-from,.devui-tooltip--fade-top-enter-to,.devui-tooltip--fade-top-leave-from{opacity:1;transform:scaleY(1)}.devui-tooltip--fade-bottom-enter-active,.devui-tooltip--fade-top-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-tooltip--fade-bottom-leave-active,.devui-tooltip--fade-top-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-tooltip--fade-left-enter-from,.devui-tooltip--fade-left-leave-to,.devui-tooltip--fade-right-enter-from,.devui-tooltip--fade-right-leave-to{opacity:.8;transform:scaleX(.8)}.devui-tooltip--fade-left-enter-to,.devui-tooltip--fade-left-leave-from,.devui-tooltip--fade-right-enter-to,.devui-tooltip--fade-right-leave-from{opacity:1;transform:scaleX(1)}.devui-tooltip--fade-left-enter-active,.devui-tooltip--fade-right-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-tooltip--fade-left-leave-active,.devui-tooltip--fade-right-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-table{position:relative;display:flex;width:100%;overflow-x:auto}.devui-table .hidden-columns{position:absolute;visibility:hidden;z-index:-1}.devui-table__container{flex:1;overflow:auto}.devui-table__view{display:table;table-layout:fixed;width:100%;border-spacing:0;border-collapse:collapse;border:none;margin:0;padding:0}.devui-table--striped tbody tr:nth-child(even){background-color:var(--devui-list-item-strip-bg, #f2f5fc)}.devui-table__empty{padding:40px 0;background-color:var(--devui-base-bg, #ffffff)}.devui-table__fix-header{display:flex;flex-direction:column;position:relative;height:100%;overflow:auto}.devui-table__fix-header>.devui-table__header-wrapper{position:sticky;top:0;z-index:10}.devui-table__scroll-view{flex:1}.devui-table--layout-auto{table-layout:auto}.devui-table--sm tbody>tr>td{font-size:var(--devui-font-size-sm, 12px);padding:7px 20px 8px}.devui-table--sm tbody>tr>td.devui-table__checkable-cell{padding:8px}.devui-table--sm thead>tr>th.devui-table__checkable-cell{padding:8px}.devui-table--md tbody>tr>td{font-size:var(--devui-font-size-md, 14px);padding:11px 20px 12px}.devui-table--md thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--lg tbody>tr>td{font-size:var(--devui-font-size-lg, 14px);padding:15px 20px 16px}.devui-table--lg thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--borderless tbody>tr>td{border-bottom:none}.devui-table--bordered tr{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered tr td{border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered thead tr th:first-child{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table--bordered thead tr th{border-top:1px solid var(--devui-dividing-line, #f2f2f3);border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-table .resize-bar{display:none;position:absolute;top:0;bottom:0;width:2px;background-color:var(--devui-form-control-line-active, #5e7ce0);z-index:var(--devui-z-index-function-widget, 999);cursor:col-resize}.table-selector{user-select:none;cursor:col-resize}.devui-table__tbody tr .devui-table__tree-operate{padding-right:8px;cursor:pointer}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon rect{stroke:var(--devui-disabled-text, #adb0b8)}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon path{fill:var(--devui-disabled-text, #adb0b8)}.devui-table__tbody tr .devui-table__tree-operate>svg.svg-icon.svg-icon-close rect:last-child{fill:var(--devui-disabled-text, #adb0b8);stroke:none}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon rect{stroke:var(--devui-icon-fill-active, #252b3a)}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon path{fill:var(--devui-icon-fill-active, #252b3a)}.devui-table__tbody tr .devui-table__tree-operate:hover>svg.svg-icon.svg-icon-close rect:last-child{fill:var(--devui-icon-fill-active, #252b3a);stroke:none}.devui-table__tbody tr .devui-table__tree-operate .svg-icon{transform:translateY(20%)}
package/tabs/index.es.js CHANGED
@@ -1,4 +1,4 @@
1
- import { toRefs, computed, defineComponent, shallowRef, reactive, inject, onUpdated, onBeforeMount, onMounted, watch, createVNode, resolveComponent, provide, mergeProps, onUnmounted } from "vue";
1
+ import { toRefs, computed, defineComponent, shallowRef, reactive, inject, onUpdated, onBeforeMount, onMounted, watch, createVNode, resolveComponent, provide, mergeProps, getCurrentInstance, onUnmounted } from "vue";
2
2
  const tabsProps = {
3
3
  modelValue: {
4
4
  type: [String, Number],
@@ -41,7 +41,6 @@ const tabsProps = {
41
41
  default: "top"
42
42
  }
43
43
  };
44
- var tabs = "";
45
44
  function createBem(namespace, element, modifier) {
46
45
  let cls = namespace;
47
46
  if (element) {
@@ -99,7 +98,7 @@ function useTabNavRender(props, data) {
99
98
  });
100
99
  return { ulClasses, aClasses, customStyle, sliderAnimationStyle };
101
100
  }
102
- function useTabNavFunction(props, tabs2, data, ctx, tabsEle) {
101
+ function useTabNavFunction(props, tabs, tabsList, data, ctx, tabsEle) {
103
102
  const update = () => {
104
103
  if (props.type === "slider") {
105
104
  setTimeout(() => {
@@ -132,17 +131,17 @@ function useTabNavFunction(props, tabs2, data, ctx, tabsEle) {
132
131
  return changeResult;
133
132
  };
134
133
  const activeClick = (item, tabEl) => {
135
- if (!props.reactivable && props.modelValue === item.id) {
134
+ const id = item.props.id;
135
+ if (!props.reactivable && props.modelValue === id) {
136
136
  return;
137
137
  }
138
- canChange(item.id).then((change) => {
139
- var _a, _b;
138
+ canChange(id).then((change) => {
140
139
  if (!change) {
141
140
  return;
142
141
  }
143
- const tab2 = (_b = (_a = tabs2 == null ? void 0 : tabs2.state) == null ? void 0 : _a.data) == null ? void 0 : _b.find((itemOption) => itemOption.id === item.id);
144
- if (tabs2 && tab2 && !tab2.disabled) {
145
- tabs2.state.active = item.id;
142
+ const tab2 = tabsList.value.find((itemOption) => itemOption.props.id === id);
143
+ if (tabs && tab2 && !tab2.props.disabled) {
144
+ tabs.state.active = id;
146
145
  if (props.type === "slider" && tabEl && tabsEle && tabsEle.value) {
147
146
  if (["left", "right"].includes(props.tabPosition)) {
148
147
  data.offsetLeft = tabEl.getBoundingClientRect().left - tabsEle.value.nativeElement.getBoundingClientRect().left;
@@ -152,19 +151,19 @@ function useTabNavFunction(props, tabs2, data, ctx, tabsEle) {
152
151
  }
153
152
  data.offsetWidth = tabEl.getBoundingClientRect().width;
154
153
  }
155
- ctx.emit("active-tab-change", tab2.id);
154
+ ctx.emit("active-tab-change", tab2.props.id);
156
155
  }
157
156
  });
158
157
  };
159
158
  const beforeMount = () => {
160
- if (props.type !== "slider" && props.modelValue === void 0 && (tabs2 == null ? void 0 : tabs2.state.data) && tabs2.state.data.length > 0) {
161
- activeClick(tabs2.state.data[0]);
159
+ if (props.type !== "slider" && props.modelValue === void 0 && tabsList.value && tabsList.value.length > 0) {
160
+ activeClick(tabsList.value[0]);
162
161
  }
163
162
  };
164
163
  const mounted = () => {
165
164
  var _a;
166
- if (props.type === "slider" && props.modelValue === void 0 && (tabs2 == null ? void 0 : tabs2.state.data) && tabs2.state.data.length > 0 && tabs2.state.data[0]) {
167
- const tabsStateData = tabs2.state.data[0];
165
+ if (props.type === "slider" && props.modelValue === void 0 && tabsList.value && tabsList.value.length > 0 && tabsList.value[0]) {
166
+ const tabsStateData = tabsList.value[0];
168
167
  const dom = (_a = tabsStateData.tabsEle) == null ? void 0 : _a.value;
169
168
  const ele = dom == null ? void 0 : dom.getElementById(tabsStateData.tabId);
170
169
  activeClick(ele);
@@ -178,8 +177,8 @@ function useTabNavFunction(props, tabs2, data, ctx, tabsEle) {
178
177
  function useTabNavEvent(ctx) {
179
178
  const onTabRemove = (item, ev) => {
180
179
  ev.stopPropagation();
181
- ctx.emit("tab-remove", item, ev);
182
- ctx.emit("tab-change", item.id, "delete");
180
+ ctx.emit("tab-remove", item.props, ev);
181
+ ctx.emit("tab-change", item.props.id, "delete");
183
182
  };
184
183
  const onTabAdd = () => {
185
184
  ctx.emit("tab-add");
@@ -202,7 +201,8 @@ var TabNav = defineComponent({
202
201
  offsetHeight: 0,
203
202
  id: null
204
203
  });
205
- const tabs2 = inject("tabs");
204
+ const tabs = inject("tabs");
205
+ const tabsList = computed(() => Object.values((tabs == null ? void 0 : tabs.state.data) || {}));
206
206
  const {
207
207
  ulClasses,
208
208
  aClasses,
@@ -215,7 +215,7 @@ var TabNav = defineComponent({
215
215
  mounted,
216
216
  activeClick,
217
217
  tabCanClose
218
- } = useTabNavFunction(props, tabs2, data, ctx, tabsEle);
218
+ } = useTabNavFunction(props, tabs, tabsList, data, ctx, tabsEle);
219
219
  const {
220
220
  onTabRemove,
221
221
  onTabAdd
@@ -224,8 +224,7 @@ var TabNav = defineComponent({
224
224
  onBeforeMount(() => beforeMount());
225
225
  onMounted(() => mounted());
226
226
  watch(() => props.modelValue, () => {
227
- var _a;
228
- const tab2 = (_a = tabs2 == null ? void 0 : tabs2.state.data) == null ? void 0 : _a.find((item) => item.id === props.modelValue);
227
+ const tab2 = tabsList.value.find((item) => item.props.id === props.modelValue);
229
228
  if (tab2) {
230
229
  activeClick(tab2);
231
230
  }
@@ -250,24 +249,23 @@ var TabNav = defineComponent({
250
249
  "ref": tabsEle,
251
250
  "role": "tablist",
252
251
  "class": ulClasses.value
253
- }, [((tabs2 == null ? void 0 : tabs2.state.data) || []).map((item, i) => {
254
- var _a, _b;
252
+ }, [(tabsList.value || []).map((item) => {
255
253
  return createVNode("li", {
256
254
  "role": "presentation",
257
255
  "onClick": () => {
258
256
  activeClick(item);
259
257
  },
260
- "class": (props.modelValue === (item.id || item.tabId) ? "active" : "") + (item.disabled ? " disabled" : ""),
261
- "id": item.id || item.tabId
258
+ "class": (props.modelValue === item.props.id ? "active" : "") + (item.props.disabled ? " disabled" : ""),
259
+ "id": item.props.id
262
260
  }, [createVNode("span", {
263
261
  "class": ns2.e("nav-content")
264
262
  }, [createVNode("a", {
265
263
  "role": "tab",
266
- "data-toggle": item.id,
267
- "aria-expanded": props.modelValue === (item.id || item.tabId),
264
+ "data-toggle": item.props.id,
265
+ "aria-expanded": props.modelValue === item.props.id,
268
266
  "class": aClasses.value,
269
267
  "style": customStyle
270
- }, [(tabs2 == null ? void 0 : tabs2.state.slots[i]) ? (_b = (_a = tabs2.state.slots)[i]) == null ? void 0 : _b.call(_a) : createVNode("span", null, [item.title])]), closeIconEl(item)])]);
268
+ }, [item.slots.title ? item.slots.title() : createVNode("span", null, [item.props.title])]), closeIconEl(item)])]);
271
269
  }), newButton, createVNode("div", {
272
270
  "class": ns2.e(`nav-${props.type}-animation`),
273
271
  "style": sliderAnimationStyle.value
@@ -307,13 +305,24 @@ var Tabs = defineComponent({
307
305
  emits: ["update:modelValue", "active-tab-change", "tab-remove", "tab-add", "tab-change"],
308
306
  setup(props, ctx) {
309
307
  const state = reactive({
310
- data: [],
308
+ data: {},
311
309
  active: props.modelValue,
312
- showContent: props.showContent,
313
- slots: []
310
+ showContent: props.showContent
314
311
  });
312
+ const addTab = (tabCtx) => {
313
+ if (tabCtx.uid) {
314
+ state.data[tabCtx.uid] = tabCtx;
315
+ }
316
+ };
317
+ const deleteTab = (uid) => {
318
+ if (uid) {
319
+ delete state.data[uid];
320
+ }
321
+ };
315
322
  provide("tabs", {
316
- state
323
+ state,
324
+ addTab,
325
+ deleteTab
317
326
  });
318
327
  const {
319
328
  onUpdateModelValue,
@@ -370,27 +379,30 @@ var Tab = defineComponent({
370
379
  setup(props, {
371
380
  slots
372
381
  }) {
373
- var _a;
374
- const tabs2 = inject("tabs");
375
- tabs2 == null ? void 0 : tabs2.state.slots.push(slots.title);
376
- (_a = tabs2 == null ? void 0 : tabs2.state.data) == null ? void 0 : _a.push(props);
382
+ const tabs = inject("tabs");
377
383
  const ns2 = useNamespace("tab");
384
+ const instance = getCurrentInstance();
385
+ const tabContext = reactive({
386
+ uid: instance == null ? void 0 : instance.uid,
387
+ slots,
388
+ props
389
+ });
390
+ onMounted(() => {
391
+ tabs == null ? void 0 : tabs.addTab(tabContext);
392
+ });
378
393
  onUnmounted(() => {
379
- var _a2;
380
- if (tabs2) {
381
- tabs2.state.data = (_a2 = tabs2.state.data) == null ? void 0 : _a2.filter((tab2) => tab2.id !== props.id);
382
- }
394
+ tabs == null ? void 0 : tabs.deleteTab(tabContext.uid);
383
395
  });
384
396
  return () => {
385
- var _a2;
397
+ var _a;
386
398
  const {
387
399
  id
388
400
  } = props;
389
- const content = (tabs2 == null ? void 0 : tabs2.state.showContent) && tabs2.state.active === id ? createVNode("div", {
401
+ const content = (tabs == null ? void 0 : tabs.state.showContent) && tabs.state.active === id ? createVNode("div", {
390
402
  "class": ns2.e("content")
391
403
  }, [createVNode("div", {
392
404
  "role": "tabpanel"
393
- }, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)])]) : null;
405
+ }, [(_a = slots.default) == null ? void 0 : _a.call(slots)])]) : null;
394
406
  return content;
395
407
  };
396
408
  }
package/tabs/index.umd.js CHANGED
@@ -1 +1 @@
1
- (function(b,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(b=typeof globalThis!="undefined"?globalThis:b||self,n(b.index={},b.Vue))})(this,function(b,n){"use strict";const w={modelValue:{type:[String,Number],default:null},type:{type:String,default:"tabs"},showContent:{type:Boolean,default:!0},reactivable:{type:Boolean,default:!0},customWidth:{type:String,default:""},cssClass:{type:String,default:""},beforeChange:{type:Function,default:null},closeable:{type:Boolean,default:!1},addable:{type:Boolean,default:!1},tabPosition:{type:String,default:"top"}};var _="";function y(e,a,t){let s=e;return a&&(s+=`__${a}`),t&&(s+=`--${t}`),s}function V(e,a=!1){const t=a?`.devui-${e}`:`devui-${e}`;return{b:()=>y(t),e:o=>o?y(t,o):"",m:o=>o?y(t,"",o):"",em:(o,m)=>o&&m?y(t,o,m):""}}const h=V("tabs");function I(e,a){const{cssClass:t,tabPosition:s,customWidth:i}=n.toRefs(e),l=n.computed(()=>({[h.e("nav")]:!0,[h.em("nav",e.type)]:!0,[t.value]:Boolean(t.value),[h.em("nav","top")]:s.value==="top",[h.em("nav","right")]:s.value==="right",[h.em("nav","bottom")]:s.value==="bottom",[h.em("nav","left")]:s.value==="left"})),u=n.computed(()=>({["custom-width"]:Boolean(i.value)})),o={width:e.customWidth?e.customWidth:""},m=n.computed(()=>["top","bottom"].includes(e.tabPosition)?{left:a.offsetLeft+"px",width:a.offsetWidth+"px"}:{top:a.offsetTop+"px",height:a.offsetHeight+"px",width:a.offsetWidth+"px"});return{ulClasses:l,aClasses:u,customStyle:o,sliderAnimationStyle:m}}function $(e,a,t,s,i){const l=()=>{e.type==="slider"&&setTimeout(()=>{var c;const d=(c=i.value)==null?void 0:c.querySelector("#"+e.modelValue+".active");d&&i.value&&(["top","bottom"].includes(e.tabPosition)?t.offsetLeft=d.getBoundingClientRect().left-i.value.getBoundingClientRect().left:(t.offsetTop=d.getBoundingClientRect().top-i.value.getBoundingClientRect().top,t.offsetHeight=d.getBoundingClientRect().height),t.offsetWidth=d.getBoundingClientRect().width)})},u=d=>{let c=Promise.resolve(!0);if(typeof e.beforeChange=="function"){const r=e.beforeChange(d);typeof r!="undefined"&&(r.then?c=r:c=Promise.resolve(r))}return c},o=(d,c)=>{!e.reactivable&&e.modelValue===d.id||u(d.id).then(r=>{var p,B;if(!r)return;const g=(B=(p=a==null?void 0:a.state)==null?void 0:p.data)==null?void 0:B.find(v=>v.id===d.id);a&&g&&!g.disabled&&(a.state.active=d.id,e.type==="slider"&&c&&i&&i.value&&(["left","right"].includes(e.tabPosition)?t.offsetLeft=c.getBoundingClientRect().left-i.value.nativeElement.getBoundingClientRect().left:(t.offsetTop=c.getBoundingClientRect().top-i.value.nativeElement.getBoundingClientRect().top,t.offsetHeight=c.getBoundingClientRect().height),t.offsetWidth=c.getBoundingClientRect().width),s.emit("active-tab-change",g.id))})};return{update:l,activeClick:o,beforeMount:()=>{e.type!=="slider"&&e.modelValue===void 0&&(a==null?void 0:a.state.data)&&a.state.data.length>0&&o(a.state.data[0])},mounted:()=>{var d;if(e.type==="slider"&&e.modelValue===void 0&&(a==null?void 0:a.state.data)&&a.state.data.length>0&&a.state.data[0]){const c=a.state.data[0],r=(d=c.tabsEle)==null?void 0:d.value,g=r==null?void 0:r.getElementById(c.tabId);o(g)}},tabCanClose:d=>(e.closeable||d.closeable)&&!d.disabled}}function U(e){return{onTabRemove:(s,i)=>{i.stopPropagation(),e.emit("tab-remove",s,i),e.emit("tab-change",s.id,"delete")},onTabAdd:()=>{e.emit("tab-add"),e.emit("tab-change",void 0,"add")}}}var F="",j=n.defineComponent({name:"DTabNav",props:w,emits:["active-tab-change","tab-remove","tab-add","tab-change"],setup(e,a){const t=V("tabs"),s=n.shallowRef(),i=n.reactive({offsetLeft:0,offsetWidth:0,offsetTop:0,offsetHeight:0,id:null}),l=n.inject("tabs"),{ulClasses:u,aClasses:o,customStyle:m,sliderAnimationStyle:C}=I(e,i),{update:T,beforeMount:d,mounted:c,activeClick:r,tabCanClose:g}=$(e,l,i,a,s),{onTabRemove:p,onTabAdd:B}=U(a);return n.onUpdated(()=>T()),n.onBeforeMount(()=>d()),n.onMounted(()=>c()),n.watch(()=>e.modelValue,()=>{var N;const v=(N=l==null?void 0:l.state.data)==null?void 0:N.find(f=>f.id===e.modelValue);v&&r(v)}),()=>{const v=f=>g(f)?n.createVNode("span",{class:t.e("close-btn"),onClick:R=>p(f,R)},[n.createVNode(n.resolveComponent("d-icon"),{size:"12px",name:"error-o"},null)]):null,N=e.addable?n.createVNode("li",{class:t.e("new-tab"),onClick:B},[n.createVNode(n.resolveComponent("d-icon"),{name:"add"},null)]):null;return n.createVNode("ul",{ref:s,role:"tablist",class:u.value},[((l==null?void 0:l.state.data)||[]).map((f,R)=>{var M,W;return n.createVNode("li",{role:"presentation",onClick:()=>{r(f)},class:(e.modelValue===(f.id||f.tabId)?"active":"")+(f.disabled?" disabled":""),id:f.id||f.tabId},[n.createVNode("span",{class:t.e("nav-content")},[n.createVNode("a",{role:"tab","data-toggle":f.id,"aria-expanded":e.modelValue===(f.id||f.tabId),class:o.value,style:m},[(l==null?void 0:l.state.slots[R])?(W=(M=l.state.slots)[R])==null?void 0:W.call(M):n.createVNode("span",null,[f.title])]),v(f)])])}),N,n.createVNode("div",{class:t.e(`nav-${e.type}-animation`),style:C.value},null)])}}});const A=V("tabs");function k(e){return{onUpdateModelValue:u=>{e.emit("update:modelValue",u)},onActiveTabChange:u=>{e.emit("active-tab-change",u)},onTabRemove:(u,o)=>{e.emit("tab-remove",u,o)},onTabAdd:()=>{e.emit("tab-add")},onTabChange:(u,o)=>{e.emit("tab-change",u,o)}}}function D(e){return{tabsClasses:n.computed(()=>({[A.b()]:!0,[A.m(e.tabPosition)]:!0}))}}var P=n.defineComponent({name:"DTabs",props:w,emits:["update:modelValue","active-tab-change","tab-remove","tab-add","tab-change"],setup(e,a){const t=n.reactive({data:[],active:e.modelValue,showContent:e.showContent,slots:[]});n.provide("tabs",{state:t});const{onUpdateModelValue:s,onActiveTabChange:i,onTabRemove:l,onTabAdd:u,onTabChange:o}=k(a),{tabsClasses:m}=D(e);return n.watch(()=>t.active,()=>{s(t.active)}),()=>{var d,c;const C=n.createVNode(j,n.mergeProps(e,{onActiveTabChange:i,onTabRemove:l,onTabAdd:u,onTabChange:o}),null),T=(c=(d=a.slots).default)==null?void 0:c.call(d);return n.createVNode("div",{class:m.value},[e.tabPosition==="bottom"?[T,C]:[C,T],n.createVNode("div",{style:"clear: both"},null)])}}});const H={title:{type:[String,Number],default:null},id:{type:String,default:null},disabled:{type:Boolean,default:!1},closeable:{type:Boolean,default:!1}};var q="",S=n.defineComponent({name:"DTab",props:H,setup(e,{slots:a}){var i;const t=n.inject("tabs");t==null||t.state.slots.push(a.title),(i=t==null?void 0:t.state.data)==null||i.push(e);const s=V("tab");return n.onUnmounted(()=>{var l;t&&(t.state.data=(l=t.state.data)==null?void 0:l.filter(u=>u.id!==e.id))}),()=>{var o;const{id:l}=e;return(t==null?void 0:t.state.showContent)&&t.state.active===l?n.createVNode("div",{class:s.e("content")},[n.createVNode("div",{role:"tabpanel"},[(o=a.default)==null?void 0:o.call(a)])]):null}}}),L={title:"Tabs \u9009\u9879\u5361",category:"\u5BFC\u822A",status:"100%",install(e){e.component(P.name,P),e.component(S.name,S)}};b.Tab=S,b.Tabs=P,b.default=L,b.tabsProps=w,Object.defineProperty(b,"__esModule",{value:!0}),b[Symbol.toStringTag]="Module"});
1
+ (function(g,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(g=typeof globalThis!="undefined"?globalThis:g||self,t(g.index={},g.Vue))})(this,function(g,t){"use strict";const N={modelValue:{type:[String,Number],default:null},type:{type:String,default:"tabs"},showContent:{type:Boolean,default:!0},reactivable:{type:Boolean,default:!0},customWidth:{type:String,default:""},cssClass:{type:String,default:""},beforeChange:{type:Function,default:null},closeable:{type:Boolean,default:!1},addable:{type:Boolean,default:!1},tabPosition:{type:String,default:"top"}};function C(e,a,n){let o=e;return a&&(o+=`__${a}`),n&&(o+=`--${n}`),o}function T(e,a=!1){const n=a?`.devui-${e}`:`devui-${e}`;return{b:()=>C(n),e:s=>s?C(n,s):"",m:s=>s?C(n,"",s):"",em:(s,f)=>s&&f?C(n,s,f):""}}const h=T("tabs");function M(e,a){const{cssClass:n,tabPosition:o,customWidth:r}=t.toRefs(e),l=t.computed(()=>({[h.e("nav")]:!0,[h.em("nav",e.type)]:!0,[n.value]:Boolean(n.value),[h.em("nav","top")]:o.value==="top",[h.em("nav","right")]:o.value==="right",[h.em("nav","bottom")]:o.value==="bottom",[h.em("nav","left")]:o.value==="left"})),i=t.computed(()=>({["custom-width"]:Boolean(r.value)})),s={width:e.customWidth?e.customWidth:""},f=t.computed(()=>["top","bottom"].includes(e.tabPosition)?{left:a.offsetLeft+"px",width:a.offsetWidth+"px"}:{top:a.offsetTop+"px",height:a.offsetHeight+"px",width:a.offsetWidth+"px"});return{ulClasses:l,aClasses:i,customStyle:s,sliderAnimationStyle:f}}function W(e,a,n,o,r,l){const i=()=>{e.type==="slider"&&setTimeout(()=>{var c;const d=(c=l.value)==null?void 0:c.querySelector("#"+e.modelValue+".active");d&&l.value&&(["top","bottom"].includes(e.tabPosition)?o.offsetLeft=d.getBoundingClientRect().left-l.value.getBoundingClientRect().left:(o.offsetTop=d.getBoundingClientRect().top-l.value.getBoundingClientRect().top,o.offsetHeight=d.getBoundingClientRect().height),o.offsetWidth=d.getBoundingClientRect().width)})},s=d=>{let c=Promise.resolve(!0);if(typeof e.beforeChange=="function"){const u=e.beforeChange(d);typeof u!="undefined"&&(u.then?c=u:c=Promise.resolve(u))}return c},f=(d,c)=>{const u=d.props.id;!e.reactivable&&e.modelValue===u||s(u).then(v=>{if(!v)return;const p=n.value.find(P=>P.props.id===u);a&&p&&!p.props.disabled&&(a.state.active=u,e.type==="slider"&&c&&l&&l.value&&(["left","right"].includes(e.tabPosition)?o.offsetLeft=c.getBoundingClientRect().left-l.value.nativeElement.getBoundingClientRect().left:(o.offsetTop=c.getBoundingClientRect().top-l.value.nativeElement.getBoundingClientRect().top,o.offsetHeight=c.getBoundingClientRect().height),o.offsetWidth=c.getBoundingClientRect().width),r.emit("active-tab-change",p.props.id))})};return{update:i,activeClick:f,beforeMount:()=>{e.type!=="slider"&&e.modelValue===void 0&&n.value&&n.value.length>0&&f(n.value[0])},mounted:()=>{var d;if(e.type==="slider"&&e.modelValue===void 0&&n.value&&n.value.length>0&&n.value[0]){const c=n.value[0],u=(d=c.tabsEle)==null?void 0:d.value,v=u==null?void 0:u.getElementById(c.tabId);f(v)}},tabCanClose:d=>(e.closeable||d.closeable)&&!d.disabled}}function $(e){return{onTabRemove:(o,r)=>{r.stopPropagation(),e.emit("tab-remove",o.props,r),e.emit("tab-change",o.props.id,"delete")},onTabAdd:()=>{e.emit("tab-add"),e.emit("tab-change",void 0,"add")}}}var _="",j=t.defineComponent({name:"DTabNav",props:N,emits:["active-tab-change","tab-remove","tab-add","tab-change"],setup(e,a){const n=T("tabs"),o=t.shallowRef(),r=t.reactive({offsetLeft:0,offsetWidth:0,offsetTop:0,offsetHeight:0,id:null}),l=t.inject("tabs"),i=t.computed(()=>Object.values((l==null?void 0:l.state.data)||{})),{ulClasses:s,aClasses:f,customStyle:y,sliderAnimationStyle:V}=M(e,r),{update:m,beforeMount:d,mounted:c,activeClick:u,tabCanClose:v}=W(e,l,i,r,a,o),{onTabRemove:p,onTabAdd:P}=$(a);return t.onUpdated(()=>m()),t.onBeforeMount(()=>d()),t.onMounted(()=>c()),t.watch(()=>e.modelValue,()=>{const B=i.value.find(S=>S.props.id===e.modelValue);B&&u(B)}),()=>{const B=b=>v(b)?t.createVNode("span",{class:n.e("close-btn"),onClick:I=>p(b,I)},[t.createVNode(t.resolveComponent("d-icon"),{size:"12px",name:"error-o"},null)]):null,S=e.addable?t.createVNode("li",{class:n.e("new-tab"),onClick:P},[t.createVNode(t.resolveComponent("d-icon"),{name:"add"},null)]):null;return t.createVNode("ul",{ref:o,role:"tablist",class:s.value},[(i.value||[]).map(b=>t.createVNode("li",{role:"presentation",onClick:()=>{u(b)},class:(e.modelValue===b.props.id?"active":"")+(b.props.disabled?" disabled":""),id:b.props.id},[t.createVNode("span",{class:n.e("nav-content")},[t.createVNode("a",{role:"tab","data-toggle":b.props.id,"aria-expanded":e.modelValue===b.props.id,class:f.value,style:y},[b.slots.title?b.slots.title():t.createVNode("span",null,[b.props.title])]),B(b)])])),S,t.createVNode("div",{class:n.e(`nav-${e.type}-animation`),style:V.value},null)])}}});const A=T("tabs");function U(e){return{onUpdateModelValue:i=>{e.emit("update:modelValue",i)},onActiveTabChange:i=>{e.emit("active-tab-change",i)},onTabRemove:(i,s)=>{e.emit("tab-remove",i,s)},onTabAdd:()=>{e.emit("tab-add")},onTabChange:(i,s)=>{e.emit("tab-change",i,s)}}}function k(e){return{tabsClasses:t.computed(()=>({[A.b()]:!0,[A.m(e.tabPosition)]:!0}))}}var R=t.defineComponent({name:"DTabs",props:N,emits:["update:modelValue","active-tab-change","tab-remove","tab-add","tab-change"],setup(e,a){const n=t.reactive({data:{},active:e.modelValue,showContent:e.showContent}),o=m=>{m.uid&&(n.data[m.uid]=m)},r=m=>{m&&delete n.data[m]};t.provide("tabs",{state:n,addTab:o,deleteTab:r});const{onUpdateModelValue:l,onActiveTabChange:i,onTabRemove:s,onTabAdd:f,onTabChange:y}=U(a),{tabsClasses:V}=k(e);return t.watch(()=>n.active,()=>{l(n.active)}),()=>{var c,u;const m=t.createVNode(j,t.mergeProps(e,{onActiveTabChange:i,onTabRemove:s,onTabAdd:f,onTabChange:y}),null),d=(u=(c=a.slots).default)==null?void 0:u.call(c);return t.createVNode("div",{class:V.value},[e.tabPosition==="bottom"?[d,m]:[m,d],t.createVNode("div",{style:"clear: both"},null)])}}});const D={title:{type:[String,Number],default:null},id:{type:String,default:null},disabled:{type:Boolean,default:!1},closeable:{type:Boolean,default:!1}};var F="",w=t.defineComponent({name:"DTab",props:D,setup(e,{slots:a}){const n=t.inject("tabs"),o=T("tab"),r=t.getCurrentInstance(),l=t.reactive({uid:r==null?void 0:r.uid,slots:a,props:e});return t.onMounted(()=>{n==null||n.addTab(l)}),t.onUnmounted(()=>{n==null||n.deleteTab(l.uid)}),()=>{var f;const{id:i}=e;return(n==null?void 0:n.state.showContent)&&n.state.active===i?t.createVNode("div",{class:o.e("content")},[t.createVNode("div",{role:"tabpanel"},[(f=a.default)==null?void 0:f.call(a)])]):null}}}),H={title:"Tabs \u9009\u9879\u5361",category:"\u5BFC\u822A",status:"100%",install(e){e.component(R.name,R),e.component(w.name,w)}};g.Tab=w,g.Tabs=R,g.default=H,g.tabsProps=N,Object.defineProperty(g,"__esModule",{value:!0}),g[Symbol.toStringTag]="Module"});
package/tabs/style.css CHANGED
@@ -1 +1 @@
1
- :host{display:block}.devui-tabs__nav--tabs,.devui-tabs__nav--pills{font-size:var(--devui-font-size, 14px);background:transparent;list-style:none}.devui-tabs__nav--tabs li,.devui-tabs__nav--pills li{cursor:pointer;border:2px solid transparent}.devui-tabs__nav--tabs li a,.devui-tabs__nav--pills li a{cursor:pointer;border:none;line-height:30px;background-color:transparent;padding:0;text-decoration:none;color:var(--devui-aide-text, #71757f)}.devui-tabs__nav--tabs li a:hover,.devui-tabs__nav--tabs li a:focus,.devui-tabs__nav--tabs li a:active,.devui-tabs__nav--pills li a:hover,.devui-tabs__nav--pills li a:focus,.devui-tabs__nav--pills li a:active{outline:none}.devui-tabs__nav--tabs li.disabled a,.devui-tabs__nav--pills li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--tabs li.active a,.devui-tabs__nav--tabs li:hover:not(.disabled) a,.devui-tabs__nav--pills li.active a,.devui-tabs__nav--pills li:hover:not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs li:after,.devui-tabs__nav--pills li:after{content:"";display:block;margin:auto;height:2px;width:0;background:transparent;transition:width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--tabs li.active:after,.devui-tabs__nav--pills li.active:after{width:100%;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs .devui-tabs__new-tab,.devui-tabs__nav--pills .devui-tabs__new-tab{padding:2px 0 0}.devui-tabs__nav--options{background:var(--devui-base-bg, #ffffff);border:1px solid var(--devui-dividing-line, #f2f2f3);border-radius:var(--devui-border-radius, 4px);padding:2px;width:fit-content}.devui-tabs__nav--options>li{cursor:pointer;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 4px);transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),text-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--options>li span>a{border:none;color:var(--devui-aide-text, #71757f);line-height:26px;padding:0 16px}.devui-tabs__nav--options>li span>a:hover,.devui-tabs__nav--options>li span>a:focus,.devui-tabs__nav--options>li span>a:active{outline:none}.devui-tabs__nav--options>li.active{background-color:var(--devui-brand-foil, #f2f2f3)}.devui-tabs__nav--options>li.active span>a{color:var(--devui-brand, #5e7ce0);padding:0 16px}.devui-tabs__nav--options>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--options>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--options>li.active span>a:hover,.devui-tabs__nav--options>li:hover:not(.disabled) span>a:hover{color:var(--devui-brand, #5e7ce0);background:transparent}.devui-tabs__nav--options .devui-tabs__close-btn{margin-right:12px}.devui-tabs__nav--options .devui-tabs__new-tab{padding:2px 16px 0}.devui-tabs__nav--slider{font-size:var(--devui-font-size, 14px);border:none;border-radius:var(--devui-border-radius, 4px);background:var(--devui-list-item-hover-bg, #f2f2f3);width:fit-content;display:flex;align-items:center;position:relative}.devui-tabs__nav--slider>li{cursor:pointer;margin:2px;position:relative;z-index:1}.devui-tabs__nav--slider>li:first-child{border-left-width:1px;border-radius:var(--devui-border-radius, 4px) 0 0 var(--devui-border-radius, 4px)}.devui-tabs__nav--slider>li:last-child{border-radius:0 var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0}.devui-tabs__nav--slider>li a{cursor:pointer;border:none;color:var(--devui-aide-text, #71757f);line-height:28px;padding:0 16px}.devui-tabs__nav--slider>li a:hover,.devui-tabs__nav--slider>li a:focus,.devui-tabs__nav--slider>li a:active{outline:none}.devui-tabs__nav--slider>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--slider>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--slider>li.active a,.devui-tabs__nav--slider>li:hover:not(.disabled) a{color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--slider>li.active a:hover,.devui-tabs__nav--slider>li:hover:not(.disabled) a:hover{color:var(--devui-brand-active, #526ecc);background:transparent}.devui-tabs__nav--slider>li.active{text-shadow:0 0 .7px var(--devui-brand, #5e7ce0)}.devui-tabs__nav--slider>li:hover:not(.active):not(.disabled){color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--slider .devui-tabs__close-btn{margin-right:12px}.devui-tabs__nav--slider .devui-tabs__new-tab{padding:2px 16px 0}.devui-tabs__nav--wrapped{font-size:var(--devui-font-size, 14px);background:transparent;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3);background-color:var(--devui-base-bg, #ffffff)}.devui-tabs__nav--wrapped>li{cursor:pointer;position:relative;padding:8px 16px}.devui-tabs__nav--wrapped>li a{cursor:pointer;border:none;color:var(--devui-aide-text, #71757f);border-radius:var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0 0}.devui-tabs__nav--wrapped>li a:hover,.devui-tabs__nav--wrapped>li a:focus,.devui-tabs__nav--wrapped>li a:active{outline:none}.devui-tabs__nav--wrapped>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--wrapped>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--wrapped>li.active{border:1px solid var(--devui-dividing-line, #f2f2f3);background:var(--devui-global-bg, #f8f8fa);border-radius:var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0 0;margin:-1px;border-bottom-color:transparent}.devui-tabs__nav--wrapped>li.active a{color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--wrapped>li:hover:not(.active):not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs{border-bottom:1px var(--devui-line, #d7d8da) solid}.devui-tabs__nav--tabs li{margin-left:32px;margin-bottom:-3px}.devui-tabs__nav--tabs li:first-child{margin-left:0}.devui-tabs__nav--pills>li{margin-left:32px}.devui-tabs__nav--pills>li:first-child{margin-left:0}.devui-tabs__nav{display:flex;align-items:center;list-style:none;padding-left:0}.devui-tabs__nav li a{text-decoration:none}.devui-tabs__nav li a.custom-width{display:inline-block;padding:0;text-align:center}.devui-tabs__nav--right,.devui-tabs__nav--left{margin:0}.devui-tabs__nav--right .devui-tabs__nav-slider-animation,.devui-tabs__nav--left .devui-tabs__nav-slider-animation{transition:top var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--right .devui-tabs__new-tab,.devui-tabs__nav--left .devui-tabs__new-tab{text-align:center}.devui-tabs__nav--right{display:block;float:right;border-bottom:none;margin-left:10px}.devui-tabs__nav--right>li{margin-left:0;padding:0 16px;position:relative}.devui-tabs__nav--right>li:after{display:none}.devui-tabs__nav--right>li:before{content:" ";position:absolute;top:0;left:-5px;margin:auto;height:0;width:2px;background:transparent;transition:height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--right>li.active:before{height:100%;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--left{display:block;float:left;border-bottom:none;margin-right:10px}.devui-tabs__nav--left>li{margin-left:0;padding:0 16px;position:relative}.devui-tabs__nav--left>li:after{content:" ";position:absolute;top:0;right:-5px;margin:auto;height:0;width:2px;background:transparent;transition:height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--left>li.active:after{height:100%;width:2px;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav-content{display:flex;align-items:center}.devui-tabs__nav--options{padding-left:2px}.devui-tabs__nav-slider-animation{position:absolute;z-index:0;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 4px);box-shadow:0 2px 4px 0 var(--devui-light-shadow, rgba(37, 43, 58, .1));top:1px;height:30px;transition:left var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__new-tab .devui-icon__container:hover,.devui-tabs__close-btn .devui-icon__container:hover{color:var(--devui-text, #252b3a)}.devui-tabs__new-tab .devui-icon__container>i,.devui-tabs__close-btn .devui-icon__container>i{transition:none}.devui-tabs__new-tab .devui-icon__container{color:var(--devui-aide-text, #71757f)}.devui-tabs__close-btn{margin-left:12px}.devui-tabs__close-btn .devui-icon__container{color:var(--devui-form-control-line, #d7d8da)}.devui-tabs--right .devui-tabs__nav--options,.devui-tabs--right .devui-tabs__nav--wrapped,.devui-tabs--left .devui-tabs__nav--options,.devui-tabs--left .devui-tabs__nav--wrapped{border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--right .devui-tabs__nav--options>li:after,.devui-tabs--right .devui-tabs__nav--wrapped>li:after,.devui-tabs--left .devui-tabs__nav--options>li:after,.devui-tabs--left .devui-tabs__nav--wrapped>li:after{display:none}.devui-tabs--right .devui-tabs__nav--options>li:before,.devui-tabs--right .devui-tabs__nav--wrapped>li:before,.devui-tabs--left .devui-tabs__nav--options>li:before,.devui-tabs--left .devui-tabs__nav--wrapped>li:before{display:none}.devui-tabs--right .devui-tabs__nav--wrapped,.devui-tabs--left .devui-tabs__nav--wrapped{border-bottom:none}.devui-tabs--right .devui-tabs__nav--wrapped>li,.devui-tabs--left .devui-tabs__nav--wrapped>li{padding:8px 16px}.devui-tabs--right .devui-tabs__nav--slider>li:after,.devui-tabs--left .devui-tabs__nav--slider>li:after{display:none}.devui-tabs--right .devui-tabs__nav--slider>li:before,.devui-tabs--left .devui-tabs__nav--slider>li:before{display:none}.devui-tabs--right .devui-tabs__nav--slider .devui-tabs__nav-slider-animation,.devui-tabs--left .devui-tabs__nav--slider .devui-tabs__nav-slider-animation{left:1px}.devui-tabs--right .devui-tabs__nav--wrapped{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--right .devui-tabs__nav--wrapped>li a{border-radius:0 var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0}.devui-tabs--right .devui-tabs__nav--wrapped>li.active{border-radius:0 var(--devui-border-radius, 4px) var(--devui-border-radius, 4px) 0;border-bottom-color:var(--devui-dividing-line, #f2f2f3);border-left-color:transparent}.devui-tabs--right .devui-tabs__nav--tabs{border-left:1px solid var(--devui-line, #d7d8da)}.devui-tabs--left .devui-tabs__nav--wrapped{border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--left .devui-tabs__nav--wrapped>li a{border-radius:var(--devui-border-radius, 4px) 0 0 var(--devui-border-radius, 4px)}.devui-tabs--left .devui-tabs__nav--wrapped>li.active{border-radius:var(--devui-border-radius, 4px) 0 0 var(--devui-border-radius, 4px);border-bottom-color:var(--devui-dividing-line, #f2f2f3);border-right-color:transparent}.devui-tabs--left .devui-tabs__nav--tabs{border-right:1px solid var(--devui-line, #d7d8da)}.devui-tab__content{margin-top:10px;overflow:hidden;padding:10px 0}
1
+ :host{display:block}.devui-tabs__nav--tabs,.devui-tabs__nav--pills{font-size:var(--devui-font-size, 14px);background:transparent;list-style:none}.devui-tabs__nav--tabs li,.devui-tabs__nav--pills li{cursor:pointer;border:2px solid transparent}.devui-tabs__nav--tabs li a,.devui-tabs__nav--pills li a{cursor:pointer;border:none;line-height:30px;background-color:transparent;padding:0;text-decoration:none;color:var(--devui-aide-text, #71757f)}.devui-tabs__nav--tabs li a:hover,.devui-tabs__nav--tabs li a:focus,.devui-tabs__nav--tabs li a:active,.devui-tabs__nav--pills li a:hover,.devui-tabs__nav--pills li a:focus,.devui-tabs__nav--pills li a:active{outline:none}.devui-tabs__nav--tabs li.disabled a,.devui-tabs__nav--pills li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--tabs li.active a,.devui-tabs__nav--tabs li:hover:not(.disabled) a,.devui-tabs__nav--pills li.active a,.devui-tabs__nav--pills li:hover:not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs li:after,.devui-tabs__nav--pills li:after{content:"";display:block;margin:auto;height:2px;width:0;background:transparent;transition:width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--tabs li.active:after,.devui-tabs__nav--pills li.active:after{width:100%;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs .devui-tabs__new-tab,.devui-tabs__nav--pills .devui-tabs__new-tab{padding:2px 0 0}.devui-tabs__nav--options{background:var(--devui-base-bg, #ffffff);border:1px solid var(--devui-dividing-line, #f2f2f3);border-radius:var(--devui-border-radius, 2px);padding:2px;width:fit-content}.devui-tabs__nav--options>li{cursor:pointer;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),text-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--options>li span>a{border:none;color:var(--devui-aide-text, #71757f);line-height:26px;padding:0 16px}.devui-tabs__nav--options>li span>a:hover,.devui-tabs__nav--options>li span>a:focus,.devui-tabs__nav--options>li span>a:active{outline:none}.devui-tabs__nav--options>li.active{background-color:var(--devui-brand-foil, #f2f2f3)}.devui-tabs__nav--options>li.active span>a{color:var(--devui-brand, #5e7ce0);padding:0 16px}.devui-tabs__nav--options>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--options>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--options>li.active span>a:hover,.devui-tabs__nav--options>li:hover:not(.disabled) span>a:hover{color:var(--devui-brand, #5e7ce0);background:transparent}.devui-tabs__nav--options .devui-tabs__close-btn{margin-right:12px}.devui-tabs__nav--options .devui-tabs__new-tab{padding:2px 16px 0}.devui-tabs__nav--slider{font-size:var(--devui-font-size, 14px);border:none;border-radius:var(--devui-border-radius, 2px);background:var(--devui-list-item-hover-bg, #f2f2f3);width:fit-content;display:flex;align-items:center;position:relative}.devui-tabs__nav--slider>li{cursor:pointer;margin:2px;position:relative;z-index:1}.devui-tabs__nav--slider>li:first-child{border-left-width:1px;border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-tabs__nav--slider>li:last-child{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-tabs__nav--slider>li a{cursor:pointer;border:none;color:var(--devui-aide-text, #71757f);line-height:28px;padding:0 16px}.devui-tabs__nav--slider>li a:hover,.devui-tabs__nav--slider>li a:focus,.devui-tabs__nav--slider>li a:active{outline:none}.devui-tabs__nav--slider>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--slider>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--slider>li.active a,.devui-tabs__nav--slider>li:hover:not(.disabled) a{color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--slider>li.active a:hover,.devui-tabs__nav--slider>li:hover:not(.disabled) a:hover{color:var(--devui-brand-active, #526ecc);background:transparent}.devui-tabs__nav--slider>li.active{text-shadow:0 0 .7px var(--devui-brand, #5e7ce0)}.devui-tabs__nav--slider>li:hover:not(.active):not(.disabled){color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--slider .devui-tabs__close-btn{margin-right:12px}.devui-tabs__nav--slider .devui-tabs__new-tab{padding:2px 16px 0}.devui-tabs__nav--wrapped{font-size:var(--devui-font-size, 14px);background:transparent;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3);background-color:var(--devui-base-bg, #ffffff)}.devui-tabs__nav--wrapped>li{cursor:pointer;position:relative;padding:8px 16px}.devui-tabs__nav--wrapped>li a{cursor:pointer;border:none;color:var(--devui-aide-text, #71757f);border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0}.devui-tabs__nav--wrapped>li a:hover,.devui-tabs__nav--wrapped>li a:focus,.devui-tabs__nav--wrapped>li a:active{outline:none}.devui-tabs__nav--wrapped>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-tabs__nav--wrapped>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-tabs__nav--wrapped>li.active{border:1px solid var(--devui-dividing-line, #f2f2f3);background:var(--devui-global-bg, #f8f8fa);border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0;margin:-1px;border-bottom-color:transparent}.devui-tabs__nav--wrapped>li.active a{color:var(--devui-brand-active, #526ecc)}.devui-tabs__nav--wrapped>li:hover:not(.active):not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--tabs{border-bottom:1px var(--devui-line, #d7d8da) solid}.devui-tabs__nav--tabs li{margin-left:32px;margin-bottom:-3px}.devui-tabs__nav--tabs li:first-child{margin-left:0}.devui-tabs__nav--pills>li{margin-left:32px}.devui-tabs__nav--pills>li:first-child{margin-left:0}.devui-tabs__nav{display:flex;align-items:center;list-style:none;padding-left:0}.devui-tabs__nav li a{text-decoration:none}.devui-tabs__nav li a.custom-width{display:inline-block;padding:0;text-align:center}.devui-tabs__nav--right,.devui-tabs__nav--left{margin:0}.devui-tabs__nav--right .devui-tabs__nav-slider-animation,.devui-tabs__nav--left .devui-tabs__nav-slider-animation{transition:top var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--right .devui-tabs__new-tab,.devui-tabs__nav--left .devui-tabs__new-tab{text-align:center}.devui-tabs__nav--right{display:block;float:right;border-bottom:none;margin-left:10px}.devui-tabs__nav--right>li{margin-left:0;padding:0 16px;position:relative}.devui-tabs__nav--right>li:after{display:none}.devui-tabs__nav--right>li:before{content:" ";position:absolute;top:0;left:-5px;margin:auto;height:0;width:2px;background:transparent;transition:height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--right>li.active:before{height:100%;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav--left{display:block;float:left;border-bottom:none;margin-right:10px}.devui-tabs__nav--left>li{margin-left:0;padding:0 16px;position:relative}.devui-tabs__nav--left>li:after{content:" ";position:absolute;top:0;right:-5px;margin:auto;height:0;width:2px;background:transparent;transition:height var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__nav--left>li.active:after{height:100%;width:2px;background:var(--devui-brand, #5e7ce0)}.devui-tabs__nav-content{display:flex;align-items:center}.devui-tabs__nav--options{padding-left:2px}.devui-tabs__nav-slider-animation{position:absolute;z-index:0;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);box-shadow:0 2px 4px 0 var(--devui-light-shadow, rgba(37, 43, 58, .1));top:1px;height:30px;transition:left var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95)),width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-tabs__new-tab .devui-icon__container:hover,.devui-tabs__close-btn .devui-icon__container:hover{color:var(--devui-text, #252b3a)}.devui-tabs__new-tab .devui-icon__container>i,.devui-tabs__close-btn .devui-icon__container>i{transition:none}.devui-tabs__new-tab .devui-icon__container{color:var(--devui-aide-text, #71757f)}.devui-tabs__close-btn{margin-left:12px}.devui-tabs__close-btn .devui-icon__container{color:var(--devui-form-control-line, #d7d8da)}.devui-tabs--right .devui-tabs__nav--options,.devui-tabs--right .devui-tabs__nav--wrapped,.devui-tabs--left .devui-tabs__nav--options,.devui-tabs--left .devui-tabs__nav--wrapped{border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--right .devui-tabs__nav--options>li:after,.devui-tabs--right .devui-tabs__nav--wrapped>li:after,.devui-tabs--left .devui-tabs__nav--options>li:after,.devui-tabs--left .devui-tabs__nav--wrapped>li:after{display:none}.devui-tabs--right .devui-tabs__nav--options>li:before,.devui-tabs--right .devui-tabs__nav--wrapped>li:before,.devui-tabs--left .devui-tabs__nav--options>li:before,.devui-tabs--left .devui-tabs__nav--wrapped>li:before{display:none}.devui-tabs--right .devui-tabs__nav--wrapped,.devui-tabs--left .devui-tabs__nav--wrapped{border-bottom:none}.devui-tabs--right .devui-tabs__nav--wrapped>li,.devui-tabs--left .devui-tabs__nav--wrapped>li{padding:8px 16px}.devui-tabs--right .devui-tabs__nav--slider>li:after,.devui-tabs--left .devui-tabs__nav--slider>li:after{display:none}.devui-tabs--right .devui-tabs__nav--slider>li:before,.devui-tabs--left .devui-tabs__nav--slider>li:before{display:none}.devui-tabs--right .devui-tabs__nav--slider .devui-tabs__nav-slider-animation,.devui-tabs--left .devui-tabs__nav--slider .devui-tabs__nav-slider-animation{left:1px}.devui-tabs--right .devui-tabs__nav--wrapped{border-left:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--right .devui-tabs__nav--wrapped>li a{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-tabs--right .devui-tabs__nav--wrapped>li.active{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0;border-bottom-color:var(--devui-dividing-line, #f2f2f3);border-left-color:transparent}.devui-tabs--right .devui-tabs__nav--tabs{border-left:1px solid var(--devui-line, #d7d8da)}.devui-tabs--left .devui-tabs__nav--wrapped{border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-tabs--left .devui-tabs__nav--wrapped>li a{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-tabs--left .devui-tabs__nav--wrapped>li.active{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px);border-bottom-color:var(--devui-dividing-line, #f2f2f3);border-right-color:transparent}.devui-tabs--left .devui-tabs__nav--tabs{border-right:1px solid var(--devui-line, #d7d8da)}.devui-tab__content{margin-top:10px;overflow:hidden;padding:10px 0}
package/tag/style.css CHANGED
@@ -1 +1 @@
1
- @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}
1
+ @charset "UTF-8";.devui-tag{display:inline-block}.devui-tag .devui-tag__item{display:block;position:relative;padding:0 8px;height:20px;border:1px solid;border-radius:var(--devui-border-radius, 2px);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}
package/textarea/index.es.js CHANGED
@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
29
29
  }
30
30
  return target;
31
31
  };
32
- import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, withModifiers, createTextVNode, onBeforeUnmount, shallowRef } from "vue";
32
+ import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, createTextVNode, onBeforeUnmount, shallowRef } from "vue";
33
33
  import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
34
34
  const formProps = {
35
35
  data: {
@@ -5779,6 +5779,10 @@ const flexibleOverlayProps = {
5779
5779
  isArrowCenter: {
5780
5780
  type: Boolean,
5781
5781
  default: true
5782
+ },
5783
+ clickEventBubble: {
5784
+ type: Boolean,
5785
+ default: false
5782
5786
  }
5783
5787
  };
5784
5788
  function getScrollParent(element) {
@@ -5893,6 +5897,9 @@ const FlexibleOverlay = defineComponent({
5893
5897
  expose
5894
5898
  }) {
5895
5899
  const ns2 = useNamespace("flexible-overlay");
5900
+ const {
5901
+ clickEventBubble
5902
+ } = toRefs(props);
5896
5903
  const {
5897
5904
  arrowRef,
5898
5905
  overlayRef,
@@ -5906,7 +5913,10 @@ const FlexibleOverlay = defineComponent({
5906
5913
  return props.modelValue && createVNode("div", mergeProps({
5907
5914
  "ref": overlayRef,
5908
5915
  "class": ns2.b()
5909
- }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
5916
+ }, attrs, {
5917
+ "onClick": withModifiers(() => ({}), [clickEventBubble.value ? "" : "stop"]),
5918
+ "onPointerup": withModifiers(() => ({}), ["stop"])
5919
+ }), [(_a = slots.default) == null ? void 0 : _a.call(slots), props.showArrow && createVNode("div", {
5910
5920
  "ref": arrowRef,
5911
5921
  "class": ns2.e("arrow")
5912
5922
  }, null)]);
@@ -6024,7 +6034,7 @@ const TransformOriginMap = {
6024
6034
  function usePopover(props, visible, placement, origin, popoverRef) {
6025
6035
  const { trigger, isOpen } = toRefs(props);
6026
6036
  const overlayStyles = computed(() => ({
6027
- zIndex: 1060,
6037
+ zIndex: "var(--devui-z-index-pop-up, 1060)",
6028
6038
  transformOrigin: TransformOriginMap[placement.value]
6029
6039
  }));
6030
6040
  const onDocumentClick = (e) => {
@@ -6267,8 +6277,6 @@ var Popover = defineComponent({
6267
6277
  "style": overlayStyles.value
6268
6278
  }, attrs, {
6269
6279
  "onPositionChange": handlePositionChange,
6270
- "onClick": withModifiers(() => ({}), ["stop"]),
6271
- "onPointerup": withModifiers(() => ({}), ["stop"]),
6272
6280
  "onMouseenter": onMouseenter,
6273
6281
  "onMouseleave": onMouseleave
6274
6282
  }), {
@@ -6467,9 +6475,7 @@ var FormControl = defineComponent({
6467
6475
  }, {
6468
6476
  default: () => {
6469
6477
  var _a, _b;
6470
- return [createVNode("div", {
6471
- "class": ns2.e("control-content")
6472
- }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]), createTextVNode(",")];
6478
+ return [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)];
6473
6479
  }
6474
6480
  }), showFeedback.value && createVNode("span", {
6475
6481
  "class": [ns2.e("feedback-icon"), ns2.em("feedback-icon", feedbackStatus.value)]
@@ -7942,7 +7948,9 @@ var Textarea = defineComponent({
7942
7948
  });
7943
7949
  return () => {
7944
7950
  var _a;
7945
- return createVNode("div", null, [createVNode("textarea", mergeProps({
7951
+ return createVNode("div", {
7952
+ "style": "width: 100%"
7953
+ }, [createVNode("textarea", mergeProps({
7946
7954
  "ref": textarea2
7947
7955
  }, ctx.attrs, {
7948
7956
  "value": modelValue.value,