bkui-vue 2.0.1 → 2.0.2-beta.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +23 -23
- package/dist/index.esm.js +5684 -5650
- package/dist/index.umd.js +27 -27
- package/dist/style.css +1 -1
- package/dist/style.variable.css +1 -1
- package/lib/cascader/index.js +1669 -181
- package/lib/color-picker/index.js +1613 -170
- package/lib/components.d.ts +1 -2
- package/lib/components.js +1 -2
- package/lib/date-picker/date-picker.css +220 -4
- package/lib/date-picker/date-picker.less +5 -5
- package/lib/date-picker/date-picker.variable.css +237 -21
- package/lib/date-picker/index.js +1882 -470
- package/lib/directives/index.js +228 -111
- package/lib/form/index.js +1570 -162
- package/lib/image/index.js +1468 -164
- package/lib/index.d.ts +0 -1
- package/lib/index.js +1 -2
- package/lib/input/index.js +1301 -13
- package/lib/pop-confirm/index.d.ts +16 -2
- package/lib/pop-confirm/index.js +13 -5
- package/lib/pop-confirm/pop-confirm.d.ts +5 -1
- package/lib/popover/index.js +1356 -68
- package/lib/search-select/index.js +1329 -108
- package/lib/select/index.js +1237 -16
- package/lib/slider/index.js +2 -1
- package/lib/tab/index.js +1277 -10
- package/lib/table/index.js +1346 -125
- package/lib/tag-input/index.js +1278 -16
- package/lib/tree/index.d.ts +4 -0
- package/lib/tree/index.js +47 -23
- package/lib/tree/props.d.ts +1 -0
- package/lib/tree/tree.css +18 -0
- package/lib/tree/tree.d.ts +2 -0
- package/lib/tree/tree.less +24 -0
- package/lib/tree/tree.variable.css +18 -0
- package/lib/tree/use-node-action.d.ts +1 -1
- package/package.json +1 -1
- package/lib/plugin-popover/index.d.ts +0 -27
- package/lib/plugin-popover/index.js +0 -65
- package/lib/plugins/index.d.ts +0 -1
- package/lib/plugins/index.js +0 -64
    
        package/lib/components.d.ts
    CHANGED
    
    | @@ -32,9 +32,8 @@ export { default as Navigation } from './navigation'; | |
| 32 32 | 
             
            export { default as Notify } from './notify';
         | 
| 33 33 | 
             
            export { default as OverflowTitle } from './overflow-title';
         | 
| 34 34 | 
             
            export { default as Pagination } from './pagination';
         | 
| 35 | 
            -
            export { default as $bkPopover } from './plugin-popover';
         | 
| 36 35 | 
             
            export { default as PopConfirm } from './pop-confirm';
         | 
| 37 | 
            -
            export { default as Popover } from './popover';
         | 
| 36 | 
            +
            export { default as Popover, $bkPopover } from './popover';
         | 
| 38 37 | 
             
            export { default as Popover2 } from './popover2';
         | 
| 39 38 | 
             
            export { default as Process } from './process';
         | 
| 40 39 | 
             
            export { default as Progress } from './progress';
         | 
    
        package/lib/components.js
    CHANGED
    
    | @@ -56,9 +56,8 @@ export { default as Navigation } from './navigation'; | |
| 56 56 | 
             
            export { default as Notify } from './notify';
         | 
| 57 57 | 
             
            export { default as OverflowTitle } from './overflow-title';
         | 
| 58 58 | 
             
            export { default as Pagination } from './pagination';
         | 
| 59 | 
            -
            export { default as $bkPopover } from './plugin-popover';
         | 
| 60 59 | 
             
            export { default as PopConfirm } from './pop-confirm';
         | 
| 61 | 
            -
            export { default as Popover } from './popover';
         | 
| 60 | 
            +
            export { default as Popover, $bkPopover } from './popover';
         | 
| 62 61 | 
             
            export { default as Popover2 } from './popover2';
         | 
| 63 62 | 
             
            export { default as Process } from './process';
         | 
| 64 63 | 
             
            export { default as Progress } from './progress';
         | 
| @@ -1,3 +1,219 @@ | |
| 1 | 
            +
            .bk-time-picker-header {
         | 
| 2 | 
            +
              height: 46px;
         | 
| 3 | 
            +
              font-size: 14px;
         | 
| 4 | 
            +
              font-weight: 700;
         | 
| 5 | 
            +
              line-height: 46px;
         | 
| 6 | 
            +
              color: #63656e;
         | 
| 7 | 
            +
              text-align: center;
         | 
| 8 | 
            +
              border-bottom: 1px solid #dcdee5;
         | 
| 9 | 
            +
            }
         | 
| 10 | 
            +
            .bk-time-picker-cells:after {
         | 
| 11 | 
            +
              position: absolute;
         | 
| 12 | 
            +
              right: 0;
         | 
| 13 | 
            +
              left: 0;
         | 
| 14 | 
            +
              z-index: 1;
         | 
| 15 | 
            +
              height: 32px;
         | 
| 16 | 
            +
              padding-top: 6px;
         | 
| 17 | 
            +
              margin-top: 0;
         | 
| 18 | 
            +
              color: #3a84ff;
         | 
| 19 | 
            +
              text-align: left;
         | 
| 20 | 
            +
              pointer-events: none;
         | 
| 21 | 
            +
              background-color: rgba(58, 132, 255, 0.16);
         | 
| 22 | 
            +
              content: '';
         | 
| 23 | 
            +
              box-sizing: border-box;
         | 
| 24 | 
            +
              mix-blend-mode: multiply;
         | 
| 25 | 
            +
            }
         | 
