bkui-vue 0.0.1-beta.24 → 0.0.1-beta.27

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 (46) hide show
  1. package/dist/bkui-vue.cjs.js +434 -303
  2. package/dist/bkui-vue.esm.js +435 -304
  3. package/dist/bkui-vue.umd.js +434 -303
  4. package/dist/style.css +377 -70
  5. package/lib/loading/index.js +1 -1
  6. package/lib/loading/loading.css +2 -0
  7. package/lib/loading/loading.d.ts +1 -0
  8. package/lib/loading/loading.less +2 -0
  9. package/lib/loading/loading.variable.css +2 -0
  10. package/lib/pagination/index.d.ts +3 -3
  11. package/lib/pagination/index.js +1 -1
  12. package/lib/pagination/pagination.d.ts +1 -1
  13. package/lib/pagination/type.d.ts +1 -1
  14. package/lib/popover/index.js +1 -1
  15. package/lib/resize-layout/index.d.ts +336 -0
  16. package/lib/resize-layout/index.js +1 -0
  17. package/lib/resize-layout/resize-layout.css +189 -0
  18. package/lib/resize-layout/resize-layout.d.ts +127 -0
  19. package/lib/resize-layout/resize-layout.less +233 -0
  20. package/lib/resize-layout/resize-layout.variable.css +282 -0
  21. package/lib/select/common.d.ts +23 -27
  22. package/lib/select/index.d.ts +530 -145
  23. package/lib/select/index.js +12 -12
  24. package/lib/select/optionGroup.d.ts +0 -76
  25. package/lib/select/select.css +154 -44
  26. package/lib/select/select.d.ts +150 -39
  27. package/lib/select/select.less +131 -75
  28. package/lib/select/select.variable.css +154 -44
  29. package/lib/select/type.d.ts +31 -0
  30. package/lib/styles/index.d.ts +1 -0
  31. package/lib/styles/index.js +1 -1
  32. package/lib/swiper/index.js +1 -1
  33. package/lib/swiper/swiper.css +14 -14
  34. package/lib/swiper/swiper.less +93 -77
  35. package/lib/swiper/swiper.variable.css +14 -14
  36. package/lib/table/table.css +1 -1
  37. package/lib/table/table.less +1 -1
  38. package/lib/table/table.variable.css +1 -1
  39. package/lib/tag/index.js +1 -1
  40. package/lib/tag/tag.css +11 -5
  41. package/lib/tag/tag.less +12 -5
  42. package/lib/tag/tag.variable.css +11 -5
  43. package/lib/tree/tree.css +6 -6
  44. package/lib/tree/tree.less +7 -6
  45. package/lib/tree/tree.variable.css +6 -6
  46. package/package.json +3 -3
package/dist/style.css CHANGED
@@ -1449,6 +1449,8 @@ optgroup {
1449
1449
  animation-direction: normal;
1450
1450
  }
1451
1451
  .bk-loading-wrapper .bk-loading-mask {
1452
+ width: 100%;
1453
+ height: 100%;
1452
1454
  opacity: 0.5;
1453
1455
  }
