fix(space): [space]default spacing for overlay button components (#3816)

* fix(space): [space]default spacing for overlay button components

* fix: import to style root file directory

Author: James-9696

examples/sites/demos/mobile-first/app/space/space-size.vue

@@ -15,7 +15,7 @@
 
     <!-- 使用 dynamic direction 值 -->
     <tiny-space class="tiny-space" :size="[rowValue, columnValue]" :wrap="true">
-      <tiny-button style="margin: 0" v-for="n in 15" :key="n">按钮 {{ n }}</tiny-button>
+      <tiny-button v-for="n in 15" :key="n">按钮 {{ n }}</tiny-button>
     </tiny-space>
   </div>
 </template>

examples/sites/demos/pc/app/space/space-size.vue

@@ -15,7 +15,7 @@
 
     <!-- 使用 dynamic direction 值 -->
     <tiny-space class="tiny-space" :size="[rowValue, columnValue]" :wrap="true">
-      <tiny-button style="margin: 0" v-for="n in 15" :key="n">按钮 {{ n }}</tiny-button>
+      <tiny-button v-for="n in 15" :key="n">按钮 {{ n }}</tiny-button>
     </tiny-space>
   </div>
 </template>

packages/theme/src/index.less

@@ -123,6 +123,7 @@
 @import './skeleton-item/index.less';
 @import './slide-img/index.less';
 @import './slider/index.less';
+@import './space/index.less';
 @import './split/index.less';
 @import './statistic/index.less';
 @import './steps/index.less';

packages/theme/src/space/index.less

@@ -0,0 +1,24 @@
+/**
+* Copyright (c) 2022 - present TinyVue Authors.
+* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+*
+* Use of this source code is governed by an MIT-style license.
+*
+* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+*
+*/
+
+@import '../custom.less';
+@import './vars.less';
+
+@space-prefix-cls: ~'@{css-prefix}space';
+
+.@{space-prefix-cls} {
+  .inject-Space-vars();
+  // TODO: 需要和 button 组件的间距变量统一(button组件后续大版本变更,需要去除默认间距8px),变更后，再将此代码删除
+  && .tiny-button + .tiny-button {
+    margin-left: var(--tv-Space-margin);
+  }
+}

packages/theme/src/space/vars.less

@@ -0,0 +1,15 @@
+/**
+* Copyright (c) 2022 - present TinyVue Authors.
+* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+*
+* Use of this source code is governed by an MIT-style license.
+*
+* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+*
+*/
+
+.inject-Space-vars() {
+  --tv-Space-margin: 0px;
+}

packages/theme/src/vars.less

@@ -52,6 +52,7 @@
 @import './slide-bar/vars.less';
 @import './tooltip/vars.less';
 @import './split/vars.less';
+@import './space/vars.less';
 @import './steps/vars.less';
 @import './switch/vars.less';
 @import './tabs/vars.less';

packages/vue/src/space/index.ts

@@ -11,6 +11,7 @@
  */
 
 import Space from './src/index'
+import '@opentiny/vue-theme/space/index.less'
 import { version } from './package.json'
 
 /* istanbul ignore next */