| 26 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
         | 
| 27 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
         | 
| 28 | 
            +
              position: absolute;
         | 
| 29 | 
            +
              top: 55px;
         | 
| 30 | 
            +
              left: 85px;
         | 
| 31 | 
            +
              z-index: 1;
         | 
| 32 | 
            +
              width: 2px;
         | 
| 33 | 
            +
              padding-top: 2px;
         | 
| 34 | 
            +
              background-color: #3a84ff;
         | 
| 35 | 
            +
              border-radius: 50%;
         | 
| 36 | 
            +
              content: '';
         | 
| 37 | 
            +
            }
         | 
| 38 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
         | 
| 39 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
         | 
| 40 | 
            +
              position: absolute;
         | 
| 41 | 
            +
              top: calc(55px + 5px);
         | 
| 42 | 
            +
              left: 85px;
         | 
| 43 | 
            +
              z-index: 1;
         | 
| 44 | 
            +
              width: 2px;
         | 
| 45 | 
            +
              padding-top: 2px;
         | 
| 46 | 
            +
              background-color: #3a84ff;
         | 
| 47 | 
            +
              border-radius: 50%;
         | 
| 48 | 
            +
              content: '';
         | 
| 49 | 
            +
            }
         | 
| 50 | 
            +
            .bk-time-picker-cells-title-wrapper {
         | 
| 51 | 
            +
              width: 100%;
         | 
| 52 | 
            +
              height: 42px;
         | 
| 53 | 
            +
              line-height: 42px;
         | 
| 54 | 
            +
            }
         | 
| 55 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
         | 
| 56 | 
            +
              position: relative;
         | 
| 57 | 
            +
              float: left;
         | 
| 58 | 
            +
              width: 33.33%;
         | 
| 59 | 
            +
              font-size: 14px;
         | 
| 60 | 
            +
              font-weight: 700;
         | 
| 61 | 
            +
              color: #63656e;
         | 
| 62 | 
            +
              text-align: center;
         | 
| 63 | 
            +
              list-style: none;
         | 
| 64 | 
            +
            }
         | 
| 65 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
         | 
| 66 | 
            +
              color: #3a84ff;
         | 
| 67 | 
            +
            }
         | 
| 68 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
         | 
| 69 | 
            +
              position: absolute;
         | 
| 70 | 
            +
              top: 55px;
         | 
| 71 | 
            +
              left: 133px;
         | 
| 72 | 
            +
              z-index: 1;
         | 
| 73 | 
            +
              width: 2px;
         | 
| 74 | 
            +
              padding-top: 2px;
         | 
| 75 | 
            +
              background-color: #3a84ff;
         | 
| 76 | 
            +
              border-radius: 50%;
         | 
| 77 | 
            +
              content: '';
         | 
| 78 | 
            +
            }
         | 
| 79 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
         | 
| 80 | 
            +
              position: absolute;
         | 
| 81 | 
            +
              top: calc(55px + 5px);
         | 
| 82 | 
            +
              left: 133px;
         | 
| 83 | 
            +
              z-index: 1;
         | 
| 84 | 
            +
              width: 2px;
         | 
| 85 | 
            +
              padding-top: 2px;
         | 
| 86 | 
            +
              background-color: #3a84ff;
         | 
| 87 | 
            +
              border-radius: 50%;
         | 
| 88 | 
            +
              content: '';
         | 
| 89 | 
            +
            }
         | 
| 90 | 
            +
            .bk-time-picker-cells-list {
         | 
| 91 | 
            +
              position: relative;
         | 
| 92 | 
            +
              float: left;
         | 
| 93 | 
            +
              width: 33.33%;
         | 
| 94 | 
            +
              max-height: 200px;
         | 
| 95 | 
            +
              overflow: hidden;
         | 
| 96 | 
            +
            }
         | 
| 97 | 
            +
            .bk-time-picker-cells-list:hover {
         | 
| 98 | 
            +
              overflow-y: auto;
         | 
| 99 | 
            +
            }
         | 
| 100 | 
            +
            .bk-time-picker-cells-list:first-child {
         | 
| 101 | 
            +
              border-radius: 2px 0 0 2px;
         | 
| 102 | 
            +
            }
         | 
| 103 | 
            +
            .bk-time-picker-cells-list:last-child {
         | 
| 104 | 
            +
              border-radius: 0 2px 2px 0;
         | 
| 105 | 
            +
            }
         | 
| 106 | 
            +
            .bk-time-picker-cells-list::-webkit-scrollbar {
         | 
| 107 | 
            +
              width: 0;
         | 
| 108 | 
            +
              height: 0;
         | 
| 109 | 
            +
              background-color: rgba(204, 204, 204, 0);
         | 
| 110 | 
            +
            }
         | 
| 111 | 
            +
            .bk-time-picker-cells-list::-webkit-scrollbar-thumb {
         | 
| 112 | 
            +
              width: 0;
         | 
| 113 | 
            +
              height: 0;
         | 
| 114 | 
            +
              background-color: transparent;
         | 
| 115 | 
            +
            }
         | 
| 116 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul {
         | 
| 117 | 
            +
              width: 100%;
         | 
| 118 | 
            +
              padding: 0 0 168px 0;
         | 
| 119 | 
            +
              margin: 0;
         | 
| 120 | 
            +
              list-style: none;
         | 
| 121 | 
            +
            }
         | 
