@wot-ui/ui 2.0.0-alpha.8 → 2.0.0

package/components/wd-switch/wd-switch.vue

@@ -1,12 +1,24 @@
 <template>
   <view :class="rootClass" :style="rootStyle" @click="switchValue">
     <view class="wd-switch__inner" :style="innerStyle">
-      <wd-icon custom-class="wd-switch__inner-icon" :name="innerIcon" v-if="innerIcon" :class-prefix="classPrefix"></wd-icon>
+      <wd-icon
+        v-if="innerIcon || innerCssIcon"
+        custom-class="wd-switch__inner-icon"
+        :name="innerIcon"
+        :class-prefix="classPrefix"
+        :css-icon="innerCssIcon"
+      ></wd-icon>
       <text v-else class="wd-switch__inner-text">{{ isActive ? activeText : inactiveText }}</text>
     </view>
     <view class="wd-switch__action">
-      <wd-loading v-bind="customLoadingProps" v-if="loading"></wd-loading>
-      <wd-icon custom-class="wd-switch__action-icon" :name="actionIcon" v-else-if="actionIcon" :class-prefix="classPrefix"></wd-icon>
+      <wd-loading v-if="loading" v-bind="customLoadingProps"></wd-loading>
+      <wd-icon
+        v-else-if="actionIcon || actionCssIcon"
+        custom-class="wd-switch__action-icon"
+        :name="actionIcon"
+        :class-prefix="classPrefix"
+        :css-icon="actionCssIcon"
+      ></wd-icon>
     </view>
   </view>
 </template>
@@ -62,10 +74,18 @@ const innerIcon = computed(() => {
   return isActive.value ? props.activeIcon : props.inactiveIcon
 })
 
+const innerCssIcon = computed(() => {
+  return isActive.value ? props.activeCssIcon : props.inactiveCssIcon
+})
+
 const actionIcon = computed(() => {
   return isActive.value ? props.activeActionIcon : props.inactiveActionIcon
 })
 
