# Web 挥手动画包

包含 400×400 透明 Animated WebP、Vue 3 组件、无框架 JavaScript 工具和可直接打开的示例页。动画共 97 帧，约 4.04 秒。

## Vue 3

```vue
<script setup lang="ts">
import { ref } from "vue";
import AssistantWave from "./AssistantWave.vue";
const wave = ref<InstanceType<typeof AssistantWave>>();
</script>

<template>
  <AssistantWave ref="wave" :size="245" />
  <button @click="wave?.replay()">Replay</button>
</template>
```

组件通过 `defineExpose` 暴露 `replay()`，无需 GIF 或 canvas。

## 原生 Web

```html
<img
  src="/assistant-wave-transparent-bright.webp"
  width="245"
  height="245"
  alt="AI Assistant waving hello"
>
```

如需按钮重播，使用 `replayAssistantWave(image)`。它会更新资源 URL，让 Animated WebP 从第一帧重新播放。