| 122 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
         | 
| 123 | 
            +
              position: relative;
         | 
| 124 | 
            +
              width: 100%;
         | 
| 125 | 
            +
              height: 32px;
         | 
| 126 | 
            +
              padding: 0;
         | 
| 127 | 
            +
              margin: 0;
         | 
| 128 | 
            +
              font-size: 12px;
         | 
| 129 | 
            +
              line-height: 32px;
         | 
| 130 | 
            +
              color: #63656e;
         | 
| 131 | 
            +
              text-align: center;
         | 
| 132 | 
            +
              list-style: none;
         | 
| 133 | 
            +
              cursor: pointer;
         | 
| 134 | 
            +
              box-sizing: content-box;
         | 
| 135 | 
            +
              transition: background 0.2s ease-in-out;
         | 
| 136 | 
            +
              user-select: none;
         | 
| 137 | 
            +
            }
         | 
| 138 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
         | 
| 139 | 
            +
              color: #3a84ff;
         | 
| 140 | 
            +
            }
         | 
| 141 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
         | 
| 142 | 
            +
              color: #c4c6cc;
         | 
| 143 | 
            +
              cursor: not-allowed;
         | 
| 144 | 
            +
            }
         | 
| 145 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
         | 
| 146 | 
            +
              color: #c4c6cc;
         | 
| 147 | 
            +
              cursor: not-allowed;
         | 
| 148 | 
            +
              background-color: #fff;
         | 
| 149 | 
            +
            }
         | 
| 150 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
         | 
| 151 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
         | 
| 152 | 
            +
              color: #3a84ff;
         | 
| 153 | 
            +
            }
         | 
| 154 | 
            +
            .bk-time-picker-header {
         | 
| 155 | 
            +
              height: 46px;
         | 
| 156 | 
            +
              font-size: 14px;
         | 
| 157 | 
            +
              font-weight: 700;
         | 
| 158 | 
            +
              line-height: 46px;
         | 
| 159 | 
            +
              color: #63656e;
         | 
| 160 | 
            +
              text-align: center;
         | 
| 161 | 
            +
              border-bottom: 1px solid #dcdee5;
         | 
| 162 | 
            +
            }
         | 
| 163 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content {
         | 
| 164 | 
            +
              position: relative;
         | 
| 165 | 
            +
              float: left;
         | 
| 166 | 
            +
            }
         | 
| 167 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content:after {
         | 
| 168 | 
            +
              position: absolute;
         | 
| 169 | 
            +
              top: 45px;
         | 
| 170 | 
            +
              right: 0;
         | 
| 171 | 
            +
              bottom: 0;
         | 
| 172 | 
            +
              z-index: 1;
         | 
| 173 | 
            +
              display: block;
         | 
| 174 | 
            +
              width: 1px;
         | 
| 175 | 
            +
              background: #e8eaec;
         | 
| 176 | 
            +
              content: '';
         | 
| 177 | 
            +
            }
         | 
| 178 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content-right {
         | 
| 179 | 
            +
              float: right;
         | 
| 180 | 
            +
            }
         | 
| 181 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content-right:after {
         | 
| 182 | 
            +
              right: auto;
         | 
| 183 | 
            +
              left: 0;
         | 
| 184 | 
            +
            }
         | 
| 185 | 
            +
            .bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
         | 
| 186 | 
            +
              border-radius: 0;
         | 
| 187 | 
            +
            }
         | 
| 188 | 
            +
            .bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
         | 
| 189 | 
            +
              border-radius: 0;
         | 
| 190 | 
            +
            }
         | 
| 191 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
         | 
| 192 | 
            +
              min-width: 216px;
         | 
| 193 | 
            +
              position: relative;
         | 
| 194 | 
            +
            }
         | 
| 195 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
         | 
| 196 | 
            +
              min-width: 216px;
         | 
| 197 | 
            +
            }
         | 
| 198 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
         | 
| 199 | 
            +
              width: 72px;
         | 
| 200 | 
            +
            }
         | 
| 201 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
         | 
| 202 | 
            +
              padding: 0;
         | 
| 203 | 
            +
            }
         | 
| 204 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
         | 
| 205 | 
            +
              width: 108px;
         | 
| 206 | 
            +
              max-height: 200px;
         | 
| 207 | 
            +
            }
         | 
| 208 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
         | 
| 209 | 
            +
              border-radius: 0;
         | 
| 210 | 
            +
            }
         | 
| 211 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
         | 
| 212 | 
            +
              border-radius: 0;
         | 
| 213 | 
            +
            }
         | 
| 214 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
         | 
| 215 | 
            +
              padding: 0 0 168px 0;
         | 
| 216 | 
            +
            }
         | 
| 1 217 | 
             
            .bk-date-picker {
         | 
| 2 218 | 
             
              display: inline-block;
         | 
| 3 219 | 
             
              width: 261px;
         | 
| @@ -16,6 +232,7 @@ | |
| 16 232 | 
             
              position: relative;
         | 
| 17 233 | 
             
            }
         | 
