fix(base-picker): fix className of BasePicker (#1573)

Co-authored-by: maxin <maxin@growingio.com>

src/legacy/base-picker/style/index.less

@@ -1,12 +1,17 @@
 @import '../../../stylesheet/index.less';
+@import (reference) '../../search-bar/style/index.less';
+@import (reference) '../../alert/style/index.less';
+@import (reference) '../../tab-nav/style/index.less';
+@import (reference) '../../empty/style/index.less';
+@import (reference) '../../loading/style/index.less';
+@import (reference) '../../list/style/index.less';
 
 @base-picker-prefix-cls-legacy: ~'@{component-prefix}-base-picker-legacy';
 
 .@{base-picker-prefix-cls-legacy} {
   position: relative;
   width: 360px;
   height: fit-content;
-  // max-height: 520px;
   margin: 0;
   padding: 12px 0 0;
   background-color: #fff;
@@ -17,7 +22,7 @@
     height: 36px;
     margin: 0 16px;
 
-    .gio-searchbar {
+    .@{searchbar-prefix-cls-legacy} {
       display: inline-block;
       vertical-align: top;
 
@@ -26,23 +31,23 @@
       }
     }
 
-    .gio-alert {
+    .@{alert-prefix-cls-legacy} {
       position: absolute;
       top: 72px;
       z-index: 9999;
       width: 320px;
     }
   }
 
-  .gio-tabnav {
+  .@{tabnav-prefix-cls-legacy} {
     margin: 8px;
   }
 
-  .gio-empty {
+  .@{empty-prefix-cls-legacy} {
     margin-top: 100px;
   }
 
-  .gio-loading-wrapper {
+  .@{loading-prefix-cls-legacy}-wrapper-loading {
     height: 406px;
     padding-top: 170px;
     text-align: center;
@@ -58,7 +63,7 @@
     scrollbar-width: none; // firefox
     -ms-overflow-style: none; // IE 10+
 
-    .gio-list__item-group__title {
+    .@{list-prefix-cls-legacy}__item-group__title {
       position: sticky;
       top: 0;
       background-color: @palette-white;

src/legacy/base-picker/style/index.ts

@@ -1,5 +1,7 @@
 import '../../alert/style';
 import '../../search-bar/style';
-import '../../tab-nav';
-import '../../list';
+import '../../tab-nav/style';
+import '../../list/style';
+import '../../loading/style';
+import '../../empty/style';
 import './index.less';

src/legacy/tab-nav/TabNav.tsx

@@ -22,11 +22,11 @@ const TabNav = (props: TabNavProps, ref?: React.RefObject<HTMLDivElement>) => {
   } = props;
 
   const [localActiveKey, setLocalActiveKey] = useControlledState<string>(activeKey, defaultActiveKey);
-  const wrapperRefKey = useRef<symbol>(Symbol('tabNav-legacy'));
+  const wrapperRefKey = useRef<symbol>(Symbol('tabNav'));
   const [setRef, getRef] = useRefs<HTMLDivElement>();
   const [inkStyle, setInkStyle] = useState<React.CSSProperties>({});
 
-  const prefixCls = usePrefixCls('tabnav', customizePrefixCls);
+  const prefixCls = usePrefixCls('tabnav-legacy', customizePrefixCls);
   const classString = classNames(prefixCls, `${prefixCls}-${type}`, {
     [`${prefixCls}-lg`]: size === 'large',
     [`${prefixCls}-md`]: size === 'middle',