+const actionCssIcon = computed(() => {
+  return isActive.value ? props.activeActionCssIcon : props.inactiveActionCssIcon
+})
+
 const customLoadingProps = computed<Partial<LoadingProps>>(() => {
   const overrides: Partial<LoadingProps> = isDef(props.loadingProps) ? omitBy(props.loadingProps, isUndefined) : {}
   const customSpinnerClass = [isDef(overrides.customSpinnerClass) ? overrides.customSpinnerClass : '', 'wd-switch__action-loading']

package/components/wd-tabbar/index.scss

@@ -10,7 +10,7 @@ $tabbar-z-index: var(--wot-tabbar-z-index, 10) !default;
 // round 变体水平外边距
 $tabbar-round-margin-horizontal: var(--wot-tabbar-round-margin-horizontal, $spacing-extra-loose) !default;
 // round 变体圆角
-$tabbar-round-radius: var(--wot-tabbar-round-radius, $radius-radius-full) !default;
+$tabbar-round-radius: var(--wot-tabbar-round-radius, $radius-full) !default;
 // round 变体阴影
 $tabbar-round-shadow: var(
   --wot-tabbar-round-shadow,

package/components/wd-tabbar-item/index.scss

@@ -7,7 +7,7 @@ $tabbar-item-color-inactive: var(--wot-tabbar-item-color-inactive, $text-main) !
 // 标题文字大小
 $tabbar-item-title-font-size: var(--wot-tabbar-item-title-font-size, $typography-label-size-extra-small) !default;
 // 标题文字行高
-$tabbar-item-title-line-height: var(--wot-tabbar-item-title-line-height, $typography-label-line--height-size-extra-small) !default;
+$tabbar-item-title-line-height: var(--wot-tabbar-item-title-line-height, $typography-label-line-height-size-extra-small) !default;
 // 图标大小
 $tabbar-item-icon-size: var(--wot-tabbar-item-icon-size, $n-24) !default;
 

package/components/wd-table/index.scss

@@ -14,7 +14,7 @@ $table-border-width: var(--wot-table-border-width, $stroke-main) !default;
 // 单元格字号
 $table-cell-font-size: var(--wot-table-cell-font-size, $typography-body-size-main) !default;
 // 单元格行高
-$table-cell-line-height: var(--wot-table-cell-line-height, $typography-body-line--height-size-main) !default;
+$table-cell-line-height: var(--wot-table-cell-line-height, $typography-body-line-height-size-main) !default;
 // 单元格内边距
 $table-cell-padding: var(--wot-table-cell-padding, $padding-loose $padding-extra-loose) !default;
 // 固定列阴影渐变背景

package/components/wd-tabs/index.scss

@@ -14,7 +14,7 @@ $tabs-nav-font-weight-active: var(--wot-tabs-nav-font-weight-active, $font-weigh
 // 导航项字号
 $tabs-nav-item-font-size: var(--wot-tabs-nav-item-font-size, $typography-body-size-extra-large) !default;
 // 导航项行高
-$tabs-nav-item-line-height: var(--wot-tabs-nav-item-line-height, $typography-body-line--height-size-extra-large) !default;
+$tabs-nav-item-line-height: var(--wot-tabs-nav-item-line-height, $typography-body-line-height-size-extra-large) !default;
 // 导航项内边距
 $tabs-nav-item-padding: var(--wot-tabs-nav-item-padding, $padding-main $padding-extra-loose) !default;
 // 导航禁用文字颜色
@@ -46,7 +46,7 @@ $tabs-map-color: var(--wot-tabs-map-color, $text-main) !default;
 // 地图模式头部字号
 $tabs-map-header-font-size: var(--wot-tabs-map-header-font-size, $typography-body-size-extra-large) !default;
 // 地图模式头部行高
-$tabs-map-header-line-height: var(--wot-tabs-map-header-line-height, $typography-body-line--height-size-extra-large) !default;
+$tabs-map-header-line-height: var(--wot-tabs-map-header-line-height, $typography-body-line-height-size-extra-large) !default;
 // 地图模式头部内边距
 $tabs-map-header-padding: var(--wot-tabs-map-header-padding, $padding-main $padding-extra-loose) !default;
 // 地图模式导航按钮间距
@@ -62,7 +62,7 @@ $tabs-map-nav-btn-radius: var(--wot-tabs-map-nav-btn-radius, $radius-main) !defa
 // 地图模式导航按钮字号
 $tabs-map-nav-btn-font-size: var(--wot-tabs-map-nav-btn-font-size, $typography-body-size-ultra-large) !default;
 // 地图模式导航按钮行高
-$tabs-map-nav-btn-line-height: var(--wot-tabs-map-nav-btn-line-height, $typography-body-line--height-size-ultra-large) !default;
+$tabs-map-nav-btn-line-height: var(--wot-tabs-map-nav-btn-line-height, $typography-body-line-height-size-ultra-large) !default;
 // 地图模式导航按钮内边距
 $tabs-map-nav-btn-padding: var(--wot-tabs-map-nav-btn-padding, $padding-tight $padding-extra-loose) !default;
 // 地图模式内容内边距
@@ -170,7 +170,7 @@ $tabs-map-body-bg: var(--wot-tabs-map-body-bg, $filled-oppo) !default;
       bottom: 0;
       width: $n-6;
       height: $n-6;
-      border-radius: $radius-radius-full;
+      border-radius: $radius-full;
     }
   }
 

package/components/wd-tag/index.scss

@@ -9,7 +9,7 @@ $tag-font-size: var(--wot-tag-font-size, $typography-label-size-main) !default;
 // 默认圆角
 $tag-radius: var(--wot-tag-radius, $radius-small) !default;
 // 圆角标签圆角
-$tag-round-radius: var(--wot-tag-round-radius, $radius-radius-full) !default;
+$tag-round-radius: var(--wot-tag-round-radius, $radius-full) !default;
 // 标记标签圆角
 $tag-mark-radius: var(--wot-tag-mark-radius, $radius-large $radius-main) !default;
 // 图标间距
@@ -79,7 +79,7 @@ $tag-purple-color: var(--wot-tag-purple-color, $purple-6) !default;
 // 小尺寸字号
 $tag-small-font-size: var(--wot-tag-small-font-size, $typography-label-size-small) !default;
 // 小尺寸行高
-$tag-small-line-height: var(--wot-tag-small-line-height, $typography-label-line--height-size-small) !default;
+$tag-small-line-height: var(--wot-tag-small-line-height, $typography-label-line-height-size-small) !default;
 // 小尺寸内边距
 $tag-small-padding: var(--wot-tag-small-padding, $padding-zero $padding-super-tight) !default;
 // 小尺寸圆角态内边距
@@ -89,7 +89,7 @@ $tag-small-icon-size: var(--wot-tag-small-icon-size, $n-10) !default;
 // 中尺寸字号
 $tag-medium-font-size: var(--wot-tag-medium-font-size, $typography-label-size-main) !default;
 // 中尺寸行高
-$tag-medium-line-height: var(--wot-tag-medium-line-height, $typography-label-line--height-size-main) !default;
+$tag-medium-line-height: var(--wot-tag-medium-line-height, $typography-label-line-height-size-main) !default;
 // 中尺寸内边距
 $tag-medium-padding: var(--wot-tag-medium-padding, $n-1 $padding-super-tight) !default;
 // 中尺寸圆角态内边距
@@ -99,7 +99,7 @@ $tag-medium-icon-size: var(--wot-tag-medium-icon-size, $n-10) !default;
 // 默认尺寸字号
 $tag-default-font-size: var(--wot-tag-default-font-size, $typography-label-size-main) !default;
 // 默认尺寸行高
-$tag-default-line-height: var(--wot-tag-default-line-height, $typography-label-line--height-size-main) !default;
+$tag-default-line-height: var(--wot-tag-default-line-height, $typography-label-line-height-size-main) !default;
 // 默认尺寸内边距
 $tag-default-padding: var(--wot-tag-default-padding, $n-3 $padding-extra-tight) !default;
 // 默认尺寸圆角态内边距
@@ -109,7 +109,7 @@ $tag-default-icon-size: var(--wot-tag-default-icon-size, $n-12) !default;
 // 大尺寸字号
 $tag-large-font-size: var(--wot-tag-large-font-size, $typography-label-size-large) !default;
 // 大尺寸行高
-$tag-large-line-height: var(--wot-tag-large-line-height, $typography-label-line--height-size-large) !default;
+$tag-large-line-height: var(--wot-tag-large-line-height, $typography-label-line-height-size-large) !default;
 // 大尺寸内边距
 $tag-large-padding: var(--wot-tag-large-padding, $n-3 $padding-extra-tight) !default;
 // 大尺寸圆角态内边距
@@ -119,7 +119,7 @@ $tag-large-icon-size: var(--wot-tag-large-icon-size, $n-12) !default;
 // 超大尺寸字号
 $tag-extra-large-font-size: var(--wot-tag-extra-large-font-size, $typography-body-size-main) !default;
 // 超大尺寸行高
-$tag-extra-large-line-height: var(--wot-tag-extra-large-line-height, $typography-body-line--height-size-main) !default;
+$tag-extra-large-line-height: var(--wot-tag-extra-large-line-height, $typography-body-line-height-size-main) !default;
 // 超大尺寸内边距
 $tag-extra-large-padding: var(--wot-tag-extra-large-padding, $n-3 $padding-extra-tight) !default;
 // 超大尺寸圆角态内边距

package/components/wd-text/index.scss

@@ -4,7 +4,7 @@
 // 默认文字字号
 $text-font-size: var(--wot-text-font-size, $typography-body-size-main) !default;
 // 默认文字行高
-$text-line-height: var(--wot-text-line-height, $typography-body-line--height-size-main) !default;
+$text-line-height: var(--wot-text-line-height, $typography-body-line-height-size-main) !default;
 // 主色文字颜色
 $text-primary-color: var(--wot-text-primary-color, $primary-6) !default;
 // 成功文字颜色

package/components/wd-textarea/index.scss

@@ -10,7 +10,7 @@ $textarea-inner-min-height: var(--wot-textarea-inner-min-height, $n-20) !default
 // 文本域字号
 $textarea-inner-font-size: var(--wot-textarea-inner-font-size, $typography-body-size-main) !default;
 // 文本域行高
-$textarea-inner-line-height: var(--wot-textarea-inner-line-height, $typography-body-line--height-size-main) !default;
+$textarea-inner-line-height: var(--wot-textarea-inner-line-height, $typography-body-line-height-size-main) !default;
 // 文本域文字颜色
 $textarea-inner-color: var(--wot-textarea-inner-color, $text-main) !default;
 // 占位符颜色
@@ -28,7 +28,7 @@ $textarea-count-color: var(--wot-textarea-count-color, $text-auxiliary) !default
 // 字数统计字号
 $textarea-count-font-size: var(--wot-textarea-count-font-size, $typography-body-size-main) !default;
 // 字数统计行高
-$textarea-count-line-height: var(--wot-textarea-count-line-height, $typography-body-line--height-size-main) !default;
+$textarea-count-line-height: var(--wot-textarea-count-line-height, $typography-body-line-height-size-main) !default;
 // 错误颜色
 $textarea-error-color: var(--wot-textarea-error-color, $danger-main) !default;
 

package/components/wd-toast/index.scss

@@ -16,7 +16,7 @@ $toast-bg: var(--wot-toast-bg, $opacfilled-tooltip-toast-cover) !default;
 // 字号
 $toast-font-size: var(--wot-toast-font-size, $typography-body-size-extra-large) !default;
 // 行高
-$toast-line-height: var(--wot-toast-line-height, $typography-body-line--height-size-extra-large) !default;
+$toast-line-height: var(--wot-toast-line-height, $typography-body-line-height-size-extra-large) !default;
 // 图标大小
 $toast-icon-size: var(--wot-toast-icon-size, $n-24) !default;
 // 消息内容左边距

package/components/wd-toast/types.ts

@@ -44,6 +44,10 @@ export type ToastOptions = {
    * 类名前缀，用于使用自定义图标
    */
   classPrefix?: string
+  /**
+   * CSS 图标
+   */
+  cssIcon?: boolean | string
   /**
    * 完全展示后的回调函数
    */
@@ -167,13 +171,19 @@ export const toastProps = {
     default: ''
   },
   /**
-   * 类名前缀
+   * 类名前缀，用于使用自定义图标，用法参考 Icon 组件
    * @type {string}
    * @default 'wd-icon'
    */
-  classPrefix: {
-    type: String,
-    default: 'wd-icon'
+  classPrefix: makeStringProp('wd-icon'),
+  /**
+   * CSS 图标，用法参考 Icon 组件
+   * @type {boolean | string}
+   * @default false
+   */
+  cssIcon: {
+    type: [Boolean, String],
+    default: false
   },
   /**
    * 完全展示后的回调函数

package/components/wd-toast/wd-toast.vue

@@ -19,11 +19,12 @@
         :name="toastIcon[iconName]"
       ></wd-icon>
       <wd-icon
-        v-else-if="iconClass"
+        v-else-if="iconClass || cssIcon"
         :custom-class="`wd-toast__icon ${direction === 'vertical' ? 'is-vertical' : ''}`"
         :size="iconSize"
         :class-prefix="classPrefix"
         :name="iconClass"
+        :css-icon="cssIcon"
       ></wd-icon>
       <!--文本-->
       <view v-if="msg" :class="`wd-toast__msg ${direction === 'vertical' ? 'is-vertical' : ''}`">{{ msg }}</view>
@@ -68,6 +69,7 @@ const loadingSize = ref<string>() // loading大小
 const cover = ref<boolean>(false) // 是否存在遮罩层
 const classPrefix = ref<string>('wd-icon') // 图标前缀
 const iconClass = ref<string>('') // 图标类名
+const cssIcon = ref<boolean | string>(false) // CSS 图标
 const direction = ref<ToastDirection>('horizontal') // toast布局方向
 
 let opened: (() => void) | null = null
@@ -108,7 +110,7 @@ const transitionStyle = computed(() => {
 
 const rootClass = computed(() => {
   return `wd-toast ${props.customClass} wd-toast--${position.value} ${
-    (iconName.value !== 'loading' || msg.value) && (iconName.value || iconClass.value) ? 'wd-toast--with-icon' : ''
+    (iconName.value !== 'loading' || msg.value) && (iconName.value || iconClass.value || cssIcon.value) ? 'wd-toast--with-icon' : ''
   } ${iconName.value === 'loading' && !msg.value ? 'wd-toast--loading' : ''} ${direction.value === 'vertical' ? 'is-vertical' : ''}`
 })
 
@@ -139,6 +141,7 @@ function reset(option: ToastOptions) {
 function mergeOptionsWithProps(option: ToastOptions, props: ToastProps) {
   iconName.value = isDef(option.iconName!) ? option.iconName! : props.iconName
   iconClass.value = isDef(option.iconClass!) ? option.iconClass! : props.iconClass
+  cssIcon.value = isDef(option.cssIcon!) ? option.cssIcon! : props.cssIcon
   msg.value = isDef(option.msg!) ? option.msg! : props.msg
   position.value = isDef(option.position!) ? option.position! : props.position
   zIndex.value = isDef(option.zIndex!) ? option.zIndex! : props.zIndex

package/components/wd-tooltip/index.scss

@@ -26,7 +26,7 @@ $tooltip-close-icon-padding: var(--wot-tooltip-close-icon-padding, $padding-supe
 // 层级
 $tooltip-z-index: var(--wot-tooltip-z-index, 500) !default;
 // 行高
-$tooltip-line-height: var(--wot-tooltip-line-height, $typography-body-line--height-size-main) !default;
+$tooltip-line-height: var(--wot-tooltip-line-height, $typography-body-line-height-size-main) !default;
 
 @include b(tooltip) {
   position: relative;

package/components/wd-tour/index.scss

@@ -24,7 +24,7 @@ $tour-popover-radius: var(--wot-tour-popover-radius, $radius-main) !default;
 // 信息框字号
 $tour-info-font-size: var(--wot-tour-info-font-size, $typography-body-size-main) !default;
 // 信息框行高
-$tour-info-line-height: var(--wot-tour-info-line-height, $typography-body-line--height-size-main) !default;
+$tour-info-line-height: var(--wot-tour-info-line-height, $typography-body-line-height-size-main) !default;
 // 信息框文字颜色
 $tour-info-color: var(--wot-tour-info-color, $text-main) !default;
 // 操作区域上边距

package/components/wd-upload/index.scss

@@ -17,7 +17,7 @@ $upload-evoke-color: var(--wot-upload-evoke-color, $text-auxiliary) !default;
 // 唤起项文字大小
 $upload-evoke-font-size: var(--wot-upload-evoke-font-size, $typography-body-size-main) !default;
 // 唤起项文字行高
-$upload-evoke-line-height: var(--wot-upload-evoke-line-height, $typography-body-line--height-size-main) !default;
+$upload-evoke-line-height: var(--wot-upload-evoke-line-height, $typography-body-line-height-size-main) !default;
 // 唤起项禁用文字颜色
 $upload-evoke-color-disabled: var(--wot-upload-evoke-color-disabled, $text-disabled) !default;
 // 唤起项图标颜色
@@ -37,13 +37,13 @@ $upload-close-icon-color: var(--wot-upload-close-icon-color, $icon-white) !defau
 // 进度文字字号
 $upload-progress-font-size: var(--wot-upload-progress-font-size, $typography-body-size-main) !default;
 // 进度文字行高
-$upload-progress-line-height: var(--wot-upload-progress-line-height, $typography-body-line--height-size-main) !default;
+$upload-progress-line-height: var(--wot-upload-progress-line-height, $typography-body-line-height-size-main) !default;
 // 进度文字颜色
 $upload-progress-color: var(--wot-upload-progress-color, $text-white) !default;
 // 文件名文字字号
 $upload-file-font-size: var(--wot-upload-file-font-size, $typography-label-size-main) !default;
 // 文件名文字行高
-$upload-file-line-height: var(--wot-upload-file-line-height, $typography-label-line--height-size-main) !default;
+$upload-file-line-height: var(--wot-upload-file-line-height, $typography-label-line-height-size-main) !default;
 // 文件名文字颜色
 $upload-file-color: var(--wot-upload-file-color, $text-secondary) !default;
 // 文件/视频名称内边距

package/package.json

@@ -1 +1 @@
-{"id":"wot-ui","name":"@wot-ui/ui","displayName":"wot-ui 一个轻量、美观、AI友好的 uni-app 组件库","version":"2.0.0-alpha.8","license":"MIT","description":"wot-ui 一个轻量、美观、AI友好的 uni-app 组件库。","keywords":["wot-ui","国际化","组件库","vue3","暗黑模式"],"main":"index.ts","repository":{"type":"git","url":"https://github.com/wot-ui/wot-ui.git"},"engines":{"HBuilderX":"^3.8.7"},"dcloudext":{"type":"component-vue","sale":{"regular":{"price":"0.00"},"sourcecode":{"price":"0.00"}},"contact":{"qq":""},"declaration":{"ads":"无","data":"插件不采集任何数据","permissions":"无"},"npmurl":"https://www.npmjs.com/package/@wot-ui/ui"},"vetur":{"tags":"tags.json","attributes":"attributes.json"},"web-types":"web-types.json","uni_modules":{"dependencies":[],"encrypt":[],"platforms":{"cloud":{"tcb":"y","aliyun":"y","alipay":"n"},"client":{"Vue":{"vue2":"n","vue3":"y"},"App":{"app-vue":"y","app-nvue":"n","app-uvue":"n"},"H5-mobile":{"Safari":"y","Android Browser":"y","微信浏览器(Android)":"y","QQ浏览器(Android)":"y"},"H5-pc":{"Chrome":"y","IE":"u","Edge":"y","Firefox":"y","Safari":"y"},"小程序":{"微信":"y","阿里":"y","百度":"u","字节跳动":"u","QQ":"y","钉钉":"y","快手":"u","飞书":"u","京东":"u"},"快应用":{"华为":"u","联盟":"u"}}}},"peerDependencies":{"vue":">=3.2.47"}}
+{"id":"wot-ui","name":"@wot-ui/ui","displayName":"wot-ui 一个轻量、美观、AI友好的 uni-app 组件库","version":"2.0.0","license":"MIT","description":"wot-ui 一个轻量、美观、AI友好的 uni-app 组件库。","keywords":["wot-ui","国际化","组件库","vue3","暗黑模式"],"main":"index.ts","repository":{"type":"git","url":"https://github.com/wot-ui/wot-ui.git"},"engines":{"HBuilderX":"^3.8.7"},"dcloudext":{"type":"component-vue","sale":{"regular":{"price":"0.00"},"sourcecode":{"price":"0.00"}},"contact":{"qq":""},"declaration":{"ads":"无","data":"插件不采集任何数据","permissions":"无"},"npmurl":"https://www.npmjs.com/package/@wot-ui/ui"},"vetur":{"tags":"tags.json","attributes":"attributes.json"},"web-types":"web-types.json","uni_modules":{"dependencies":[],"encrypt":[],"platforms":{"cloud":{"tcb":"y","aliyun":"y","alipay":"n"},"client":{"Vue":{"vue2":"n","vue3":"y"},"App":{"app-vue":"y","app-nvue":"n","app-uvue":"n"},"H5-mobile":{"Safari":"y","Android Browser":"y","微信浏览器(Android)":"y","QQ浏览器(Android)":"y"},"H5-pc":{"Chrome":"y","IE":"u","Edge":"y","Firefox":"y","Safari":"y"},"小程序":{"微信":"y","阿里":"y","百度":"u","字节跳动":"u","QQ":"y","钉钉":"y","快手":"u","飞书":"u","京东":"u"},"快应用":{"华为":"u","联盟":"u"}}}},"peerDependencies":{"vue":">=3.2.47"}}

package/styles/theme/base/radius.scss

@@ -9,5 +9,5 @@ page,
   --wot-radius-extra-large: var(--wot-n-12);
   --wot-radius-super-large: var(--wot-n-16);
   --wot-radius-ultra-large: var(--wot-n-20);
-  --wot-radius-radius-full: var(--wot-n-full);
+  --wot-radius-full: var(--wot-n-full);
 }

package/styles/theme/base/typography.scss

@@ -9,9 +9,9 @@ page,
   --wot-typography-title-font-weight-light: var(--wot-font-weight-regular);
   --wot-typography-title-font-weight-main: var(--wot-font-weight-medium);
   --wot-typography-title-font-weight-strong: var(--wot-font-weight-semibold);
-  --wot-typography-title-line--height-size-main: var(--wot-n-26);
-  --wot-typography-title-line--height-size-large: var(--wot-n-28);
-  --wot-typography-title-line--height-size-extra-large: var(--wot-n-34);
+  --wot-typography-title-line-height-size-main: var(--wot-n-26);
+  --wot-typography-title-line-height-size-large: var(--wot-n-28);
+  --wot-typography-title-line-height-size-extra-large: var(--wot-n-34);
   /* body */
   --wot-typography-body-font-family: PingFang SC;
   --wot-typography-body-size-main: var(--wot-n-14);
@@ -22,11 +22,11 @@ page,
   --wot-typography-body-font-weight-main: var(--wot-font-weight-regular);
   --wot-typography-body-font-weight-strong: var(--wot-font-weight-medium);
   --wot-typography-body-font-weight-extra-strong: var(--wot-font-weight-semibold);
-  --wot-typography-body-line--height-size-main: var(--wot-n-20);
-  --wot-typography-body-line--height-size-large: var(--wot-n-22);
-  --wot-typography-body-line--height-size-extra-large: var(--wot-n-24);
-  --wot-typography-body-line--height-size-super-large: var(--wot-n-24);
-  --wot-typography-body-line--height-size-ultra-large: var(--wot-n-26);
+  --wot-typography-body-line-height-size-main: var(--wot-n-20);
+  --wot-typography-body-line-height-size-large: var(--wot-n-22);
+  --wot-typography-body-line-height-size-extra-large: var(--wot-n-24);
+  --wot-typography-body-line-height-size-super-large: var(--wot-n-24);
+  --wot-typography-body-line-height-size-ultra-large: var(--wot-n-26);
   /* label */
   --wot-typography-label-font-family: PingFang SC;
   --wot-typography-label-size-super-small: var(--wot-n-9);
@@ -36,9 +36,9 @@ page,
   --wot-typography-label-size-large: var(--wot-n-14);
   --wot-typography-label-font-weight-main: var(--wot-font-weight-regular);
   --wot-typography-label-font-weight-strong: var(--wot-font-weight-medium);
-  --wot-typography-label-line--height-size-super-small: var(--wot-n-14);
-  --wot-typography-label-line--height-size-extra-small: var(--wot-n-16);
-  --wot-typography-label-line--height-size-small:  var(--wot-n-16);
-  --wot-typography-label-line--height-size-main: var(--wot-n-18);
-  --wot-typography-label-line--height-size-large: var(--wot-n-18);
+  --wot-typography-label-line-height-size-super-small: var(--wot-n-14);
+  --wot-typography-label-line-height-size-extra-small: var(--wot-n-16);
+  --wot-typography-label-line-height-size-small:  var(--wot-n-16);
+  --wot-typography-label-line-height-size-main: var(--wot-n-18);
+  --wot-typography-label-line-height-size-large: var(--wot-n-18);
 }

package/styles/variable.scss

@@ -274,11 +274,11 @@ $typography-label-size-main: var(--wot-typography-label-size-main, $n-12) !defau
 $typography-label-size-large: var(--wot-typography-label-size-large, $n-14) !default;
 $typography-label-font-weight-main: var(--wot-typography-label-font-weight-main, $font-weight-regular) !default;
 $typography-label-font-weight-strong: var(--wot-typography-label-font-weight-strong, $font-weight-medium) !default;
-$typography-label-line--height-size-extra-small: var(--wot-typography-label-line--height-size-extra-small, $n-16) !default;
-$typography-label-line--height-size-large: var(--wot-typography-label-line--height-size-large, $n-18) !default;
-$typography-label-line--height-size-main: var(--wot-typography-label-line--height-size-main, $n-18) !default;
-$typography-label-line--height-size-small: var(--wot-typography-label-line--height-size-small, $n-16) !default;
-$typography-label-line--height-size-super-small: var(--wot-typography-label-line--height-size-super-small, $n-14) !default;
+$typography-label-line-height-size-extra-small: var(--wot-typography-label-line-height-size-extra-small, $n-16) !default;
+$typography-label-line-height-size-large: var(--wot-typography-label-line-height-size-large, $n-18) !default;
+$typography-label-line-height-size-main: var(--wot-typography-label-line-height-size-main, $n-18) !default;
+$typography-label-line-height-size-small: var(--wot-typography-label-line-height-size-small, $n-16) !default;
+$typography-label-line-height-size-super-small: var(--wot-typography-label-line-height-size-super-small, $n-14) !default;
 $typography-label-size-extra-small: var(--wot-typography-label-size-extra-small, $n-10) !default;
 $typography-label-size-super-small: var(--wot-typography-label-size-super-small, $n-9) !default;
 
@@ -289,11 +289,11 @@ $typography-body-size-large: var(--wot-typography-body-size-large, $n-15) !defau
 $typography-body-font-weight-main: var(--wot-typography-body-font-weight-main, $font-weight-regular) !default;
 $typography-body-font-weight-strong: var(--wot-typography-body-font-weight-strong, $font-weight-medium) !default;
 $typography-body-font-weight-extra-strong: var(--wot-typography-body-font-weight-extra-strong, $font-weight-semibold) !default;
-$typography-body-line--height-size-extra-large: var(--wot-typography-body-line--height-size-extra-large, $n-24) !default;
-$typography-body-line--height-size-large: var(--wot-typography-body-line--height-size-large, $n-22) !default;
-$typography-body-line--height-size-main: var(--wot-typography-body-line--height-size-main, $n-20) !default;
-$typography-body-line--height-size-super-large: var(--wot-typography-body-line--height-size-super-large, $n-24) !default;
-$typography-body-line--height-size-ultra-large: var(--wot-typography-body-line--height-size-ultra-large, $n-26) !default;
+$typography-body-line-height-size-extra-large: var(--wot-typography-body-line-height-size-extra-large, $n-24) !default;
+$typography-body-line-height-size-large: var(--wot-typography-body-line-height-size-large, $n-22) !default;
+$typography-body-line-height-size-main: var(--wot-typography-body-line-height-size-main, $n-20) !default;
+$typography-body-line-height-size-super-large: var(--wot-typography-body-line-height-size-super-large, $n-24) !default;
+$typography-body-line-height-size-ultra-large: var(--wot-typography-body-line-height-size-ultra-large, $n-26) !default;
 $typography-body-size-extra-large: var(--wot-typography-body-size-extra-large, $n-16) !default;
 $typography-body-size-super-large: var(--wot-typography-body-size-super-large, $n-17) !default;
 $typography-body-size-ultra-large: var(--wot-typography-body-size-ultra-large, $n-18) !default;
@@ -306,9 +306,9 @@ $typography-title-size-extra-large: var(--wot-typography-title-size-extra-large,
 $typography-title-font-weight-light: var(--wot-typography-title-font-weight-light, $font-weight-regular) !default;
 $typography-title-font-weight-main: var(--wot-typography-title-font-weight-main, $font-weight-medium) !default;
 $typography-title-font-weight-strong: var(--wot-typography-title-font-weight-strong, $font-weight-semibold) !default;
-$typography-title-line--height-size-main: var(--wot-typography-title-line--height-size-main, $n-26) !default;
-$typography-title-line--height-size-large: var(--wot-typography-title-line--height-size-large, $n-28) !default;
-$typography-title-line--height-size-extra-large: var(--wot-typography-title-line--height-size-extra-large, $n-34) !default;
+$typography-title-line-height-size-main: var(--wot-typography-title-line-height-size-main, $n-26) !default;
+$typography-title-line-height-size-large: var(--wot-typography-title-line-height-size-large, $n-28) !default;
+$typography-title-line-height-size-extra-large: var(--wot-typography-title-line-height-size-extra-large, $n-34) !default;
 
 /* 圆角系列 */
 $radius-zero: var(--wot-radius-zero, $n-0) !default;
@@ -318,7 +318,7 @@ $radius-large: var(--wot-radius-large, $n-8) !default;
 $radius-extra-large: var(--wot-radius-extra-large, $n-12) !default;
 $radius-super-large: var(--wot-radius-super-large, $n-16) !default;
 $radius-ultra-large: var(--wot-radius-ultra-large, $n-20) !default;
-$radius-radius-full: var(--wot-radius-radius-full, $n-full) !default;
+$radius-full: var(--wot-radius-full, $n-full) !default;
 
 /* 内边距系列 */
 $padding-zero: var(--wot-padding-zero, $n-0) !default;