| 18 234 | 
             
            .bk-date-picker-rel .bk-date-picker-editor {
         | 
| 235 | 
            +
              box-sizing: border-box;
         | 
| 19 236 | 
             
              display: block;
         | 
| 20 237 | 
             
              width: 100%;
         | 
| 21 238 | 
             
              height: 32px;
         | 
| @@ -27,7 +244,6 @@ | |
| 27 244 | 
             
              border: 1px solid #c4c6cc;
         | 
| 28 245 | 
             
              border-radius: 2px;
         | 
| 29 246 | 
             
              outline: none;
         | 
| 30 | 
            -
              box-sizing: border-box;
         | 
| 31 247 | 
             
            }
         | 
| 32 248 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
         | 
| 33 249 | 
             
              border-color: transparent transparent #c4c6cc transparent;
         | 
| @@ -106,13 +322,13 @@ | |
| 106 322 | 
             
            .bk-date-picker-dropdown {
         | 
| 107 323 | 
             
              position: absolute;
         | 
| 108 324 | 
             
              z-index: 900;
         | 
| 325 | 
            +
              box-sizing: border-box;
         | 
| 109 326 | 
             
              padding: 5px 0 0 0;
         | 
| 110 327 | 
             
              overflow: auto;
         | 
| 111 328 | 
             
              background-color: #fff;
         | 
| 112 329 | 
             
              border: 1px solid #dcdee5;
         | 
| 113 330 | 
             
              border-radius: 2px;
         | 
| 114 331 | 
             
              box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
         | 
| 115 | 
            -
              box-sizing: border-box;
         | 
| 116 332 | 
             
            }
         | 
| 117 333 | 
             
            .bk-date-picker .bk-select-dropdown {
         | 
| 118 334 | 
             
              max-height: none;
         | 
| @@ -187,6 +403,7 @@ | |
| 187 403 | 
             
            }
         | 
| 188 404 | 
             
            .bk-picker-confirm {
         | 
| 189 405 | 
             
              display: flex;
         | 
| 406 | 
            +
              justify-content: flex-end;
         | 
| 190 407 | 
             
              height: 42px;
         | 
| 191 408 | 
             
              padding: 0 20px;
         | 
| 192 409 | 
             
              clear: both;
         | 
| @@ -195,7 +412,6 @@ | |
| 195 412 | 
             
              text-align: right;
         | 
| 196 413 | 
             
              background-color: #fafbfd;
         | 
| 197 414 | 
             
              border-top: 1px solid #dcdee5;
         | 
| 198 | 
            -
              justify-content: flex-end;
         | 
| 199 415 | 
             
            }
         | 
