├── .github └── FUNDING.yml ├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── bin ├── generate.ts └── release.js ├── dist ├── index.d.ts ├── vue-animate.cjs ├── vue-animate.cjs.map ├── vue-animate.css ├── vue-animate.css.map ├── vue-animate.es.js ├── vue-animate.es.js.map ├── vue-animate.es.min.js ├── vue-animate.es.min.js.map ├── vue-animate.min.css ├── vue-animate.min.css.map ├── vue-animate.umd.js ├── vue-animate.umd.js.map ├── vue-animate.umd.min.js └── vue-animate.umd.min.js.map ├── docs ├── CNAME ├── assets │ ├── index-05dc69e1.css │ ├── index-cbc3acf7.js │ └── vue-5532db34.svg ├── index.html └── vite.svg ├── index.html ├── package.json ├── public ├── CNAME └── vite.svg ├── rollup.config.mjs ├── src ├── animates │ ├── animate.css │ ├── back │ │ ├── backDown.css │ │ ├── backLeft.css │ │ ├── backRight.css │ │ └── backUp.css │ ├── bounce │ │ ├── bounce.css │ │ ├── bounceDown.css │ │ ├── bounceLeft.css │ │ ├── bounceRight.css │ │ └── bounceUp.css │ ├── fade │ │ ├── fade.css │ │ ├── fadeBottomLeft.css │ │ ├── fadeBottomRight.css │ │ ├── fadeDown.css │ │ ├── fadeDownBig.css │ │ ├── fadeLeft.css │ │ ├── fadeLeftBig.css │ │ ├── fadeRight.css │ │ ├── fadeRightBig.css │ │ ├── fadeTopLeft.css │ │ ├── fadeTopRight.css │ │ ├── fadeUp.css │ │ └── fadeUpBig.css │ ├── flip │ │ ├── flip.css │ │ ├── flipX.css │ │ └── flipY.css │ ├── lightSpeed │ │ ├── lightSpeedLeft.css │ │ └── lightSpeedRight.css │ ├── main.css │ ├── roll │ │ └── roll.css │ ├── rotate │ │ ├── rotate.css │ │ ├── rotateDownLeft.css │ │ ├── rotateDownRight.css │ │ ├── rotateUpLeft.css │ │ └── rotateUpRight.css │ ├── slide │ │ ├── slideDown.css │ │ ├── slideLeft.css │ │ ├── slideRight.css │ │ └── slideUp.css │ └── zoom │ │ ├── zoom.css │ │ ├── zoomDown.css │ │ ├── zoomLeft.css │ │ ├── zoomRight.css │ │ └── zoomUp.css ├── animations-list.json ├── attention.ts ├── attentions-list.json ├── attentions │ ├── bounce.ts │ ├── flash.ts │ ├── headShake.ts │ ├── heartBeat.ts │ ├── index.ts │ ├── jello.ts │ ├── pulse.ts │ ├── rubberBand.ts │ ├── shake.ts │ ├── shakeX.ts │ ├── shakeY.ts │ ├── swing.ts │ ├── tada.ts │ └── wobble.ts ├── docs │ ├── App.vue │ ├── assets │ │ └── vue.svg │ ├── main.ts │ ├── style.css │ └── vite-env.d.ts └── index.ts ├── tsconfig.json ├── tsconfig.lib.json ├── tsconfig.node.json ├── vite.config.ts └── yarn.lock /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] 4 | patreon: asika32764 5 | open_collective: # Replace with a single Open Collective username 6 | ko_fi: # Replace with a single Ko-fi username 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry 9 | liberapay: # Replace with a single Liberapay username 10 | issuehunt: # Replace with a single IssueHunt username 11 | lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry 12 | polar: # Replace with a single Polar username 13 | buy_me_a_coffee: asika32764 14 | thanks_dev: # Replace with a single thanks.dev username 15 | custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] 16 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist-ssr 12 | *.local 13 | 14 | # Editor directories and files 15 | .vscode/* 16 | !.vscode/extensions.json 17 | .idea 18 | .DS_Store 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw? 24 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | .* 2 | *.log 3 | *.swp 4 | *.yml 5 | bower.json 6 | coverage 7 | config 8 | public 9 | bin 10 | docs 11 | README.md 12 | index.html 13 | LICENSE 14 | rollup.config.mjs 15 | tsconfig.json 16 | tsconfig.lib.json 17 | tsconfig.node.json 18 | vite.config.ts 19 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2017 Simon Asika 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of 6 | this software and associated documentation files (the "Software"), to deal in 7 | the Software without restriction, including without limitation the rights to 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 9 | the Software, and to permit persons to whom the Software is furnished to do so, 10 | subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | 22 | ----- 23 | 24 | The Animate.css license. 25 | 26 | This library is port of animate.css (https://github.com/animate-css/animate.css) for use with Vue.js transitions. 27 | The animate.css license please see: https://github.com/animate-css/animate.css/blob/main/LICENSE 28 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-animate 2 | 3 | [![Version](https://img.shields.io/npm/v/%40asika32764/vue-animate.svg?style=flat-square)](https://www.npmjs.com/package/@asika32764/vue-animate) 4 | [![License](https://img.shields.io/npm/l/%40asika32764/vue-animate.svg?style=flat-square)](LICENSE) 5 | 6 | Cross-browser CSS3 animation library, a port of animate.css for use with Vue.js transitions. [DEMO](https://vue-animate.simular.co/) 7 | 8 | Support for: 9 | 10 | - Vue 2.x 11 | - Vue 3.x 12 | - Alpine.js 13 | 14 | ## Credit 15 | 16 | - [@haydenbbickerton](https://github.com/haydenbbickerton/vue-animate) is the original [vue-animate (LESS)](https://github.com/haydenbbickerton/vue-animate) author (Only for Vue 1.x). 17 | - [@pavels-hyuna](https://github.com/pavels-hyuna) is v2 SCSS version author. 18 | 19 | ## Table of Contents 20 | 21 | 22 | * [vue-animate](#vue-animate) 23 | * [Credit](#credit) 24 | * [Table of Contents](#table-of-contents) 25 | * [Installation](#installation) 26 | * [Transitions](#transitions) 27 | * [Custom Transition Classes](#custom-transition-classes) 28 | * [Custom Animation Properties](#custom-animation-properties) 29 | * [Slide as Mobile](#slide-as-mobile) 30 | * [Work with Alpine.js](#work-with-alpinejs) 31 | * [Attentions Seekers](#attentions-seekers) 32 | * [Options](#options) 33 | * [Contribution Guide](#contribution-guide) 34 | * [Build Lib](#build-lib) 35 | * [Build Docs](#build-docs) 36 | * [Sync from animate.css](#sync-from-animatecss) 37 | 38 | 39 | ## Installation 40 | 41 | From NPM 42 | 43 | ```shell 44 | npm i @asika32764/vue-animate --save 45 | 46 | yarn add @asika32764/vue-animate 47 | ``` 48 | 49 | CDN 50 | 51 | ```html 52 | 53 | ``` 54 | 55 | ## Import 56 | 57 | Import animations for JS Bundler. 58 | 59 | ```ts 60 | import '@asika32764/vue-animate/dist/vue-animate.css'; 61 | ``` 62 | 63 | Import in CSS or SCSS file. 64 | 65 | ```css 66 | @import "@asika32764/vue-animate/dist/vue-animate.css"; 67 | 68 | /* If you want to override CSS variables, write it just after importing */ 69 | :root { 70 | --animate-duration: .3s; 71 | --animate-delay: 0; 72 | } 73 | ``` 74 | 75 | ## Transitions 76 | 77 | Use [Vue.js transitions](https://vuejs.org/guide/built-ins/transition.html "Vue.js Transitions") as you normally would, but for the transition name you will use one of [Animate.css animations](https://animate.style/#utilities "animations") **removing** the `animate__` and `in/Out` from the name. 78 | 79 | For example, if you want to use `animate__animated animate__fadeInLeft` and `animate__fadeInLeft` on your element, You could write: 80 | 81 | ```html 82 | 83 |
  • 84 | {{ item }} 85 |
    • 86 |     87 | ``` 88 | enter/leave is already written in the stylesheet, so just remove `In/Out` from the name and you're golden. 89 | 90 | ### Custom Transition Classes 91 | 92 | Animate.css's original classnames are supported on enter/leave transitions. So if you're going to use [Custom Transition Classes](https://vuejs.org/guide/built-ins/transition.html#css-based-transitions "Custom Transition Classes"), you can either add *-enter/-leave* to the classes: 93 | 94 | ```html 95 | 100 |

    hello

    101 |     102 | ``` 103 | Or use the regular *In/Out* syntax: 104 | 105 | ```html 106 | 111 |

    hello

    112 |     113 | ``` 114 | 115 | ### Custom Animation Properties 116 | 117 | ```html 118 | 119 |

    hello

    122 |     123 | ``` 124 | 125 | ### Slide as Mobile 126 | 127 | The view element must set position as absolute. 128 | 129 | ``` 130 | 133 | 134 | 135 | ``` 136 | 137 | ## Work with Alpine.js 138 | 139 | Alpine `x-transition` must add `enter` and `leave` suffix, you have to add `In` and `Out` suffix after animation name. 140 | 141 | ```html 142 |
    ...
    147 | ``` 148 | 149 | See also: https://github.com/alpinejs/alpine#x-transition 150 | 151 | ## Attentions Seekers 152 | 153 | To use Attentions, vue-animate.css provides a set of JS functions. 154 | 155 | ```ts 156 | import { bounce } from '@asika32764/vue-animate'; 157 | import { ref } from 'vue'; 158 | 159 | const el = ref(); 160 | 161 | bounce(el.value); 162 | ``` 163 | 164 | - [DEMO](https://vue-animate.simular.co/#attentions) 165 | - [Available Attentions Seekers](https://github.com/asika32764/vue-animate.css/tree/main/src/attentions) 166 | 167 | This function is very useful for adding some one-time animation to html element, for example, 168 | this is an incorrect password attentions. 169 | 170 | ```ts 171 | import { headShake } from '@asika32764/vue-animate'; 172 | 173 | if (!await checkPassword()) { 174 | headShake(passwordInput.value); 175 | } 176 | ``` 177 | 178 | ![handshake](https://github.com/asika32764/vue-animate/assets/1639206/0fea77fb-feda-4e5d-a8b1-9fbb59c8f330) 179 | 180 | 181 | ## Options 182 | 183 | You could add animation properties to following parameters. 184 | 185 | ```ts 186 | bounce(el.value, 300); // Durations 300ms 187 | bounce(el.value, '.3s'); // Durations 0.3seconds 188 | bounce(el.value, 300, { delay: 200 }); // Add duration and delay 189 | bounce(el.value, { duration: 300, delay: 200 }); // Add duration and delay by options object 190 | ``` 191 | 192 | | Option | Type | Description | 193 | |----------------|----------------------------------------------------|--------------------------------------| 194 | | duration | string, number | Can be any CSS valid duration value. | 195 | | delay | string, number | Can be any CSS valid duration value. | 196 | | iterationCount | string, number | The number of times to play. | 197 | | direction | `normal` `reverse` `alternate` `alternate-reverse` | The animation playing direction. | 198 | | fillMode | `none` `forwards` `backwards` `both` | The animation fill mode. | 199 | 200 | ## Contribution Guide 201 | 202 | Clone project and install deps. 203 | 204 | ```shell 205 | git clone git@github.com:asika32764/vue-animate.git 206 | cd vue-animate 207 | yarn install 208 | ``` 209 | 210 | Run: 211 | 212 | ```shell 213 | yarn dev 214 | ``` 215 | 216 | Will launch a Vite dev server of the documentation site which the source file at `src/docs`. 217 | You can modify this site to test your code. (Do not push you test code.) 218 | 219 | ### Build Lib 220 | 221 | Run this command to build `/dist` files. 222 | 223 | ```shell 224 | rollup -c 225 | ``` 226 | 227 | ### Build Docs 228 | 229 | Run this command to build `/docs` files. 230 | 231 | ```shell 232 | yarn build:docs 233 | ``` 234 | 235 | ### Sync from animate.css 236 | 237 | This project is auto convert from animate.css animations, if animate.css release new animations, 238 | you can run this command to sync animations and auto generate source files. 239 | 240 | ```shell 241 | yarn generate 242 | ``` 243 | -------------------------------------------------------------------------------- /bin/generate.ts: -------------------------------------------------------------------------------- 1 | import { mkdirSync, readdirSync, readFileSync, rmSync, writeFileSync } from 'node:fs'; 2 | import { basename, dirname, resolve } from 'node:path'; 3 | 4 | type AnimationItem = { 5 | file: string; 6 | base: string; 7 | import: string; 8 | actions: string[] 9 | }; 10 | 11 | const animations: { [action: string]: AnimationItem } = {}; 12 | 13 | run(); 14 | 15 | function copyAnimateCss() { 16 | const animateCSS = resolve('node_modules/animate.css/animate.css'); 17 | let content = readFileSync(animateCSS, 'utf8'); 18 | 19 | content = content.replace('--animate-duration: 1s;', '--animate-duration: .5s;') 20 | content = content.replace('--animate-delay: 1s;', '--animate-delay: 0;') 21 | 22 | writeFileSync(resolve('src/animates/animate.css'), content); 23 | } 24 | 25 | function run() { 26 | const animateDir = resolve('node_modules/animate.css/source'); 27 | const dirs = readdirSync(animateDir, { withFileTypes: true }); 28 | 29 | copyAnimateCss(); 30 | 31 | rmSync('src/css', { recursive: true, force: true }); 32 | 33 | let indexContent = ` 34 | @import './animate.css'; 35 | `; 36 | 37 | for (const dir of dirs) { 38 | if (!dir.isDirectory()) { 39 | continue; 40 | } 41 | 42 | if (dir.name === 'attention_seekers') { 43 | generateAttentions(dir.name); 44 | continue; 45 | } 46 | 47 | const typePath = resolve('node_modules/animate.css/source', dir.name); 48 | const files = readdirSync(typePath, { withFileTypes: true }); 49 | 50 | for (const file of files) { 51 | if (!file.isDirectory()) { 52 | if ( 53 | file.name === 'jackInTheBox.css' 54 | || file.name === 'hinge.css' 55 | ) { 56 | continue; 57 | } 58 | 59 | handleInOutTransition(typePath, file.name); 60 | } 61 | } 62 | } 63 | 64 | const animJson = {}; 65 | 66 | for (const action in animations) { 67 | const animItem = animations[action]; 68 | 69 | animJson[animItem.base] = animJson[animItem.base] || []; 70 | animJson[animItem.base].push(action); 71 | 72 | mkdirSync(dirname(animItem.file), { recursive: true }); 73 | writeFileSync(animItem.file, animItem.actions.join("\n")); 74 | 75 | console.log('[Create CSS]', animItem.file); 76 | 77 | indexContent += `@import '${animItem.import}';\n`; 78 | } 79 | 80 | writeFileSync(resolve('src/animates/main.css'), indexContent); 81 | 82 | writeFileSync(resolve('src/animations-list.json'), JSON.stringify(animJson, null, 2)); 83 | } 84 | 85 | function generateAttentions(dir: string) { 86 | const typePath = resolve('node_modules/animate.css/source', dir); 87 | const files = readdirSync(typePath, { withFileTypes: true }); 88 | const imports = []; 89 | const attentions = []; 90 | 91 | for (const file of files) { 92 | if (!file.isDirectory()) { 93 | if (file.name === 'shake.css') { 94 | continue; 95 | } 96 | 97 | const animName = basename(file.name, '.css'); 98 | 99 | attentions.push(animName); 100 | 101 | imports.push(`export * from '@/attentions/${animName}';`); 102 | 103 | const dest = resolve('src/attentions', animName + '.ts'); 104 | const code = handleAttention(animName); 105 | 106 | mkdirSync(dirname(dest), { recursive: true }); 107 | writeFileSync(dest, code); 108 | 109 | console.log('[Create TS]', dest); 110 | } 111 | } 112 | 113 | writeFileSync(resolve('src/attentions/index.ts'), imports.join("\n")); 114 | writeFileSync(resolve('src/attentions-list.json'), JSON.stringify(attentions)); 115 | } 116 | 117 | function handleAttention(animName: string) { 118 | return `import { type AttentionOptions, doAttention } from '@/attention'; 119 | 120 | export function ${animName}( 121 | el: HTMLElement, options?: AttentionOptions, 122 | ): Promise; 123 | 124 | export function ${animName}( 125 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 126 | ): Promise; 127 | 128 | export function ${animName}( 129 | el: HTMLElement, 130 | duration: AttentionOptions | number | string | undefined = undefined, 131 | options: AttentionOptions = {}, 132 | ): Promise { 133 | return doAttention(el, '${animName}', duration, options); 134 | }`; 135 | } 136 | 137 | function handleInOutTransition(typePath: string, file: string) { 138 | let originCss = readFileSync(resolve(typePath, file), 'utf-8'); 139 | 140 | const matches = originCss.matchAll(/@keyframes\s+(\w+)(In|Out)(\w*)|@keyframes\s+(\w+)/g); 141 | 142 | for (const match of matches) { 143 | let base: string = '', 144 | inOut: string = '', 145 | direction: string = ''; 146 | 147 | if (match[4]) { 148 | base = match[4]; 149 | } else { 150 | [, base, inOut, direction] = match; 151 | } 152 | 153 | saveToAnimations(base, inOut, direction); 154 | } 155 | } 156 | 157 | function saveToAnimations(base: string, inOut: string = '', direction: string = '') { 158 | const code = makeTransitionCss(base, inOut, direction) + "\n"; 159 | 160 | const action = base + direction; 161 | 162 | const dest = resolve('src/animates', base, action + '.css'); 163 | 164 | const animItem = animations[action] 165 | = animations[action] || { file: '', base: '', import: '', actions: [] }; 166 | 167 | animItem.file = dest; 168 | animItem.base = base; 169 | animItem.import = './' + base + '/' + action + '.css'; 170 | animItem.actions.push(code); 171 | } 172 | 173 | function makeTransitionCss( 174 | base: string, 175 | inOut: string, 176 | direction: string, 177 | ) { 178 | const enterLeave = inOut === 'In' ? 'enter' : 'leave'; 179 | 180 | return `.${base}${direction}-${enterLeave}-active { 181 | animation-duration: var(--animate-duration); 182 | animation-delay: var(--animate-delay); 183 | animation-iteration-count: var(--animate-repeat); 184 | animation-fill-mode: both; 185 | animation-name: ${base}${inOut}${direction}; 186 | }`; 187 | } 188 | 189 | function makeTransitionTs( 190 | base: string, 191 | inOut: string, 192 | direction: string, 193 | ) { 194 | const enterLeave = inOut === 'In' ? 'enter' : 'leave'; 195 | 196 | return `.${base}${direction}-${enterLeave}-active { 197 | animation-duration: var(--animate-duration); 198 | animation-delay: var(--animate-delay); 199 | animation-iteration-count: var(--animate-repeat); 200 | animation-fill-mode: both; 201 | animation-name: ${base}${inOut}${direction}; 202 | }`; 203 | } 204 | -------------------------------------------------------------------------------- /bin/release.js: -------------------------------------------------------------------------------- 1 | const input = require('minimist')(process.argv.slice(2)); 2 | const fs = require('fs'); 3 | const exec = require('child_process').execSync; 4 | 5 | const help = ` 6 | Usage: release.js 7 | -b Branch name to push. 8 | `; 9 | 10 | if (input['help'] || input['h']) { 11 | console.log(help); 12 | process.exit(0); 13 | } 14 | 15 | const version = input._[0]; 16 | const branch = input['b'] || 'main'; 17 | 18 | if (!version) { 19 | console.log('Please provide a version.', "\n", help); 20 | process.exit(1); 21 | } 22 | 23 | console.log(`>> Replace version to ${version}`); 24 | 25 | const pjson = require('../package.json'); 26 | 27 | pjson.version = version; 28 | 29 | fs.writeFileSync(__dirname + '/../package.json', JSON.stringify(pjson, null, 2)); 30 | 31 | console.log('>> Push to git'); 32 | 33 | exec(`git checkout ${branch}`); 34 | exec(`git commit -am "Prepare ${version} release."`, () => {}); 35 | exec(`git tag ${version} -f`); 36 | exec(`git push origin ${branch}`); 37 | exec(`git push origin --tags -f`); 38 | exec(`git checkout main`); 39 | 40 | console.log('>> Publish to npm'); 41 | 42 | exec(`npm publish`); 43 | -------------------------------------------------------------------------------- /dist/index.d.ts: -------------------------------------------------------------------------------- 1 | type AttentionOptions = { 2 | duration?: number | string; 3 | delay?: number | string; 4 | iterationCount?: number | string; 5 | direction?: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse'; 6 | fillMode?: 'none' | 'forwards' | 'backwards' | 'both'; 7 | }; 8 | declare function attention(el: HTMLElement, animate: string, options?: AttentionOptions): Promise; 9 | declare function attention(el: HTMLElement, animate: string, duration: number | string | undefined, options?: AttentionOptions): Promise; 10 | 11 | declare function bounce(el: HTMLElement, options?: AttentionOptions): Promise; 12 | declare function bounce(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 13 | 14 | declare function flash(el: HTMLElement, options?: AttentionOptions): Promise; 15 | declare function flash(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 16 | 17 | declare function headShake(el: HTMLElement, options?: AttentionOptions): Promise; 18 | declare function headShake(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 19 | 20 | declare function heartBeat(el: HTMLElement, options?: AttentionOptions): Promise; 21 | declare function heartBeat(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 22 | 23 | declare function jello(el: HTMLElement, options?: AttentionOptions): Promise; 24 | declare function jello(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 25 | 26 | declare function pulse(el: HTMLElement, options?: AttentionOptions): Promise; 27 | declare function pulse(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 28 | 29 | declare function rubberBand(el: HTMLElement, options?: AttentionOptions): Promise; 30 | declare function rubberBand(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 31 | 32 | declare function shakeX(el: HTMLElement, options?: AttentionOptions): Promise; 33 | declare function shakeX(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 34 | 35 | declare function shakeY(el: HTMLElement, options?: AttentionOptions): Promise; 36 | declare function shakeY(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 37 | 38 | declare function swing(el: HTMLElement, options?: AttentionOptions): Promise; 39 | declare function swing(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 40 | 41 | declare function tada(el: HTMLElement, options?: AttentionOptions): Promise; 42 | declare function tada(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 43 | 44 | declare function wobble(el: HTMLElement, options?: AttentionOptions): Promise; 45 | declare function wobble(el: HTMLElement, duration?: number | string, options?: AttentionOptions): Promise; 46 | 47 | export { type AttentionOptions, attention, bounce, flash, headShake, heartBeat, jello, pulse, rubberBand, shakeX, shakeY, swing, tada, wobble }; 48 | -------------------------------------------------------------------------------- /dist/vue-animate.cjs: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | function attention(el, animate, duration = undefined, options = {}) { 4 | return doAttention(el, animate, duration, options); 5 | } 6 | function doAttention(el, animate, duration = undefined, options = {}) { 7 | if (typeof duration === 'number' || typeof duration === 'string') { 8 | options.duration = duration; 9 | } 10 | else if (duration != undefined) { 11 | options = duration; 12 | } 13 | return new Promise((resolve) => { 14 | const rollbacks = getRollbacks(el); 15 | el.addEventListener('animationend', () => { 16 | el.classList.remove('animate__animated', 'animate__' + animate); 17 | restore(el, rollbacks); 18 | resolve(); 19 | }, { once: true }); 20 | setVariables(el, options); 21 | el.classList.add('animate__animated', 'animate__' + animate); 22 | }); 23 | } 24 | function setVariables(el, options) { 25 | if (options.duration) { 26 | el.style.setProperty('animation-duration', String(options.duration)); 27 | } 28 | if (options.delay) { 29 | el.style.setProperty('animation-delay', String(options.delay)); 30 | } 31 | if (options.iterationCount) { 32 | el.style.setProperty('animation-iteration-count', String(options.iterationCount)); 33 | } 34 | if (options.direction) { 35 | el.style.setProperty('animation-direction', options.direction); 36 | } 37 | if (options.fillMode) { 38 | el.style.setProperty('animation-fill-mode', options.fillMode); 39 | } 40 | } 41 | function restore(el, rollbacks) { 42 | for (const varName in rollbacks) { 43 | const value = rollbacks[varName]; 44 | if (value === '') { 45 | el.style.removeProperty(varName); 46 | } 47 | else { 48 | el.style.setProperty(varName, value); 49 | } 50 | } 51 | } 52 | function getRollbacks(el) { 53 | const rollbacks = {}; 54 | rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration'); 55 | rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay'); 56 | rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count'); 57 | rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction'); 58 | rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode'); 59 | return rollbacks; 60 | } 61 | 62 | function bounce(el, duration = undefined, options = {}) { 63 | return doAttention(el, 'bounce', duration, options); 64 | } 65 | 66 | function flash(el, duration = undefined, options = {}) { 67 | return doAttention(el, 'flash', duration, options); 68 | } 69 | 70 | function headShake(el, duration = undefined, options = {}) { 71 | return doAttention(el, 'headShake', duration, options); 72 | } 73 | 74 | function heartBeat(el, duration = undefined, options = {}) { 75 | return doAttention(el, 'heartBeat', duration, options); 76 | } 77 | 78 | function jello(el, duration = undefined, options = {}) { 79 | return doAttention(el, 'jello', duration, options); 80 | } 81 | 82 | function pulse(el, duration = undefined, options = {}) { 83 | return doAttention(el, 'pulse', duration, options); 84 | } 85 | 86 | function rubberBand(el, duration = undefined, options = {}) { 87 | return doAttention(el, 'rubberBand', duration, options); 88 | } 89 | 90 | function shakeX(el, duration = undefined, options = {}) { 91 | return doAttention(el, 'shakeX', duration, options); 92 | } 93 | 94 | function shakeY(el, duration = undefined, options = {}) { 95 | return doAttention(el, 'shakeY', duration, options); 96 | } 97 | 98 | function swing(el, duration = undefined, options = {}) { 99 | return doAttention(el, 'swing', duration, options); 100 | } 101 | 102 | function tada(el, duration = undefined, options = {}) { 103 | return doAttention(el, 'tada', duration, options); 104 | } 105 | 106 | function wobble(el, duration = undefined, options = {}) { 107 | return doAttention(el, 'wobble', duration, options); 108 | } 109 | 110 | exports.attention = attention; 111 | exports.bounce = bounce; 112 | exports.flash = flash; 113 | exports.headShake = headShake; 114 | exports.heartBeat = heartBeat; 115 | exports.jello = jello; 116 | exports.pulse = pulse; 117 | exports.rubberBand = rubberBand; 118 | exports.shakeX = shakeX; 119 | exports.shakeY = shakeY; 120 | exports.swing = swing; 121 | exports.tada = tada; 122 | exports.wobble = wobble; 123 | //# sourceMappingURL=vue-animate.cjs.map 124 | -------------------------------------------------------------------------------- /dist/vue-animate.cjs.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.cjs","sources":["../src/attention.ts","../src/attentions/bounce.ts","../src/attentions/flash.ts","../src/attentions/headShake.ts","../src/attentions/heartBeat.ts","../src/attentions/jello.ts","../src/attentions/pulse.ts","../src/attentions/rubberBand.ts","../src/attentions/shakeX.ts","../src/attentions/shakeY.ts","../src/attentions/swing.ts","../src/attentions/tada.ts","../src/attentions/wobble.ts"],"sourcesContent":["export default function attention(el, animate, duration = undefined, options = {}) {\n return doAttention(el, animate, duration, options);\n}\nexport function doAttention(el, animate, duration = undefined, options = {}) {\n if (typeof duration === 'number' || typeof duration === 'string') {\n options.duration = duration;\n }\n else if (duration != undefined) {\n options = duration;\n }\n return new Promise((resolve) => {\n const rollbacks = getRollbacks(el);\n el.addEventListener('animationend', () => {\n el.classList.remove('animate__animated', 'animate__' + animate);\n restore(el, rollbacks);\n resolve();\n }, { once: true });\n setVariables(el, options);\n el.classList.add('animate__animated', 'animate__' + animate);\n });\n}\nfunction setVariables(el, options) {\n if (options.duration) {\n el.style.setProperty('animation-duration', String(options.duration));\n }\n if (options.delay) {\n el.style.setProperty('animation-delay', String(options.delay));\n }\n if (options.iterationCount) {\n el.style.setProperty('animation-iteration-count', String(options.iterationCount));\n }\n if (options.direction) {\n el.style.setProperty('animation-direction', options.direction);\n }\n if (options.fillMode) {\n el.style.setProperty('animation-fill-mode', options.fillMode);\n }\n}\nfunction restore(el, rollbacks) {\n for (const varName in rollbacks) {\n const value = rollbacks[varName];\n if (value === '') {\n el.style.removeProperty(varName);\n }\n else {\n el.style.setProperty(varName, value);\n }\n }\n}\nfunction getRollbacks(el) {\n const rollbacks = {};\n rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration');\n rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay');\n rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count');\n rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction');\n rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode');\n return rollbacks;\n}\n//# sourceMappingURL=attention.js.map","import { doAttention } from '@/attention';\nexport function bounce(el, duration = undefined, options = {}) {\n return doAttention(el, 'bounce', duration, options);\n}\n//# sourceMappingURL=bounce.js.map","import { doAttention } from '@/attention';\nexport function flash(el, duration = undefined, options = {}) {\n return doAttention(el, 'flash', duration, options);\n}\n//# sourceMappingURL=flash.js.map","import { doAttention } from '@/attention';\nexport function headShake(el, duration = undefined, options = {}) {\n return doAttention(el, 'headShake', duration, options);\n}\n//# sourceMappingURL=headShake.js.map","import { doAttention } from '@/attention';\nexport function heartBeat(el, duration = undefined, options = {}) {\n return doAttention(el, 'heartBeat', duration, options);\n}\n//# sourceMappingURL=heartBeat.js.map","import { doAttention } from '@/attention';\nexport function jello(el, duration = undefined, options = {}) {\n return doAttention(el, 'jello', duration, options);\n}\n//# sourceMappingURL=jello.js.map","import { doAttention } from '@/attention';\nexport function pulse(el, duration = undefined, options = {}) {\n return doAttention(el, 'pulse', duration, options);\n}\n//# sourceMappingURL=pulse.js.map","import { doAttention } from '@/attention';\nexport function rubberBand(el, duration = undefined, options = {}) {\n return doAttention(el, 'rubberBand', duration, options);\n}\n//# sourceMappingURL=rubberBand.js.map","import { doAttention } from '@/attention';\nexport function shakeX(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeX', duration, options);\n}\n//# sourceMappingURL=shakeX.js.map","import { doAttention } from '@/attention';\nexport function shakeY(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeY', duration, options);\n}\n//# sourceMappingURL=shakeY.js.map","import { doAttention } from '@/attention';\nexport function swing(el, duration = undefined, options = {}) {\n return doAttention(el, 'swing', duration, options);\n}\n//# sourceMappingURL=swing.js.map","import { doAttention } from '@/attention';\nexport function tada(el, duration = undefined, options = {}) {\n return doAttention(el, 'tada', duration, options);\n}\n//# sourceMappingURL=tada.js.map","import { doAttention } from '@/attention';\nexport function wobble(el, duration = undefined, options = {}) {\n return doAttention(el, 'wobble', duration, options);\n}\n//# sourceMappingURL=wobble.js.map"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /dist/vue-animate.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.css","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"} -------------------------------------------------------------------------------- /dist/vue-animate.es.js: -------------------------------------------------------------------------------- 1 | function attention(el, animate, duration = undefined, options = {}) { 2 | return doAttention(el, animate, duration, options); 3 | } 4 | function doAttention(el, animate, duration = undefined, options = {}) { 5 | if (typeof duration === 'number' || typeof duration === 'string') { 6 | options.duration = duration; 7 | } 8 | else if (duration != undefined) { 9 | options = duration; 10 | } 11 | return new Promise((resolve) => { 12 | const rollbacks = getRollbacks(el); 13 | el.addEventListener('animationend', () => { 14 | el.classList.remove('animate__animated', 'animate__' + animate); 15 | restore(el, rollbacks); 16 | resolve(); 17 | }, { once: true }); 18 | setVariables(el, options); 19 | el.classList.add('animate__animated', 'animate__' + animate); 20 | }); 21 | } 22 | function setVariables(el, options) { 23 | if (options.duration) { 24 | el.style.setProperty('animation-duration', String(options.duration)); 25 | } 26 | if (options.delay) { 27 | el.style.setProperty('animation-delay', String(options.delay)); 28 | } 29 | if (options.iterationCount) { 30 | el.style.setProperty('animation-iteration-count', String(options.iterationCount)); 31 | } 32 | if (options.direction) { 33 | el.style.setProperty('animation-direction', options.direction); 34 | } 35 | if (options.fillMode) { 36 | el.style.setProperty('animation-fill-mode', options.fillMode); 37 | } 38 | } 39 | function restore(el, rollbacks) { 40 | for (const varName in rollbacks) { 41 | const value = rollbacks[varName]; 42 | if (value === '') { 43 | el.style.removeProperty(varName); 44 | } 45 | else { 46 | el.style.setProperty(varName, value); 47 | } 48 | } 49 | } 50 | function getRollbacks(el) { 51 | const rollbacks = {}; 52 | rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration'); 53 | rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay'); 54 | rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count'); 55 | rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction'); 56 | rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode'); 57 | return rollbacks; 58 | } 59 | 60 | function bounce(el, duration = undefined, options = {}) { 61 | return doAttention(el, 'bounce', duration, options); 62 | } 63 | 64 | function flash(el, duration = undefined, options = {}) { 65 | return doAttention(el, 'flash', duration, options); 66 | } 67 | 68 | function headShake(el, duration = undefined, options = {}) { 69 | return doAttention(el, 'headShake', duration, options); 70 | } 71 | 72 | function heartBeat(el, duration = undefined, options = {}) { 73 | return doAttention(el, 'heartBeat', duration, options); 74 | } 75 | 76 | function jello(el, duration = undefined, options = {}) { 77 | return doAttention(el, 'jello', duration, options); 78 | } 79 | 80 | function pulse(el, duration = undefined, options = {}) { 81 | return doAttention(el, 'pulse', duration, options); 82 | } 83 | 84 | function rubberBand(el, duration = undefined, options = {}) { 85 | return doAttention(el, 'rubberBand', duration, options); 86 | } 87 | 88 | function shakeX(el, duration = undefined, options = {}) { 89 | return doAttention(el, 'shakeX', duration, options); 90 | } 91 | 92 | function shakeY(el, duration = undefined, options = {}) { 93 | return doAttention(el, 'shakeY', duration, options); 94 | } 95 | 96 | function swing(el, duration = undefined, options = {}) { 97 | return doAttention(el, 'swing', duration, options); 98 | } 99 | 100 | function tada(el, duration = undefined, options = {}) { 101 | return doAttention(el, 'tada', duration, options); 102 | } 103 | 104 | function wobble(el, duration = undefined, options = {}) { 105 | return doAttention(el, 'wobble', duration, options); 106 | } 107 | 108 | export { attention, bounce, flash, headShake, heartBeat, jello, pulse, rubberBand, shakeX, shakeY, swing, tada, wobble }; 109 | //# sourceMappingURL=vue-animate.es.js.map 110 | -------------------------------------------------------------------------------- /dist/vue-animate.es.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.es.js","sources":["../src/attention.ts","../src/attentions/bounce.ts","../src/attentions/flash.ts","../src/attentions/headShake.ts","../src/attentions/heartBeat.ts","../src/attentions/jello.ts","../src/attentions/pulse.ts","../src/attentions/rubberBand.ts","../src/attentions/shakeX.ts","../src/attentions/shakeY.ts","../src/attentions/swing.ts","../src/attentions/tada.ts","../src/attentions/wobble.ts"],"sourcesContent":["export default function attention(el, animate, duration = undefined, options = {}) {\n return doAttention(el, animate, duration, options);\n}\nexport function doAttention(el, animate, duration = undefined, options = {}) {\n if (typeof duration === 'number' || typeof duration === 'string') {\n options.duration = duration;\n }\n else if (duration != undefined) {\n options = duration;\n }\n return new Promise((resolve) => {\n const rollbacks = getRollbacks(el);\n el.addEventListener('animationend', () => {\n el.classList.remove('animate__animated', 'animate__' + animate);\n restore(el, rollbacks);\n resolve();\n }, { once: true });\n setVariables(el, options);\n el.classList.add('animate__animated', 'animate__' + animate);\n });\n}\nfunction setVariables(el, options) {\n if (options.duration) {\n el.style.setProperty('animation-duration', String(options.duration));\n }\n if (options.delay) {\n el.style.setProperty('animation-delay', String(options.delay));\n }\n if (options.iterationCount) {\n el.style.setProperty('animation-iteration-count', String(options.iterationCount));\n }\n if (options.direction) {\n el.style.setProperty('animation-direction', options.direction);\n }\n if (options.fillMode) {\n el.style.setProperty('animation-fill-mode', options.fillMode);\n }\n}\nfunction restore(el, rollbacks) {\n for (const varName in rollbacks) {\n const value = rollbacks[varName];\n if (value === '') {\n el.style.removeProperty(varName);\n }\n else {\n el.style.setProperty(varName, value);\n }\n }\n}\nfunction getRollbacks(el) {\n const rollbacks = {};\n rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration');\n rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay');\n rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count');\n rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction');\n rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode');\n return rollbacks;\n}\n//# sourceMappingURL=attention.js.map","import { doAttention } from '@/attention';\nexport function bounce(el, duration = undefined, options = {}) {\n return doAttention(el, 'bounce', duration, options);\n}\n//# sourceMappingURL=bounce.js.map","import { doAttention } from '@/attention';\nexport function flash(el, duration = undefined, options = {}) {\n return doAttention(el, 'flash', duration, options);\n}\n//# sourceMappingURL=flash.js.map","import { doAttention } from '@/attention';\nexport function headShake(el, duration = undefined, options = {}) {\n return doAttention(el, 'headShake', duration, options);\n}\n//# sourceMappingURL=headShake.js.map","import { doAttention } from '@/attention';\nexport function heartBeat(el, duration = undefined, options = {}) {\n return doAttention(el, 'heartBeat', duration, options);\n}\n//# sourceMappingURL=heartBeat.js.map","import { doAttention } from '@/attention';\nexport function jello(el, duration = undefined, options = {}) {\n return doAttention(el, 'jello', duration, options);\n}\n//# sourceMappingURL=jello.js.map","import { doAttention } from '@/attention';\nexport function pulse(el, duration = undefined, options = {}) {\n return doAttention(el, 'pulse', duration, options);\n}\n//# sourceMappingURL=pulse.js.map","import { doAttention } from '@/attention';\nexport function rubberBand(el, duration = undefined, options = {}) {\n return doAttention(el, 'rubberBand', duration, options);\n}\n//# sourceMappingURL=rubberBand.js.map","import { doAttention } from '@/attention';\nexport function shakeX(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeX', duration, options);\n}\n//# sourceMappingURL=shakeX.js.map","import { doAttention } from '@/attention';\nexport function shakeY(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeY', duration, options);\n}\n//# sourceMappingURL=shakeY.js.map","import { doAttention } from '@/attention';\nexport function swing(el, duration = undefined, options = {}) {\n return doAttention(el, 'swing', duration, options);\n}\n//# sourceMappingURL=swing.js.map","import { doAttention } from '@/attention';\nexport function tada(el, duration = undefined, options = {}) {\n return doAttention(el, 'tada', duration, options);\n}\n//# sourceMappingURL=tada.js.map","import { doAttention } from '@/attention';\nexport function wobble(el, duration = undefined, options = {}) {\n return doAttention(el, 'wobble', duration, options);\n}\n//# sourceMappingURL=wobble.js.map"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /dist/vue-animate.es.min.js: -------------------------------------------------------------------------------- 1 | function u(n,e,t=void 0,a={}){return i(n,e,t,a)}function i(n,e,t=void 0,a={}){return typeof t=="number"||typeof t=="string"?a.duration=t:t!=null&&(a=t),new Promise(r=>{const o=l(n);n.addEventListener("animationend",()=>{n.classList.remove("animate__animated","animate__"+e),f(n,o),r()},{once:!0}),d(n,a),n.classList.add("animate__animated","animate__"+e)})}function d(n,e){e.duration&&n.style.setProperty("animation-duration",String(e.duration)),e.delay&&n.style.setProperty("animation-delay",String(e.delay)),e.iterationCount&&n.style.setProperty("animation-iteration-count",String(e.iterationCount)),e.direction&&n.style.setProperty("animation-direction",e.direction),e.fillMode&&n.style.setProperty("animation-fill-mode",e.fillMode)}function f(n,e){for(const t in e){const a=e[t];a===""?n.style.removeProperty(t):n.style.setProperty(t,a)}}function l(n){const e={};return e["animation-duration"]=n.style.getPropertyValue("animation-duration"),e["animation-delay"]=n.style.getPropertyValue("animation-delay"),e["animation-iteration-count"]=n.style.getPropertyValue("animation-iteration-count"),e["animation-direction"]=n.style.getPropertyValue("animation-direction"),e["animation-fill-mode"]=n.style.getPropertyValue("animation-fill-mode"),e}function s(n,e=void 0,t={}){return i(n,"bounce",e,t)}function c(n,e=void 0,t={}){return i(n,"flash",e,t)}function y(n,e=void 0,t={}){return i(n,"headShake",e,t)}function m(n,e=void 0,t={}){return i(n,"heartBeat",e,t)}function b(n,e=void 0,t={}){return i(n,"jello",e,t)}function P(n,e=void 0,t={}){return i(n,"pulse",e,t)}function g(n,e=void 0,t={}){return i(n,"rubberBand",e,t)}function h(n,e=void 0,t={}){return i(n,"shakeX",e,t)}function k(n,e=void 0,t={}){return i(n,"shakeY",e,t)}function _(n,e=void 0,t={}){return i(n,"swing",e,t)}function p(n,e=void 0,t={}){return i(n,"tada",e,t)}function V(n,e=void 0,t={}){return i(n,"wobble",e,t)}export{u as attention,s as bounce,c as flash,y as headShake,m as heartBeat,b as jello,P as pulse,g as rubberBand,h as shakeX,k as shakeY,_ as swing,p as tada,V as wobble}; 2 | //# sourceMappingURL=vue-animate.es.min.js.map 3 | -------------------------------------------------------------------------------- /dist/vue-animate.es.min.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.es.min.js","sources":["../src/attention.ts","../src/attentions/bounce.ts","../src/attentions/flash.ts","../src/attentions/headShake.ts","../src/attentions/heartBeat.ts","../src/attentions/jello.ts","../src/attentions/pulse.ts","../src/attentions/rubberBand.ts","../src/attentions/shakeX.ts","../src/attentions/shakeY.ts","../src/attentions/swing.ts","../src/attentions/tada.ts","../src/attentions/wobble.ts"],"sourcesContent":["export default function attention(el, animate, duration = undefined, options = {}) {\n return doAttention(el, animate, duration, options);\n}\nexport function doAttention(el, animate, duration = undefined, options = {}) {\n if (typeof duration === 'number' || typeof duration === 'string') {\n options.duration = duration;\n }\n else if (duration != undefined) {\n options = duration;\n }\n return new Promise((resolve) => {\n const rollbacks = getRollbacks(el);\n el.addEventListener('animationend', () => {\n el.classList.remove('animate__animated', 'animate__' + animate);\n restore(el, rollbacks);\n resolve();\n }, { once: true });\n setVariables(el, options);\n el.classList.add('animate__animated', 'animate__' + animate);\n });\n}\nfunction setVariables(el, options) {\n if (options.duration) {\n el.style.setProperty('animation-duration', String(options.duration));\n }\n if (options.delay) {\n el.style.setProperty('animation-delay', String(options.delay));\n }\n if (options.iterationCount) {\n el.style.setProperty('animation-iteration-count', String(options.iterationCount));\n }\n if (options.direction) {\n el.style.setProperty('animation-direction', options.direction);\n }\n if (options.fillMode) {\n el.style.setProperty('animation-fill-mode', options.fillMode);\n }\n}\nfunction restore(el, rollbacks) {\n for (const varName in rollbacks) {\n const value = rollbacks[varName];\n if (value === '') {\n el.style.removeProperty(varName);\n }\n else {\n el.style.setProperty(varName, value);\n }\n }\n}\nfunction getRollbacks(el) {\n const rollbacks = {};\n rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration');\n rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay');\n rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count');\n rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction');\n rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode');\n return rollbacks;\n}\n//# sourceMappingURL=attention.js.map","import { doAttention } from '@/attention';\nexport function bounce(el, duration = undefined, options = {}) {\n return doAttention(el, 'bounce', duration, options);\n}\n//# sourceMappingURL=bounce.js.map","import { doAttention } from '@/attention';\nexport function flash(el, duration = undefined, options = {}) {\n return doAttention(el, 'flash', duration, options);\n}\n//# sourceMappingURL=flash.js.map","import { doAttention } from '@/attention';\nexport function headShake(el, duration = undefined, options = {}) {\n return doAttention(el, 'headShake', duration, options);\n}\n//# sourceMappingURL=headShake.js.map","import { doAttention } from '@/attention';\nexport function heartBeat(el, duration = undefined, options = {}) {\n return doAttention(el, 'heartBeat', duration, options);\n}\n//# sourceMappingURL=heartBeat.js.map","import { doAttention } from '@/attention';\nexport function jello(el, duration = undefined, options = {}) {\n return doAttention(el, 'jello', duration, options);\n}\n//# sourceMappingURL=jello.js.map","import { doAttention } from '@/attention';\nexport function pulse(el, duration = undefined, options = {}) {\n return doAttention(el, 'pulse', duration, options);\n}\n//# sourceMappingURL=pulse.js.map","import { doAttention } from '@/attention';\nexport function rubberBand(el, duration = undefined, options = {}) {\n return doAttention(el, 'rubberBand', duration, options);\n}\n//# sourceMappingURL=rubberBand.js.map","import { doAttention } from '@/attention';\nexport function shakeX(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeX', duration, options);\n}\n//# sourceMappingURL=shakeX.js.map","import { doAttention } from '@/attention';\nexport function shakeY(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeY', duration, options);\n}\n//# sourceMappingURL=shakeY.js.map","import { doAttention } from '@/attention';\nexport function swing(el, duration = undefined, options = {}) {\n return doAttention(el, 'swing', duration, options);\n}\n//# sourceMappingURL=swing.js.map","import { doAttention } from '@/attention';\nexport function tada(el, duration = undefined, options = {}) {\n return doAttention(el, 'tada', duration, options);\n}\n//# sourceMappingURL=tada.js.map","import { doAttention } from '@/attention';\nexport function wobble(el, duration = undefined, options = {}) {\n return doAttention(el, 'wobble', duration, options);\n}\n//# sourceMappingURL=wobble.js.map"],"names":["attention","el","animate","duration","options","doAttention","resolve","rollbacks","getRollbacks","restore","setVariables","varName","value","bounce","flash","headShake","heartBeat","jello","pulse","rubberBand","shakeX","shakeY","swing","tada","wobble"],"mappings":"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"} -------------------------------------------------------------------------------- /dist/vue-animate.min.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.min.css","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"} -------------------------------------------------------------------------------- /dist/vue-animate.umd.js: -------------------------------------------------------------------------------- 1 | (function (global, factory) { 2 | typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : 3 | typeof define === 'function' && define.amd ? define(['exports'], factory) : 4 | (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.VueAnimate = {})); 5 | })(this, (function (exports) { 'use strict'; 6 | 7 | function attention(el, animate, duration = undefined, options = {}) { 8 | return doAttention(el, animate, duration, options); 9 | } 10 | function doAttention(el, animate, duration = undefined, options = {}) { 11 | if (typeof duration === 'number' || typeof duration === 'string') { 12 | options.duration = duration; 13 | } 14 | else if (duration != undefined) { 15 | options = duration; 16 | } 17 | return new Promise((resolve) => { 18 | const rollbacks = getRollbacks(el); 19 | el.addEventListener('animationend', () => { 20 | el.classList.remove('animate__animated', 'animate__' + animate); 21 | restore(el, rollbacks); 22 | resolve(); 23 | }, { once: true }); 24 | setVariables(el, options); 25 | el.classList.add('animate__animated', 'animate__' + animate); 26 | }); 27 | } 28 | function setVariables(el, options) { 29 | if (options.duration) { 30 | el.style.setProperty('animation-duration', String(options.duration)); 31 | } 32 | if (options.delay) { 33 | el.style.setProperty('animation-delay', String(options.delay)); 34 | } 35 | if (options.iterationCount) { 36 | el.style.setProperty('animation-iteration-count', String(options.iterationCount)); 37 | } 38 | if (options.direction) { 39 | el.style.setProperty('animation-direction', options.direction); 40 | } 41 | if (options.fillMode) { 42 | el.style.setProperty('animation-fill-mode', options.fillMode); 43 | } 44 | } 45 | function restore(el, rollbacks) { 46 | for (const varName in rollbacks) { 47 | const value = rollbacks[varName]; 48 | if (value === '') { 49 | el.style.removeProperty(varName); 50 | } 51 | else { 52 | el.style.setProperty(varName, value); 53 | } 54 | } 55 | } 56 | function getRollbacks(el) { 57 | const rollbacks = {}; 58 | rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration'); 59 | rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay'); 60 | rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count'); 61 | rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction'); 62 | rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode'); 63 | return rollbacks; 64 | } 65 | 66 | function bounce(el, duration = undefined, options = {}) { 67 | return doAttention(el, 'bounce', duration, options); 68 | } 69 | 70 | function flash(el, duration = undefined, options = {}) { 71 | return doAttention(el, 'flash', duration, options); 72 | } 73 | 74 | function headShake(el, duration = undefined, options = {}) { 75 | return doAttention(el, 'headShake', duration, options); 76 | } 77 | 78 | function heartBeat(el, duration = undefined, options = {}) { 79 | return doAttention(el, 'heartBeat', duration, options); 80 | } 81 | 82 | function jello(el, duration = undefined, options = {}) { 83 | return doAttention(el, 'jello', duration, options); 84 | } 85 | 86 | function pulse(el, duration = undefined, options = {}) { 87 | return doAttention(el, 'pulse', duration, options); 88 | } 89 | 90 | function rubberBand(el, duration = undefined, options = {}) { 91 | return doAttention(el, 'rubberBand', duration, options); 92 | } 93 | 94 | function shakeX(el, duration = undefined, options = {}) { 95 | return doAttention(el, 'shakeX', duration, options); 96 | } 97 | 98 | function shakeY(el, duration = undefined, options = {}) { 99 | return doAttention(el, 'shakeY', duration, options); 100 | } 101 | 102 | function swing(el, duration = undefined, options = {}) { 103 | return doAttention(el, 'swing', duration, options); 104 | } 105 | 106 | function tada(el, duration = undefined, options = {}) { 107 | return doAttention(el, 'tada', duration, options); 108 | } 109 | 110 | function wobble(el, duration = undefined, options = {}) { 111 | return doAttention(el, 'wobble', duration, options); 112 | } 113 | 114 | exports.attention = attention; 115 | exports.bounce = bounce; 116 | exports.flash = flash; 117 | exports.headShake = headShake; 118 | exports.heartBeat = heartBeat; 119 | exports.jello = jello; 120 | exports.pulse = pulse; 121 | exports.rubberBand = rubberBand; 122 | exports.shakeX = shakeX; 123 | exports.shakeY = shakeY; 124 | exports.swing = swing; 125 | exports.tada = tada; 126 | exports.wobble = wobble; 127 | 128 | })); 129 | //# sourceMappingURL=vue-animate.umd.js.map 130 | -------------------------------------------------------------------------------- /dist/vue-animate.umd.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.umd.js","sources":["../src/attention.ts","../src/attentions/bounce.ts","../src/attentions/flash.ts","../src/attentions/headShake.ts","../src/attentions/heartBeat.ts","../src/attentions/jello.ts","../src/attentions/pulse.ts","../src/attentions/rubberBand.ts","../src/attentions/shakeX.ts","../src/attentions/shakeY.ts","../src/attentions/swing.ts","../src/attentions/tada.ts","../src/attentions/wobble.ts"],"sourcesContent":["export default function attention(el, animate, duration = undefined, options = {}) {\n return doAttention(el, animate, duration, options);\n}\nexport function doAttention(el, animate, duration = undefined, options = {}) {\n if (typeof duration === 'number' || typeof duration === 'string') {\n options.duration = duration;\n }\n else if (duration != undefined) {\n options = duration;\n }\n return new Promise((resolve) => {\n const rollbacks = getRollbacks(el);\n el.addEventListener('animationend', () => {\n el.classList.remove('animate__animated', 'animate__' + animate);\n restore(el, rollbacks);\n resolve();\n }, { once: true });\n setVariables(el, options);\n el.classList.add('animate__animated', 'animate__' + animate);\n });\n}\nfunction setVariables(el, options) {\n if (options.duration) {\n el.style.setProperty('animation-duration', String(options.duration));\n }\n if (options.delay) {\n el.style.setProperty('animation-delay', String(options.delay));\n }\n if (options.iterationCount) {\n el.style.setProperty('animation-iteration-count', String(options.iterationCount));\n }\n if (options.direction) {\n el.style.setProperty('animation-direction', options.direction);\n }\n if (options.fillMode) {\n el.style.setProperty('animation-fill-mode', options.fillMode);\n }\n}\nfunction restore(el, rollbacks) {\n for (const varName in rollbacks) {\n const value = rollbacks[varName];\n if (value === '') {\n el.style.removeProperty(varName);\n }\n else {\n el.style.setProperty(varName, value);\n }\n }\n}\nfunction getRollbacks(el) {\n const rollbacks = {};\n rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration');\n rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay');\n rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count');\n rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction');\n rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode');\n return rollbacks;\n}\n//# sourceMappingURL=attention.js.map","import { doAttention } from '@/attention';\nexport function bounce(el, duration = undefined, options = {}) {\n return doAttention(el, 'bounce', duration, options);\n}\n//# sourceMappingURL=bounce.js.map","import { doAttention } from '@/attention';\nexport function flash(el, duration = undefined, options = {}) {\n return doAttention(el, 'flash', duration, options);\n}\n//# sourceMappingURL=flash.js.map","import { doAttention } from '@/attention';\nexport function headShake(el, duration = undefined, options = {}) {\n return doAttention(el, 'headShake', duration, options);\n}\n//# sourceMappingURL=headShake.js.map","import { doAttention } from '@/attention';\nexport function heartBeat(el, duration = undefined, options = {}) {\n return doAttention(el, 'heartBeat', duration, options);\n}\n//# sourceMappingURL=heartBeat.js.map","import { doAttention } from '@/attention';\nexport function jello(el, duration = undefined, options = {}) {\n return doAttention(el, 'jello', duration, options);\n}\n//# sourceMappingURL=jello.js.map","import { doAttention } from '@/attention';\nexport function pulse(el, duration = undefined, options = {}) {\n return doAttention(el, 'pulse', duration, options);\n}\n//# sourceMappingURL=pulse.js.map","import { doAttention } from '@/attention';\nexport function rubberBand(el, duration = undefined, options = {}) {\n return doAttention(el, 'rubberBand', duration, options);\n}\n//# sourceMappingURL=rubberBand.js.map","import { doAttention } from '@/attention';\nexport function shakeX(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeX', duration, options);\n}\n//# sourceMappingURL=shakeX.js.map","import { doAttention } from '@/attention';\nexport function shakeY(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeY', duration, options);\n}\n//# sourceMappingURL=shakeY.js.map","import { doAttention } from '@/attention';\nexport function swing(el, duration = undefined, options = {}) {\n return doAttention(el, 'swing', duration, options);\n}\n//# sourceMappingURL=swing.js.map","import { doAttention } from '@/attention';\nexport function tada(el, duration = undefined, options = {}) {\n return doAttention(el, 'tada', duration, options);\n}\n//# sourceMappingURL=tada.js.map","import { doAttention } from '@/attention';\nexport function wobble(el, duration = undefined, options = {}) {\n return doAttention(el, 'wobble', duration, options);\n}\n//# sourceMappingURL=wobble.js.map"],"names":[],"mappings":"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"} -------------------------------------------------------------------------------- /dist/vue-animate.umd.min.js: -------------------------------------------------------------------------------- 1 | (function(i,u){typeof exports=="object"&&typeof module<"u"?u(exports):typeof define=="function"&&define.amd?define(["exports"],u):(i=typeof globalThis<"u"?globalThis:i||self,u(i.VueAnimate={}))})(this,function(i){"use strict";function u(n,e,t=void 0,r={}){return a(n,e,t,r)}function a(n,e,t=void 0,r={}){return typeof t=="number"||typeof t=="string"?r.duration=t:t!=null&&(r=t),new Promise(V=>{const B=f(n);n.addEventListener("animationend",()=>{n.classList.remove("animate__animated","animate__"+e),o(n,B),V()},{once:!0}),d(n,r),n.classList.add("animate__animated","animate__"+e)})}function d(n,e){e.duration&&n.style.setProperty("animation-duration",String(e.duration)),e.delay&&n.style.setProperty("animation-delay",String(e.delay)),e.iterationCount&&n.style.setProperty("animation-iteration-count",String(e.iterationCount)),e.direction&&n.style.setProperty("animation-direction",e.direction),e.fillMode&&n.style.setProperty("animation-fill-mode",e.fillMode)}function o(n,e){for(const t in e){const r=e[t];r===""?n.style.removeProperty(t):n.style.setProperty(t,r)}}function f(n){const e={};return e["animation-duration"]=n.style.getPropertyValue("animation-duration"),e["animation-delay"]=n.style.getPropertyValue("animation-delay"),e["animation-iteration-count"]=n.style.getPropertyValue("animation-iteration-count"),e["animation-direction"]=n.style.getPropertyValue("animation-direction"),e["animation-fill-mode"]=n.style.getPropertyValue("animation-fill-mode"),e}function l(n,e=void 0,t={}){return a(n,"bounce",e,t)}function c(n,e=void 0,t={}){return a(n,"flash",e,t)}function s(n,e=void 0,t={}){return a(n,"headShake",e,t)}function y(n,e=void 0,t={}){return a(n,"heartBeat",e,t)}function m(n,e=void 0,t={}){return a(n,"jello",e,t)}function h(n,e=void 0,t={}){return a(n,"pulse",e,t)}function b(n,e=void 0,t={}){return a(n,"rubberBand",e,t)}function g(n,e=void 0,t={}){return a(n,"shakeX",e,t)}function P(n,e=void 0,t={}){return a(n,"shakeY",e,t)}function k(n,e=void 0,t={}){return a(n,"swing",e,t)}function _(n,e=void 0,t={}){return a(n,"tada",e,t)}function w(n,e=void 0,t={}){return a(n,"wobble",e,t)}i.attention=u,i.bounce=l,i.flash=c,i.headShake=s,i.heartBeat=y,i.jello=m,i.pulse=h,i.rubberBand=b,i.shakeX=g,i.shakeY=P,i.swing=k,i.tada=_,i.wobble=w}); 2 | //# sourceMappingURL=vue-animate.umd.min.js.map 3 | -------------------------------------------------------------------------------- /dist/vue-animate.umd.min.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"vue-animate.umd.min.js","sources":["../src/attention.ts","../src/attentions/bounce.ts","../src/attentions/flash.ts","../src/attentions/headShake.ts","../src/attentions/heartBeat.ts","../src/attentions/jello.ts","../src/attentions/pulse.ts","../src/attentions/rubberBand.ts","../src/attentions/shakeX.ts","../src/attentions/shakeY.ts","../src/attentions/swing.ts","../src/attentions/tada.ts","../src/attentions/wobble.ts"],"sourcesContent":["export default function attention(el, animate, duration = undefined, options = {}) {\n return doAttention(el, animate, duration, options);\n}\nexport function doAttention(el, animate, duration = undefined, options = {}) {\n if (typeof duration === 'number' || typeof duration === 'string') {\n options.duration = duration;\n }\n else if (duration != undefined) {\n options = duration;\n }\n return new Promise((resolve) => {\n const rollbacks = getRollbacks(el);\n el.addEventListener('animationend', () => {\n el.classList.remove('animate__animated', 'animate__' + animate);\n restore(el, rollbacks);\n resolve();\n }, { once: true });\n setVariables(el, options);\n el.classList.add('animate__animated', 'animate__' + animate);\n });\n}\nfunction setVariables(el, options) {\n if (options.duration) {\n el.style.setProperty('animation-duration', String(options.duration));\n }\n if (options.delay) {\n el.style.setProperty('animation-delay', String(options.delay));\n }\n if (options.iterationCount) {\n el.style.setProperty('animation-iteration-count', String(options.iterationCount));\n }\n if (options.direction) {\n el.style.setProperty('animation-direction', options.direction);\n }\n if (options.fillMode) {\n el.style.setProperty('animation-fill-mode', options.fillMode);\n }\n}\nfunction restore(el, rollbacks) {\n for (const varName in rollbacks) {\n const value = rollbacks[varName];\n if (value === '') {\n el.style.removeProperty(varName);\n }\n else {\n el.style.setProperty(varName, value);\n }\n }\n}\nfunction getRollbacks(el) {\n const rollbacks = {};\n rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration');\n rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay');\n rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count');\n rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction');\n rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode');\n return rollbacks;\n}\n//# sourceMappingURL=attention.js.map","import { doAttention } from '@/attention';\nexport function bounce(el, duration = undefined, options = {}) {\n return doAttention(el, 'bounce', duration, options);\n}\n//# sourceMappingURL=bounce.js.map","import { doAttention } from '@/attention';\nexport function flash(el, duration = undefined, options = {}) {\n return doAttention(el, 'flash', duration, options);\n}\n//# sourceMappingURL=flash.js.map","import { doAttention } from '@/attention';\nexport function headShake(el, duration = undefined, options = {}) {\n return doAttention(el, 'headShake', duration, options);\n}\n//# sourceMappingURL=headShake.js.map","import { doAttention } from '@/attention';\nexport function heartBeat(el, duration = undefined, options = {}) {\n return doAttention(el, 'heartBeat', duration, options);\n}\n//# sourceMappingURL=heartBeat.js.map","import { doAttention } from '@/attention';\nexport function jello(el, duration = undefined, options = {}) {\n return doAttention(el, 'jello', duration, options);\n}\n//# sourceMappingURL=jello.js.map","import { doAttention } from '@/attention';\nexport function pulse(el, duration = undefined, options = {}) {\n return doAttention(el, 'pulse', duration, options);\n}\n//# sourceMappingURL=pulse.js.map","import { doAttention } from '@/attention';\nexport function rubberBand(el, duration = undefined, options = {}) {\n return doAttention(el, 'rubberBand', duration, options);\n}\n//# sourceMappingURL=rubberBand.js.map","import { doAttention } from '@/attention';\nexport function shakeX(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeX', duration, options);\n}\n//# sourceMappingURL=shakeX.js.map","import { doAttention } from '@/attention';\nexport function shakeY(el, duration = undefined, options = {}) {\n return doAttention(el, 'shakeY', duration, options);\n}\n//# sourceMappingURL=shakeY.js.map","import { doAttention } from '@/attention';\nexport function swing(el, duration = undefined, options = {}) {\n return doAttention(el, 'swing', duration, options);\n}\n//# sourceMappingURL=swing.js.map","import { doAttention } from '@/attention';\nexport function tada(el, duration = undefined, options = {}) {\n return doAttention(el, 'tada', duration, options);\n}\n//# sourceMappingURL=tada.js.map","import { doAttention } from '@/attention';\nexport function wobble(el, duration = undefined, options = {}) {\n return doAttention(el, 'wobble', duration, options);\n}\n//# sourceMappingURL=wobble.js.map"],"names":["attention","el","animate","duration","options","doAttention","resolve","rollbacks","getRollbacks","restore","setVariables","varName","value","bounce","flash","headShake","heartBeat","jello","pulse","rubberBand","shakeX","shakeY","swing","tada","wobble"],"mappings":"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"} -------------------------------------------------------------------------------- /docs/CNAME: -------------------------------------------------------------------------------- 1 | vue-animate.simular.co -------------------------------------------------------------------------------- /docs/assets/index-cbc3acf7.js: -------------------------------------------------------------------------------- 1 | (function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const o of document.querySelectorAll('link[rel="modulepreload"]'))s(o);new MutationObserver(o=>{for(const r of o)if(r.type==="childList")for(const i of r.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&s(i)}).observe(document,{childList:!0,subtree:!0});function n(o){const r={};return o.integrity&&(r.integrity=o.integrity),o.referrerPolicy&&(r.referrerPolicy=o.referrerPolicy),o.crossOrigin==="use-credentials"?r.credentials="include":o.crossOrigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function s(o){if(o.ep)return;o.ep=!0;const r=n(o);fetch(o.href,r)}})();function zn(e,t){const n=Object.create(null),s=e.split(",");for(let o=0;o!!n[o.toLowerCase()]:o=>!!n[o]}const q={},ft=[],xe=()=>{},sr=()=>!1,or=/^on[^a-z]/,ln=e=>or.test(e),qn=e=>e.startsWith("onUpdate:"),Q=Object.assign,Yn=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},rr=Object.prototype.hasOwnProperty,$=(e,t)=>rr.call(e,t),P=Array.isArray,ut=e=>Nt(e)==="[object Map]",cn=e=>Nt(e)==="[object Set]",ms=e=>Nt(e)==="[object Date]",S=e=>typeof e=="function",ee=e=>typeof e=="string",Ot=e=>typeof e=="symbol",W=e=>e!==null&&typeof e=="object",eo=e=>W(e)&&S(e.then)&&S(e.catch),to=Object.prototype.toString,Nt=e=>to.call(e),ir=e=>Nt(e).slice(8,-1),no=e=>Nt(e)==="[object Object]",Jn=e=>ee(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,zt=zn(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),fn=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},lr=/-(\w)/g,pt=fn(e=>e.replace(lr,(t,n)=>n?n.toUpperCase():"")),cr=/\B([A-Z])/g,_t=fn(e=>e.replace(cr,"-$1").toLowerCase()),so=fn(e=>e.charAt(0).toUpperCase()+e.slice(1)),Cn=fn(e=>e?`on${so(e)}`:""),It=(e,t)=>!Object.is(e,t),qt=(e,t)=>{for(let n=0;n{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},Gt=e=>{const t=parseFloat(e);return isNaN(t)?e:t},fr=e=>{const t=ee(e)?Number(e):NaN;return isNaN(t)?e:t};let _s;const Mn=()=>_s||(_s=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof window<"u"?window:typeof global<"u"?global:{});function Xn(e){if(P(e)){const t={};for(let n=0;n{if(n){const s=n.split(ar);s.length>1&&(t[s[0].trim()]=s[1].trim())}}),t}function un(e){let t="";if(ee(e))t=e;else if(P(e))for(let n=0;nan(n,t))}const Ct=e=>ee(e)?e:e==null?"":P(e)||W(e)&&(e.toString===to||!S(e.toString))?JSON.stringify(e,ro,2):String(e),ro=(e,t)=>t&&t.__v_isRef?ro(e,t.value):ut(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[s,o])=>(n[`${s} =>`]=o,n),{})}:cn(t)?{[`Set(${t.size})`]:[...t.values()]}:W(t)&&!P(t)&&!no(t)?String(t):t;let be;class br{constructor(t=!1){this.detached=t,this._active=!0,this.effects=[],this.cleanups=[],this.parent=be,!t&&be&&(this.index=(be.scopes||(be.scopes=[])).push(this)-1)}get active(){return this._active}run(t){if(this._active){const n=be;try{return be=this,t()}finally{be=n}}}on(){be=this}off(){be=this.parent}stop(t){if(this._active){let n,s;for(n=0,s=this.effects.length;n{const t=new Set(e);return t.w=0,t.n=0,t},io=e=>(e.w&We)>0,lo=e=>(e.n&We)>0,xr=({deps:e})=>{if(e.length)for(let t=0;t{const{deps:t}=e;if(t.length){let n=0;for(let s=0;s{(d==="length"||d>=f)&&l.push(a)})}else switch(n!==void 0&&l.push(i.get(n)),t){case"add":P(e)?Jn(n)&&l.push(i.get("length")):(l.push(i.get(nt)),ut(e)&&l.push(i.get(Ln)));break;case"delete":P(e)||(l.push(i.get(nt)),ut(e)&&l.push(i.get(Ln)));break;case"set":ut(e)&&l.push(i.get(nt));break}if(l.length===1)l[0]&&Rn(l[0]);else{const f=[];for(const a of l)a&&f.push(...a);Rn(Zn(f))}}function Rn(e,t){const n=P(e)?e:[...e];for(const s of n)s.computed&&vs(s);for(const s of n)s.computed||vs(s)}function vs(e,t){(e!==ve||e.allowRecurse)&&(e.scheduler?e.scheduler():e.run())}const wr=zn("__proto__,__v_isRef,__isVue"),uo=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!=="arguments"&&e!=="caller").map(e=>Symbol[e]).filter(Ot)),Er=Gn(),Tr=Gn(!1,!0),Ar=Gn(!0),ys=Pr();function Pr(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const s=H(this);for(let r=0,i=this.length;r{e[t]=function(...n){bt();const s=H(this)[t].apply(this,n);return vt(),s}}),e}function Or(e){const t=H(this);return ue(t,"has",e),t.hasOwnProperty(e)}function Gn(e=!1,t=!1){return function(s,o,r){if(o==="__v_isReactive")return!e;if(o==="__v_isReadonly")return e;if(o==="__v_isShallow")return t;if(o==="__v_raw"&&r===(e?t?Vr:mo:t?go:ho).get(s))return s;const i=P(s);if(!e){if(i&&$(ys,o))return Reflect.get(ys,o,r);if(o==="hasOwnProperty")return Or}const l=Reflect.get(s,o,r);return(Ot(o)?uo.has(o):wr(o))||(e||ue(s,"get",o),t)?l:ie(l)?i&&Jn(o)?l:l.value:W(l)?e?_o(l):ns(l):l}}const Ir=ao(),Mr=ao(!0);function ao(e=!1){return function(n,s,o,r){let i=n[s];if(ht(i)&&ie(i)&&!ie(o))return!1;if(!e&&(!en(o)&&!ht(o)&&(i=H(i),o=H(o)),!P(n)&&ie(i)&&!ie(o)))return i.value=o,!0;const l=P(n)&&Jn(s)?Number(s)e,dn=e=>Reflect.getPrototypeOf(e);function Bt(e,t,n=!1,s=!1){e=e.__v_raw;const o=H(e),r=H(t);n||(t!==r&&ue(o,"get",t),ue(o,"get",r));const{has:i}=dn(o),l=s?es:n?os:Mt;if(i.call(o,t))return l(e.get(t));if(i.call(o,r))return l(e.get(r));e!==o&&e.get(t)}function $t(e,t=!1){const n=this.__v_raw,s=H(n),o=H(e);return t||(e!==o&&ue(s,"has",e),ue(s,"has",o)),e===o?n.has(e):n.has(e)||n.has(o)}function Ut(e,t=!1){return e=e.__v_raw,!t&&ue(H(e),"iterate",nt),Reflect.get(e,"size",e)}function xs(e){e=H(e);const t=H(this);return dn(t).has.call(t,e)||(t.add(e),Ne(t,"add",e,e)),this}function Cs(e,t){t=H(t);const n=H(this),{has:s,get:o}=dn(n);let r=s.call(n,e);r||(e=H(e),r=s.call(n,e));const i=o.call(n,e);return n.set(e,t),r?It(t,i)&&Ne(n,"set",e,t):Ne(n,"add",e,t),this}function ws(e){const t=H(this),{has:n,get:s}=dn(t);let o=n.call(t,e);o||(e=H(e),o=n.call(t,e)),s&&s.call(t,e);const r=t.delete(e);return o&&Ne(t,"delete",e,void 0),r}function Es(){const e=H(this),t=e.size!==0,n=e.clear();return t&&Ne(e,"clear",void 0,void 0),n}function Ht(e,t){return function(s,o){const r=this,i=r.__v_raw,l=H(i),f=t?es:e?os:Mt;return!e&&ue(l,"iterate",nt),i.forEach((a,d)=>s.call(o,f(a),f(d),r))}}function kt(e,t,n){return function(...s){const o=this.__v_raw,r=H(o),i=ut(r),l=e==="entries"||e===Symbol.iterator&&i,f=e==="keys"&&i,a=o[e](...s),d=n?es:t?os:Mt;return!t&&ue(r,"iterate",f?Ln:nt),{next(){const{value:_,done:y}=a.next();return y?{value:_,done:y}:{value:l?[d(_[0]),d(_[1])]:d(_),done:y}},[Symbol.iterator](){return this}}}}function Be(e){return function(...t){return e==="delete"?!1:this}}function Dr(){const e={get(r){return Bt(this,r)},get size(){return Ut(this)},has:$t,add:xs,set:Cs,delete:ws,clear:Es,forEach:Ht(!1,!1)},t={get(r){return Bt(this,r,!1,!0)},get size(){return Ut(this)},has:$t,add:xs,set:Cs,delete:ws,clear:Es,forEach:Ht(!1,!0)},n={get(r){return Bt(this,r,!0)},get size(){return Ut(this,!0)},has(r){return $t.call(this,r,!0)},add:Be("add"),set:Be("set"),delete:Be("delete"),clear:Be("clear"),forEach:Ht(!0,!1)},s={get(r){return Bt(this,r,!0,!0)},get size(){return Ut(this,!0)},has(r){return $t.call(this,r,!0)},add:Be("add"),set:Be("set"),delete:Be("delete"),clear:Be("clear"),forEach:Ht(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(r=>{e[r]=kt(r,!1,!1),n[r]=kt(r,!0,!1),t[r]=kt(r,!1,!0),s[r]=kt(r,!0,!0)}),[e,n,t,s]}const[jr,Br,$r,Ur]=Dr();function ts(e,t){const n=t?e?Ur:$r:e?Br:jr;return(s,o,r)=>o==="__v_isReactive"?!e:o==="__v_isReadonly"?e:o==="__v_raw"?s:Reflect.get($(n,o)&&o in s?n:s,o,r)}const Hr={get:ts(!1,!1)},kr={get:ts(!1,!0)},Kr={get:ts(!0,!1)},ho=new WeakMap,go=new WeakMap,mo=new WeakMap,Vr=new WeakMap;function Wr(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function zr(e){return e.__v_skip||!Object.isExtensible(e)?0:Wr(ir(e))}function ns(e){return ht(e)?e:ss(e,!1,po,Hr,ho)}function qr(e){return ss(e,!1,Nr,kr,go)}function _o(e){return ss(e,!0,Rr,Kr,mo)}function ss(e,t,n,s,o){if(!W(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const r=o.get(e);if(r)return r;const i=zr(e);if(i===0)return e;const l=new Proxy(e,i===2?s:n);return o.set(e,l),l}function at(e){return ht(e)?at(e.__v_raw):!!(e&&e.__v_isReactive)}function ht(e){return!!(e&&e.__v_isReadonly)}function en(e){return!!(e&&e.__v_isShallow)}function bo(e){return at(e)||ht(e)}function H(e){const t=e&&e.__v_raw;return t?H(t):e}function vo(e){return Qt(e,"__v_skip",!0),e}const Mt=e=>W(e)?ns(e):e,os=e=>W(e)?_o(e):e;function yo(e){Ke&&ve&&(e=H(e),fo(e.dep||(e.dep=Zn())))}function xo(e,t){e=H(e);const n=e.dep;n&&Rn(n)}function ie(e){return!!(e&&e.__v_isRef===!0)}function $e(e){return Yr(e,!1)}function Yr(e,t){return ie(e)?e:new Jr(e,t)}class Jr{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:H(t),this._value=n?t:Mt(t)}get value(){return yo(this),this._value}set value(t){const n=this.__v_isShallow||en(t)||ht(t);t=n?t:H(t),It(t,this._rawValue)&&(this._rawValue=t,this._value=n?t:Mt(t),xo(this))}}function Nn(e){return ie(e)?e.value:e}const Xr={get:(e,t,n)=>Nn(Reflect.get(e,t,n)),set:(e,t,n,s)=>{const o=e[t];return ie(o)&&!ie(n)?(o.value=n,!0):Reflect.set(e,t,n,s)}};function Co(e){return at(e)?e:new Proxy(e,Xr)}class Zr{constructor(t,n,s,o){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this.__v_isReadonly=!1,this._dirty=!0,this.effect=new Qn(t,()=>{this._dirty||(this._dirty=!0,xo(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!o,this.__v_isReadonly=s}get value(){const t=H(this);return yo(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function Qr(e,t,n=!1){let s,o;const r=S(e);return r?(s=e,o=xe):(s=e.get,o=e.set),new Zr(s,o,r||!o,n)}function Ve(e,t,n,s){let o;try{o=s?e(...s):e()}catch(r){pn(r,t,n)}return o}function ge(e,t,n,s){if(S(e)){const r=Ve(e,t,n,s);return r&&eo(r)&&r.catch(i=>{pn(i,t,n)}),r}const o=[];for(let r=0;r>>1;St(re[s])Oe&&re.splice(t,1)}function si(e){P(e)?dt.push(...e):(!Re||!Re.includes(e,e.allowRecurse?Ze+1:Ze))&&dt.push(e),Eo()}function Ts(e,t=Ft?Oe+1:0){for(;tSt(n)-St(s)),Ze=0;Zee.id==null?1/0:e.id,oi=(e,t)=>{const n=St(e)-St(t);if(n===0){if(e.pre&&!t.pre)return-1;if(t.pre&&!e.pre)return 1}return n};function Ao(e){Dn=!1,Ft=!0,re.sort(oi);const t=xe;try{for(Oe=0;Oeee(O)?O.trim():O)),_&&(o=n.map(Gt))}let l,f=s[l=Cn(t)]||s[l=Cn(pt(t))];!f&&r&&(f=s[l=Cn(_t(t))]),f&&ge(f,e,6,o);const a=s[l+"Once"];if(a){if(!e.emitted)e.emitted={};else if(e.emitted[l])return;e.emitted[l]=!0,ge(a,e,6,o)}}function Po(e,t,n=!1){const s=t.emitsCache,o=s.get(e);if(o!==void 0)return o;const r=e.emits;let i={},l=!1;if(!S(e)){const f=a=>{const d=Po(a,t,!0);d&&(l=!0,Q(i,d))};!n&&t.mixins.length&&t.mixins.forEach(f),e.extends&&f(e.extends),e.mixins&&e.mixins.forEach(f)}return!r&&!l?(W(e)&&s.set(e,null),null):(P(r)?r.forEach(f=>i[f]=null):Q(i,r),W(e)&&s.set(e,i),i)}function hn(e,t){return!e||!ln(t)?!1:(t=t.slice(2).replace(/Once$/,""),$(e,t[0].toLowerCase()+t.slice(1))||$(e,_t(t))||$(e,t))}let he=null,gn=null;function tn(e){const t=he;return he=e,gn=e&&e.type.__scopeId||null,t}function ii(e){gn=e}function li(){gn=null}function Oo(e,t=he,n){if(!t||e._n)return e;const s=(...o)=>{s._d&&Ns(-1);const r=tn(t);let i;try{i=e(...o)}finally{tn(r),s._d&&Ns(1)}return i};return s._n=!0,s._c=!0,s._d=!0,s}function wn(e){const{type:t,vnode:n,proxy:s,withProxy:o,props:r,propsOptions:[i],slots:l,attrs:f,emit:a,render:d,renderCache:_,data:y,setupState:O,ctx:U,inheritAttrs:L}=e;let j,B;const R=tn(e);try{if(n.shapeFlag&4){const I=o||s;j=Pe(d.call(I,I,_,r,O,y,U)),B=f}else{const I=t;j=Pe(I.length>1?I(r,{attrs:f,slots:l,emit:a}):I(r,null)),B=t.props?f:ci(f)}}catch(I){Pt.length=0,pn(I,e,1),j=Ie(gt)}let Y=j;if(B&&L!==!1){const I=Object.keys(B),{shapeFlag:te}=Y;I.length&&te&7&&(i&&I.some(qn)&&(B=fi(B,i)),Y=ot(Y,B))}return n.dirs&&(Y=ot(Y),Y.dirs=Y.dirs?Y.dirs.concat(n.dirs):n.dirs),n.transition&&(Y.transition=n.transition),j=Y,tn(R),j}const ci=e=>{let t;for(const n in e)(n==="class"||n==="style"||ln(n))&&((t||(t={}))[n]=e[n]);return t},fi=(e,t)=>{const n={};for(const s in e)(!qn(s)||!(s.slice(9)in t))&&(n[s]=e[s]);return n};function ui(e,t,n){const{props:s,children:o,component:r}=e,{props:i,children:l,patchFlag:f}=t,a=r.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&f>=0){if(f&1024)return!0;if(f&16)return s?As(s,i,a):!!i;if(f&8){const d=t.dynamicProps;for(let _=0;_e.__isSuspense;function pi(e,t){t&&t.pendingBranch?P(e)?t.effects.push(...e):t.effects.push(e):si(e)}const Kt={};function En(e,t,n){return Io(e,t,n)}function Io(e,t,{immediate:n,deep:s,flush:o,onTrack:r,onTrigger:i}=q){var l;const f=yr()===((l=se)==null?void 0:l.scope)?se:null;let a,d=!1,_=!1;if(ie(e)?(a=()=>e.value,d=en(e)):at(e)?(a=()=>e,s=!0):P(e)?(_=!0,d=e.some(I=>at(I)||en(I)),a=()=>e.map(I=>{if(ie(I))return I.value;if(at(I))return et(I);if(S(I))return Ve(I,f,2)})):S(e)?t?a=()=>Ve(e,f,2):a=()=>{if(!(f&&f.isUnmounted))return y&&y(),ge(e,f,3,[O])}:a=xe,t&&s){const I=a;a=()=>et(I())}let y,O=I=>{y=R.onStop=()=>{Ve(I,f,4)}},U;if(Rt)if(O=xe,t?n&&ge(t,f,3,[a(),_?[]:void 0,O]):a(),o==="sync"){const I=ul();U=I.__watcherHandles||(I.__watcherHandles=[])}else return xe;let L=_?new Array(e.length).fill(Kt):Kt;const j=()=>{if(R.active)if(t){const I=R.run();(s||d||(_?I.some((te,Ce)=>It(te,L[Ce])):It(I,L)))&&(y&&y(),ge(t,f,3,[I,L===Kt?void 0:_&&L[0]===Kt?[]:L,O]),L=I)}else R.run()};j.allowRecurse=!!t;let B;o==="sync"?B=j:o==="post"?B=()=>fe(j,f&&f.suspense):(j.pre=!0,f&&(j.id=f.uid),B=()=>is(j));const R=new Qn(a,B);t?n?j():L=R.run():o==="post"?fe(R.run.bind(R),f&&f.suspense):R.run();const Y=()=>{R.stop(),f&&f.scope&&Yn(f.scope.effects,R)};return U&&U.push(Y),Y}function hi(e,t,n){const s=this.proxy,o=ee(e)?e.includes(".")?Mo(s,e):()=>s[e]:e.bind(s,s);let r;S(t)?r=t:(r=t.handler,n=t);const i=se;mt(this);const l=Io(o,r.bind(s),n);return i?mt(i):st(),l}function Mo(e,t){const n=t.split(".");return()=>{let s=e;for(let o=0;o{et(n,t)});else if(no(e))for(const n in e)et(e[n],t);return e}function Vt(e,t){const n=he;if(n===null)return e;const s=vn(n)||n.proxy,o=e.dirs||(e.dirs=[]);for(let r=0;r{e.isMounted=!0}),Do(()=>{e.isUnmounting=!0}),e}const pe=[Function,Array],mi={mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:pe,onEnter:pe,onAfterEnter:pe,onEnterCancelled:pe,onBeforeLeave:pe,onLeave:pe,onAfterLeave:pe,onLeaveCancelled:pe,onBeforeAppear:pe,onAppear:pe,onAfterAppear:pe,onAppearCancelled:pe};function _i(e,t){const{leavingVNodes:n}=e;let s=n.get(t.type);return s||(s=Object.create(null),n.set(t.type,s)),s}function jn(e,t,n,s){const{appear:o,mode:r,persisted:i=!1,onBeforeEnter:l,onEnter:f,onAfterEnter:a,onEnterCancelled:d,onBeforeLeave:_,onLeave:y,onAfterLeave:O,onLeaveCancelled:U,onBeforeAppear:L,onAppear:j,onAfterAppear:B,onAppearCancelled:R}=t,Y=String(e.key),I=_i(n,e),te=(N,X)=>{N&&ge(N,s,9,X)},Ce=(N,X)=>{const z=X[1];te(N,X),P(N)?N.every(oe=>oe.length<=1)&&z():N.length<=1&&z()},we={mode:r,persisted:i,beforeEnter(N){let X=l;if(!n.isMounted)if(o)X=L||l;else return;N._leaveCb&&N._leaveCb(!0);const z=I[Y];z&&ct(e,z)&&z.el._leaveCb&&z.el._leaveCb(),te(X,[N])},enter(N){let X=f,z=a,oe=d;if(!n.isMounted)if(o)X=j||f,z=B||a,oe=R||d;else return;let E=!1;const J=N._enterCb=ae=>{E||(E=!0,ae?te(oe,[N]):te(z,[N]),we.delayedLeave&&we.delayedLeave(),N._enterCb=void 0)};X?Ce(X,[N,J]):J()},leave(N,X){const z=String(e.key);if(N._enterCb&&N._enterCb(!0),n.isUnmounting)return X();te(_,[N]);let oe=!1;const E=N._leaveCb=J=>{oe||(oe=!0,X(),J?te(U,[N]):te(O,[N]),N._leaveCb=void 0,I[z]===e&&delete I[z])};I[z]=e,y?Ce(y,[N,E]):E()},clone(N){return jn(N,t,n,s)}};return we}function Bn(e,t){e.shapeFlag&6&&e.component?Bn(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function Fo(e,t=!1,n){let s=[],o=0;for(let r=0;r1)for(let r=0;rQ({name:e.name},t,{setup:e}))():e}const Yt=e=>!!e.type.__asyncLoader,So=e=>e.type.__isKeepAlive;function vi(e,t){Lo(e,"a",t)}function yi(e,t){Lo(e,"da",t)}function Lo(e,t,n=se){const s=e.__wdc||(e.__wdc=()=>{let o=n;for(;o;){if(o.isDeactivated)return;o=o.parent}return e()});if(mn(t,s,n),n){let o=n.parent;for(;o&&o.parent;)So(o.parent.vnode)&&xi(s,t,n,o),o=o.parent}}function xi(e,t,n,s){const o=mn(t,e,s,!0);jo(()=>{Yn(s[t],o)},n)}function mn(e,t,n=se,s=!1){if(n){const o=n[e]||(n[e]=[]),r=t.__weh||(t.__weh=(...i)=>{if(n.isUnmounted)return;bt(),mt(n);const l=ge(t,n,e,i);return st(),vt(),l});return s?o.unshift(r):o.push(r),r}}const De=e=>(t,n=se)=>(!Rt||e==="sp")&&mn(e,(...s)=>t(...s),n),Ci=De("bm"),Ro=De("m"),wi=De("bu"),No=De("u"),Do=De("bum"),jo=De("um"),Ei=De("sp"),Ti=De("rtg"),Ai=De("rtc");function Pi(e,t=se){mn("ec",e,t)}const Oi=Symbol.for("v-ndc");function Wt(e,t,n,s){let o;const r=n&&n[s];if(P(e)||ee(e)){o=new Array(e.length);for(let i=0,l=e.length;it(i,l,void 0,r&&r[l]));else{const i=Object.keys(e);o=new Array(i.length);for(let l=0,f=i.length;le?qo(e)?vn(e)||e.proxy:$n(e.parent):null,At=Q(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>$n(e.parent),$root:e=>$n(e.root),$emit:e=>e.emit,$options:e=>ls(e),$forceUpdate:e=>e.f||(e.f=()=>is(e.update)),$nextTick:e=>e.n||(e.n=ei.bind(e.proxy)),$watch:e=>hi.bind(e)}),Tn=(e,t)=>e!==q&&!e.__isScriptSetup&&$(e,t),Ii={get({_:e},t){const{ctx:n,setupState:s,data:o,props:r,accessCache:i,type:l,appContext:f}=e;let a;if(t[0]!=="$"){const O=i[t];if(O!==void 0)switch(O){case 1:return s[t];case 2:return o[t];case 4:return n[t];case 3:return r[t]}else{if(Tn(s,t))return i[t]=1,s[t];if(o!==q&&$(o,t))return i[t]=2,o[t];if((a=e.propsOptions[0])&&$(a,t))return i[t]=3,r[t];if(n!==q&&$(n,t))return i[t]=4,n[t];Un&&(i[t]=0)}}const d=At[t];let _,y;if(d)return t==="$attrs"&&ue(e,"get",t),d(e);if((_=l.__cssModules)&&(_=_[t]))return _;if(n!==q&&$(n,t))return i[t]=4,n[t];if(y=f.config.globalProperties,$(y,t))return y[t]},set({_:e},t,n){const{data:s,setupState:o,ctx:r}=e;return Tn(o,t)?(o[t]=n,!0):s!==q&&$(s,t)?(s[t]=n,!0):$(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(r[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:s,appContext:o,propsOptions:r}},i){let l;return!!n[i]||e!==q&&$(e,i)||Tn(t,i)||(l=r[0])&&$(l,i)||$(s,i)||$(At,i)||$(o.config.globalProperties,i)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:$(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}};function Ps(e){return P(e)?e.reduce((t,n)=>(t[n]=null,t),{}):e}let Un=!0;function Mi(e){const t=ls(e),n=e.proxy,s=e.ctx;Un=!1,t.beforeCreate&&Os(t.beforeCreate,e,"bc");const{data:o,computed:r,methods:i,watch:l,provide:f,inject:a,created:d,beforeMount:_,mounted:y,beforeUpdate:O,updated:U,activated:L,deactivated:j,beforeDestroy:B,beforeUnmount:R,destroyed:Y,unmounted:I,render:te,renderTracked:Ce,renderTriggered:we,errorCaptured:N,serverPrefetch:X,expose:z,inheritAttrs:oe,components:E,directives:J,filters:ae}=t;if(a&&Fi(a,s,null),i)for(const Z in i){const K=i[Z];S(K)&&(s[Z]=K.bind(n))}if(o){const Z=o.call(n,n);W(Z)&&(e.data=ns(Z))}if(Un=!0,r)for(const Z in r){const K=r[Z],ze=S(K)?K.bind(n,n):S(K.get)?K.get.bind(n,n):xe,Dt=!S(K)&&S(K.set)?K.set.bind(n):xe,qe=Vn({get:ze,set:Dt});Object.defineProperty(s,Z,{enumerable:!0,configurable:!0,get:()=>qe.value,set:Ee=>qe.value=Ee})}if(l)for(const Z in l)Bo(l[Z],s,n,Z);if(f){const Z=S(f)?f.call(n):f;Reflect.ownKeys(Z).forEach(K=>{ji(K,Z[K])})}d&&Os(d,e,"c");function ne(Z,K){P(K)?K.forEach(ze=>Z(ze.bind(n))):K&&Z(K.bind(n))}if(ne(Ci,_),ne(Ro,y),ne(wi,O),ne(No,U),ne(vi,L),ne(yi,j),ne(Pi,N),ne(Ai,Ce),ne(Ti,we),ne(Do,R),ne(jo,I),ne(Ei,X),P(z))if(z.length){const Z=e.exposed||(e.exposed={});z.forEach(K=>{Object.defineProperty(Z,K,{get:()=>n[K],set:ze=>n[K]=ze})})}else e.exposed||(e.exposed={});te&&e.render===xe&&(e.render=te),oe!=null&&(e.inheritAttrs=oe),E&&(e.components=E),J&&(e.directives=J)}function Fi(e,t,n=xe){P(e)&&(e=Hn(e));for(const s in e){const o=e[s];let r;W(o)?"default"in o?r=Jt(o.from||s,o.default,!0):r=Jt(o.from||s):r=Jt(o),ie(r)?Object.defineProperty(t,s,{enumerable:!0,configurable:!0,get:()=>r.value,set:i=>r.value=i}):t[s]=r}}function Os(e,t,n){ge(P(e)?e.map(s=>s.bind(t.proxy)):e.bind(t.proxy),t,n)}function Bo(e,t,n,s){const o=s.includes(".")?Mo(n,s):()=>n[s];if(ee(e)){const r=t[e];S(r)&&En(o,r)}else if(S(e))En(o,e.bind(n));else if(W(e))if(P(e))e.forEach(r=>Bo(r,t,n,s));else{const r=S(e.handler)?e.handler.bind(n):t[e.handler];S(r)&&En(o,r,e)}}function ls(e){const t=e.type,{mixins:n,extends:s}=t,{mixins:o,optionsCache:r,config:{optionMergeStrategies:i}}=e.appContext,l=r.get(t);let f;return l?f=l:!o.length&&!n&&!s?f=t:(f={},o.length&&o.forEach(a=>nn(f,a,i,!0)),nn(f,t,i)),W(t)&&r.set(t,f),f}function nn(e,t,n,s=!1){const{mixins:o,extends:r}=t;r&&nn(e,r,n,!0),o&&o.forEach(i=>nn(e,i,n,!0));for(const i in t)if(!(s&&i==="expose")){const l=Si[i]||n&&n[i];e[i]=l?l(e[i],t[i]):t[i]}return e}const Si={data:Is,props:Ms,emits:Ms,methods:Tt,computed:Tt,beforeCreate:le,created:le,beforeMount:le,mounted:le,beforeUpdate:le,updated:le,beforeDestroy:le,beforeUnmount:le,destroyed:le,unmounted:le,activated:le,deactivated:le,errorCaptured:le,serverPrefetch:le,components:Tt,directives:Tt,watch:Ri,provide:Is,inject:Li};function Is(e,t){return t?e?function(){return Q(S(e)?e.call(this,this):e,S(t)?t.call(this,this):t)}:t:e}function Li(e,t){return Tt(Hn(e),Hn(t))}function Hn(e){if(P(e)){const t={};for(let n=0;n1)return n&&S(t)?t.call(s&&s.proxy):t}}function Bi(e,t,n,s=!1){const o={},r={};Qt(r,bn,1),e.propsDefaults=Object.create(null),Uo(e,t,o,r);for(const i in e.propsOptions[0])i in o||(o[i]=void 0);n?e.props=s?o:qr(o):e.type.props?e.props=o:e.props=r,e.attrs=r}function $i(e,t,n,s){const{props:o,attrs:r,vnode:{patchFlag:i}}=e,l=H(o),[f]=e.propsOptions;let a=!1;if((s||i>0)&&!(i&16)){if(i&8){const d=e.vnode.dynamicProps;for(let _=0;_{f=!0;const[y,O]=Ho(_,t,!0);Q(i,y),O&&l.push(...O)};!n&&t.mixins.length&&t.mixins.forEach(d),e.extends&&d(e.extends),e.mixins&&e.mixins.forEach(d)}if(!r&&!f)return W(e)&&s.set(e,ft),ft;if(P(r))for(let d=0;d-1,O[1]=L<0||U-1||$(O,"default"))&&l.push(_)}}}const a=[i,l];return W(e)&&s.set(e,a),a}function Fs(e){return e[0]!=="$"}function Ss(e){const t=e&&e.toString().match(/^\s*(function|class) (\w+)/);return t?t[2]:e===null?"null":""}function Ls(e,t){return Ss(e)===Ss(t)}function Rs(e,t){return P(t)?t.findIndex(n=>Ls(n,e)):S(t)&&Ls(t,e)?0:-1}const ko=e=>e[0]==="_"||e==="$stable",cs=e=>P(e)?e.map(Pe):[Pe(e)],Ui=(e,t,n)=>{if(t._n)return t;const s=Oo((...o)=>cs(t(...o)),n);return s._c=!1,s},Ko=(e,t,n)=>{const s=e._ctx;for(const o in e){if(ko(o))continue;const r=e[o];if(S(r))t[o]=Ui(o,r,s);else if(r!=null){const i=cs(r);t[o]=()=>i}}},Vo=(e,t)=>{const n=cs(t);e.slots.default=()=>n},Hi=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=H(t),Qt(t,"_",n)):Ko(t,e.slots={})}else e.slots={},t&&Vo(e,t);Qt(e.slots,bn,1)},ki=(e,t,n)=>{const{vnode:s,slots:o}=e;let r=!0,i=q;if(s.shapeFlag&32){const l=t._;l?n&&l===1?r=!1:(Q(o,t),!n&&l===1&&delete o._):(r=!t.$stable,Ko(t,o)),i=t}else t&&(Vo(e,t),i={default:1});if(r)for(const l in o)!ko(l)&&!(l in i)&&delete o[l]};function Kn(e,t,n,s,o=!1){if(P(e)){e.forEach((y,O)=>Kn(y,t&&(P(t)?t[O]:t),n,s,o));return}if(Yt(s)&&!o)return;const r=s.shapeFlag&4?vn(s.component)||s.component.proxy:s.el,i=o?null:r,{i:l,r:f}=e,a=t&&t.r,d=l.refs===q?l.refs={}:l.refs,_=l.setupState;if(a!=null&&a!==f&&(ee(a)?(d[a]=null,$(_,a)&&(_[a]=null)):ie(a)&&(a.value=null)),S(f))Ve(f,l,12,[i,d]);else{const y=ee(f),O=ie(f);if(y||O){const U=()=>{if(e.f){const L=y?$(_,f)?_[f]:d[f]:f.value;o?P(L)&&Yn(L,r):P(L)?L.includes(r)||L.push(r):y?(d[f]=[r],$(_,f)&&(_[f]=d[f])):(f.value=[r],e.k&&(d[e.k]=f.value))}else y?(d[f]=i,$(_,f)&&(_[f]=i)):O&&(f.value=i,e.k&&(d[e.k]=i))};i?(U.id=-1,fe(U,n)):U()}}}const fe=pi;function Ki(e){return Vi(e)}function Vi(e,t){const n=Mn();n.__VUE__=!0;const{insert:s,remove:o,patchProp:r,createElement:i,createText:l,createComment:f,setText:a,setElementText:d,parentNode:_,nextSibling:y,setScopeId:O=xe,insertStaticContent:U}=e,L=(c,u,p,g=null,h=null,v=null,C=!1,b=null,x=!!u.dynamicChildren)=>{if(c===u)return;c&&!ct(c,u)&&(g=jt(c),Ee(c,h,v,!0),c=null),u.patchFlag===-2&&(x=!1,u.dynamicChildren=null);const{type:m,ref:T,shapeFlag:w}=u;switch(m){case _n:j(c,u,p,g);break;case gt:B(c,u,p,g);break;case Xt:c==null&&R(u,p,g,C);break;case ce:E(c,u,p,g,h,v,C,b,x);break;default:w&1?te(c,u,p,g,h,v,C,b,x):w&6?J(c,u,p,g,h,v,C,b,x):(w&64||w&128)&&m.process(c,u,p,g,h,v,C,b,x,rt)}T!=null&&h&&Kn(T,c&&c.ref,v,u||c,!u)},j=(c,u,p,g)=>{if(c==null)s(u.el=l(u.children),p,g);else{const h=u.el=c.el;u.children!==c.children&&a(h,u.children)}},B=(c,u,p,g)=>{c==null?s(u.el=f(u.children||""),p,g):u.el=c.el},R=(c,u,p,g)=>{[c.el,c.anchor]=U(c.children,u,p,g,c.el,c.anchor)},Y=({el:c,anchor:u},p,g)=>{let h;for(;c&&c!==u;)h=y(c),s(c,p,g),c=h;s(u,p,g)},I=({el:c,anchor:u})=>{let p;for(;c&&c!==u;)p=y(c),o(c),c=p;o(u)},te=(c,u,p,g,h,v,C,b,x)=>{C=C||u.type==="svg",c==null?Ce(u,p,g,h,v,C,b,x):X(c,u,h,v,C,b,x)},Ce=(c,u,p,g,h,v,C,b)=>{let x,m;const{type:T,props:w,shapeFlag:A,transition:M,dirs:D}=c;if(x=c.el=i(c.type,v,w&&w.is,w),A&8?d(x,c.children):A&16&&N(c.children,x,null,g,h,v&&T!=="foreignObject",C,b),D&&Ye(c,null,g,"created"),we(x,c,c.scopeId,C,g),w){for(const k in w)k!=="value"&&!zt(k)&&r(x,k,null,w[k],v,c.children,g,h,Me);"value"in w&&r(x,"value",null,w.value),(m=w.onVnodeBeforeMount)&&Ae(m,g,c)}D&&Ye(c,null,g,"beforeMount");const V=(!h||h&&!h.pendingBranch)&&M&&!M.persisted;V&&M.beforeEnter(x),s(x,u,p),((m=w&&w.onVnodeMounted)||V||D)&&fe(()=>{m&&Ae(m,g,c),V&&M.enter(x),D&&Ye(c,null,g,"mounted")},h)},we=(c,u,p,g,h)=>{if(p&&O(c,p),g)for(let v=0;v{for(let m=x;m{const b=u.el=c.el;let{patchFlag:x,dynamicChildren:m,dirs:T}=u;x|=c.patchFlag&16;const w=c.props||q,A=u.props||q;let M;p&&Je(p,!1),(M=A.onVnodeBeforeUpdate)&&Ae(M,p,u,c),T&&Ye(u,c,p,"beforeUpdate"),p&&Je(p,!0);const D=h&&u.type!=="foreignObject";if(m?z(c.dynamicChildren,m,b,p,g,D,v):C||K(c,u,b,null,p,g,D,v,!1),x>0){if(x&16)oe(b,u,w,A,p,g,h);else if(x&2&&w.class!==A.class&&r(b,"class",null,A.class,h),x&4&&r(b,"style",w.style,A.style,h),x&8){const V=u.dynamicProps;for(let k=0;k{M&&Ae(M,p,u,c),T&&Ye(u,c,p,"updated")},g)},z=(c,u,p,g,h,v,C)=>{for(let b=0;b{if(p!==g){if(p!==q)for(const b in p)!zt(b)&&!(b in g)&&r(c,b,p[b],null,C,u.children,h,v,Me);for(const b in g){if(zt(b))continue;const x=g[b],m=p[b];x!==m&&b!=="value"&&r(c,b,m,x,C,u.children,h,v,Me)}"value"in g&&r(c,"value",p.value,g.value)}},E=(c,u,p,g,h,v,C,b,x)=>{const m=u.el=c?c.el:l(""),T=u.anchor=c?c.anchor:l("");let{patchFlag:w,dynamicChildren:A,slotScopeIds:M}=u;M&&(b=b?b.concat(M):M),c==null?(s(m,p,g),s(T,p,g),N(u.children,p,T,h,v,C,b,x)):w>0&&w&64&&A&&c.dynamicChildren?(z(c.dynamicChildren,A,p,h,v,C,b),(u.key!=null||h&&u===h.subTree)&&Wo(c,u,!0)):K(c,u,p,T,h,v,C,b,x)},J=(c,u,p,g,h,v,C,b,x)=>{u.slotScopeIds=b,c==null?u.shapeFlag&512?h.ctx.activate(u,p,g,C,x):ae(u,p,g,h,v,C,x):yt(c,u,x)},ae=(c,u,p,g,h,v,C)=>{const b=c.component=nl(c,g,h);if(So(c)&&(b.ctx.renderer=rt),ol(b),b.asyncDep){if(h&&h.registerDep(b,ne),!c.el){const x=b.subTree=Ie(gt);B(null,x,u,p)}return}ne(b,c,u,p,h,v,C)},yt=(c,u,p)=>{const g=u.component=c.component;if(ui(c,u,p))if(g.asyncDep&&!g.asyncResolved){Z(g,u,p);return}else g.next=u,ni(g.update),g.update();else u.el=c.el,g.vnode=u},ne=(c,u,p,g,h,v,C)=>{const b=()=>{if(c.isMounted){let{next:T,bu:w,u:A,parent:M,vnode:D}=c,V=T,k;Je(c,!1),T?(T.el=D.el,Z(c,T,C)):T=D,w&&qt(w),(k=T.props&&T.props.onVnodeBeforeUpdate)&&Ae(k,M,T,D),Je(c,!0);const G=wn(c),_e=c.subTree;c.subTree=G,L(_e,G,_(_e.el),jt(_e),c,h,v),T.el=G.el,V===null&&ai(c,G.el),A&&fe(A,h),(k=T.props&&T.props.onVnodeUpdated)&&fe(()=>Ae(k,M,T,D),h)}else{let T;const{el:w,props:A}=u,{bm:M,m:D,parent:V}=c,k=Yt(u);if(Je(c,!1),M&&qt(M),!k&&(T=A&&A.onVnodeBeforeMount)&&Ae(T,V,u),Je(c,!0),w&&xn){const G=()=>{c.subTree=wn(c),xn(w,c.subTree,c,h,null)};k?u.type.__asyncLoader().then(()=>!c.isUnmounted&&G()):G()}else{const G=c.subTree=wn(c);L(null,G,p,g,c,h,v),u.el=G.el}if(D&&fe(D,h),!k&&(T=A&&A.onVnodeMounted)){const G=u;fe(()=>Ae(T,V,G),h)}(u.shapeFlag&256||V&&Yt(V.vnode)&&V.vnode.shapeFlag&256)&&c.a&&fe(c.a,h),c.isMounted=!0,u=p=g=null}},x=c.effect=new Qn(b,()=>is(m),c.scope),m=c.update=()=>x.run();m.id=c.uid,Je(c,!0),m()},Z=(c,u,p)=>{u.component=c;const g=c.vnode.props;c.vnode=u,c.next=null,$i(c,u.props,g,p),ki(c,u.children,p),bt(),Ts(),vt()},K=(c,u,p,g,h,v,C,b,x=!1)=>{const m=c&&c.children,T=c?c.shapeFlag:0,w=u.children,{patchFlag:A,shapeFlag:M}=u;if(A>0){if(A&128){Dt(m,w,p,g,h,v,C,b,x);return}else if(A&256){ze(m,w,p,g,h,v,C,b,x);return}}M&8?(T&16&&Me(m,h,v),w!==m&&d(p,w)):T&16?M&16?Dt(m,w,p,g,h,v,C,b,x):Me(m,h,v,!0):(T&8&&d(p,""),M&16&&N(w,p,g,h,v,C,b,x))},ze=(c,u,p,g,h,v,C,b,x)=>{c=c||ft,u=u||ft;const m=c.length,T=u.length,w=Math.min(m,T);let A;for(A=0;AT?Me(c,h,v,!0,!1,w):N(u,p,g,h,v,C,b,x,w)},Dt=(c,u,p,g,h,v,C,b,x)=>{let m=0;const T=u.length;let w=c.length-1,A=T-1;for(;m<=w&&m<=A;){const M=c[m],D=u[m]=x?ke(u[m]):Pe(u[m]);if(ct(M,D))L(M,D,p,null,h,v,C,b,x);else break;m++}for(;m<=w&&m<=A;){const M=c[w],D=u[A]=x?ke(u[A]):Pe(u[A]);if(ct(M,D))L(M,D,p,null,h,v,C,b,x);else break;w--,A--}if(m>w){if(m<=A){const M=A+1,D=MA)for(;m<=w;)Ee(c[m],h,v,!0),m++;else{const M=m,D=m,V=new Map;for(m=D;m<=A;m++){const de=u[m]=x?ke(u[m]):Pe(u[m]);de.key!=null&&V.set(de.key,m)}let k,G=0;const _e=A-D+1;let it=!1,ps=0;const xt=new Array(_e);for(m=0;m<_e;m++)xt[m]=0;for(m=M;m<=w;m++){const de=c[m];if(G>=_e){Ee(de,h,v,!0);continue}let Te;if(de.key!=null)Te=V.get(de.key);else for(k=D;k<=A;k++)if(xt[k-D]===0&&ct(de,u[k])){Te=k;break}Te===void 0?Ee(de,h,v,!0):(xt[Te-D]=m+1,Te>=ps?ps=Te:it=!0,L(de,u[Te],p,null,h,v,C,b,x),G++)}const hs=it?Wi(xt):ft;for(k=hs.length-1,m=_e-1;m>=0;m--){const de=D+m,Te=u[de],gs=de+1{const{el:v,type:C,transition:b,children:x,shapeFlag:m}=c;if(m&6){qe(c.component.subTree,u,p,g);return}if(m&128){c.suspense.move(u,p,g);return}if(m&64){C.move(c,u,p,rt);return}if(C===ce){s(v,u,p);for(let w=0;wb.enter(v),h);else{const{leave:w,delayLeave:A,afterLeave:M}=b,D=()=>s(v,u,p),V=()=>{w(v,()=>{D(),M&&M()})};A?A(v,D,V):V()}else s(v,u,p)},Ee=(c,u,p,g=!1,h=!1)=>{const{type:v,props:C,ref:b,children:x,dynamicChildren:m,shapeFlag:T,patchFlag:w,dirs:A}=c;if(b!=null&&Kn(b,null,p,c,!0),T&256){u.ctx.deactivate(c);return}const M=T&1&&A,D=!Yt(c);let V;if(D&&(V=C&&C.onVnodeBeforeUnmount)&&Ae(V,u,c),T&6)nr(c.component,p,g);else{if(T&128){c.suspense.unmount(p,g);return}M&&Ye(c,null,u,"beforeUnmount"),T&64?c.type.remove(c,u,p,h,rt,g):m&&(v!==ce||w>0&&w&64)?Me(m,u,p,!1,!0):(v===ce&&w&384||!h&&T&16)&&Me(x,u,p),g&&as(c)}(D&&(V=C&&C.onVnodeUnmounted)||M)&&fe(()=>{V&&Ae(V,u,c),M&&Ye(c,null,u,"unmounted")},p)},as=c=>{const{type:u,el:p,anchor:g,transition:h}=c;if(u===ce){tr(p,g);return}if(u===Xt){I(c);return}const v=()=>{o(p),h&&!h.persisted&&h.afterLeave&&h.afterLeave()};if(c.shapeFlag&1&&h&&!h.persisted){const{leave:C,delayLeave:b}=h,x=()=>C(p,v);b?b(c.el,v,x):x()}else v()},tr=(c,u)=>{let p;for(;c!==u;)p=y(c),o(c),c=p;o(u)},nr=(c,u,p)=>{const{bum:g,scope:h,update:v,subTree:C,um:b}=c;g&&qt(g),h.stop(),v&&(v.active=!1,Ee(C,c,u,p)),b&&fe(b,u),fe(()=>{c.isUnmounted=!0},u),u&&u.pendingBranch&&!u.isUnmounted&&c.asyncDep&&!c.asyncResolved&&c.suspenseId===u.pendingId&&(u.deps--,u.deps===0&&u.resolve())},Me=(c,u,p,g=!1,h=!1,v=0)=>{for(let C=v;Cc.shapeFlag&6?jt(c.component.subTree):c.shapeFlag&128?c.suspense.next():y(c.anchor||c.el),ds=(c,u,p)=>{c==null?u._vnode&&Ee(u._vnode,null,null,!0):L(u._vnode||null,c,u,null,null,null,p),Ts(),To(),u._vnode=c},rt={p:L,um:Ee,m:qe,r:as,mt:ae,mc:N,pc:K,pbc:z,n:jt,o:e};let yn,xn;return t&&([yn,xn]=t(rt)),{render:ds,hydrate:yn,createApp:Di(ds,yn)}}function Je({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function Wo(e,t,n=!1){const s=e.children,o=t.children;if(P(s)&&P(o))for(let r=0;r>1,e[n[l]]0&&(t[s]=n[r-1]),n[r]=s)}}for(r=n.length,i=n[r-1];r-- >0;)n[r]=i,i=t[i];return n}const zi=e=>e.__isTeleport,ce=Symbol.for("v-fgt"),_n=Symbol.for("v-txt"),gt=Symbol.for("v-cmt"),Xt=Symbol.for("v-stc"),Pt=[];let ye=null;function Fe(e=!1){Pt.push(ye=e?null:[])}function qi(){Pt.pop(),ye=Pt[Pt.length-1]||null}let Lt=1;function Ns(e){Lt+=e}function Yi(e){return e.dynamicChildren=Lt>0?ye||ft:null,qi(),Lt>0&&ye&&ye.push(e),e}function Se(e,t,n,s,o,r){return Yi(F(e,t,n,s,o,r,!0))}function Ji(e){return e?e.__v_isVNode===!0:!1}function ct(e,t){return e.type===t.type&&e.key===t.key}const bn="__vInternal",zo=({key:e})=>e??null,Zt=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?ee(e)||ie(e)||S(e)?{i:he,r:e,k:t,f:!!n}:e:null);function F(e,t=null,n=null,s=0,o=null,r=e===ce?0:1,i=!1,l=!1){const f={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&zo(t),ref:t&&Zt(t),scopeId:gn,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:r,patchFlag:s,dynamicProps:o,dynamicChildren:null,appContext:null,ctx:he};return l?(fs(f,n),r&128&&e.normalize(f)):n&&(f.shapeFlag|=ee(n)?8:16),Lt>0&&!i&&ye&&(f.patchFlag>0||r&6)&&f.patchFlag!==32&&ye.push(f),f}const Ie=Xi;function Xi(e,t=null,n=null,s=0,o=null,r=!1){if((!e||e===Oi)&&(e=gt),Ji(e)){const l=ot(e,t,!0);return n&&fs(l,n),Lt>0&&!r&&ye&&(l.shapeFlag&6?ye[ye.indexOf(e)]=l:ye.push(l)),l.patchFlag|=-2,l}if(cl(e)&&(e=e.__vccOpts),t){t=Zi(t);let{class:l,style:f}=t;l&&!ee(l)&&(t.class=un(l)),W(f)&&(bo(f)&&!P(f)&&(f=Q({},f)),t.style=Xn(f))}const i=ee(e)?1:di(e)?128:zi(e)?64:W(e)?4:S(e)?2:0;return F(e,t,n,s,o,i,r,!0)}function Zi(e){return e?bo(e)||bn in e?Q({},e):e:null}function ot(e,t,n=!1){const{props:s,ref:o,patchFlag:r,children:i}=e,l=t?Gi(s||{},t):s;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:l,key:l&&zo(l),ref:t&&t.ref?n&&o?P(o)?o.concat(Zt(t)):[o,Zt(t)]:Zt(t):o,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:i,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==ce?r===-1?16:r|16:r,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&ot(e.ssContent),ssFallback:e.ssFallback&&ot(e.ssFallback),el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce}}function tt(e=" ",t=0){return Ie(_n,null,e,t)}function Qi(e,t){const n=Ie(Xt,null,e);return n.staticCount=t,n}function Pe(e){return e==null||typeof e=="boolean"?Ie(gt):P(e)?Ie(ce,null,e.slice()):typeof e=="object"?ke(e):Ie(_n,null,String(e))}function ke(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:ot(e)}function fs(e,t){let n=0;const{shapeFlag:s}=e;if(t==null)t=null;else if(P(t))n=16;else if(typeof t=="object")if(s&65){const o=t.default;o&&(o._c&&(o._d=!1),fs(e,o()),o._c&&(o._d=!0));return}else{n=32;const o=t._;!o&&!(bn in t)?t._ctx=he:o===3&&he&&(he.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else S(t)?(t={default:t,_ctx:he},n=32):(t=String(t),s&64?(n=16,t=[tt(t)]):n=8);e.children=t,e.shapeFlag|=n}function Gi(...e){const t={};for(let n=0;nse||he;let us,lt,Ds="__VUE_INSTANCE_SETTERS__";(lt=Mn()[Ds])||(lt=Mn()[Ds]=[]),lt.push(e=>se=e),us=e=>{lt.length>1?lt.forEach(t=>t(e)):lt[0](e)};const mt=e=>{us(e),e.scope.on()},st=()=>{se&&se.scope.off(),us(null)};function qo(e){return e.vnode.shapeFlag&4}let Rt=!1;function ol(e,t=!1){Rt=t;const{props:n,children:s}=e.vnode,o=qo(e);Bi(e,n,o,t),Hi(e,s);const r=o?rl(e,t):void 0;return Rt=!1,r}function rl(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=vo(new Proxy(e.ctx,Ii));const{setup:s}=n;if(s){const o=e.setupContext=s.length>1?ll(e):null;mt(e),bt();const r=Ve(s,e,0,[e.props,o]);if(vt(),st(),eo(r)){if(r.then(st,st),t)return r.then(i=>{js(e,i,t)}).catch(i=>{pn(i,e,0)});e.asyncDep=r}else js(e,r,t)}else Yo(e,t)}function js(e,t,n){S(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:W(t)&&(e.setupState=Co(t)),Yo(e,n)}let Bs;function Yo(e,t,n){const s=e.type;if(!e.render){if(!t&&Bs&&!s.render){const o=s.template||ls(e).template;if(o){const{isCustomElement:r,compilerOptions:i}=e.appContext.config,{delimiters:l,compilerOptions:f}=s,a=Q(Q({isCustomElement:r,delimiters:l},i),f);s.render=Bs(o,a)}}e.render=s.render||xe}mt(e),bt(),Mi(e),vt(),st()}function il(e){return e.attrsProxy||(e.attrsProxy=new Proxy(e.attrs,{get(t,n){return ue(e,"get","$attrs"),t[n]}}))}function ll(e){const t=n=>{e.exposed=n||{}};return{get attrs(){return il(e)},slots:e.slots,emit:e.emit,expose:t}}function vn(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(Co(vo(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in At)return At[n](e)},has(t,n){return n in t||n in At}}))}function cl(e){return S(e)&&"__vccOpts"in e}const Vn=(e,t)=>Qr(e,t,Rt),fl=Symbol.for("v-scx"),ul=()=>Jt(fl),al="3.3.4",dl="http://www.w3.org/2000/svg",Qe=typeof document<"u"?document:null,$s=Qe&&Qe.createElement("template"),pl={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,s)=>{const o=t?Qe.createElementNS(dl,e):Qe.createElement(e,n?{is:n}:void 0);return e==="select"&&s&&s.multiple!=null&&o.setAttribute("multiple",s.multiple),o},createText:e=>Qe.createTextNode(e),createComment:e=>Qe.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Qe.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},insertStaticContent(e,t,n,s,o,r){const i=n?n.previousSibling:t.lastChild;if(o&&(o===r||o.nextSibling))for(;t.insertBefore(o.cloneNode(!0),n),!(o===r||!(o=o.nextSibling)););else{$s.innerHTML=s?`${e}`:e;const l=$s.content;if(s){const f=l.firstChild;for(;f.firstChild;)l.appendChild(f.firstChild);l.removeChild(f)}t.insertBefore(l,n)}return[i?i.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}};function hl(e,t,n){const s=e._vtc;s&&(t=(t?[t,...s]:[...s]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}function gl(e,t,n){const s=e.style,o=ee(n);if(n&&!o){if(t&&!ee(t))for(const r in t)n[r]==null&&Wn(s,r,"");for(const r in n)Wn(s,r,n[r])}else{const r=s.display;o?t!==n&&(s.cssText=n):t&&e.removeAttribute("style"),"_vod"in e&&(s.display=r)}}const Us=/\s*!important$/;function Wn(e,t,n){if(P(n))n.forEach(s=>Wn(e,t,s));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const s=ml(e,t);Us.test(n)?e.setProperty(_t(s),n.replace(Us,""),"important"):e[s]=n}}const Hs=["Webkit","Moz","ms"],An={};function ml(e,t){const n=An[t];if(n)return n;let s=pt(t);if(s!=="filter"&&s in e)return An[t]=s;s=so(s);for(let o=0;oPn||(Cl.then(()=>Pn=0),Pn=Date.now());function El(e,t){const n=s=>{if(!s._vts)s._vts=Date.now();else if(s._vts<=n.attached)return;ge(Tl(s,n.value),t,5,[s])};return n.value=e,n.attached=wl(),n}function Tl(e,t){if(P(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(s=>o=>!o._stopped&&s&&s(o))}else return t}const Vs=/^on[a-z]/,Al=(e,t,n,s,o=!1,r,i,l,f)=>{t==="class"?hl(e,s,o):t==="style"?gl(e,n,s):ln(t)?qn(t)||yl(e,t,n,s,i):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Pl(e,t,s,o))?bl(e,t,s,r,i,l,f):(t==="true-value"?e._trueValue=s:t==="false-value"&&(e._falseValue=s),_l(e,t,s,o))};function Pl(e,t,n,s){return s?!!(t==="innerHTML"||t==="textContent"||t in e&&Vs.test(t)&&S(n)):t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Vs.test(t)&&ee(n)?!1:t in e}const Ue="transition",wt="animation",Jo={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String},Ol=Q({},mi,Jo),Xe=(e,t=[])=>{P(e)?e.forEach(n=>n(...t)):e&&e(...t)},Ws=e=>e?P(e)?e.some(t=>t.length>1):e.length>1:!1;function Il(e){const t={};for(const E in e)E in Jo||(t[E]=e[E]);if(e.css===!1)return t;const{name:n="v",type:s,duration:o,enterFromClass:r=`${n}-enter-from`,enterActiveClass:i=`${n}-enter-active`,enterToClass:l=`${n}-enter-to`,appearFromClass:f=r,appearActiveClass:a=i,appearToClass:d=l,leaveFromClass:_=`${n}-leave-from`,leaveActiveClass:y=`${n}-leave-active`,leaveToClass:O=`${n}-leave-to`}=e,U=Ml(o),L=U&&U[0],j=U&&U[1],{onBeforeEnter:B,onEnter:R,onEnterCancelled:Y,onLeave:I,onLeaveCancelled:te,onBeforeAppear:Ce=B,onAppear:we=R,onAppearCancelled:N=Y}=t,X=(E,J,ae)=>{He(E,J?d:l),He(E,J?a:i),ae&&ae()},z=(E,J)=>{E._isLeaving=!1,He(E,_),He(E,O),He(E,y),J&&J()},oe=E=>(J,ae)=>{const yt=E?we:R,ne=()=>X(J,E,ae);Xe(yt,[J,ne]),zs(()=>{He(J,E?f:r),Le(J,E?d:l),Ws(yt)||qs(J,s,L,ne)})};return Q(t,{onBeforeEnter(E){Xe(B,[E]),Le(E,r),Le(E,i)},onBeforeAppear(E){Xe(Ce,[E]),Le(E,f),Le(E,a)},onEnter:oe(!1),onAppear:oe(!0),onLeave(E,J){E._isLeaving=!0;const ae=()=>z(E,J);Le(E,_),Zo(),Le(E,y),zs(()=>{E._isLeaving&&(He(E,_),Le(E,O),Ws(I)||qs(E,s,j,ae))}),Xe(I,[E,ae])},onEnterCancelled(E){X(E,!1),Xe(Y,[E])},onAppearCancelled(E){X(E,!0),Xe(N,[E])},onLeaveCancelled(E){z(E),Xe(te,[E])}})}function Ml(e){if(e==null)return null;if(W(e))return[On(e.enter),On(e.leave)];{const t=On(e);return[t,t]}}function On(e){return fr(e)}function Le(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e._vtc||(e._vtc=new Set)).add(t)}function He(e,t){t.split(/\s+/).forEach(s=>s&&e.classList.remove(s));const{_vtc:n}=e;n&&(n.delete(t),n.size||(e._vtc=void 0))}function zs(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let Fl=0;function qs(e,t,n,s){const o=e._endId=++Fl,r=()=>{o===e._endId&&s()};if(n)return setTimeout(r,n);const{type:i,timeout:l,propCount:f}=Xo(e,t);if(!i)return s();const a=i+"end";let d=0;const _=()=>{e.removeEventListener(a,y),r()},y=O=>{O.target===e&&++d>=f&&_()};setTimeout(()=>{d(n[U]||"").split(", "),o=s(`${Ue}Delay`),r=s(`${Ue}Duration`),i=Ys(o,r),l=s(`${wt}Delay`),f=s(`${wt}Duration`),a=Ys(l,f);let d=null,_=0,y=0;t===Ue?i>0&&(d=Ue,_=i,y=r.length):t===wt?a>0&&(d=wt,_=a,y=f.length):(_=Math.max(i,a),d=_>0?i>a?Ue:wt:null,y=d?d===Ue?r.length:f.length:0);const O=d===Ue&&/\b(transform|all)(,|$)/.test(s(`${Ue}Property`).toString());return{type:d,timeout:_,propCount:y,hasTransform:O}}function Ys(e,t){for(;e.lengthJs(n)+Js(e[s])))}function Js(e){return Number(e.slice(0,-1).replace(",","."))*1e3}function Zo(){return document.body.offsetHeight}const Qo=new WeakMap,Go=new WeakMap,er={name:"TransitionGroup",props:Q({},Ol,{tag:String,moveClass:String}),setup(e,{slots:t}){const n=sl(),s=gi();let o,r;return No(()=>{if(!o.length)return;const i=e.moveClass||`${e.name||"v"}-move`;if(!jl(o[0].el,n.vnode.el,i))return;o.forEach(Rl),o.forEach(Nl);const l=o.filter(Dl);Zo(),l.forEach(f=>{const a=f.el,d=a.style;Le(a,i),d.transform=d.webkitTransform=d.transitionDuration="";const _=a._moveCb=y=>{y&&y.target!==a||(!y||/transform$/.test(y.propertyName))&&(a.removeEventListener("transitionend",_),a._moveCb=null,He(a,i))};a.addEventListener("transitionend",_)})}),()=>{const i=H(e),l=Il(i);let f=i.tag||ce;o=r,r=t.default?Fo(t.default()):[];for(let a=0;adelete e.mode;er.props;const Ll=er;function Rl(e){const t=e.el;t._moveCb&&t._moveCb(),t._enterCb&&t._enterCb()}function Nl(e){Go.set(e,e.el.getBoundingClientRect())}function Dl(e){const t=Qo.get(e),n=Go.get(e),s=t.left-n.left,o=t.top-n.top;if(s||o){const r=e.el.style;return r.transform=r.webkitTransform=`translate(${s}px,${o}px)`,r.transitionDuration="0s",e}}function jl(e,t,n){const s=e.cloneNode();e._vtc&&e._vtc.forEach(i=>{i.split(/\s+/).forEach(l=>l&&s.classList.remove(l))}),n.split(/\s+/).forEach(i=>i&&s.classList.add(i)),s.style.display="none";const o=t.nodeType===1?t:t.parentNode;o.appendChild(s);const{hasTransform:r}=Xo(s);return o.removeChild(s),r}const on=e=>{const t=e.props["onUpdate:modelValue"]||!1;return P(t)?n=>qt(t,n):t};function Bl(e){e.target.composing=!0}function Xs(e){const t=e.target;t.composing&&(t.composing=!1,t.dispatchEvent(new Event("input")))}const In={created(e,{modifiers:{lazy:t,trim:n,number:s}},o){e._assign=on(o);const r=s||o.props&&o.props.type==="number";Ge(e,t?"change":"input",i=>{if(i.target.composing)return;let l=e.value;n&&(l=l.trim()),r&&(l=Gt(l)),e._assign(l)}),n&&Ge(e,"change",()=>{e.value=e.value.trim()}),t||(Ge(e,"compositionstart",Bl),Ge(e,"compositionend",Xs),Ge(e,"change",Xs))},mounted(e,{value:t}){e.value=t??""},beforeUpdate(e,{value:t,modifiers:{lazy:n,trim:s,number:o}},r){if(e._assign=on(r),e.composing||document.activeElement===e&&e.type!=="range"&&(n||s&&e.value.trim()===t||(o||e.type==="number")&&Gt(e.value)===t))return;const i=t??"";e.value!==i&&(e.value=i)}},$l={deep:!0,created(e,{value:t,modifiers:{number:n}},s){const o=cn(t);Ge(e,"change",()=>{const r=Array.prototype.filter.call(e.options,i=>i.selected).map(i=>n?Gt(rn(i)):rn(i));e._assign(e.multiple?o?new Set(r):r:r[0])}),e._assign=on(s)},mounted(e,{value:t}){Zs(e,t)},beforeUpdate(e,t,n){e._assign=on(n)},updated(e,{value:t}){Zs(e,t)}};function Zs(e,t){const n=e.multiple;if(!(n&&!P(t)&&!cn(t))){for(let s=0,o=e.options.length;s-1:r.selected=t.has(i);else if(an(rn(r),t)){e.selectedIndex!==s&&(e.selectedIndex=s);return}}!n&&e.selectedIndex!==-1&&(e.selectedIndex=-1)}}function rn(e){return"_value"in e?e._value:e.value}const Ul=Q({patchProp:Al},pl);let Qs;function Hl(){return Qs||(Qs=Ki(Ul))}const kl=(...e)=>{const t=Hl().createApp(...e),{mount:n}=t;return t.mount=s=>{const o=Kl(s);if(!o)return;const r=t._component;!S(r)&&!r.render&&!r.template&&(r.template=o.innerHTML),o.innerHTML="";const i=n(o,!1,o instanceof SVGElement);return o instanceof Element&&(o.removeAttribute("v-cloak"),o.setAttribute("data-v-app","")),i},t};function Kl(e){return ee(e)?document.querySelector(e):e}const Vl=""+new URL("vue-5532db34.svg",import.meta.url).href,Wl=["backDown","backLeft","backRight","backUp"],zl=["bounce","bounceDown","bounceLeft","bounceRight","bounceUp"],ql=["fade","fadeBottomLeft","fadeBottomRight","fadeDown","fadeDownBig","fadeLeft","fadeLeftBig","fadeRight","fadeRightBig","fadeTopLeft","fadeTopRight","fadeUp","fadeUpBig"],Yl=["flip","flipX","flipY"],Jl=["lightSpeedLeft","lightSpeedRight"],Xl=["rotate","rotateDownLeft","rotateDownRight","rotateUpLeft","rotateUpRight"],Zl=["slideDown","slideLeft","slideRight","slideUp"],Ql=["roll"],Gl=["zoom","zoomDown","zoomLeft","zoomRight","zoomUp"],ec={back:Wl,bounce:zl,fade:ql,flip:Yl,lightSpeed:Jl,rotate:Xl,slide:Zl,roll:Ql,zoom:Gl},tc=["bounce","flash","headShake","heartBeat","jello","pulse","rubberBand","shakeX","shakeY","swing","tada","wobble"];function me(e,t,n=void 0,s={}){return typeof n=="number"||typeof n=="string"?s.duration=n:n!=null&&(s=n),new Promise(o=>{const r=oc(e);e.addEventListener("animationend",()=>{e.classList.remove("animate__animated","animate__"+t),sc(e,r),o()},{once:!0}),nc(e,s),e.classList.add("animate__animated","animate__"+t)})}function nc(e,t){t.duration&&e.style.setProperty("animation-duration",String(t.duration)),t.delay&&e.style.setProperty("animation-delay",String(t.delay)),t.iterationCount&&e.style.setProperty("animation-iteration-count",String(t.iterationCount)),t.direction&&e.style.setProperty("animation-direction",t.direction),t.fillMode&&e.style.setProperty("animation-fill-mode",t.fillMode)}function sc(e,t){for(const n in t){const s=t[n];s===""?e.style.removeProperty(n):e.style.setProperty(n,s)}}function oc(e){const t={};return t["animation-duration"]=e.style.getPropertyValue("animation-duration"),t["animation-delay"]=e.style.getPropertyValue("animation-delay"),t["animation-iteration-count"]=e.style.getPropertyValue("animation-iteration-count"),t["animation-direction"]=e.style.getPropertyValue("animation-direction"),t["animation-fill-mode"]=e.style.getPropertyValue("animation-fill-mode"),t}function rc(e,t=void 0,n={}){return me(e,"bounce",t,n)}function ic(e,t=void 0,n={}){return me(e,"flash",t,n)}function lc(e,t=void 0,n={}){return me(e,"headShake",t,n)}function cc(e,t=void 0,n={}){return me(e,"heartBeat",t,n)}function fc(e,t=void 0,n={}){return me(e,"jello",t,n)}function uc(e,t=void 0,n={}){return me(e,"pulse",t,n)}function ac(e,t=void 0,n={}){return me(e,"rubberBand",t,n)}function dc(e,t=void 0,n={}){return me(e,"shakeX",t,n)}function pc(e,t=void 0,n={}){return me(e,"shakeY",t,n)}function hc(e,t=void 0,n={}){return me(e,"swing",t,n)}function gc(e,t=void 0,n={}){return me(e,"tada",t,n)}function mc(e,t=void 0,n={}){return me(e,"wobble",t,n)}const _c=Object.freeze(Object.defineProperty({__proto__:null,bounce:rc,flash:ic,headShake:lc,heartBeat:cc,jello:fc,pulse:uc,rubberBand:ac,shakeX:dc,shakeY:pc,swing:hc,tada:gc,wobble:mc},Symbol.toStringTag,{value:"Module"})),je=e=>(ii("data-v-93d30ca4"),e=e(),li(),e),bc={class:"container pb-5"},vc=Qi('

    Vue-Animate.css

    A Vue.js port of Animate.css. For use with Vue's built-in transitions

    GitHub NPM Documentation MIT License
    ',1),yc={id:"transition-demo",class:"",style:{"margin-top":"85px"}},xc=je(()=>F("header",{class:"text-center mb-5"},[F("h2",{id:"transitions",class:"display-5"},"Transitions")],-1)),Cc={class:"row"},wc={class:"col-md-5"},Ec=je(()=>F("h3",{style:{"margin-top":"0","margin-bottom":".7em"}},"Select an effect to DEMO",-1)),Tc={class:"form-group"},Ac=["label"],Pc=["value"],Oc={class:"code-sample mt-4"},Ic={class:"p-3 rounded",style:{"background-color":"var(--bs-gray-800)"}},Mc=je(()=>F("span",null,"{{ item }}",-1)),Fc={id:"demo-component",class:"col-md-7"},Sc={class:"text-toolbar d-flex gap-2"},Lc={class:"input-group"},Rc=je(()=>F("i",{class:"fa fa-plus"},null,-1)),Nc=je(()=>F("i",{class:"fa fa-trash"},null,-1)),Dc={class:"list-box",style:{"margin-top":"30px"}},jc={id:"attentions-demo",style:{"margin-top":"75px"}},Bc={class:"text-center mb-5"},$c=je(()=>F("p",{class:"mt-3"},"Click a button to demo the animations.",-1)),Uc={class:""},Hc={class:"d-flex justify-content-center gap-3 mb-4"},kc=["onClick"],Kc={class:"d-flex justify-content-center gap-5"},Vc={class:"form-floating mb-3"},Wc=je(()=>F("label",{for:"input-duration"},"Duration",-1)),zc={class:"form-floating mb-3"},qc=je(()=>F("label",{for:"input-delay"},"Delay",-1)),Yc={class:"mt-5"},Jc={class:"code-sample mx-auto",style:{"max-width":"600px"}},Xc={class:"p-3 rounded",style:{"background-color":"var(--bs-gray-800)"}},Zc=je(()=>F("footer",{class:"",style:{"margin-top":"85px"}},[F("div",{class:"container text-center"},[tt(" Made with "),F("i",{class:"fa fa-heart text-danger"}),tt(" by "),F("a",{class:"link-light",href:"https://simular.co"},"SIMULAR")])],-1)),Gs="Lorem ipsum dolor sit amet consectetur adipiscing elit Duis vestibulum tincidunt turpis Etiam eget eleifend elit In et vestibulum ipsum Donec eu convallis urna Pellentesque sit amet accumsan leo Aliquam elementum justo turpis mollis maximus libero faucibus non Vivamus et eros libero",Qc=bi({__name:"App",setup(e){let t=Gs.split(" ");const n=$e("fade"),s=$e(t.shift()),o=$e(["Sakura","Sunflower","Rose"]);function r(){s.value&&(o.value.unshift(s.value),s.value=t.shift()||"",t.length||(t=Gs.split(" ")))}function i(){o.value=[]}const l=$e(),f=$e("bounce"),a=$e(""),d=$e(""),_=$e(!1),y=Vn(()=>{if(a.value===""&&d.value==="")return"";const j=[];if(a.value!==""){let B=U(a.value)?a.value:`'${a.value}'`;j.push(`duration: ${B}`)}if(d.value!==""){let B=U(d.value)?d.value:`'${d.value}'`;j.push(`delay: ${B}`)}return j.length===0?"":", { "+j.join(", ")+" }"}),O=Vn(()=>`import { ${f.value} } from 'vue-animate.css'; 2 | 3 | const el = ref(); 4 | 5 | ${f.value}(el.value!${y.value}); 6 | `);function U(j){return!isNaN(Number(j))&&!isNaN(parseFloat(j))}async function L(j){f.value=j,_.value=!0,await _c[j](l.value,{duration:a.value,delay:d.value}),_.value=!1}return(j,B)=>(Fe(),Se("div",bc,[vc,F("section",yc,[xc,F("div",Cc,[F("div",wc,[Ec,F("div",Tc,[Vt(F("select",{name:"effect","onUpdate:modelValue":B[0]||(B[0]=R=>n.value=R),class:"form-select"},[(Fe(!0),Se(ce,null,Wt(Nn(ec),(R,Y)=>(Fe(),Se("optgroup",{label:Y},[(Fe(!0),Se(ce,null,Wt(R,I=>(Fe(),Se("option",{value:I},Ct(I),9,Pc))),256))],8,Ac))),256))],512),[[$l,n.value]])]),F("div",Oc,[F("pre",Ic,[F("code",null,[tt(' 7 |
  • 8 | `,1),Mc,tt(` 9 |
    • 10 |     `)])])])]),F("div",Fc,[F("div",Sc,[F("div",Lc,[Vt(F("input",{type:"text",class:"form-control","onUpdate:modelValue":B[1]||(B[1]=R=>s.value=R)},null,512),[[In,s.value]]),F("button",{type:"button",class:"btn btn-success text-nowrap",onClick:r,style:{width:"150px"}},[Rc,tt(" Add ")])]),F("button",{type:"button",class:"btn btn-danger text-nowrap",onClick:i},[Nc,tt(" Reset ")])]),F("div",Dc,[Ie(Ll,{name:n.value,tag:"div",class:"list-group"},{default:Oo(()=>[(Fe(!0),Se(ce,null,Wt(o.value,R=>(Fe(),Se("div",{class:"list-group-item",key:R},Ct(R),1))),128))]),_:1},8,["name"])])])])]),F("section",jc,[F("header",Bc,[F("h2",{class:"display-5 attentions",ref_key:"attentionTitle",ref:l},"Attentions",512),$c]),F("div",Uc,[F("div",Hc,[(Fe(!0),Se(ce,null,Wt(Nn(tc),R=>(Fe(),Se("button",{class:un(["btn btn-outline-light",{active:f.value===R&&_.value}]),onClick:Y=>L(R)},Ct(R),11,kc))),256))]),F("div",Kc,[F("div",Vc,[Vt(F("input",{type:"text",class:"form-control",id:"input-duration","onUpdate:modelValue":B[2]||(B[2]=R=>a.value=R),placeholder:"Can be '2s' or 2000"},null,512),[[In,a.value]]),Wc]),F("div",zc,[Vt(F("input",{type:"text",class:"form-control",id:"input-delay","onUpdate:modelValue":B[3]||(B[3]=R=>d.value=R),placeholder:"Can be '2s' or 2000"},null,512),[[In,d.value]]),qc])])]),F("div",Yc,[F("div",Jc,[F("pre",Xc,[F("code",null,Ct(O.value),1)])])])]),Zc]))}});const Gc=(e,t)=>{const n=e.__vccOpts||e;for(const[s,o]of t)n[s]=o;return n},ef=Gc(Qc,[["__scopeId","data-v-93d30ca4"]]);kl(ef).mount("#app"); 11 | -------------------------------------------------------------------------------- /docs/assets/vue-5532db34.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vue-animate (Vue3 | Vue2) | For Vue.js transitions 8 | 9 | 10 | 15 | 20 | 25 | 26 | 27 | 34 | 35 | 36 | 37 | 38 |
    39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /docs/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vue-animate (Vue3 | Vue2) | For Vue.js transitions 8 | 9 | 10 | 15 | 20 | 25 | 26 | 27 | 34 | 35 | 36 |
    37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@asika32764/vue-animate", 3 | "homepage": "https://github.com/asika32764/vue-animate", 4 | "version": "3.0.2", 5 | "license": "MIT", 6 | "css": "dist/vue-animate.css", 7 | "main": "dist/vue-animate.cjs", 8 | "browser": "dist/vue-animate.umd.js", 9 | "module": "dist/vue-animate.es.js", 10 | "typings": "dist/index.d.ts", 11 | "scripts": { 12 | "dev": "vite", 13 | "build": "rollup -c", 14 | "build:prod": "NODE_ENV=production rollup -c", 15 | "build:docs": "vue-tsc && vite build", 16 | "preview": "vite preview", 17 | "generate": "ts-node -T --esm bin/generate.ts" 18 | }, 19 | "devDependencies": { 20 | "@rollup/plugin-node-resolve": "^15.2.1", 21 | "@rollup/plugin-typescript": "^11.1.3", 22 | "@types/lodash-es": "^4.17.9", 23 | "@types/node": "^20.6.2", 24 | "@vitejs/plugin-vue": "^4.2.3", 25 | "animate.css": "^4.1.1", 26 | "lodash-es": "^4.17.21", 27 | "minimist": "^1.2.8", 28 | "postcss-discard-comments": "^6.0.0", 29 | "postcss-header": "^3.0.3", 30 | "postcss-import": "^15.1.0", 31 | "rollup-plugin-copy": "^3.5.0", 32 | "rollup-plugin-dts": "^6.0.2", 33 | "rollup-plugin-esbuild": "^6.0.1", 34 | "rollup-plugin-postcss": "^4.0.2", 35 | "sass": "^1.67.0", 36 | "ts-node": "^10.9.1", 37 | "tslib": "^2.6.2", 38 | "typescript": "^5.0.2", 39 | "vite": "^4.4.5", 40 | "vue": "^3.3.4", 41 | "vue-tsc": "^1.8.5" 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /public/CNAME: -------------------------------------------------------------------------------- 1 | vue-animate.simular.co -------------------------------------------------------------------------------- /public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /rollup.config.mjs: -------------------------------------------------------------------------------- 1 | import nodeResolve from '@rollup/plugin-node-resolve'; 2 | import typescript from '@rollup/plugin-typescript'; 3 | import { readFileSync } from 'fs'; 4 | import postcssDiscardComment from 'postcss-discard-comments'; 5 | import postcssHeader from 'postcss-header'; 6 | import postcssImport from 'postcss-import'; 7 | import dts from 'rollup-plugin-dts'; 8 | import { minify } from 'rollup-plugin-esbuild'; 9 | import postcss from 'rollup-plugin-postcss'; 10 | 11 | const pkg = JSON.parse(readFileSync('./package.json', 'utf8')); 12 | 13 | const header = `/*! 14 | * vue-animate.css - ${pkg.homepage} 15 | * Version: ${pkg.version} 16 | * License: MIT - see LICENSE 17 | * 18 | * This library is port of animate.css (https://github.com/animate-css/animate.css) to support Vue.js transitions. 19 | * The animate.css LICENSE please see: https://github.com/animate-css/animate.css/blob/main/LICENSE 20 | */`; 21 | 22 | // @see https://gist.github.com/aleclarson/9900ed2a9a3119d865286b218e14d226 23 | export default [ 24 | { 25 | input: 'src/animates/main.css', 26 | output: { 27 | file: pkg.css, 28 | format: 'es', 29 | sourcemap: true 30 | }, 31 | plugins: [ 32 | postcss({ 33 | // modules: true, 34 | extract: true, 35 | plugins: [ 36 | postcssImport(), 37 | postcssDiscardComment({ 38 | removeAll: true 39 | }), 40 | postcssHeader({ header }) 41 | ] 42 | }), 43 | ] 44 | }, 45 | { 46 | input: 'src/animates/main.css', 47 | output: { 48 | file: addMinToCssFilename(pkg.css), 49 | format: 'es', 50 | sourcemap: true 51 | }, 52 | plugins: [ 53 | postcss({ 54 | // modules: true, 55 | extract: true, 56 | minimize: true, 57 | plugins: [ 58 | postcssImport(), 59 | postcssDiscardComment({ 60 | removeAll: true 61 | }), 62 | postcssHeader({ header }) 63 | ] 64 | }), 65 | ] 66 | }, 67 | { 68 | input: 'src/index.ts', 69 | output: [ 70 | { 71 | file: pkg.main, 72 | format: 'cjs', 73 | sourcemap: true, 74 | }, 75 | { 76 | file: pkg.browser, 77 | format: 'umd', 78 | sourcemap: true, 79 | name: 'VueAnimate', 80 | }, 81 | { 82 | file: pkg.module, 83 | format: 'esm', 84 | sourcemap: true, 85 | }, 86 | { 87 | file: addMinToFilename(pkg.browser), 88 | format: 'umd', 89 | sourcemap: true, 90 | name: 'VueAnimate', 91 | plugins: [ 92 | minify(), 93 | ] 94 | }, 95 | { 96 | file: addMinToFilename(pkg.module), 97 | format: 'esm', 98 | sourcemap: true, 99 | plugins: [ 100 | minify(), 101 | ] 102 | } 103 | ], 104 | plugins: [ 105 | nodeResolve(), 106 | typescript({ 107 | tsconfig: './tsconfig.lib.json' 108 | }) 109 | ] 110 | }, 111 | { 112 | input: 'src/index.ts', 113 | output: { 114 | file: pkg.typings, 115 | format: 'es', 116 | }, 117 | plugins: [ 118 | dts({ 119 | tsconfig: './tsconfig.lib.json' 120 | }) 121 | ] 122 | } 123 | ]; 124 | 125 | function addMinToFilename(fileName) { 126 | return fileName.replace(/.js$/, '.min.js'); 127 | } 128 | 129 | function addMinToCssFilename(fileName) { 130 | return fileName.replace(/.css$/, '.min.css'); 131 | } 132 | -------------------------------------------------------------------------------- /src/animates/back/backDown.css: -------------------------------------------------------------------------------- 1 | .backDown-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: backInDown; 7 | } 8 | 9 | .backDown-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: backOutDown; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/back/backLeft.css: -------------------------------------------------------------------------------- 1 | .backLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: backInLeft; 7 | } 8 | 9 | .backLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: backOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/back/backRight.css: -------------------------------------------------------------------------------- 1 | .backRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: backInRight; 7 | } 8 | 9 | .backRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: backOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/back/backUp.css: -------------------------------------------------------------------------------- 1 | .backUp-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: backInUp; 7 | } 8 | 9 | .backUp-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: backOutUp; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/bounce/bounce.css: -------------------------------------------------------------------------------- 1 | .bounce-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: bounceIn; 7 | } 8 | 9 | .bounce-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: bounceOut; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/bounce/bounceDown.css: -------------------------------------------------------------------------------- 1 | .bounceDown-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: bounceInDown; 7 | } 8 | 9 | .bounceDown-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: bounceOutDown; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/bounce/bounceLeft.css: -------------------------------------------------------------------------------- 1 | .bounceLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: bounceInLeft; 7 | } 8 | 9 | .bounceLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: bounceOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/bounce/bounceRight.css: -------------------------------------------------------------------------------- 1 | .bounceRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: bounceInRight; 7 | } 8 | 9 | .bounceRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: bounceOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/bounce/bounceUp.css: -------------------------------------------------------------------------------- 1 | .bounceUp-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: bounceInUp; 7 | } 8 | 9 | .bounceUp-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: bounceOutUp; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fade.css: -------------------------------------------------------------------------------- 1 | .fade-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeIn; 7 | } 8 | 9 | .fade-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOut; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeBottomLeft.css: -------------------------------------------------------------------------------- 1 | .fadeBottomLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInBottomLeft; 7 | } 8 | 9 | .fadeBottomLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutBottomLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeBottomRight.css: -------------------------------------------------------------------------------- 1 | .fadeBottomRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInBottomRight; 7 | } 8 | 9 | .fadeBottomRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutBottomRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeDown.css: -------------------------------------------------------------------------------- 1 | .fadeDown-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInDown; 7 | } 8 | 9 | .fadeDown-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutDown; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeDownBig.css: -------------------------------------------------------------------------------- 1 | .fadeDownBig-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInDownBig; 7 | } 8 | 9 | .fadeDownBig-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutDownBig; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeLeft.css: -------------------------------------------------------------------------------- 1 | .fadeLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInLeft; 7 | } 8 | 9 | .fadeLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeLeftBig.css: -------------------------------------------------------------------------------- 1 | .fadeLeftBig-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInLeftBig; 7 | } 8 | 9 | .fadeLeftBig-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutLeftBig; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeRight.css: -------------------------------------------------------------------------------- 1 | .fadeRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInRight; 7 | } 8 | 9 | .fadeRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeRightBig.css: -------------------------------------------------------------------------------- 1 | .fadeRightBig-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInRightBig; 7 | } 8 | 9 | .fadeRightBig-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutRightBig; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeTopLeft.css: -------------------------------------------------------------------------------- 1 | .fadeTopLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInTopLeft; 7 | } 8 | 9 | .fadeTopLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutTopLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeTopRight.css: -------------------------------------------------------------------------------- 1 | .fadeTopRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInTopRight; 7 | } 8 | 9 | .fadeTopRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutTopRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeUp.css: -------------------------------------------------------------------------------- 1 | .fadeUp-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInUp; 7 | } 8 | 9 | .fadeUp-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutUp; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/fade/fadeUpBig.css: -------------------------------------------------------------------------------- 1 | .fadeUpBig-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: fadeInUpBig; 7 | } 8 | 9 | .fadeUpBig-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: fadeOutUpBig; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/flip/flip.css: -------------------------------------------------------------------------------- 1 | .flip-leave-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: flip; 7 | } 8 | -------------------------------------------------------------------------------- /src/animates/flip/flipX.css: -------------------------------------------------------------------------------- 1 | .flipX-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: flipInX; 7 | } 8 | 9 | .flipX-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: flipOutX; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/flip/flipY.css: -------------------------------------------------------------------------------- 1 | .flipY-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: flipInY; 7 | } 8 | 9 | .flipY-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: flipOutY; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/lightSpeed/lightSpeedLeft.css: -------------------------------------------------------------------------------- 1 | .lightSpeedLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: lightSpeedInLeft; 7 | } 8 | 9 | .lightSpeedLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: lightSpeedOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/lightSpeed/lightSpeedRight.css: -------------------------------------------------------------------------------- 1 | .lightSpeedRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: lightSpeedInRight; 7 | } 8 | 9 | .lightSpeedRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: lightSpeedOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/main.css: -------------------------------------------------------------------------------- 1 | 2 | @import './animate.css'; 3 | @import './back/backDown.css'; 4 | @import './back/backLeft.css'; 5 | @import './back/backRight.css'; 6 | @import './back/backUp.css'; 7 | @import './bounce/bounce.css'; 8 | @import './bounce/bounceDown.css'; 9 | @import './bounce/bounceLeft.css'; 10 | @import './bounce/bounceRight.css'; 11 | @import './bounce/bounceUp.css'; 12 | @import './fade/fade.css'; 13 | @import './fade/fadeBottomLeft.css'; 14 | @import './fade/fadeBottomRight.css'; 15 | @import './fade/fadeDown.css'; 16 | @import './fade/fadeDownBig.css'; 17 | @import './fade/fadeLeft.css'; 18 | @import './fade/fadeLeftBig.css'; 19 | @import './fade/fadeRight.css'; 20 | @import './fade/fadeRightBig.css'; 21 | @import './fade/fadeTopLeft.css'; 22 | @import './fade/fadeTopRight.css'; 23 | @import './fade/fadeUp.css'; 24 | @import './fade/fadeUpBig.css'; 25 | @import './flip/flip.css'; 26 | @import './flip/flipX.css'; 27 | @import './flip/flipY.css'; 28 | @import './lightSpeed/lightSpeedLeft.css'; 29 | @import './lightSpeed/lightSpeedRight.css'; 30 | @import './rotate/rotate.css'; 31 | @import './rotate/rotateDownLeft.css'; 32 | @import './rotate/rotateDownRight.css'; 33 | @import './rotate/rotateUpLeft.css'; 34 | @import './rotate/rotateUpRight.css'; 35 | @import './slide/slideDown.css'; 36 | @import './slide/slideLeft.css'; 37 | @import './slide/slideRight.css'; 38 | @import './slide/slideUp.css'; 39 | @import './roll/roll.css'; 40 | @import './zoom/zoom.css'; 41 | @import './zoom/zoomDown.css'; 42 | @import './zoom/zoomLeft.css'; 43 | @import './zoom/zoomRight.css'; 44 | @import './zoom/zoomUp.css'; 45 | -------------------------------------------------------------------------------- /src/animates/roll/roll.css: -------------------------------------------------------------------------------- 1 | .roll-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rollIn; 7 | } 8 | 9 | .roll-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rollOut; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/rotate/rotate.css: -------------------------------------------------------------------------------- 1 | .rotate-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rotateIn; 7 | } 8 | 9 | .rotate-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rotateOut; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/rotate/rotateDownLeft.css: -------------------------------------------------------------------------------- 1 | .rotateDownLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rotateInDownLeft; 7 | } 8 | 9 | .rotateDownLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rotateOutDownLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/rotate/rotateDownRight.css: -------------------------------------------------------------------------------- 1 | .rotateDownRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rotateInDownRight; 7 | } 8 | 9 | .rotateDownRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rotateOutDownRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/rotate/rotateUpLeft.css: -------------------------------------------------------------------------------- 1 | .rotateUpLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rotateInUpLeft; 7 | } 8 | 9 | .rotateUpLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rotateOutUpLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/rotate/rotateUpRight.css: -------------------------------------------------------------------------------- 1 | .rotateUpRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: rotateInUpRight; 7 | } 8 | 9 | .rotateUpRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: rotateOutUpRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/slide/slideDown.css: -------------------------------------------------------------------------------- 1 | .slideDown-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: slideInDown; 7 | } 8 | 9 | .slideDown-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: slideOutDown; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/slide/slideLeft.css: -------------------------------------------------------------------------------- 1 | .slideLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: slideInLeft; 7 | } 8 | 9 | .slideLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: slideOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/slide/slideRight.css: -------------------------------------------------------------------------------- 1 | .slideRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: slideInRight; 7 | } 8 | 9 | .slideRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: slideOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/slide/slideUp.css: -------------------------------------------------------------------------------- 1 | .slideUp-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: slideInUp; 7 | } 8 | 9 | .slideUp-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: slideOutUp; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/zoom/zoom.css: -------------------------------------------------------------------------------- 1 | .zoom-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: zoomIn; 7 | } 8 | 9 | .zoom-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: zoomOut; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/zoom/zoomDown.css: -------------------------------------------------------------------------------- 1 | .zoomDown-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: zoomInDown; 7 | } 8 | 9 | .zoomDown-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: zoomOutDown; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/zoom/zoomLeft.css: -------------------------------------------------------------------------------- 1 | .zoomLeft-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: zoomInLeft; 7 | } 8 | 9 | .zoomLeft-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: zoomOutLeft; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/zoom/zoomRight.css: -------------------------------------------------------------------------------- 1 | .zoomRight-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: zoomInRight; 7 | } 8 | 9 | .zoomRight-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: zoomOutRight; 15 | } 16 | -------------------------------------------------------------------------------- /src/animates/zoom/zoomUp.css: -------------------------------------------------------------------------------- 1 | .zoomUp-enter-active { 2 | animation-duration: var(--animate-duration); 3 | animation-delay: var(--animate-delay); 4 | animation-iteration-count: var(--animate-repeat); 5 | animation-fill-mode: both; 6 | animation-name: zoomInUp; 7 | } 8 | 9 | .zoomUp-leave-active { 10 | animation-duration: var(--animate-duration); 11 | animation-delay: var(--animate-delay); 12 | animation-iteration-count: var(--animate-repeat); 13 | animation-fill-mode: both; 14 | animation-name: zoomOutUp; 15 | } 16 | -------------------------------------------------------------------------------- /src/animations-list.json: -------------------------------------------------------------------------------- 1 | { 2 | "back": [ 3 | "backDown", 4 | "backLeft", 5 | "backRight", 6 | "backUp" 7 | ], 8 | "bounce": [ 9 | "bounce", 10 | "bounceDown", 11 | "bounceLeft", 12 | "bounceRight", 13 | "bounceUp" 14 | ], 15 | "fade": [ 16 | "fade", 17 | "fadeBottomLeft", 18 | "fadeBottomRight", 19 | "fadeDown", 20 | "fadeDownBig", 21 | "fadeLeft", 22 | "fadeLeftBig", 23 | "fadeRight", 24 | "fadeRightBig", 25 | "fadeTopLeft", 26 | "fadeTopRight", 27 | "fadeUp", 28 | "fadeUpBig" 29 | ], 30 | "flip": [ 31 | "flip", 32 | "flipX", 33 | "flipY" 34 | ], 35 | "lightSpeed": [ 36 | "lightSpeedLeft", 37 | "lightSpeedRight" 38 | ], 39 | "rotate": [ 40 | "rotate", 41 | "rotateDownLeft", 42 | "rotateDownRight", 43 | "rotateUpLeft", 44 | "rotateUpRight" 45 | ], 46 | "slide": [ 47 | "slideDown", 48 | "slideLeft", 49 | "slideRight", 50 | "slideUp" 51 | ], 52 | "roll": [ 53 | "roll" 54 | ], 55 | "zoom": [ 56 | "zoom", 57 | "zoomDown", 58 | "zoomLeft", 59 | "zoomRight", 60 | "zoomUp" 61 | ] 62 | } -------------------------------------------------------------------------------- /src/attention.ts: -------------------------------------------------------------------------------- 1 | export type AttentionOptions = { 2 | duration?: number | string; 3 | delay?: number | string; 4 | iterationCount?: number | string; 5 | direction?: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse'; 6 | fillMode?: 'none' | 'forwards' | 'backwards' | 'both'; 7 | }; 8 | 9 | export default function attention( 10 | el: HTMLElement, 11 | animate: string, 12 | options?: AttentionOptions, 13 | ): Promise; 14 | 15 | export default function attention( 16 | el: HTMLElement, 17 | animate: string, 18 | duration: number | string | undefined, 19 | options?: AttentionOptions, 20 | ): Promise; 21 | 22 | export default function attention( 23 | el: HTMLElement, 24 | animate: string, 25 | duration: AttentionOptions | number | string | undefined = undefined, 26 | options: AttentionOptions = {}, 27 | ): Promise { 28 | return doAttention(el, animate, duration, options); 29 | } 30 | 31 | export function doAttention( 32 | el: HTMLElement, 33 | animate: string, 34 | duration: AttentionOptions | number | string | undefined = undefined, 35 | options: AttentionOptions = {}, 36 | ): Promise { 37 | if (typeof duration === 'number' || typeof duration === 'string') { 38 | options.duration = duration; 39 | } else if (duration != undefined) { 40 | options = duration; 41 | } 42 | 43 | return new Promise((resolve) => { 44 | const rollbacks = getRollbacks(el); 45 | 46 | el.addEventListener('animationend', () => { 47 | el.classList.remove('animate__animated', 'animate__' + animate); 48 | 49 | restore(el, rollbacks); 50 | resolve(); 51 | }, { once: true }); 52 | 53 | setVariables(el, options); 54 | 55 | el.classList.add('animate__animated', 'animate__' + animate); 56 | }); 57 | } 58 | 59 | function setVariables(el: HTMLElement, options: AttentionOptions) { 60 | if (options.duration) { 61 | el.style.setProperty('animation-duration', String(options.duration)); 62 | } 63 | 64 | if (options.delay) { 65 | el.style.setProperty('animation-delay', String(options.delay)); 66 | } 67 | 68 | if (options.iterationCount) { 69 | el.style.setProperty('animation-iteration-count', String(options.iterationCount)); 70 | } 71 | 72 | if (options.direction) { 73 | el.style.setProperty('animation-direction', options.direction); 74 | } 75 | 76 | if (options.fillMode) { 77 | el.style.setProperty('animation-fill-mode', options.fillMode); 78 | } 79 | } 80 | 81 | function restore(el: HTMLElement, rollbacks: { [name: string]: string }) { 82 | for (const varName in rollbacks) { 83 | const value = rollbacks[varName]; 84 | 85 | if (value === '') { 86 | el.style.removeProperty(varName); 87 | } else { 88 | el.style.setProperty(varName, value); 89 | } 90 | } 91 | } 92 | 93 | function getRollbacks(el: HTMLElement) { 94 | const rollbacks: { [name: string]: string } = {}; 95 | 96 | rollbacks['animation-duration'] = el.style.getPropertyValue('animation-duration'); 97 | rollbacks['animation-delay'] = el.style.getPropertyValue('animation-delay'); 98 | rollbacks['animation-iteration-count'] = el.style.getPropertyValue('animation-iteration-count'); 99 | rollbacks['animation-direction'] = el.style.getPropertyValue('animation-direction'); 100 | rollbacks['animation-fill-mode'] = el.style.getPropertyValue('animation-fill-mode'); 101 | 102 | return rollbacks; 103 | } 104 | -------------------------------------------------------------------------------- /src/attentions-list.json: -------------------------------------------------------------------------------- 1 | ["bounce","flash","headShake","heartBeat","jello","pulse","rubberBand","shakeX","shakeY","swing","tada","wobble"] -------------------------------------------------------------------------------- /src/attentions/bounce.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function bounce( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function bounce( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function bounce( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'bounce', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/flash.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function flash( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function flash( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function flash( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'flash', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/headShake.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function headShake( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function headShake( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function headShake( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'headShake', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/heartBeat.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function heartBeat( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function heartBeat( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function heartBeat( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'heartBeat', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/index.ts: -------------------------------------------------------------------------------- 1 | export * from '@/attentions/bounce'; 2 | export * from '@/attentions/flash'; 3 | export * from '@/attentions/headShake'; 4 | export * from '@/attentions/heartBeat'; 5 | export * from '@/attentions/jello'; 6 | export * from '@/attentions/pulse'; 7 | export * from '@/attentions/rubberBand'; 8 | export * from '@/attentions/shakeX'; 9 | export * from '@/attentions/shakeY'; 10 | export * from '@/attentions/swing'; 11 | export * from '@/attentions/tada'; 12 | export * from '@/attentions/wobble'; -------------------------------------------------------------------------------- /src/attentions/jello.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function jello( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function jello( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function jello( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'jello', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/pulse.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function pulse( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function pulse( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function pulse( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'pulse', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/rubberBand.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function rubberBand( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function rubberBand( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function rubberBand( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'rubberBand', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/shake.ts: -------------------------------------------------------------------------------- 1 | import attention from '@/attention'; 2 | 3 | export function shake(el: HTMLElement) { 4 | return attention(el, 'shake'); 5 | } 6 | -------------------------------------------------------------------------------- /src/attentions/shakeX.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function shakeX( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function shakeX( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function shakeX( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'shakeX', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/shakeY.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function shakeY( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function shakeY( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function shakeY( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'shakeY', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/swing.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function swing( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function swing( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function swing( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'swing', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/tada.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function tada( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function tada( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function tada( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'tada', duration, options); 17 | } -------------------------------------------------------------------------------- /src/attentions/wobble.ts: -------------------------------------------------------------------------------- 1 | import { type AttentionOptions, doAttention } from '@/attention'; 2 | 3 | export function wobble( 4 | el: HTMLElement, options?: AttentionOptions, 5 | ): Promise; 6 | 7 | export function wobble( 8 | el: HTMLElement, duration?: number | string, options?: AttentionOptions, 9 | ): Promise; 10 | 11 | export function wobble( 12 | el: HTMLElement, 13 | duration: AttentionOptions | number | string | undefined = undefined, 14 | options: AttentionOptions = {}, 15 | ): Promise { 16 | return doAttention(el, 'wobble', duration, options); 17 | } -------------------------------------------------------------------------------- /src/docs/App.vue: -------------------------------------------------------------------------------- 1 | 86 | 87 | 231 | 232 | 248 | -------------------------------------------------------------------------------- /src/docs/assets/vue.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/docs/main.ts: -------------------------------------------------------------------------------- 1 | import { createApp } from 'vue'; 2 | import App from './App.vue'; 3 | import './style.css'; 4 | import '@/animates/main.css'; 5 | 6 | createApp(App).mount('#app'); 7 | -------------------------------------------------------------------------------- /src/docs/style.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asika32764/vue-animate/3b822eb809f701bfd5c6c304b8331afff70fcc1c/src/docs/style.css -------------------------------------------------------------------------------- /src/docs/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | export { default as attention, type AttentionOptions } from './attention'; 2 | export * from './attentions'; 3 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES2020", 4 | "useDefineForClassFields": true, 5 | "module": "ESNext", 6 | "lib": ["ES2020", "DOM", "DOM.Iterable"], 7 | "skipLibCheck": true, 8 | "paths": { 9 | "@/*": ["./src/*"], 10 | }, 11 | 12 | /* Bundler mode */ 13 | "moduleResolution": "bundler", 14 | "allowImportingTsExtensions": true, 15 | "resolveJsonModule": true, 16 | "isolatedModules": true, 17 | "noEmit": true, 18 | "jsx": "preserve", 19 | 20 | /* Linting */ 21 | "strict": true, 22 | "noUnusedLocals": true, 23 | "noUnusedParameters": true, 24 | "noFallthroughCasesInSwitch": true 25 | }, 26 | "include": [ 27 | "src/**/*.ts", 28 | "src/**/*.d.ts", 29 | "src/**/*.tsx", 30 | "src/**/*.vue" 31 | ], 32 | "references": [{ "path": "./tsconfig.node.json" }], 33 | "ts-node": { 34 | "esm": true, 35 | "compilerOptions": { 36 | "moduleResolution": "nodenext", 37 | "module": "nodenext", 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES2020", 4 | "useDefineForClassFields": true, 5 | "module": "ESNext", 6 | "lib": ["ES2020", "DOM", "DOM.Iterable"], 7 | "skipLibCheck": true, 8 | "paths": { 9 | "@/*": ["./src/*"], 10 | }, 11 | 12 | /* Bundler mode */ 13 | "moduleResolution": "bundler", 14 | "resolveJsonModule": true, 15 | "isolatedModules": true, 16 | "noEmit": true, 17 | "jsx": "preserve", 18 | 19 | /* Linting */ 20 | "strict": true, 21 | "noUnusedLocals": true, 22 | "noUnusedParameters": true, 23 | "noFallthroughCasesInSwitch": true 24 | }, 25 | "include": ["src/**/*.ts"], 26 | "exclude": ["src/docs/**/*"], 27 | "references": [{ "path": "./tsconfig.node.json" }] 28 | } 29 | -------------------------------------------------------------------------------- /tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "composite": true, 4 | "skipLibCheck": true, 5 | "module": "ESNext", 6 | "moduleResolution": "bundler", 7 | "allowSyntheticDefaultImports": true 8 | }, 9 | "include": ["vite.config.ts"] 10 | } 11 | -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import vue from '@vitejs/plugin-vue' 3 | import { resolve } from 'path'; 4 | 5 | // https://vitejs.dev/config/ 6 | export default defineConfig({ 7 | base: `./`, 8 | resolve: { 9 | alias: { 10 | '@': resolve('./src'), 11 | }, 12 | }, 13 | plugins: [ 14 | vue() 15 | ], 16 | build: { 17 | outDir: 'docs', 18 | } 19 | }) 20 | --------------------------------------------------------------------------------