chore: 回退到 Sight 的提交

package/component/src/component/ripple/index.less

@@ -28,7 +28,7 @@
   @keyframes ripple-effect {
     0% {
       box-shadow: 0 0 0 0px var(--layui-ripple-color);
-      opacity: 0.3;
+      opacity: 0.4;
     }
 
     100% {

package/component/src/component/ripple/index.vue

@@ -28,7 +28,6 @@ const props = withDefaults(defineProps<LayRippletProps>(), {
 });
 
 const isActiveRef = ref(false);
-// 波纹宽高
 const spreadSizeRef = ref<string>("0px");
 const ripplesRefEl = ref<HTMLElement | null>(null);
 const waterRipplesContainerRefEl = ref<HTMLElement | null>(null);
@@ -43,7 +42,7 @@ const rippleY = ref<string | number | undefined>(undefined);
 const onActive = function (event: Event) {
   isActiveRef.value = true;
 
-  // 跟随鼠标点击
+  // 计算点击位置和波纹大小
   if (props.type === "inset" && !props.spreadSize && !props.center) {
     const el = event.currentTarget;
     // @ts-ignore
@@ -129,4 +128,4 @@ watch(
     ></div>
     <slot></slot>
   </div>
-</template>
+</template>

package/document/src/document/zh-CN/components/animation.md

@@ -72,11 +72,11 @@ import { ref } from 'vue'
 
 export default {
   setup() {
-    const replay = (e, aninClass) => {
+    const replay = (e, animClass) => {
       const el = e.currentTarget;
       const targetClass = el.classList[1];
       if(!targetClass){
-        el.classList.add(aninClass);
+        el.classList.add(animClass);
       }else{
         el.classList.remove(targetClass);
         setTimeout(() => {

package/document/src/document/zh-CN/components/fullscreen.md

@@ -221,8 +221,8 @@ export default {
 :::table
 | 属性 | 描述 | 类型 | 参数 |
 | --------- | --------------| ------------- | ------ |
-| enter | 进入全屏 | Function | 可选,HTMLElement |
+| enter | 进入全屏 | Function | 可选,`HTMLElement` |
-| exit | 退出全屏 | Function | 可选,HTMLElement /| Document |
+| exit | 退出全屏 | Function | 可选,`HTMLElement` `Document` |
 | toggle | 进入/退出全屏 | Function | - |
 | isFullscreen | 是否全屏 | boolean | - |
-:::
+:::

package/document/src/document/zh-CN/components/ripple.md

@@ -7,29 +7,53 @@
 ::: describe 为组件添加水波纹动画。
 :::
 
-::: title 测试
+::: title 内部水波纹
 :::
 
-::: demo 使用 `lay-ripple` 标签, 添加水波纹
+::: demo 使用 `lay-ripple` 标签, 添加水波纹。
 
 <template>
   <lay-ripple>
-    <lay-button>内部:click</lay-button>
+    <lay-button>click</lay-button>
   </lay-ripple><br>
   <lay-ripple trigger="always">
-    <lay-button>内部:always</lay-button>
+    <lay-button>always</lay-button>
   </lay-ripple><br>
   <lay-ripple trigger="mouseenter">
-    <lay-button>内部:mouseenter</lay-button>
+    <lay-button>mouseenter</lay-button>
-  </lay-ripple><br><br>
+  </lay-ripple>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 外部水波纹
+:::
+
+::: demo 使用 `lay-ripple` 标签, 添加水波纹。
+
+<template>
   <lay-ripple type="out" borderRadius="1px">
-    <lay-button>外部:click</lay-button>
+    <lay-button>click</lay-button>
-  </lay-ripple><br><br>
-  <lay-ripple type="out" trigger="always" borderRadius="50%" color="red">
-    <div style="border-radius:50%;background-color:red;width:8px;height:8px"></div>
   </lay-ripple><br><br><br>
-  <lay-ripple type="out" trigger="mouseenter" borderRadius="50%" color="red">
+  <p>always:</p>
-    <div style="border-radius:50%;background-color:red;width:20px;height:20px"></div>
+  <lay-ripple type="out" trigger="always" borderRadius="50%" color="#009688">
+    <div style="border-radius:50%;background-color:#009688;width:8px;height:8px"></div>
+  </lay-ripple><br><br><br>
+  <p>mouseenter:</p>
+  <lay-ripple type="out" trigger="mouseenter" borderRadius="50%" color="#009688" spread-width="50px">
+    <div style="border-radius:50%;background-color:#009688;width:20px;height:20px"></div>
   </lay-ripple><br>
 </template>
 
@@ -45,4 +69,30 @@ export default {
 }
 </script>
 
+:::
+
+::: title Ripple 属性
+:::
+
+::: table
+
+| 属性        | 描述     | 可选值 |
+| ----------- | -------- | ------ |
+| type | 波纹类型 | `out` `inset`    |
+| color | 波纹颜色 | -- |
+| borderRadius | 圆角，仅 `out` 类型 | -- |
+| spreadWidth | 扩散宽度，单位 px，仅 `out` 类型 | --     |
+| spreadSize | 扩散大小，单位 px，仅 `inset` 类型 | --     |
+| trigger | 触发方式 | `click` `always` `mouseenter`|
+| center | 是否在元素中心扩散 | --     |
+
+:::
+
+:::title Ripple 插槽
+:::
+
+:::table
+| 插槽 | 描述 | 参数 |
+|------ |----------|-----------|
+| default | 默认插槽 | - |
 :::