| 200 416 | 
             
            .bk-picker-confirm a {
         | 
| 201 417 | 
             
              color: #979ba5;
         | 
| @@ -326,10 +542,10 @@ span.bk-date-picker-cells-cell-disabled:hover { | |
| 326 542 | 
             
              bottom: 0;
         | 
| 327 543 | 
             
              left: 0;
         | 
| 328 544 | 
             
              display: block;
         | 
| 545 | 
            +
              content: '';
         | 
| 329 546 | 
             
              background: #e1ecff;
         | 
| 330 547 | 
             
              border: 0;
         | 
| 331 548 | 
             
              border-radius: 0;
         | 
| 332 | 
            -
              content: '';
         | 
| 333 549 | 
             
            }
         | 
| 334 550 | 
             
            .bk-date-picker-cells-cell-range em {
         | 
| 335 551 | 
             
              position: relative;
         | 
| @@ -1,5 +1,5 @@ | |
| 1 1 | 
             
            @import '../styles/themes/themes.less';
         | 
| 2 | 
            -
             | 
| 2 | 
            +
            @import '../time-picker/time-picker.less';
         | 
| 3 3 | 
             
            .@{bk-prefix}-date-picker {
         | 
| 4 4 | 
             
              display: inline-block;
         | 
| 5 5 | 
             
              width: 261px;
         | 
| @@ -22,6 +22,7 @@ | |
| 22 22 | 
             
              position: relative;
         | 
| 23 23 |  | 
| 24 24 | 
             
              .@{bk-prefix}-date-picker-editor {
         | 
| 25 | 
            +
                box-sizing: border-box;
         | 
| 25 26 | 
             
                display: block;
         | 
| 26 27 | 
             
                width: 100%;
         | 
| 27 28 | 
             
                height: 32px;
         | 
| @@ -33,7 +34,6 @@ | |
| 33 34 | 
             
                border: 1px solid @light-gray;
         | 
| 34 35 | 
             
                border-radius: 2px;
         | 
| 35 36 | 
             
                outline: none;
         | 
| 36 | 
            -
                box-sizing: border-box;
         | 
| 37 37 |  | 
| 38 38 | 
             
                &.only-bottom-border {
         | 
| 39 39 | 
             
                  border-color: transparent transparent @light-gray transparent;
         | 
| @@ -129,13 +129,13 @@ | |
| 129 129 | 
             
            .@{bk-prefix}-date-picker-dropdown {
         | 
| 130 130 | 
             
              position: absolute;
         | 
| 131 131 | 
             
              z-index: 900;
         | 
| 132 | 
            +
              box-sizing: border-box;
         | 
| 132 133 | 
             
              padding: 5px 0 0 0;
         | 
| 133 134 | 
             
              overflow: auto;
         | 
| 134 135 | 
             
              background-color: @date-picker-dropdown-bg;
         | 
| 135 136 | 
             
              border: 1px solid @disable-color;
         | 
| 136 137 | 
             
              border-radius: 2px;
         | 
| 137 138 | 
             
              box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
         | 
| 138 | 
            -
              box-sizing: border-box;
         | 
| 139 139 | 
             
            }
         | 
| 140 140 |  | 
| 141 141 | 
             
            .@{bk-prefix}-date-picker .@{bk-prefix}-select-dropdown {
         | 
| @@ -225,6 +225,7 @@ | |
| 225 225 |  | 
| 226 226 | 
             
            .@{bk-prefix}-picker-confirm {
         | 
| 227 227 | 
             
              display: flex;
         | 
| 228 | 
            +
              justify-content: flex-end;
         | 
| 228 229 | 
             
              height: 42px;
         | 
| 229 230 | 
             
              padding: 0 20px;
         | 
| 230 231 | 
             
              clear: both;
         | 
| @@ -233,7 +234,6 @@ | |
| 233 234 | 
             
              text-align: right;
         | 
| 234 235 | 
             
              background-color: #fafbfd;
         | 
| 235 236 | 
             
              border-top: 1px solid #dcdee5;
         | 
| 236 | 
            -
              justify-content: flex-end;
         | 
| 237 237 |  | 
| 238 238 | 
             
              a {
         | 
| 239 239 | 
             
                color: #979ba5;
         | 
| @@ -392,10 +392,10 @@ span.@{bk-prefix}-date-picker-cells-cell-disabled:hover { | |
| 392 392 | 
             
                bottom: 0;
         | 
| 393 393 | 
             
                left: 0;
         | 
| 394 394 | 
             
                display: block;
         | 
| 395 | 
            +
                content: '';
         | 
| 395 396 | 
             
                background: #e1ecff;
         | 
| 396 397 | 
             
                border: 0;
         | 
| 397 398 | 
             
                border-radius: 0;
         | 
| 398 | 
            -
                content: '';
         | 
| 399 399 | 
             
              }
         | 
| 400 400 |  | 
| 401 401 | 
             
              em {
         | 
| @@ -128,6 +128,222 @@ | |
| 128 128 | 
             
              --select-active-color: #e1ecff;
         | 
| 129 129 | 
             
              --select-hover-color: #f5f7fa;
         | 
| 130 130 | 
             
            }
         | 
| 131 | 
            +
            .bk-time-picker-header {
         | 
| 132 | 
            +
              height: 46px;
         | 
| 133 | 
            +
              font-size: 14px;
         | 
| 134 | 
            +
              font-weight: 700;
         | 
| 135 | 
            +
              line-height: 46px;
         | 
| 136 | 
            +
              color: #63656e;
         | 
| 137 | 
            +
              text-align: center;
         | 
| 138 | 
            +
              border-bottom: 1px solid #dcdee5;
         | 
| 139 | 
            +
            }
         | 
| 140 | 
            +
            .bk-time-picker-cells:after {
         | 
| 141 | 
            +
              position: absolute;
         | 
| 142 | 
            +
              right: 0;
         | 
| 143 | 
            +
              left: 0;
         | 
| 144 | 
            +
              z-index: 1;
         | 
| 145 | 
            +
              height: 32px;
         | 
| 146 | 
            +
              padding-top: 6px;
         | 
| 147 | 
            +
              margin-top: 0;
         | 
| 148 | 
            +
              color: #3a84ff;
         | 
| 149 | 
            +
              text-align: left;
         | 
| 150 | 
            +
              pointer-events: none;
         | 
| 151 | 
            +
              background-color: rgba(58, 132, 255, 0.16);
         | 
| 152 | 
            +
              content: '';
         | 
| 153 | 
            +
              box-sizing: border-box;
         | 
| 154 | 
            +
              mix-blend-mode: multiply;
         | 
| 155 | 
            +
            }
         | 
| 156 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
         | 
| 157 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
         | 
| 158 | 
            +
              position: absolute;
         | 
| 159 | 
            +
              top: 55px;
         | 
| 160 | 
            +
              left: 85px;
         | 
| 161 | 
            +
              z-index: 1;
         | 
| 162 | 
            +
              width: 2px;
         | 
| 163 | 
            +
              padding-top: 2px;
         | 
| 164 | 
            +
              background-color: #3a84ff;
         | 
| 165 | 
            +
              border-radius: 50%;
         | 
| 166 | 
            +
              content: '';
         | 
| 167 | 
            +
            }
         | 
| 168 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
         | 
| 169 | 
            +
            .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
         | 
| 170 | 
            +
              position: absolute;
         | 
| 171 | 
            +
              top: calc(55px + 5px);
         | 
| 172 | 
            +
              left: 85px;
         | 
| 173 | 
            +
              z-index: 1;
         | 
| 174 | 
            +
              width: 2px;
         | 
| 175 | 
            +
              padding-top: 2px;
         | 
| 176 | 
            +
              background-color: #3a84ff;
         | 
| 177 | 
            +
              border-radius: 50%;
         | 
| 178 | 
            +
              content: '';
         | 
| 179 | 
            +
            }
         | 
| 180 | 
            +
            .bk-time-picker-cells-title-wrapper {
         | 
| 181 | 
            +
              width: 100%;
         | 
| 182 | 
            +
              height: 42px;
         | 
| 183 | 
            +
              line-height: 42px;
         | 
| 184 | 
            +
            }
         | 
| 185 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
         | 
| 186 | 
            +
              position: relative;
         | 
| 187 | 
            +
              float: left;
         | 
| 188 | 
            +
              width: 33.33%;
         | 
| 189 | 
            +
              font-size: 14px;
         | 
| 190 | 
            +
              font-weight: 700;
         | 
| 191 | 
            +
              color: #63656e;
         | 
| 192 | 
            +
              text-align: center;
         | 
| 193 | 
            +
              list-style: none;
         | 
| 194 | 
            +
            }
         | 
| 195 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
         | 
| 196 | 
            +
              color: #3a84ff;
         | 
| 197 | 
            +
            }
         | 
| 198 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
         | 
| 199 | 
            +
              position: absolute;
         | 
| 200 | 
            +
              top: 55px;
         | 
| 201 | 
            +
              left: 133px;
         | 
| 202 | 
            +
              z-index: 1;
         | 
| 203 | 
            +
              width: 2px;
         | 
| 204 | 
            +
              padding-top: 2px;
         | 
| 205 | 
            +
              background-color: #3a84ff;
         | 
| 206 | 
            +
              border-radius: 50%;
         | 
| 207 | 
            +
              content: '';
         | 
| 208 | 
            +
            }
         | 
| 209 | 
            +
            .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
         | 
| 210 | 
            +
              position: absolute;
         | 
| 211 | 
            +
              top: calc(55px + 5px);
         | 
| 212 | 
            +
              left: 133px;
         | 
| 213 | 
            +
              z-index: 1;
         | 
| 214 | 
            +
              width: 2px;
         | 
| 215 | 
            +
              padding-top: 2px;
         | 
| 216 | 
            +
              background-color: #3a84ff;
         | 
| 217 | 
            +
              border-radius: 50%;
         | 
| 218 | 
            +
              content: '';
         | 
| 219 | 
            +
            }
         | 
| 220 | 
            +
            .bk-time-picker-cells-list {
         | 
| 221 | 
            +
              position: relative;
         | 
| 222 | 
            +
              float: left;
         | 
| 223 | 
            +
              width: 33.33%;
         | 
| 224 | 
            +
              max-height: 200px;
         | 
| 225 | 
            +
              overflow: hidden;
         | 
| 226 | 
            +
            }
         | 
| 227 | 
            +
            .bk-time-picker-cells-list:hover {
         | 
| 228 | 
            +
              overflow-y: auto;
         | 
| 229 | 
            +
            }
         | 
| 230 | 
            +
            .bk-time-picker-cells-list:first-child {
         | 
| 231 | 
            +
              border-radius: 2px 0 0 2px;
         | 
| 232 | 
            +
            }
         | 
| 233 | 
            +
            .bk-time-picker-cells-list:last-child {
         | 
| 234 | 
            +
              border-radius: 0 2px 2px 0;
         | 
| 235 | 
            +
            }
         | 
| 236 | 
            +
            .bk-time-picker-cells-list::-webkit-scrollbar {
         | 
| 237 | 
            +
              width: 0;
         | 
| 238 | 
            +
              height: 0;
         | 
| 239 | 
            +
              background-color: rgba(204, 204, 204, 0);
         | 
| 240 | 
            +
            }
         | 
| 241 | 
            +
            .bk-time-picker-cells-list::-webkit-scrollbar-thumb {
         | 
| 242 | 
            +
              width: 0;
         | 
| 243 | 
            +
              height: 0;
         | 
| 244 | 
            +
              background-color: transparent;
         | 
| 245 | 
            +
            }
         | 
| 246 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul {
         | 
| 247 | 
            +
              width: 100%;
         | 
| 248 | 
            +
              padding: 0 0 168px 0;
         | 
| 249 | 
            +
              margin: 0;
         | 
| 250 | 
            +
              list-style: none;
         | 
| 251 | 
            +
            }
         | 
| 252 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
         | 
| 253 | 
            +
              position: relative;
         | 
| 254 | 
            +
              width: 100%;
         | 
| 255 | 
            +
              height: 32px;
         | 
| 256 | 
            +
              padding: 0;
         | 
| 257 | 
            +
              margin: 0;
         | 
| 258 | 
            +
              font-size: 12px;
         | 
| 259 | 
            +
              line-height: 32px;
         | 
| 260 | 
            +
              color: #63656e;
         | 
| 261 | 
            +
              text-align: center;
         | 
| 262 | 
            +
              list-style: none;
         | 
| 263 | 
            +
              cursor: pointer;
         | 
| 264 | 
            +
              box-sizing: content-box;
         | 
| 265 | 
            +
              transition: background 0.2s ease-in-out;
         | 
| 266 | 
            +
              user-select: none;
         | 
| 267 | 
            +
            }
         | 
| 268 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
         | 
| 269 | 
            +
              color: #3a84ff;
         | 
| 270 | 
            +
            }
         | 
