bkui-vue 1.0.3-beta.26 → 1.0.3-beta.28

package/lib/link/link.variable.css

@@ -12,13 +12,13 @@
   --whitesmoke-color: #fafbfd;
   --disable-color: #dcdee5;
   --disable-bg-color: #f9fafd;
+  --border-color: #dcdee5;
   --font-size-base: 12px;
   --font-size-medium: 14px;
   --font-size-large: 16px;
   --line-height-base: 16px;
   --line-height-medium: 16px;
   --line-height-large: 18px;
-  --border-color: #dcdee5;
   --component-size-small: 26px;
   --component-size-base: 32px;
   --component-size-large: 40px;
@@ -111,7 +111,7 @@
   --table-border-color: #dcdee5;
   --table-head-bg-color: #fafbfd;
   --table-head-font-color: #313238;
-  --table-body-font-color: #63656e;
+  --table-body-font-color: #63656E;
   --table-row-hover-bg-color: #f5f7fa;
   --table-row-active-bg-color: #f0f1f5;
   --cascader-panel-border-color: #dcdee5;
@@ -127,58 +127,58 @@
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
 }
-:where(.bk-link) {
+.bk-link {
   font-size: var(--font-size-medium);
   text-decoration: none;
 }
-:where(.bk-link).is-disabled {
+.bk-link.is-disabled {
   cursor: not-allowed;
 }
-:where(.bk-link).has-underline {
+.bk-link.has-underline {
   text-decoration: underline;
 }
-:where(.bk-link).default {
+.bk-link.default {
   color: var(--default-color);
 }
-:where(.bk-link).default:hover {
+.bk-link.default:hover {
   color: var(--link-default-hover-color);
 }
-:where(.bk-link).default.is-disabled {
+.bk-link.default.is-disabled {
   color: var(--link-default-disabled-color);
 }
-:where(.bk-link).primary {
+.bk-link.primary {
   color: var(--primary-color);
 }
-:where(.bk-link).primary:hover {
+.bk-link.primary:hover {
   color: var(--link-primary-hover-color);
 }
-:where(.bk-link).primary.is-disabled {
+.bk-link.primary.is-disabled {
   color: var(--link-primary-disabled-color);
 }
-:where(.bk-link).success {
+.bk-link.success {
   color: var(--success-color);
 }
-:where(.bk-link).success:hover {
+.bk-link.success:hover {
   color: var(--link-success-hover-color);
 }
-:where(.bk-link).success.is-disabled {
+.bk-link.success.is-disabled {
   color: var(--link-success-disabled-color);
 }
-:where(.bk-link).warning {
+.bk-link.warning {
   color: var(--warning-color);
 }
-:where(.bk-link).warning:hover {
+.bk-link.warning:hover {
   color: var(--link-warning-hover-color);
 }
-:where(.bk-link).warning.is-disabled {
+.bk-link.warning.is-disabled {
   color: var(--link-warning-disabled-color);
 }
-:where(.bk-link).danger {
+.bk-link.danger {
   color: var(--danger-color);
 }
-:where(.bk-link).danger:hover {
+.bk-link.danger:hover {
   color: var(--link-danger-hover-color);
 }
-:where(.bk-link).danger.is-disabled {
+.bk-link.danger.is-disabled {
   color: var(--link-danger-disabled-color);
 }

package/lib/loading/index.js

@@ -1,8 +1,6 @@
-import "../styles/reset.css";
-import "./loading.less";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__ from "../shared";
+import * as __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__ from "../shared";
 import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "vue";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__ from "../config-provider";
+import * as __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__ from "../config-provider";
 /******/ // The require scope
 /******/ var __webpack_require__ = {};
 /******/ 
@@ -39,7 +37,7 @@ __webpack_require__.d(__webpack_exports__, {
 ;// CONCATENATED MODULE: external "../shared"
 var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var y = x => () => x
-const shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.PropTypes, ["classes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.classes, ["withInstallProps"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstallProps });
+const external_shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.PropTypes, ["classes"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.classes, ["withInstallProps"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.withInstallProps });
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
@@ -90,9 +88,9 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 ;// CONCATENATED MODULE: external "../config-provider"
-var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var config_provider_y = x => () => x
-const config_provider_namespaceObject = config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
+var external_config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var external_config_provider_y = x => () => x
+const external_config_provider_namespaceObject = external_config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__.usePrefix });
 ;// CONCATENATED MODULE: ../../packages/loading/src/loading.tsx
 
 
@@ -148,12 +146,12 @@ var loadingTypes = {
   indicator: {
     type: Function
   },
-  loading: shared_namespaceObject.PropTypes.bool.def(true),
-  inline: shared_namespaceObject.PropTypes.bool.def(true),
+  loading: external_shared_namespaceObject.PropTypes.bool.def(true),
+  inline: external_shared_namespaceObject.PropTypes.bool.def(true),
   theme: {
     type: String
   },
-  title: shared_namespaceObject.PropTypes.string.def(''),
+  title: external_shared_namespaceObject.PropTypes.string.def(''),
   size: {
     type: String,
     "default": BkLoadingSize.Normal
@@ -162,16 +160,16 @@ var loadingTypes = {
     type: String,
     "default": 'default'
   },
-  opacity: shared_namespaceObject.PropTypes.number.def(0.9),
-  color: shared_namespaceObject.PropTypes.string.def('white'),
-  zIndex: shared_namespaceObject.PropTypes.number.def(1),
-  isDirective: shared_namespaceObject.PropTypes.bool.def(false)
+  opacity: external_shared_namespaceObject.PropTypes.number.def(0.9),
+  color: external_shared_namespaceObject.PropTypes.string.def('white'),
+  zIndex: external_shared_namespaceObject.PropTypes.number.def(1),
+  isDirective: external_shared_namespaceObject.PropTypes.bool.def(false)
 };
 /* harmony default export */ const loading = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'Loading',
   props: loadingTypes,
   setup: function setup(props, ctx) {
-    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
     var dotIndicator = (0,external_vue_namespaceObject.createVNode)("div", {
       "class": "".concat(resolveClassName('normal-indicator'))
@@ -199,10 +197,10 @@ var loadingTypes = {
       }, zIndexStyle.value);
     });
     var loadingWrapperCls = (0,external_vue_namespaceObject.computed)(function () {
-      return (0,shared_namespaceObject.classes)(_defineProperty(_defineProperty(_defineProperty({}, "".concat(resolveClassName('loading-wrapper')), props.loading), "".concat(resolveClassName('nested-loading')), !!ctx.slots["default"]), "".concat(resolveClassName('directive-loading')), props.isDirective));
+      return (0,external_shared_namespaceObject.classes)(_defineProperty(_defineProperty(_defineProperty({}, "".concat(resolveClassName('loading-wrapper')), props.loading), "".concat(resolveClassName('nested-loading')), !!ctx.slots["default"]), "".concat(resolveClassName('directive-loading')), props.isDirective));
     });
     var containerCls = (0,external_vue_namespaceObject.computed)(function () {
-      return (0,shared_namespaceObject.classes)(_defineProperty(_defineProperty({}, "".concat(resolveClassName("loading-size-".concat(props.size))), !!props.size), "".concat(resolveClassName("loading-".concat(props.theme))), !!props.theme), resolveClassName('loading-indicator'));
+      return (0,external_shared_namespaceObject.classes)(_defineProperty(_defineProperty({}, "".concat(resolveClassName("loading-size-".concat(props.size))), !!props.size), "".concat(resolveClassName("loading-".concat(props.theme))), !!props.theme), resolveClassName('loading-indicator'));
     });
     var hasTitle = (0,external_vue_namespaceObject.computed)(function () {
       return !!props.title;
@@ -363,7 +361,7 @@ var vBkloading = {
 
 
 
-var BkLoading = (0,shared_namespaceObject.withInstallProps)(loading, {
+var BkLoading = (0,external_shared_namespaceObject.withInstallProps)(loading, {
   setDefaultIndicator: setDefaultIndicator,
   BkLoadingMode: BkLoadingMode,
   BkLoadingSize: BkLoadingSize

package/lib/loading/loading.css

@@ -11,12 +11,12 @@
     background-color: transparent;
   }
 }
-:where(.bk-transition) .bk-fade-enter-active,
-:where(.bk-transition) .bk-fade-leave-active {
+.bk-transition .bk-fade-enter-active,
+.bk-transition .bk-fade-leave-active {
   transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
 }
-:where(.bk-transition) .bk-fade-enter,
-:where(.bk-transition) .bk-fade-leave-to {
+.bk-transition .bk-fade-enter,
+.bk-transition .bk-fade-leave-to {
   opacity: 0;
 }
 .clearfix-style::after {
@@ -27,7 +27,7 @@
   content: '';
   visibility: hidden;
 }
-:where(.bk-popper) {
+.bk-popper {
   display: none;
   padding: 7px 14px;
   font-size: 12px;
@@ -35,62 +35,62 @@
   background: #333;
   border-radius: 4px;
 }
-:where(.bk-popper).light {
+.bk-popper.light {
   color: #63656e;
   background: #fff;
   box-shadow: #dcdee5 0 0 6px 0;
 }
-:where(.bk-popper) .bk-popper-arrow,
-:where(.bk-popper) .bk-popper-arrow::before {
+.bk-popper .bk-popper-arrow,
+.bk-popper .bk-popper-arrow::before {
   position: absolute;
   width: 8px;
   height: 8px;
   background: inherit;
 }
-:where(.bk-popper) .bk-popper-arrow {
+.bk-popper .bk-popper-arrow {
   visibility: hidden;
 }
-:where(.bk-popper) .bk-popper-arrow::before {
+.bk-popper .bk-popper-arrow::before {
   content: '';
   visibility: visible;
   transform: rotate(45deg);
 }
-:where(.bk-popper)[data-show] {
+.bk-popper[data-show] {
   display: block;
 }
-:where(.bk-popper[data-popper-placement^='top'] > .bk-popper-arrow) {
+.bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
   bottom: -4px;
 }
-:where(.bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow) {
+.bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
   top: -4px;
 }
-:where(.bk-popper[data-popper-placement^='left'] > .bk-popper-arrow) {
+.bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
   right: -4px;
 }
-:where(.bk-popper[data-popper-placement^='right'] > .bk-popper-arrow) {
+.bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
   left: -4px;
 }
-:where(.bk-loading-wrapper) {
+.bk-loading-wrapper {
   position: static;
   vertical-align: middle;
 }
-:where(.bk-loading-wrapper):not(.bk-nested-loading):not(.bk-directive-loading) {
+.bk-loading-wrapper:not(.bk-nested-loading):not(.bk-directive-loading) {
   display: inline-flex;
 }
-:where(.bk-loading-wrapper).bk-directive-loading {
+.bk-loading-wrapper.bk-directive-loading {
   width: 100%;
   height: 100%;
 }
-:where(.bk-loading-wrapper).bk-directive-loading,
-:where(.bk-loading-wrapper).bk-nested-loading {
+.bk-loading-wrapper.bk-directive-loading,
+.bk-loading-wrapper.bk-nested-loading {
   position: relative;
 }
-:where(.bk-loading-wrapper).bk-directive-loading.is-block,
-:where(.bk-loading-wrapper).bk-nested-loading.is-block {
+.bk-loading-wrapper.bk-directive-loading.is-block,
+.bk-loading-wrapper.bk-nested-loading.is-block {
   display: block;
 }
-:where(.bk-loading-wrapper).bk-directive-loading .bk-loading-indicator,
-:where(.bk-loading-wrapper).bk-nested-loading .bk-loading-indicator {
+.bk-loading-wrapper.bk-directive-loading .bk-loading-indicator,
+.bk-loading-wrapper.bk-nested-loading .bk-loading-indicator {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -98,7 +98,7 @@
   text-align: center;
   transform: translate(-50%, -50%);
 }
-:where(.bk-loading-wrapper) .dot {
+.bk-loading-wrapper .dot {
   display: inline-flex;
   width: 14px;
   height: 14px;
@@ -110,7 +110,7 @@
   animation-name: loading-scale-animate;
   animation-direction: normal;
 }
-:where(.bk-loading-wrapper) .oval {
+.bk-loading-wrapper .oval {
   position: absolute;
   width: 6px;
   height: 8px;
@@ -121,191 +121,191 @@
   animation-name: fade;
   transform-origin: center 24px;
 }
-:where(.bk-loading-wrapper) .bk-loading-mask {
+.bk-loading-wrapper .bk-loading-mask {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator {
+.bk-loading-wrapper .bk-loading-indicator {
   display: flex;
   line-height: 1;
   text-align: center;
   flex-direction: column;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-4 {
   background-color: #2dcb56;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-4 {
   background-color: #ea3636;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-4 {
   background-color: #ff9c01;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-4 {
   background-color: #3a84ff;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-4 {
   background-color: white;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .oval,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-1,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-2,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-3,
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .oval,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-1,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-2,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-3,
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-4 {
   background-color: #c4c6cc;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .dot-1 {
+.bk-loading-wrapper .bk-loading-indicator .dot-1 {
   background-color: #ea3636;
   animation-delay: 0.1s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .dot-2 {
+.bk-loading-wrapper .bk-loading-indicator .dot-2 {
   background-color: #ff9c01;
   animation-delay: 0.25s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .dot-3 {
+.bk-loading-wrapper .bk-loading-indicator .dot-3 {
   background-color: #2dcb56;
   animation-delay: 0.4s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .dot-4 {
+.bk-loading-wrapper .bk-loading-indicator .dot-4 {
   background-color: #3a84ff;
   animation-delay: 0.55s;
   margin-right: 0px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-1 {
+.bk-loading-wrapper .bk-loading-indicator .oval-1 {
   transform: rotate(135deg);
   animation-delay: -0.45s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-2 {
+.bk-loading-wrapper .bk-loading-indicator .oval-2 {
   transform: rotate(90deg);
   animation-delay: -0.6s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-3 {
+.bk-loading-wrapper .bk-loading-indicator .oval-3 {
   transform: rotate(45deg);
   animation-delay: -0.75s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-4 {
+.bk-loading-wrapper .bk-loading-indicator .oval-4 {
   transform: rotate(0deg);
   animation-delay: -0.9s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-5 {
+.bk-loading-wrapper .bk-loading-indicator .oval-5 {
   transform: rotate(-45deg);
   animation-delay: -1.05s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-6 {
+.bk-loading-wrapper .bk-loading-indicator .oval-6 {
   transform: rotate(-90deg);
   animation-delay: -1.2s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-7 {
+.bk-loading-wrapper .bk-loading-indicator .oval-7 {
   transform: rotate(-135deg);
   animation-delay: -1.35s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .oval-8 {
+.bk-loading-wrapper .bk-loading-indicator .oval-8 {
   transform: rotate(-180deg);
   animation-delay: -1.5s;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .bk-normal-indicator {
+.bk-loading-wrapper .bk-loading-indicator .bk-normal-indicator {
   display: inline-flex;
   justify-content: center;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .bk-spin-indicator {
+.bk-loading-wrapper .bk-loading-indicator .bk-spin-indicator {
   position: relative;
   display: inline-flex;
   justify-content: center;
   width: 48px;
   height: 48px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
   height: 16px;
   width: 16px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .dot {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot {
   width: 3px;
   height: 3px;
   margin-right: 3px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
   margin-right: 0;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .oval {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .oval {
   width: 2px;
   height: 3px;
   border-radius: 3px;
   transform-origin: center 8px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
   font-size: 14px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
   height: 32px;
   width: 32px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .dot {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot {
   width: 6px;
   height: 6px;
   margin-right: 6px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
   margin-right: 0;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .oval {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .oval {
   width: 4px;
   height: 5px;
   border-radius: 5px;
   transform-origin: center 16px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
   font-size: 12px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
   height: 68px;
   width: 68px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .dot {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot {
   width: 20px;
   height: 20px;
   margin-right: 12px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
   margin-right: 0;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .oval {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .oval {
   width: 8px;
   height: 12px;
   border-radius: 12px;
   transform-origin: center 34px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
+.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
   font-size: 14px;
 }
-:where(.bk-loading-wrapper) .bk-loading-indicator .bk-loading-title {
+.bk-loading-wrapper .bk-loading-indicator .bk-loading-title {
   margin-top: 8px;
   font-size: 14px;
   line-height: normal;

package/lib/loading/loading.less

@@ -57,7 +57,7 @@
   default: @light-gray;
 };
 
-:where(.@{bk-prefix}-loading-wrapper) {
+.@{bk-prefix}-loading-wrapper {
   position: static;
   vertical-align: middle;
   &:not(.@{bk-prefix}-nested-loading):not(.@{bk-prefix}-directive-loading) {
@@ -95,8 +95,8 @@
     height: @dotSize;
     margin-right: @dotGap;
     border-radius: 50%;
-    transform: scale(0.6);
-    animation-duration: 0.8s;
+    transform: scale(.6);
+    animation-duration: .8s;
     animation-iteration-count: infinite;
     animation-name: loading-scale-animate;
     animation-direction: normal;
@@ -195,7 +195,7 @@
       }
     }
   })
-      .@{bk-prefix}-loading-title {
+    .@{bk-prefix}-loading-title {
       margin-top: @titleMarginTop;
       font-size: @font-size-medium;
       line-height: normal;