@sdata/web-vue 1.6.0 → 1.7.0

package/es/spin/style/index.css

@@ -50,115 +50,114 @@
   background-color: rgb(var(--primary-2));
   animation-delay: 1600ms;
 }
-/* prettier-ignore */
+
 @keyframes sd-dot-loading {
-  /* prettier-ignore */
   0% {
-    transform: translate3D(-48.621%, 0, -0.985px) scale(0.511);
+    transform: translate3D(-48.6214897467%, 0, -0.984807753px) scale(0.5113941852);
   }
-  2.778% {
-    transform: translate3D(-95.766%, 0, -0.94px) scale(0.545);
+  2.7777777778% {
+    transform: translate3D(-95.7656401312%, 0, -0.9396926208px) scale(0.5452305344);
   }
-  5.556% {
-    transform: translate3D(-140%, 0, -0.866px) scale(0.6);
+  5.5555555556% {
+    transform: translate3D(-140%, 0, -0.8660254038px) scale(0.6004809472);
   }
-  8.333% {
-    transform: translate3D(-179.981%, 0, -0.766px) scale(0.675);
+  8.3333333333% {
+    transform: translate3D(-179.9805307122%, 0, -0.7660444431px) scale(0.6754666677);
   }
-  11.111% {
-    transform: translate3D(-214.492%, 0, -0.643px) scale(0.768);
+  11.1111111111% {
+    transform: translate3D(-214.4924440733%, 0, -0.6427876097px) scale(0.7679092927);
   }
-  13.889% {
-    transform: translate3D(-242.487%, 0, -0.5px) scale(0.875);
+  13.8888888889% {
+    transform: translate3D(-242.4871130596%, 0, -0.5px) scale(0.875);
   }
-  16.667% {
-    transform: translate3D(-263.114%, 0, -0.342px) scale(0.993);
+  16.6666666667% {
+    transform: translate3D(-263.1139338201%, 0, -0.3420201433px) scale(0.9934848925);
   }
-  19.444% {
-    transform: translate3D(-275.746%, 0, -0.174px) scale(1.12);
+  19.4444444444% {
+    transform: translate3D(-275.7461708434%, 0, -0.1736481777px) scale(1.1197638667);
   }
-  22.222% {
+  22.2222222222% {
     transform: translate3D(-280%, 0, 0px) scale(1.25);
   }
   25% {
-    transform: translate3D(-275.746%, 0, 0.174px) scale(1.38);
+    transform: translate3D(-275.7461708434%, 0, 0.1736481777px) scale(1.3802361333);
   }
-  27.778% {
-    transform: translate3D(-263.114%, 0, 0.342px) scale(1.507);
+  27.7777777778% {
+    transform: translate3D(-263.1139338201%, 0, 0.3420201433px) scale(1.5065151075);
   }
-  30.556% {
-    transform: translate3D(-242.487%, 0, 0.5px) scale(1.625);
+  30.5555555556% {
+    transform: translate3D(-242.4871130596%, 0, 0.5px) scale(1.625);
   }
-  33.333% {
-    transform: translate3D(-214.492%, 0, 0.643px) scale(1.732);
+  33.3333333333% {
+    transform: translate3D(-214.4924440733%, 0, 0.6427876097px) scale(1.7320907073);
   }
-  36.111% {
-    transform: translate3D(-179.981%, 0, 0.766px) scale(1.825);
+  36.1111111111% {
+    transform: translate3D(-179.9805307122%, 0, 0.7660444431px) scale(1.8245333323);
   }
-  38.889% {
-    transform: translate3D(-140%, 0, 0.866px) scale(1.9);
+  38.8888888889% {
+    transform: translate3D(-140%, 0, 0.8660254038px) scale(1.8995190528);
   }
-  41.667% {
-    transform: translate3D(-95.766%, 0, 0.94px) scale(1.955);
+  41.6666666667% {
+    transform: translate3D(-95.7656401312%, 0, 0.9396926208px) scale(1.9547694656);
   }
-  44.444% {
-    transform: translate3D(-48.621%, 0, 0.985px) scale(1.989);
+  44.4444444444% {
+    transform: translate3D(-48.6214897467%, 0, 0.984807753px) scale(1.9886058148);
   }
-  47.222% {
+  47.2222222222% {
     transform: translate3D(0%, 0, 1px) scale(2);
   }
   50% {
-    transform: translate3D(48.621%, 0, 0.985px) scale(1.989);
+    transform: translate3D(48.6214897467%, 0, 0.984807753px) scale(1.9886058148);
   }
-  52.778% {
-    transform: translate3D(95.766%, 0, 0.94px) scale(1.955);
+  52.7777777778% {
+    transform: translate3D(95.7656401312%, 0, 0.9396926208px) scale(1.9547694656);
   }
-  55.556% {
-    transform: translate3D(140%, 0, 0.866px) scale(1.9);
+  55.5555555556% {
+    transform: translate3D(140%, 0, 0.8660254038px) scale(1.8995190528);
   }
-  58.333% {
-    transform: translate3D(179.981%, 0, 0.766px) scale(1.825);
+  58.3333333333% {
+    transform: translate3D(179.9805307122%, 0, 0.7660444431px) scale(1.8245333323);
   }
-  61.111% {
-    transform: translate3D(214.492%, 0, 0.643px) scale(1.732);
+  61.1111111111% {
+    transform: translate3D(214.4924440733%, 0, 0.6427876097px) scale(1.7320907073);
   }
-  63.889% {
-    transform: translate3D(242.487%, 0, 0.5px) scale(1.625);
+  63.8888888889% {
+    transform: translate3D(242.4871130596%, 0, 0.5px) scale(1.625);
   }
-  66.667% {
-    transform: translate3D(263.114%, 0, 0.342px) scale(1.507);
+  66.6666666667% {
+    transform: translate3D(263.1139338201%, 0, 0.3420201433px) scale(1.5065151075);
   }
-  69.444% {
-    transform: translate3D(275.746%, 0, 0.174px) scale(1.38);
+  69.4444444444% {
+    transform: translate3D(275.7461708434%, 0, 0.1736481777px) scale(1.3802361333);
   }
-  72.222% {
+  72.2222222222% {
     transform: translate3D(280%, 0, 0px) scale(1.25);
   }
   75% {
-    transform: translate3D(275.746%, 0, -0.174px) scale(1.12);
+    transform: translate3D(275.7461708434%, 0, -0.1736481777px) scale(1.1197638667);
   }
-  77.778% {
-    transform: translate3D(263.114%, 0, -0.342px) scale(0.993);
+  77.7777777778% {
+    transform: translate3D(263.1139338201%, 0, -0.3420201433px) scale(0.9934848925);
   }
-  80.556% {
-    transform: translate3D(242.487%, 0, -0.5px) scale(0.875);
+  80.5555555556% {
+    transform: translate3D(242.4871130596%, 0, -0.5px) scale(0.875);
   }
-  83.333% {
-    transform: translate3D(214.492%, 0, -0.643px) scale(0.768);
+  83.3333333333% {
+    transform: translate3D(214.4924440733%, 0, -0.6427876097px) scale(0.7679092927);
   }
-  86.111% {
-    transform: translate3D(179.981%, 0, -0.766px) scale(0.675);
+  86.1111111111% {
+    transform: translate3D(179.9805307122%, 0, -0.7660444431px) scale(0.6754666677);
   }
-  88.889% {
-    transform: translate3D(140%, 0, -0.866px) scale(0.6);
+  88.8888888889% {
+    transform: translate3D(140%, 0, -0.8660254038px) scale(0.6004809472);
   }
-  91.667% {
-    transform: translate3D(95.766%, 0, -0.94px) scale(0.545);
+  91.6666666667% {
+    transform: translate3D(95.7656401312%, 0, -0.9396926208px) scale(0.5452305344);
   }
-  94.444% {
-    transform: translate3D(48.621%, 0, -0.985px) scale(0.511);
+  94.4444444444% {
+    transform: translate3D(48.6214897467%, 0, -0.984807753px) scale(0.5113941852);
   }
-  97.222% {
+  97.2222222222% {
     transform: translate3D(0%, 0, -1px) scale(0.5);
   }
 }
@@ -201,4 +200,4 @@
 .sd-spin-loading .sd-spin-children::after {
   opacity: 1;
   pointer-events: auto;
-}
+}

package/es/spin/style/index.d.ts

@@ -1,2 +1,2 @@
-import '../../style/index.less';
-import './index.less';
+import '../../style/index.scss';
+import './index.scss';

package/es/spin/style/index.js

@@ -1,2 +1,2 @@
-import "../../style/index.less";
-import "./index.less";
+import "../../style/index.scss";
+import "./index.scss";

package/es/spin/style/index.scss

@@ -0,0 +1,55 @@
+@use '@style/theme/index.scss' as theme;
+@use '@style/theme/index.scss' as global;
+@use 'sass:string';
+@use '@components/spin/style/token.scss' as *;
+@use '@components/spin/style/dot-loading.scss' as *;
+
+$spin-prefix-cls: string.unquote('#{theme.$prefix}-spin');
+
+.#{$spin-prefix-cls} {
+  display: inline-block;
+
+  &-with-tip {
+    text-align: center;
+  }
+
+  &-icon {
+    color: $spin-color-icon;
+    font-size: $spin-font-size-icon;
+  }
+
+  &-tip {
+    margin-top: $spin-margin-top-tip;
+    color: $spin-color-text;
+    font-weight: $spin-font-weight;
+    font-size: $spin-font-size-text;
+  }
+
+  &-mask {
+    position: absolute;
+    inset: 0;
+    z-index: 11;
+    text-align: center;
+    background-color: var(string.unquote('#{global.$sd-cssvars-prefix}-color-spin-layer-bg'));
+    transition: opacity theme.$transition-duration-1 theme.$transition-timing-function-linear;
+    user-select: none;
+  }
+
+  &-loading {
+    position: relative;
+    user-select: none;
+  }
+
+  &-loading &-mask-icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    z-index: 12;
+    transform: translate(-50%, -50%);
+  }
+
+  &-loading &-children::after {
+    opacity: 1;
+    pointer-events: auto;
+  }
+}

package/es/spin/style/token.scss

@@ -0,0 +1,32 @@
+@use '@style/theme/index.scss' as global;
+
+@forward '@style/theme/index.scss';
+@forward '@style/color/colors.scss' hide $sd-vars-prefix, $sd-cssvars-prefix;
+
+@use '@style/theme/index.scss' as *;
+
+$spin-font-size-text: 14px;
+
+$spin-font-size-icon: 20px;
+
+$spin-font-weight: global.$font-weight-500;
+
+$spin-line-height: $line-height-base;
+
+$spin-margin-top-tip: global.$spacing-3;
+
+$spin-color-text: global.$color-primary-6;
+
+$spin-color-icon: global.$color-primary-6;
+
+$spin-dot-color-icon_default: global.$color-primary-6;
+
+$spin-dot-color-icon_second: global.$color-primary-5;
+
+$spin-dot-color-icon_third: global.$color-primary-4;
+
+$spin-dot-color-icon_forth: global.$color-primary-4;
+
+$spin-dot-color-icon_last: global.$color-primary-2;
+
+$spin-dot-size-width: global.$size-2;

package/es/split/style/index.css

@@ -30,6 +30,7 @@
 .sd-split-vertical {
   flex-direction: column;
 }
+
 .sd-split-trigger-icon-wrapper {
   display: flex;
   align-items: center;
@@ -51,4 +52,4 @@
 .sd-split-trigger-horizontal {
   width: 100%;
   cursor: row-resize;
-}
+}

package/es/split/style/index.d.ts

@@ -1,2 +1,2 @@
-import '../../style/index.less';
-import './index.less';
+import '../../style/index.scss';
+import './index.scss';

package/es/split/style/index.js

@@ -1,2 +1,2 @@
-import "../../style/index.less";
-import "./index.less";
+import "../../style/index.scss";
+import "./index.scss";

package/es/split/style/index.scss

@@ -0,0 +1,56 @@
+@use '@components/resize-box/style/token.scss' as resizeBoxToken;
+@use '@style/theme/index.scss' as theme;
+@use 'sass:string';
+@use '@components/split/style/token.scss' as *;
+
+$split-prefix-cls: string.unquote('#{theme.$prefix}-split');
+$split-trigger-prefix-cls: string.unquote('#{$split-prefix-cls}-trigger');
+
+.#{$split-prefix-cls} {
+  display: flex;
+
+  &-pane {
+    overflow: auto;
+  }
+
+  &-pane-second {
+    flex: 1;
+  }
+
+  &-horizontal {
+    flex-direction: row;
+  }
+
+  &-vertical {
+    flex-direction: column;
+  }
+}
+
+// 伸缩触发杆
+.#{$split-trigger-prefix-cls} {
+  &-icon-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    color: $split-trigger-color-icon;
+    font-size: $split-trigger-font-size-icon;
+    line-height: 1;
+    background-color: $split-trigger-color-background;
+  }
+
+  &-icon {
+    display: inline-block;
+    margin: -(resizeBoxToken.$resizeBox-trigger-font-size-icon * 0.25);
+  }
+
+  &-vertical {
+    height: 100%;
+    cursor: col-resize;
+  }
+
+  &-horizontal {
+    width: 100%;
+    cursor: row-resize;
+  }
+}

package/es/split/style/token.scss

@@ -0,0 +1,21 @@
+@use '@style/theme/index.scss' as global;
+
+@forward '@style/theme/index.scss';
+@forward '@style/color/colors.scss' hide $sd-vars-prefix, $sd-cssvars-prefix;
+
+@use 'sass:string';
+
+@forward '@components/resize-box/style/token.scss';
+
+@use '@style/theme/index.scss' as *;
+@use '@components/resize-box/style/token.scss' as *;
+
+$split-trigger-color-background: var(
+  string.unquote('#{global.$sd-cssvars-prefix}-color-neutral-3')
+);
+
+$split-trigger-size-icon-wrapper: 6px;
+
+$split-trigger-font-size-icon: 12px;
+
+$split-trigger-color-icon: var(string.unquote('#{global.$sd-cssvars-prefix}-color-text-1'));

package/es/statistic/style/index.css

@@ -48,4 +48,4 @@
 .sd-statistic-extra {
   margin-top: 8px;
   color: var(--color-text-2);
-}
+}

package/es/statistic/style/index.d.ts

@@ -1,2 +1,2 @@
-import '../../style/index.less';
-import './index.less';
+import '../../style/index.scss';
+import './index.scss';

package/es/statistic/style/index.js

@@ -1,2 +1,2 @@
-import "../../style/index.less";
-import "./index.less";
+import "../../style/index.scss";
+import "./index.scss";

package/es/statistic/style/index.scss

@@ -0,0 +1,49 @@
+@use '@style/theme/index.scss' as theme;
+@use 'sass:string';
+@use '@components/statistic/style/token.scss' as *;
+
+$statistic-prefix-cls: string.unquote('#{theme.$prefix}-statistic');
+
+.#{$statistic-prefix-cls} {
+  display: inline-block;
+  color: $statistic-color-text;
+  line-height: theme.$line-height-base;
+
+  &-title {
+    margin-bottom: $statistic-margin-title-bottom;
+    color: $statistic-color-title-text;
+    font-size: $statistic-font-title-size;
+  }
+
+  &-content {
+    .#{$statistic-prefix-cls}-value {
+      color: $statistic-color-value-text;
+      font-weight: $statistic-font-value-weight;
+      font-size: $statistic-font-int-size;
+      white-space: nowrap;
+
+      &-integer {
+        font-size: inherit;
+        white-space: nowrap;
+      }
+
+      &-decimal {
+        display: inline-block;
+        font-size: $statistic-font-decimal-size;
+      }
+    }
+  }
+
+  &-prefix {
+    font-size: $statistic-size-value-icon;
+  }
+
+  &-suffix {
+    font-size: $statistic-font-suffix-size;
+  }
+
+  &-extra {
+    margin-top: $statistic-margin-extra-top;
+    color: $statistic-color-extra-text;
+  }
+}

package/es/statistic/style/token.scss

@@ -0,0 +1,33 @@
+@use '@style/theme/index.scss' as global;
+
+@forward '@style/theme/index.scss';
+@forward '@style/color/colors.scss' hide $sd-vars-prefix, $sd-cssvars-prefix;
+
+@use 'sass:string';
+@use '@style/theme/index.scss' as *;
+
+$statistic-font-title-size: global.$font-size-body-3;
+
+$statistic-margin-title-bottom: global.$spacing-4;
+
+$statistic-margin-extra-top: global.$spacing-4;
+
+$statistic-font-value-size: global.$font-size-body-3;
+
+$statistic-font-int-size: 26px;
+
+$statistic-font-decimal-size: inherit;
+
+$statistic-font-value-weight: global.$font-weight-500;
+
+$statistic-color-value-text: var(string.unquote('#{global.$sd-cssvars-prefix}-color-text-1'));
+
+$statistic-color-text: var(string.unquote('#{global.$sd-cssvars-prefix}-color-text-2'));
+
+$statistic-size-value-icon: 14px;
+
+$statistic-font-suffix-size: 14px;
+
+$statistic-color-title-text: var(string.unquote('#{global.$sd-cssvars-prefix}-color-text-2'));
+
+$statistic-color-extra-text: var(string.unquote('#{global.$sd-cssvars-prefix}-color-text-2'));