| 271 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
         | 
| 272 | 
            +
              color: #c4c6cc;
         | 
| 273 | 
            +
              cursor: not-allowed;
         | 
| 274 | 
            +
            }
         | 
| 275 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
         | 
| 276 | 
            +
              color: #c4c6cc;
         | 
| 277 | 
            +
              cursor: not-allowed;
         | 
| 278 | 
            +
              background-color: #fff;
         | 
| 279 | 
            +
            }
         | 
| 280 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
         | 
| 281 | 
            +
            .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
         | 
| 282 | 
            +
              color: #3a84ff;
         | 
| 283 | 
            +
            }
         | 
| 284 | 
            +
            .bk-time-picker-header {
         | 
| 285 | 
            +
              height: 46px;
         | 
| 286 | 
            +
              font-size: 14px;
         | 
| 287 | 
            +
              font-weight: 700;
         | 
| 288 | 
            +
              line-height: 46px;
         | 
| 289 | 
            +
              color: #63656e;
         | 
| 290 | 
            +
              text-align: center;
         | 
| 291 | 
            +
              border-bottom: 1px solid #dcdee5;
         | 
| 292 | 
            +
            }
         | 
| 293 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content {
         | 
| 294 | 
            +
              position: relative;
         | 
| 295 | 
            +
              float: left;
         | 
| 296 | 
            +
            }
         | 