1454
1456
  .bk-loading-wrapper .bk-loading-mask::after {
@@ -1988,8 +1990,8 @@ optgroup {
1988
1990
  display: block;
1989
1991
  }
1990
1992
  .bk-swiper-main {
1991
- height: 100%;
1992
1993
  display: flex;
1994
+ height: 100%;
1993
1995
  overflow: hidden;
1994
1996
  }
1995
1997
  .bk-swiper-main.bk-transition {
@@ -1997,53 +1999,53 @@ optgroup {
1997
1999
  }
1998
2000
  .bk-swiper-main .bk-swiper-card {
1999
2001
  height: 100%;
2000
- margin: 0;
2001
2002
  padding: 0;
2003
+ margin: 0;
2002
2004
  }
2003
2005
  .bk-swiper-main .bk-swiper-img {
2004
2006
  display: inline-block;
2005
- height: 100%;
2006
2007
  width: 100%;
2008
+ height: 100%;
2007
2009
  margin: 0;
2008
- background-size: cover;
2009
- background-repeat: no-repeat;
2010
2010
  background-position: center;
2011
+ background-repeat: no-repeat;
2012
+ background-size: cover;
2011
2013
  }
2012
2014
  .bk-swiper-main .bk-swiper-link {
2013
2015
  cursor: pointer;
2014
2016
  }
2015
2017
  .bk-swiper-index {
2016
2018
  position: absolute;
2019
+ right: 0;
2017
2020
  bottom: 10px;
2018
2021
  left: 0;
2019
- right: 0;
2020
2022
  display: flex;
2021
- justify-content: center;
2022
- margin: 0;
2023
2023
  padding: 0;
2024
+ margin: 0;
2025
+ justify-content: center;
2024
2026
  }
2025
2027
  .bk-swiper-index li {
2026
2028
  width: 11px;
2027
2029
  height: 4px;
2028
2030
  margin: 0 3px;
2031
+ list-style-type: none;
2029
2032
  background: #63656e;
2030
2033
  border-radius: 2px;
2031
2034
  transition: width 0.525s;
2032
- list-style-type: none;
2033
2035
  }
2034
2036
  .bk-swiper-index li.bk-current-index {
2035
2037
  width: 17px;
2036
2038
  background: #c5c7d1;
2037
2039
  }
2038
2040
  .bk-swiper-nav {
2039
- cursor: pointer;
2040
2041
  position: absolute;
2041
- border-radius: 50%;
2042
+ top: calc(50% - 15px);
2043
+ display: none;
2042
2044
  width: 30px;
2043
2045
  height: 30px;
2046
+ cursor: pointer;
2044
2047
  background: rgba(31, 45, 61, 0.4);
2045
- top: calc(50% - 15px);
2046
- display: none;
2048
+ border-radius: 50%;
2047
2049
  }
2048
2050
  .bk-swiper-nav .bk-swiper-nav-icon {
2049
2051
  position: absolute;
@@ -2051,8 +2053,8 @@ optgroup {
2051
2053
  left: 11px;
2052
2054
  width: 10px;
2053
2055
  height: 10px;
2054
- border-left: 2px solid #fff;
2055
2056
  border-bottom: 2px solid #fff;
2057
+ border-left: 2px solid #fff;
2056
2058
  }
2057
2059
  .bk-swiper-nav.bk-nav-prev {
2058
2060
  left: 14px;
@@ -2071,8 +2073,55 @@ optgroup {
2071
2073
  .bk-swiper-nav:hover {
2072
2074
  background: rgba(31, 45, 61, 0.6);
2073
2075
  }
2074
- .bk-select {
2075
- display: inline-block;
2076
+ @keyframes loading-scale-animate {
2077
+ 0% {
2078
+ transform: scale(1);
2079
+ }
2080
+ 100% {
2081
+ transform: scale(0.6);
2082
+ }
2083
+ }
2084
+ @keyframes fade {
2085
+ 100% {
2086
+ background-color: transparent;
2087
+ }
2088
+ }
2089
+ .bk-fade-transtion .bk-fade-enter-active,
2090
+ .bk-fade-transtion .bk-fade-leave-active {
2091
+ transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
2092
+ }
2093
+ .bk-fade-transtion .bk-fade-enter,
2094
+ .bk-fade-transtion .bk-fade-leave-to {
2095
+ opacity: 0;
2096
+ }
2097
+ .bk-select .mr5 {
2098
+ margin-right: 5px;
2099
+ }
2100
+ .bk-select .ml5 {
2101
+ margin-left: 5px;
2102
+ }
2103
+ .bk-select .input {
2104
+ width: 100%;
2105
+ height: 32px;
2106
+ padding: 0 28px 0 10px;
2107
+ line-height: normal;
2108
+ color: #63656e;
2109
+ text-align: left;
2110
+ vertical-align: middle;
2111
+ cursor: pointer;
2112
+ background-color: white;
2113
+ border: 1px solid #c4c6cc;
2114
+ border-radius: 2px;
2115
+ outline: none;
2116
+ box-sizing: border-box;
2117
+ transition: all 0.1s;
2118
+ resize: none;
2119
+ overflow: hidden;
2120
+ text-overflow: ellipsis;
2121
+ white-space: nowrap;
2122
+ }
2123
+ .bk-select .input::placeholder {
2124
+ color: #c4c6cc;
2076
2125
  }
2077
2126
  .bk-select ul {
2078
2127
  padding: 0;
@@ -2080,19 +2129,43 @@ optgroup {
2080
2129
  font-weight: normal;
2081
2130
  list-style: none;
2082
2131
  }
2132
+ .bk-select .bk-popover-reference {
2133
+ display: unset;
2134
+ }
2083
2135
  .bk-select .bk-popover-content {
2084
2136
  padding: 0;
2085
2137
  }
2086
- .bk-select.is-focus .bk-select-trigger .bk-select-input {
2138
+ .bk-select.small .bk-select-trigger .bk-select-input {
2139
+ height: 24px;
2140
+ }
2141
+ .bk-select.large .bk-select-trigger .bk-select-input {
2142
+ height: 36px;
2143
+ font-size: 14px;
2144
+ }
2145
+ .bk-select.large .bk-select-content {
2146
+ font-size: 14px;
2147
+ }
2148
+ .bk-select.simplicity .bk-select-trigger .bk-select-input {
2149
+ border: none;
2150
+ border-bottom: 1px solid #c4c6cc;
2151
+ }
2152
+ .bk-select.is-focus.normal .bk-select-trigger .bk-select-input {
2087
2153
  border-color: #3a84ff;
2088
2154
  box-shadow: 0px 0px 3px 0px #a3c5fd;
2089
2155
  }
2156
+ .bk-select.is-focus.simplicity .bk-select-trigger .bk-select-input {
2157
+ border-color: #3a84ff;
2158
+ }
2090
2159
  .bk-select.is-disabled .bk-select-trigger .bk-select-input {
2091
2160
  cursor: not-allowed;
2092
2161
  background: #fafbfd;
2093
2162
  border-color: #dcdee5;
2094
2163
  box-shadow: unset;
2095
2164
  }
2165
+ .bk-select.is-filterable .bk-select-trigger .bk-select-input,
2166
+ .bk-select.is-filterable .bk-select-trigger .bk-select-tag-input {
2167
+ cursor: text;
2168
+ }
2096
2169
  .bk-select.popover-show .bk-select-trigger .angle-up {
2097
2170
  transform: rotate(0);
2098
2171
  }
@@ -2104,7 +2177,6 @@ optgroup {
2104
2177
  width: 100%;
2105
2178
  height: 32px;
2106
2179
  padding: 0 28px 0 10px;
2107
- font-size: 12px;
2108
2180
  line-height: normal;
2109
2181
  color: #63656e;
2110
2182
  text-align: left;
@@ -2117,13 +2189,76 @@ optgroup {
2117
2189
  box-sizing: border-box;
2118
2190
  transition: all 0.1s;
2119
2191
  resize: none;
2192
+ overflow: hidden;
2193
+ text-overflow: ellipsis;
2194
+ white-space: nowrap;
2120
2195
  }
2121
2196
  .bk-select .bk-select-trigger .bk-select-input::placeholder {
2122
2197
  color: #c4c6cc;
2123
2198
  }
2199
+ .bk-select .bk-select-trigger .bk-select-tag {
2200
+ width: 100%;
2201
+ height: 32px;
2202
+ padding: 0 28px 0 10px;
2203
+ line-height: normal;
2204
+ color: #63656e;
2205
+ text-align: left;
2206
+ vertical-align: middle;
2207
+ cursor: pointer;
2208
+ background-color: white;
2209
+ border: 1px solid #c4c6cc;
2210
+ border-radius: 2px;
2211
+ outline: none;
2212
+ box-sizing: border-box;
2213
+ transition: all 0.1s;
2214
+ resize: none;
2215
+ overflow: hidden;
2216
+ text-overflow: ellipsis;
2217
+ white-space: nowrap;
2218
+ width: auto;
2219
+ height: auto;
2220
+ min-height: 32px;
2221
+ display: flex;
2222
+ align-items: center;
2223
+ flex-wrap: wrap;
2224
+ }
2225
+ .bk-select .bk-select-trigger .bk-select-tag::placeholder {
2226
+ color: #c4c6cc;
2227
+ }
2228
+ .bk-select .bk-select-trigger .bk-select-tag-input {
2229
+ width: 100%;
2230
+ height: 32px;
2231
+ padding: 0 28px 0 10px;
2232
+ line-height: normal;
2233
+ color: #63656e;
2234
+ text-align: left;
2235
+ vertical-align: middle;
2236
+ cursor: pointer;
2237
+ background-color: white;
2238
+ border: 1px solid #c4c6cc;
2239
+ border-radius: 2px;
2240
+ box-sizing: border-box;
2241
+ transition: all 0.1s;
2242
+ resize: none;
2243
+ overflow: hidden;
2244
+ text-overflow: ellipsis;
2245
+ white-space: nowrap;
2246
+ height: auto;
2247
+ width: auto;
2248
+ border: none;
2249
+ outline: none;
2250
+ padding: 0;
2251
+ }
2252
+ .bk-select .bk-select-trigger .bk-select-tag-input::placeholder {
2253
+ color: #c4c6cc;
2254
+ }
2124
2255
  .bk-select .bk-select-trigger .bk-select-prefix {
2125
2256
  position: absolute;
2126
- top: 6px;
2257
+ top: 0;
2258
+ display: inline-flex;
2259
+ height: 100%;
2260
+ align-items: center;
2261
+ justify-content: center;
2127
2262
  left: 4px;
2128
2263
  font-size: 14px;
2129
2264
  }
@@ -2131,27 +2266,31 @@ optgroup {
2131
2266
  transform: rotate(180deg);
2132
2267
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
2133
2268
  display: flex;
2134
- align-items: center;
2135
- justify-content: center;
2136
2269
  width: 20px;
2137
2270
  height: 20px;
2138
2271
  font-size: 20px;
2139
2272
  color: #979ba5;
2140
2273
  position: absolute;
2141
- top: 6px;
2274
+ top: 0;
2275
+ display: inline-flex;
2276
+ height: 100%;
2277
+ align-items: center;
2278
+ justify-content: center;
2142
2279
  right: 4px;
2143
2280
  }
2144
2281
  .bk-select .bk-select-trigger .clear-icon {
2145
2282
  transition: all 0.1s;
2146
2283
  display: flex;
2147
- align-items: center;
2148
- justify-content: center;
2149
2284
  width: 20px;
2150
2285
  height: 20px;
2151
2286
  font-size: 14px;
2152
2287
  color: #c4c6cc;
2153
2288
  position: absolute;
2154
- top: 6px;
2289
+ top: 0;
2290
+ display: inline-flex;
2291
+ height: 100%;
2292
+ align-items: center;
2293
+ justify-content: center;
2155
2294
  right: 4px;
2156
2295
  }
2157
2296
  .bk-select .bk-select-trigger .clear-icon:hover {
@@ -2159,15 +2298,8 @@ optgroup {
2159
2298
  }
2160
2299
  .bk-select .bk-select-trigger .spinner {
2161
2300
  position: absolute;
2162
- top: 6px;
2163
- right: 4px;
2164
- display: flex;
2165
- align-items: center;
2166
- justify-content: center;
2167
- width: 20px;
2168
- height: 20px;
2169
- font-size: 16px;
2170
- color: #3A84FF;
2301
+ top: 8px;
2302
+ right: 6px;
2171
2303
  }
2172
2304
  .bk-select .bk-select-empty {
2173
2305
  display: flex;
@@ -2189,28 +2321,6 @@ optgroup {
2189
2321
  .bk-select .bk-select-dropdown {
2190
2322
  overflow: auto;
2191
2323
  }
2192
- .bk-select .bk-select-dropdown .bk-select-search {
2193
- position: relative;
2194
- padding: 0 5px;
2195
- }
2196
- .bk-select .bk-select-dropdown .bk-select-search-icon {
2197
- position: absolute;
2198
- top: 50%;
2199
- left: 8px;
2200
- font-size: 16px;
2201
- color: #979ba5;
2202
- transform: translateY(-50%);
2203
- }
2204
- .bk-select .bk-select-dropdown .bk-select-search-input {
2205
- width: 100%;
2206
- height: 32px;
2207
- padding: 0 10px 0 26px;
2208
- font-size: 12px;
2209
- cursor: text;
2210
- border: none;
2211
- border-bottom: 1px solid #dcdee5;
2212
- outline: 0;
2213
- }
2214
2324
  .bk-select .bk-select-extension {
2215
2325
  display: flex;
2216
2326
  height: 40px;
@@ -2243,7 +2353,6 @@ optgroup {
2243
2353
  .bk-select .bk-select-option.is-selected.is-multiple::after {
2244
2354
  position: absolute;
2245
2355
  right: 12px;
2246
- font-size: 12px;
2247
2356
  font-weight: 700;
2248
2357
  content: '\2713';
2249
2358
  }
@@ -2265,6 +2374,10 @@ optgroup {
2265
2374
  .bk-select .bk-option-group.collapsible .bk-select-option {
2266
2375
  padding-left: 40px;
2267
2376
  }
2377
+ .bk-select .bk-option-group.disabled .default-group-label {
2378
+ color: #C4C6CC;
2379
+ cursor: not-allowed;
2380
+ }
2268
2381
  .bk-select .bk-option-group .default-group-label {
2269
2382
  display: flex;
2270
2383
  user-select: none;
@@ -2275,7 +2388,6 @@ optgroup {
2275
2388
  width: 12px;
2276
2389
  height: 12px;
2277
2390
  margin-right: 8px;
2278
- font-size: 12px;
2279
2391
  transition: all 0.1s;
2280
2392
  align-items: center;
2281
2393
  justify-content: center;
@@ -2628,8 +2740,8 @@ optgroup {
2628
2740
  }
2629
2741
  }
2630
2742
  .bk-table {
2631
- overflow: hidden;
2632
2743
  height: 100%;
2744
+ overflow: hidden;
2633
2745
  border-top: 1px solid #dcdee5;
2634
2746
  border-bottom: 1px solid #dcdee5;
2635
2747
  }
@@ -2718,10 +2830,11 @@ optgroup {
2718
2830
  background: #f0f1f5;
2719
2831
  }
2720
2832
  .bk-tag {
2721
- display: inline-block;
2833
+ display: inline-flex;
2834
+ align-items: center;
2722
2835
  height: 22px;
2723
2836
  padding: 0 10px;
2724
- margin: 2px 0 2px 6px;
2837
+ margin: 2px 6px 2px 0px;
2725
2838
  font-size: 12px;
2726
2839
  line-height: 22px;
2727
2840
  color: #63656e;
@@ -2794,18 +2907,23 @@ optgroup {
2794
2907
  background: #3a84ff;
2795
2908
  opacity: 1;
2796
2909
  }
2910
+ .bk-tag .bk-tag-text {
2911
+ flex: 1;
2912
+ overflow: hidden;
2913
+ text-overflow: ellipsis;
2914
+ white-space: nowrap;
2915
+ }
2797
2916
  .bk-tag .bk-tag-icon {
2798
- display: inline-block;
2917
+ flex-shrink: 0;
2799
2918
  margin-right: 4px;
2800
2919
  font-size: 14px;
2801
2920
  line-height: 0;
2802
2921
  }
2803
2922
  .bk-tag .bk-tag-close {
2804
- display: inline-block;
2923
+ flex-shrink: 0;
2805
2924
  margin-left: 4px;
2806
2925
  font-size: 12px;
2807
2926
  line-height: 0;
2808
- vertical-align: 1px;
2809
2927
  cursor: pointer;
2810
2928
  }
2811
2929
  .bk-form {
@@ -3250,15 +3368,15 @@ optgroup {
3250
3368
  padding-left: calc(var(--offset-left));
3251
3369
  }
3252
3370
  .bk-tree .bk-node-row.is-checked {
3253
- background-color: #EBF2FF;
3371
+ background-color: #ebf2ff;
3254
3372
  }
3255
3373
  .bk-tree .bk-tree-node {
3256
3374
  position: relative;
3375
+ display: flex;
3257
3376
  height: var(--lineHeight);
3258
3377
  padding-left: 0;
3259
3378
  line-height: var(--lineHeight);
3260
3379
  cursor: pointer;
3261
- display: flex;
3262
3380
  align-items: center;
3263
3381
  }
3264
3382
  .bk-tree .bk-tree-node:not(.is-root) {
@@ -3276,11 +3394,11 @@ optgroup {
3276
3394
  content: '';
3277
3395
  }
3278
3396
  .bk-tree .bk-tree-node .node-virtual-line {
3279
- display: inline-block;
3280
3397
  position: absolute;
3281
- left: calc(var(--depth) * var(--indent) * -1 + 6px);
3282
3398
  top: -12px;
3283
3399
  bottom: 50%;
3400
+ left: calc(var(--depth) * var(--indent) * -1 + 6px);
3401
+ display: inline-block;
3284
3402
  width: 0;
3285
3403
  border-left: var(--level-line);
3286
3404
  }
@@ -3292,9 +3410,9 @@ optgroup {
3292
3410
  align-items: center;
3293
3411
  }
3294
3412
  .bk-tree .bk-tree-node .bk-node-content .bk-node-text {
3295
- white-space: nowrap;
3296
- text-overflow: ellipsis;
3297
3413
  overflow: hidden;
3414
+ text-overflow: ellipsis;
3415
+ white-space: nowrap;
3298
3416
  }
3299
3417
  .bk-slider {
3300
3418
  display: flex;
@@ -5153,6 +5271,195 @@ span.bk-date-picker-cells-cell-disabled.bk-date-picker-cells-cell-selected em {
5153
5271
  text-align: left;
5154
5272
  align-items: center;
5155
5273
  }
5274
+ .bk-resize-layout {
5275
+ display: flex;
5276
+ }
5277
+ .bk-resize-layout-border {
5278
+ border: 1px solid #dcdee5;
5279
+ }
5280
+ .bk-resize-layout-collapsed > .bk-resize-layout-aside .bk-resize-layout-aside-content {
5281
+ overflow: hidden;
5282
+ }
5283
+ .bk-resize-layout-collapsed > .bk-resize-layout-aside .bk-resize-collapse:before {
5284
+ display: inline-block;
5285
+ transform: rotate(180deg);
5286
+ }
5287
+ .bk-resize-layout-left {
5288
+ flex-direction: row;
5289
+ }
5290
+ .bk-resize-layout-left > .bk-resize-layout-aside {
5291
+ border-right: 1px solid #dcdee5;
5292
+ }
5293
+ .bk-resize-layout-left > .bk-resize-layout-aside:after {
5294
+ top: 50%;
5295
+ right: 1px;
5296
+ transform: translate3d(0, -50%, 0);
5297
+ }
5298
+ .bk-resize-layout-left > .bk-resize-layout-aside .bk-resize-trigger {
5299
+ top: 0;
5300
+ left: 100%;
5301
+ width: 5px;
5302
+ height: 100%;
5303
+ cursor: col-resize;
5304
+ }
5305
+ .bk-resize-layout-left > .bk-resize-layout-aside .bk-resize-trigger:hover {
5306
+ @mixin linear-gradient left;
5307
+ }
5308
+ .bk-resize-layout-left > .bk-resize-layout-aside .bk-resize-collapse {
5309
+ top: 50%;
5310
+ left: 100%;
5311
+ transform: translateY(-50%);
5312
+ }
5313
+ .bk-resize-layout-right {
5314
+ flex-direction: row-reverse;
5315
+ }
5316
+ .bk-resize-layout-right > .bk-resize-layout-aside {
5317
+ border-left: 1px solid #dcdee5;
5318
+ }
5319
+ .bk-resize-layout-right > .bk-resize-layout-aside:after {
5320
+ top: 50%;
5321
+ left: 1px;
5322
+ transform: translate3d(0, -50%, 0);
5323
+ }
5324
+ .bk-resize-layout-right > .bk-resize-layout-aside .bk-resize-trigger {
5325
+ top: 0;
5326
+ right: 100%;
5327
+ width: 5px;
5328
+ height: 100%;
5329
+ cursor: col-resize;
5330
+ }
5331
+ .bk-resize-layout-right > .bk-resize-layout-aside .bk-resize-trigger:hover {
5332
+ @mixin linear-gradient right;
5333
+ }
5334
+ .bk-resize-layout-right > .bk-resize-layout-aside .bk-resize-collapse {
5335
+ top: 50%;
5336
+ right: 100%;
5337
+ transform: translateY(-50%) rotate(180deg);
5338
+ }
5339
+ .bk-resize-layout-top {
5340
+ flex-direction: column;
5341
+ }
5342
+ .bk-resize-layout-top > .bk-resize-layout-aside {
5343
+ border-bottom: 1px solid #dcdee5;
5344
+ }
5345
+ .bk-resize-layout-top > .bk-resize-layout-aside:after {
5346
+ bottom: 1px;
5347
+ left: 50%;
5348
+ transform: translate3d(-50%, 0, 0) rotate(90deg);
5349
+ }
5350
+ .bk-resize-layout-top > .bk-resize-layout-aside .bk-resize-trigger {
5351
+ top: 100%;
5352
+ left: 0;
5353
+ width: 100%;
5354
+ height: 5px;
5355
+ cursor: row-resize;
5356
+ }
5357
+ .bk-resize-layout-top > .bk-resize-layout-aside .bk-resize-trigger:hover {
5358
+ @mixin linear-gradient top;
5359
+ }
5360
+ .bk-resize-layout-top > .bk-resize-layout-aside .bk-resize-collapse {
5361
+ top: 100%;
5362
+ left: 50%;
5363
+ margin-top: 8px;
5364
+ transform: translate3d(-50%, -50%, 0) rotate(90deg);
5365
+ }
5366
+ .bk-resize-layout-bottom {
5367
+ flex-direction: column-reverse;
5368
+ }
5369
+ .bk-resize-layout-bottom > .bk-resize-layout-aside {
5370
+ border-top: 1px solid #dcdee5;
5371
+ }
5372
+ .bk-resize-layout-bottom > .bk-resize-layout-aside:after {
5373
+ top: 1px;
5374
+ left: 50%;
5375
+ transform: translate3d(-50%, 0, 0) rotate(90deg);
5376
+ }
5377
+ .bk-resize-layout-bottom > .bk-resize-layout-aside .bk-resize-trigger {
5378
+ bottom: 100%;
5379
+ left: 0;
5380
+ width: 100%;
5381
+ height: 5px;
5382
+ cursor: row-resize;
5383
+ }
5384
+ .bk-resize-layout-bottom > .bk-resize-layout-aside .bk-resize-trigger:hover {
5385
+ @mixin linear-gradient bottom;
5386
+ }
5387
+ .bk-resize-layout-bottom > .bk-resize-layout-aside .bk-resize-collapse {
5388
+ bottom: 100%;
5389
+ left: 50%;
5390
+ margin-bottom: 8px;
5391
+ transform: translate3d(50%, 50%, 0) rotate(-90deg);
5392
+ }
5393
+ .bk-resize-layout > .bk-resize-layout-aside {
5394
+ position: relative;
5395
+ }
5396
+ .bk-resize-layout > .bk-resize-layout-aside:after {
5397
+ position: absolute;
5398
+ width: 2px;
5399
+ height: 2px;
5400
+ color: #c4c6cc;
5401
+ background: currentColor;
5402
+ content: '';
5403
+ box-shadow: 0 4px 0 0 currentColor, 0 8px 0 0 currentColor, 0 -4px 0 0 currentColor, 0 -8px 0 0 currentColor;
5404
+ }
5405
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-layout-aside-content {
5406
+ width: 100%;
5407
+ height: 100%;
5408
+ overflow: hidden;
5409
+ }
5410
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-trigger {
5411
+ position: absolute;
5412
+ z-index: 3;
5413
+ background-color: transparent;
5414
+ }
5415
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-proxy {
5416
+ position: absolute;
5417
+ z-index: 9999;
5418
+ pointer-events: none;
5419
+ visibility: hidden;
5420
+ }
5421
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-proxy.left,
5422
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-proxy.right {
5423
+ top: 0;
5424
+ height: 100%;
5425
+ border-left: 1px dashed #3a84ff;
5426
+ }
5427
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-proxy.top,
5428
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-proxy.bottom {
5429
+ left: 0;
5430
+ width: 100%;
5431
+ border-top: 1px dashed #3a84ff;
5432
+ }
5433
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-collapse {
5434
+ position: absolute;
5435
+ z-index: 2;
5436
+ width: 16px;
5437
+ height: 50px;
5438
+ font-size: 20px;
5439
+ line-height: 50px;
5440
+ color: #fff;
5441
+ text-align: center;
5442
+ text-indent: -2px;
5443
+ cursor: pointer;
5444
+ background: #dcdee5;
5445
+ border-radius: 0px 12px 12px 0px;
5446
+ }
5447
+ .bk-resize-layout > .bk-resize-layout-aside .bk-resize-collapse:hover {
5448
+ background: #3a84ff;
5449
+ }
5450
+ .bk-resize-layout > .bk-resize-layout-main {
5451
+ flex: 1;
5452
+ overflow: hidden;
5453
+ }
5454
+ .bk-resize-layout .bk-resize-mask {
5455
+ position: fixed;
5456
+ top: 0;
5457
+ right: 0;
5458
+ bottom: 0;
5459
+ left: 0;
5460
+ z-index: 9999;
5461
+ display: none;
5462
+ }
5156
5463
  .bk-popper {
5157
5464
  display: none;
5158
5465
  padding: 7px 14px;
@@ -1 +1 @@
1
- !function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("../shared"),require("vue")):"function"==typeof define&&define.amd?define(["exports","../shared","vue"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Shared,e.Vue)}(this,(function(e,o,t){"use strict";function n(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var a={exports:{}};!function(e){e.exports=function(e,o,t){return o in e?Object.defineProperty(e,o,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[o]=t,e},e.exports.__esModule=!0,e.exports.default=e.exports}(a);var i,d,l,r=n(a.exports);function u(e){l="function"==typeof e?e:function(){return t.createVNode(e,null,null)}}e.BkLoadingMode=void 0,(i=e.BkLoadingMode||(e.BkLoadingMode={})).Default="default",i.Spin="spin",e.BkLoadingSize=void 0,(d=e.BkLoadingSize||(e.BkLoadingSize={})).Mini="mini",d.Small="small",d.Large="large";var s={indicator:{type:Function},loading:o.PropTypes.bool,theme:o.PropTypes.theme(["white","primary","warning","success","danger"]),title:o.PropTypes.string.def(""),size:o.PropTypes.commonType(Object.values(e.BkLoadingSize)).def("small"),mode:o.PropTypes.commonType(Object.values(e.BkLoadingMode)).def("default")},c=t.defineComponent({name:"Loading",props:s,setup:function(n,a){var i=[1,2,3,4].map((function(e){return t.createVNode("span",{class:"dot dot-".concat(e)},null)})),d=t.createVNode("div",{class:"bk-spin-indicator"},[[1,2,3,4,5,6,7,8].map((function(e){return t.createVNode("span",{class:"oval oval-".concat(e)},null)}))]),u=t.computed((function(){return o.classes({"bk-nested-loading":!!a.slots.default},"bk-loading-wrapper")}));console.log(n.theme);var s=t.computed((function(){var e;return o.classes((r(e={},"bk-loading-size-".concat(n.size),!!n.size),r(e,"bk-loading-".concat(n.theme),!!n.theme),e),"bk-loading-indicator")})),c=t.computed((function(){return!!n.title})),p=t.computed((function(){var o=n.mode===e.BkLoadingMode.Spin;return"function"==typeof n.indicator?t.createVNode(n.indicator,null,null):"function"==typeof l?t.createVNode(l,null,null):o?d:i}));return function(){var e,o;return a.slots.default&&!n.loading?null===(o=(e=a.slots).default)||void 0===o?void 0:o.call(e):t.createVNode("div",{class:u.value},[t.createVNode("div",{class:s.value},[p.value,c.value&&t.createVNode("div",{class:"bk-loading-title"},[n.title])]),a.slots.default&&t.createVNode("div",{class:"bk-loading-mask"},[a.slots.default()])])}}}),p=o.withInstallProps(c,{setDefaultIndicator:u,BkLoadingMode:e.BkLoadingMode,BkLoadingSize:e.BkLoadingSize},!0);e.BkLoading=p,e.default=p,e.setDefaultIndicator=u,Object.defineProperty(e,"__esModule",{value:!0})}));
1
+ !function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("../shared"),require("vue")):"function"==typeof define&&define.amd?define(["exports","../shared","vue"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self).bkuiVue={},e.Shared,e.Vue)}(this,(function(e,o,t){"use strict";function n(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var a={exports:{}};!function(e){e.exports=function(e,o,t){return o in e?Object.defineProperty(e,o,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[o]=t,e},e.exports.__esModule=!0,e.exports.default=e.exports}(a);var i,d,l,r=n(a.exports);function u(e){l="function"==typeof e?e:function(){return t.createVNode(e,null,null)}}e.BkLoadingMode=void 0,(i=e.BkLoadingMode||(e.BkLoadingMode={})).Default="default",i.Spin="spin",e.BkLoadingSize=void 0,(d=e.BkLoadingSize||(e.BkLoadingSize={})).Normal="",d.Mini="mini",d.Small="small",d.Large="large";var s={indicator:{type:Function},loading:o.PropTypes.bool,theme:o.PropTypes.theme(["white","primary","warning","success","danger"]),title:o.PropTypes.string.def(""),size:o.PropTypes.commonType(Object.values(e.BkLoadingSize)).def(e.BkLoadingSize.Normal),mode:o.PropTypes.commonType(Object.values(e.BkLoadingMode)).def("default")},c=t.defineComponent({name:"Loading",props:s,setup:function(n,a){var i=[1,2,3,4].map((function(e){return t.createVNode("span",{class:"dot dot-".concat(e)},null)})),d=t.createVNode("div",{class:"bk-spin-indicator"},[[1,2,3,4,5,6,7,8].map((function(e){return t.createVNode("span",{class:"oval oval-".concat(e)},null)}))]),u=t.computed((function(){return o.classes({"bk-nested-loading":!!a.slots.default},"bk-loading-wrapper")}));console.log(n.theme);var s=t.computed((function(){var e;return o.classes((r(e={},"bk-loading-size-".concat(n.size),!!n.size),r(e,"bk-loading-".concat(n.theme),!!n.theme),e),"bk-loading-indicator")})),c=t.computed((function(){return!!n.title})),p=t.computed((function(){var o=n.mode===e.BkLoadingMode.Spin;return"function"==typeof n.indicator?t.createVNode(n.indicator,null,null):"function"==typeof l?t.createVNode(l,null,null):o?d:i}));return function(){var e,o;return a.slots.default&&!n.loading?null===(o=(e=a.slots).default)||void 0===o?void 0:o.call(e):t.createVNode("div",{class:u.value},[t.createVNode("div",{class:s.value},[p.value,c.value&&t.createVNode("div",{class:"bk-loading-title"},[n.title])]),a.slots.default&&t.createVNode("div",{class:"bk-loading-mask"},[a.slots.default()])])}}}),p=o.withInstallProps(c,{setDefaultIndicator:u,BkLoadingMode:e.BkLoadingMode,BkLoadingSize:e.BkLoadingSize},!0);e.BkLoading=p,e.default=p,e.setDefaultIndicator=u,Object.defineProperty(e,"__esModule",{value:!0})}));
@@ -61,6 +61,8 @@
61
61
  animation-direction: normal;
62
62
  }
63
63
  .bk-loading-wrapper .bk-loading-mask {
64
+ width: 100%;
65
+ height: 100%;
64
66
  opacity: 0.5;
65
67
  }
66
68
  .bk-loading-wrapper .bk-loading-mask::after {
@@ -4,6 +4,7 @@ export declare enum BkLoadingMode {
4
4
  Spin = "spin"
5
5
  }
6
6
  export declare enum BkLoadingSize {
7
+ Normal = "",
7
8
  Mini = "mini",
8
9
  Small = "small",
9
10
  Large = "large"
@@ -100,6 +100,8 @@
100
100
  }
101
101
 
102
102
  .@{bk-prefix}-loading-mask {
103
+ width: 100%;
104
+ height: 100%;
103
105
  opacity: .5;
104
106
 
105
107
  &::after {