init

.svn/pristine/c2/c22e2503fe24c04c089b042a9a16c5bc49abb82e.svn-base

@@ -0,0 +1,15 @@
+<script lang="ts">
+export default {
+  name: "LayButtonGroup",
+};
+</script>
+
+<script setup lang="ts">
+import "./index.less";
+</script>
+
+<template>
+  <div class="layui-btn-group">
+    <slot></slot>
+  </div>
+</template>

.svn/pristine/c2/c2e57ee3975aebf16a91904b339b29098fa6baa2.svn-base

@@ -0,0 +1,16 @@
+<script lang="ts">
+export default {
+  name: "UpIcon",
+};
+</script>
+<script setup lang="ts">
+import LayIcon from "../component/icon/index";
+
+const props = defineProps<{
+  color?: string;
+  size?: string;
+}>();
+</script>
+<template>
+  <lay-icon :color="props.color" :size="props.size" type="layui-icon-up" />
+</template>

.svn/pristine/c2/c2fcc9014e6933d1f099a3d1ac2b39d078dca8f6.svn-base

@@ -0,0 +1,95 @@
+::: anchor
+:::
+
+::: title 基本介绍
+:::
+
+::: describe 为组件添加水波纹动画。
+:::
+
+::: title 基础使用
+:::
+
+::: demo 使用 `lay-ripple` 标签, 为 `element` 添加水波纹效果。
+
+<template>
+  <lay-space>
+    <lay-ripple>
+      <lay-button>click</lay-button>
+    </lay-ripple>
+    <lay-ripple type="out" borderRadius="2px">
+      <lay-button>click</lay-button>
+    </lay-ripple>
+  </lay-space>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 触发时机
+:::
+
+::: demo 通过 `trigger` 属性, 设置 `ripple` 触发时机。
+
+<template>
+  <lay-ripple type="out" trigger="always" borderRadius="2px" color="#009688">
+    <lay-button type="primary">闪烁</lay-button>
+  </lay-ripple>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</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 | 默认插槽 | - |
+:::
+
+::: contributor ripple
+:::  
+
+::: previousNext ripple
+:::