| 297 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content:after {
         | 
| 298 | 
            +
              position: absolute;
         | 
| 299 | 
            +
              top: 45px;
         | 
| 300 | 
            +
              right: 0;
         | 
| 301 | 
            +
              bottom: 0;
         | 
| 302 | 
            +
              z-index: 1;
         | 
| 303 | 
            +
              display: block;
         | 
| 304 | 
            +
              width: 1px;
         | 
| 305 | 
            +
              background: #e8eaec;
         | 
| 306 | 
            +
              content: '';
         | 
| 307 | 
            +
            }
         | 
| 308 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content-right {
         | 
| 309 | 
            +
              float: right;
         | 
| 310 | 
            +
            }
         | 
| 311 | 
            +
            .bk-time-picker-with-range .bk-picker-panel-content-right:after {
         | 
| 312 | 
            +
              right: auto;
         | 
| 313 | 
            +
              left: 0;
         | 
| 314 | 
            +
            }
         | 
| 315 | 
            +
            .bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
         | 
| 316 | 
            +
              border-radius: 0;
         | 
| 317 | 
            +
            }
         | 
| 318 | 
            +
            .bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
         | 
| 319 | 
            +
              border-radius: 0;
         | 
| 320 | 
            +
            }
         | 
| 321 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
         | 
| 322 | 
            +
              min-width: 216px;
         | 
| 323 | 
            +
              position: relative;
         | 
| 324 | 
            +
            }
         | 
| 325 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
         | 
| 326 | 
            +
              min-width: 216px;
         | 
| 327 | 
            +
            }
         | 
| 328 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
         | 
| 329 | 
            +
              width: 72px;
         | 
| 330 | 
            +
            }
         | 
| 331 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
         | 
| 332 | 
            +
              padding: 0;
         | 
| 333 | 
            +
            }
         | 
| 334 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
         | 
| 335 | 
            +
              width: 108px;
         | 
| 336 | 
            +
              max-height: 200px;
         | 
| 337 | 
            +
            }
         | 
| 338 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
         | 
| 339 | 
            +
              border-radius: 0;
         | 
| 340 | 
            +
            }
         | 
| 341 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
         | 
| 342 | 
            +
              border-radius: 0;
         | 
| 343 | 
            +
            }
         | 
| 344 | 
            +
            .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
         | 
| 345 | 
            +
              padding: 0 0 168px 0;
         | 
| 346 | 
            +
            }
         | 
| 131 347 | 
             
            .bk-date-picker {
         | 
| 132 348 | 
             
              display: inline-block;
         | 
| 133 349 | 
             
              width: 261px;
         | 
| @@ -146,45 +362,45 @@ | |
| 146 362 | 
             
              position: relative;
         | 
| 147 363 | 
             
            }
         | 
| 148 364 | 
             
            .bk-date-picker-rel .bk-date-picker-editor {
         | 
| 365 | 
            +
              box-sizing: border-box;
         | 
| 149 366 | 
             
              display: block;
         | 
| 150 367 | 
             
              width: 100%;
         | 
| 151 368 | 
             
              height: 32px;
         | 
| 152 369 | 
             
              padding: 0 10px 0 30px;
         | 
| 153 370 | 
             
              font-size: 12px;
         | 
| 154 371 | 
             
              line-height: 32px;
         | 
| 155 | 
            -
              color:  | 
| 372 | 
            +
              color: #63656e;
         | 
| 156 373 | 
             
              cursor: pointer;
         | 
| 157 | 
            -
              border: 1px solid  | 
| 374 | 
            +
              border: 1px solid #c4c6cc;
         | 
| 158 375 | 
             
              border-radius: 2px;
         | 
| 159 376 | 
             
              outline: none;
         | 
| 160 | 
            -
              box-sizing: border-box;
         | 
| 161 377 | 
             
            }
         | 
| 162 378 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
         | 
| 163 | 
            -
              border-color: transparent transparent  | 
| 379 | 
            +
              border-color: transparent transparent #c4c6cc transparent;
         | 
| 164 380 | 
             
            }
         | 
| 165 381 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border:focus {
         | 
| 166 | 
            -
              border-color: transparent transparent  | 
| 382 | 
            +
              border-color: transparent transparent #3a84ff transparent;
         | 
| 167 383 | 
             
              box-shadow: none;
         | 
| 168 384 | 
             
            }
         | 
| 169 385 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border[disabled],
         | 
| 170 386 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border.readonly {
         | 
| 171 | 
            -
              border-color: transparent transparent  | 
| 387 | 
            +
              border-color: transparent transparent #dcdee5 transparent;
         | 
| 172 388 | 
             
            }
         | 
| 173 389 | 
             
            .bk-date-picker-rel .bk-date-picker-editor:focus {
         | 
| 174 | 
            -
              border: 1px solid  | 
| 390 | 
            +
              border: 1px solid #3a84ff;
         | 
| 175 391 | 
             
            }
         | 
| 176 392 | 
             
            .bk-date-picker-rel .bk-date-picker-editor::placeholder {
         | 
| 177 | 
            -
              color:  | 
| 393 | 
            +
              color: #c4c6cc;
         | 
| 178 394 | 
             
            }
         | 
| 179 395 | 
             
            .bk-date-picker-rel .bk-date-picker-editor[disabled] {
         | 
| 180 | 
            -
              color:  | 
| 396 | 
            +
              color: #c4c6cc;
         | 
| 181 397 | 
             
              cursor: not-allowed;
         | 
| 182 | 
            -
              background-color:  | 
| 183 | 
            -
              border-color:  | 
| 398 | 
            +
              background-color: #fafbfd;
         | 
| 399 | 
            +
              border-color: #c4c6cc;
         | 
| 184 400 | 
             
            }
         | 
| 185 401 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.readonly {
         | 
| 186 | 
            -
              background-color:  | 
| 187 | 
            -
              border-color:  | 
| 402 | 
            +
              background-color: #fafbfd;
         | 
| 403 | 
            +
              border-color: #c4c6cc;
         | 
| 188 404 | 
             
            }
         | 
| 189 405 | 
             
            .bk-date-picker-rel .bk-date-picker-editor.medium-font {
         | 
| 190 406 | 
             
              font-size: 14px;
         | 
| @@ -198,12 +414,12 @@ | |
| 198 414 | 
             
              right: 10px;
         | 
| 199 415 | 
             
              padding: 5px 0;
         | 
| 200 416 | 
             
              font-size: 14px;
         | 
| 201 | 
            -
              color:  | 
| 417 | 
            +
              color: #c4c6cc;
         | 
| 202 418 | 
             
              cursor: pointer;
         | 
| 203 419 | 
             
              transform: translateY(-50%);
         | 
| 204 420 | 
             
            }
         | 
| 205 421 | 
             
            .bk-date-picker-rel .clear-action:hover {
         | 
| 206 | 
            -
              color:  | 
| 422 | 
            +
              color: #979ba5;
         | 
| 207 423 | 
             
            }
         | 
| 208 424 | 
             
            .bk-date-picker-rel .icon-wrapper {
         | 
| 209 425 | 
             
              position: absolute;
         | 
| @@ -212,7 +428,7 @@ | |
| 212 428 | 
             
              display: inline-block;
         | 
| 213 429 | 
             
              width: 32px;
         | 
| 214 430 | 
             
              height: 32px;
         | 
| 215 | 
            -
              color:  | 
| 431 | 
            +
              color: #c4c6cc;
         | 
| 216 432 | 
             
              cursor: pointer;
         | 
| 217 433 | 
             
              background-color: transparent;
         | 
| 218 434 | 
             
            }
         | 
| @@ -236,13 +452,13 @@ | |
| 236 452 | 
             
            .bk-date-picker-dropdown {
         | 
| 237 453 | 
             
              position: absolute;
         | 
| 238 454 | 
             
              z-index: 900;
         | 
| 455 | 
            +
              box-sizing: border-box;
         | 
| 239 456 | 
             
              padding: 5px 0 0 0;
         | 
| 240 457 | 
             
              overflow: auto;
         | 
| 241 | 
            -
              background-color:  | 
| 242 | 
            -
              border: 1px solid  | 
| 458 | 
            +
              background-color: #fff;
         | 
| 459 | 
            +
              border: 1px solid #dcdee5;
         | 
| 243 460 | 
             
              border-radius: 2px;
         | 
| 244 461 | 
             
              box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
         | 
| 245 | 
            -
              box-sizing: border-box;
         | 
| 246 462 | 
             
            }
         | 
| 247 463 | 
             
            .bk-date-picker .bk-select-dropdown {
         | 
| 248 464 | 
             
              max-height: none;
         | 
| @@ -317,6 +533,7 @@ | |
| 317 533 | 
             
            }
         | 
| 318 534 | 
             
            .bk-picker-confirm {
         | 
| 319 535 | 
             
              display: flex;
         | 
| 536 | 
            +
              justify-content: flex-end;
         | 
| 320 537 | 
             
              height: 42px;
         | 
| 321 538 | 
             
              padding: 0 20px;
         | 
| 322 539 | 
             
              clear: both;
         | 
| @@ -325,7 +542,6 @@ | |
| 325 542 | 
             
              text-align: right;
         | 
| 326 543 | 
             
              background-color: #fafbfd;
         | 
| 327 544 | 
             
              border-top: 1px solid #dcdee5;
         | 
| 328 | 
            -
              justify-content: flex-end;
         | 
| 329 545 | 
             
            }
         | 
| 330 546 | 
             
            .bk-picker-confirm a {
         | 
| 331 547 | 
             
              color: #979ba5;
         | 
| @@ -456,10 +672,10 @@ span.bk-date-picker-cells-cell-disabled:hover { | |
| 456 672 | 
             
              bottom: 0;
         | 
| 457 673 | 
             
              left: 0;
         | 
| 458 674 | 
             
              display: block;
         | 
| 675 | 
            +
              content: '';
         | 
| 459 676 | 
             
              background: #e1ecff;
         | 
| 460 677 | 
             
              border: 0;
         | 
| 461 678 | 
             
              border-radius: 0;
         | 
| 462 | 
            -
              content: '';
         | 
| 463 679 | 
             
            }
         | 
| 464 680 | 
             
            .bk-date-picker-cells-cell-range em {
         | 
| 465 681 | 
             
              position: relative;
         |