@humanspeak/svelte-motion
Version:
Framer Motion for Svelte 5. Declarative motion.<tag> components with AnimatePresence exit animations, gestures (hover, tap, drag, focus, in-view), variants, FLIP layout animations, shared-layout transitions, spring physics, and scroll-linked motion values
1,724 lines • 158 kB
TypeScript
import A from './A.svelte';
import Abbr from './Abbr.svelte';
import Address from './Address.svelte';
import Animate from './Animate.svelte';
import Animatemotion from './Animatemotion.svelte';
import Animatetransform from './Animatetransform.svelte';
import Area from './Area.svelte';
import Article from './Article.svelte';
import Aside from './Aside.svelte';
import Audio from './Audio.svelte';
import B from './B.svelte';
import Base from './Base.svelte';
import Bdi from './Bdi.svelte';
import Bdo from './Bdo.svelte';
import Blockquote from './Blockquote.svelte';
import Br from './Br.svelte';
import Button from './Button.svelte';
import Canvas from './Canvas.svelte';
import Caption from './Caption.svelte';
import Circle from './Circle.svelte';
import Cite from './Cite.svelte';
import Clippath from './Clippath.svelte';
import Code from './Code.svelte';
import Col from './Col.svelte';
import Colgroup from './Colgroup.svelte';
import Cursor from './Cursor.svelte';
import Data from './Data.svelte';
import Datalist from './Datalist.svelte';
import Dd from './Dd.svelte';
import Defs from './Defs.svelte';
import Del from './Del.svelte';
import Desc from './Desc.svelte';
import Details from './Details.svelte';
import Dfn from './Dfn.svelte';
import Dialog from './Dialog.svelte';
import Div from './Div.svelte';
import Dl from './Dl.svelte';
import Dt from './Dt.svelte';
import Ellipse from './Ellipse.svelte';
import Em from './Em.svelte';
import Embed from './Embed.svelte';
import Feblend from './Feblend.svelte';
import Fecolormatrix from './Fecolormatrix.svelte';
import Fecomponenttransfer from './Fecomponenttransfer.svelte';
import Fecomposite from './Fecomposite.svelte';
import Feconvolvematrix from './Feconvolvematrix.svelte';
import Fediffuselighting from './Fediffuselighting.svelte';
import Fedisplacementmap from './Fedisplacementmap.svelte';
import Fedistantlight from './Fedistantlight.svelte';
import Feflood from './Feflood.svelte';
import Fefunca from './Fefunca.svelte';
import Fefuncb from './Fefuncb.svelte';
import Fefuncg from './Fefuncg.svelte';
import Fefuncr from './Fefuncr.svelte';
import Fegaussianblur from './Fegaussianblur.svelte';
import Feimage from './Feimage.svelte';
import Femerge from './Femerge.svelte';
import Femergenode from './Femergenode.svelte';
import Femorphology from './Femorphology.svelte';
import Feoffset from './Feoffset.svelte';
import Fepointlight from './Fepointlight.svelte';
import Fespecularlighting from './Fespecularlighting.svelte';
import Fespotlight from './Fespotlight.svelte';
import Fetile from './Fetile.svelte';
import Feturbulence from './Feturbulence.svelte';
import Fieldset from './Fieldset.svelte';
import Figcaption from './Figcaption.svelte';
import Figure from './Figure.svelte';
import Filter from './Filter.svelte';
import Footer from './Footer.svelte';
import Foreignobject from './Foreignobject.svelte';
import Form from './Form.svelte';
import G from './G.svelte';
import H1 from './H1.svelte';
import H2 from './H2.svelte';
import H3 from './H3.svelte';
import H4 from './H4.svelte';
import H5 from './H5.svelte';
import H6 from './H6.svelte';
import Header from './Header.svelte';
import Hgroup from './Hgroup.svelte';
import Hr from './Hr.svelte';
import I from './I.svelte';
import Iframe from './Iframe.svelte';
import Image from './Image.svelte';
import Img from './Img.svelte';
import Input from './Input.svelte';
import Ins from './Ins.svelte';
import Kbd from './Kbd.svelte';
import Label from './Label.svelte';
import Legend from './Legend.svelte';
import Li from './Li.svelte';
import Line from './Line.svelte';
import Lineargradient from './Lineargradient.svelte';
import Main from './Main.svelte';
import Map from './Map.svelte';
import Mark from './Mark.svelte';
import Marker from './Marker.svelte';
import Mask from './Mask.svelte';
import Math from './Math.svelte';
import Menu from './Menu.svelte';
import Metadata from './Metadata.svelte';
import Meter from './Meter.svelte';
import Mpath from './Mpath.svelte';
import Nav from './Nav.svelte';
import Noscript from './Noscript.svelte';
import Object from './Object.svelte';
import Ol from './Ol.svelte';
import Optgroup from './Optgroup.svelte';
import Option from './Option.svelte';
import Output from './Output.svelte';
import P from './P.svelte';
import Path from './Path.svelte';
import Pattern from './Pattern.svelte';
import Picture from './Picture.svelte';
import Polygon from './Polygon.svelte';
import Polyline from './Polyline.svelte';
import Pre from './Pre.svelte';
import Progress from './Progress.svelte';
import Q from './Q.svelte';
import Radialgradient from './Radialgradient.svelte';
import Rect from './Rect.svelte';
import Rp from './Rp.svelte';
import Rt from './Rt.svelte';
import Ruby from './Ruby.svelte';
import S from './S.svelte';
import Samp from './Samp.svelte';
import Script from './Script.svelte';
import Search from './Search.svelte';
import Section from './Section.svelte';
import Select from './Select.svelte';
import Selectedcontent from './Selectedcontent.svelte';
import Set from './SetElement.svelte';
import Slot from './Slot.svelte';
import Small from './Small.svelte';
import Source from './Source.svelte';
import Span from './Span.svelte';
import Stop from './Stop.svelte';
import Strong from './Strong.svelte';
import Style from './Style.svelte';
import Sub from './Sub.svelte';
import Summary from './Summary.svelte';
import Sup from './Sup.svelte';
import Svg from './Svg.svelte';
import Switch from './Switch.svelte';
import Symbol from './Symbol.svelte';
import Table from './Table.svelte';
import Tbody from './Tbody.svelte';
import Td from './Td.svelte';
import Template from './Template.svelte';
import Text from './Text.svelte';
import Textarea from './Textarea.svelte';
import Textpath from './Textpath.svelte';
import Tfoot from './Tfoot.svelte';
import Th from './Th.svelte';
import Thead from './Thead.svelte';
import Time from './Time.svelte';
import Title from './Title.svelte';
import Tr from './Tr.svelte';
import Track from './Track.svelte';
import Tref from './Tref.svelte';
import Tspan from './Tspan.svelte';
import U from './U.svelte';
import Ul from './Ul.svelte';
import Use from './Use.svelte';
import Var from './Var.svelte';
import Video from './Video.svelte';
import View from './View.svelte';
import Wbr from './Wbr.svelte';
export { A, Abbr, Address, Animate, Animatemotion, Animatetransform, Area, Article, Aside, Audio, B, Base, Bdi, Bdo, Blockquote, Br, Button, Canvas, Caption, Circle, Cite, Clippath, Code, Col, Colgroup, Cursor, Data, Datalist, Dd, Defs, Del, Desc, Details, Dfn, Dialog, Div, Dl, Dt, Ellipse, Em, Embed, Feblend, Fecolormatrix, Fecomponenttransfer, Fecomposite, Feconvolvematrix, Fediffuselighting, Fedisplacementmap, Fedistantlight, Feflood, Fefunca, Fefuncb, Fefuncg, Fefuncr, Fegaussianblur, Feimage, Femerge, Femergenode, Femorphology, Feoffset, Fepointlight, Fespecularlighting, Fespotlight, Fetile, Feturbulence, Fieldset, Figcaption, Figure, Filter, Footer, Foreignobject, Form, G, H1, H2, H3, H4, H5, H6, Header, Hgroup, Hr, I, Iframe, Image, Img, Input, Ins, Kbd, Label, Legend, Li, Line, Lineargradient, Main, Map, Mark, Marker, Mask, Math, Menu, Metadata, Meter, Mpath, Nav, Noscript, Object, Ol, Optgroup, Option, Output, P, Path, Pattern, Picture, Polygon, Polyline, Pre, Progress, Q, Radialgradient, Rect, Rp, Rt, Ruby, S, Samp, Script, Search, Section, Select, Selectedcontent, Set, Slot, Small, Source, Span, Stop, Strong, Style, Sub, Summary, Sup, Svg, Switch, Symbol, Table, Tbody, Td, Template, Text, Textarea, Textpath, Tfoot, Th, Thead, Time, Title, Tr, Track, Tref, Tspan, U, Ul, Use, Var, Video, View, Wbr };
export type MotionComponents = {
/**
* A motion-enhanced a element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.a
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.a>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
a: typeof A;
/**
* A motion-enhanced abbr element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.abbr
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.abbr>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
abbr: typeof Abbr;
/**
* A motion-enhanced address element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.address
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.address>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
address: typeof Address;
/**
* A motion-enhanced animate element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.animate
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.animate>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
animate: typeof Animate;
/**
* A motion-enhanced animatemotion element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.animatemotion
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.animatemotion>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
animatemotion: typeof Animatemotion;
/**
* A motion-enhanced animatetransform element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.animatetransform
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.animatetransform>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
animatetransform: typeof Animatetransform;
/**
* A motion-enhanced article element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.article
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.article>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
article: typeof Article;
/**
* A motion-enhanced aside element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.aside
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.aside>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
aside: typeof Aside;
/**
* A motion-enhanced audio element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.audio
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.audio>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
audio: typeof Audio;
/**
* A motion-enhanced b element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.b
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.b>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
b: typeof B;
/**
* A motion-enhanced bdi element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.bdi
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.bdi>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
bdi: typeof Bdi;
/**
* A motion-enhanced bdo element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.bdo
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.bdo>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
bdo: typeof Bdo;
/**
* A motion-enhanced blockquote element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.blockquote
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.blockquote>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
blockquote: typeof Blockquote;
/**
* A motion-enhanced button element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.button
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.button>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
button: typeof Button;
/**
* A motion-enhanced canvas element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.canvas
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.canvas>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
canvas: typeof Canvas;
/**
* A motion-enhanced caption element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.caption
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.caption>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
caption: typeof Caption;
/**
* A motion-enhanced circle element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.circle
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.circle>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
circle: typeof Circle;
/**
* A motion-enhanced cite element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.cite
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.cite>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
cite: typeof Cite;
/**
* A motion-enhanced clippath element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.clippath
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.clippath>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
clippath: typeof Clippath;
/**
* A motion-enhanced code element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.code
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.code>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
code: typeof Code;
/**
* A motion-enhanced colgroup element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.colgroup
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.colgroup>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
colgroup: typeof Colgroup;
/**
* A motion-enhanced cursor element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.cursor
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.cursor>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
cursor: typeof Cursor;
/**
* A motion-enhanced data element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.data
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.data>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
data: typeof Data;
/**
* A motion-enhanced datalist element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.datalist
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.datalist>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
datalist: typeof Datalist;
/**
* A motion-enhanced dd element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.dd
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.dd>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
dd: typeof Dd;
/**
* A motion-enhanced defs element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.defs
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.defs>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
defs: typeof Defs;
/**
* A motion-enhanced del element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.del
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.del>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
del: typeof Del;
/**
* A motion-enhanced desc element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.desc
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.desc>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
desc: typeof Desc;
/**
* A motion-enhanced details element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.details
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.details>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
details: typeof Details;
/**
* A motion-enhanced dfn element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.dfn
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.dfn>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
dfn: typeof Dfn;
/**
* A motion-enhanced dialog element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.dialog
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.dialog>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
dialog: typeof Dialog;
/**
* A motion-enhanced div element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.div
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.div>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
div: typeof Div;
/**
* A motion-enhanced dl element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.dl
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.dl>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
dl: typeof Dl;
/**
* A motion-enhanced dt element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.dt
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.dt>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
dt: typeof Dt;
/**
* A motion-enhanced ellipse element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.ellipse
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.ellipse>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
ellipse: typeof Ellipse;
/**
* A motion-enhanced em element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.em
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.em>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
em: typeof Em;
/**
* A motion-enhanced feblend element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.feblend
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.feblend>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
feblend: typeof Feblend;
/**
* A motion-enhanced fecolormatrix element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fecolormatrix
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fecolormatrix>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fecolormatrix: typeof Fecolormatrix;
/**
* A motion-enhanced fecomponenttransfer element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fecomponenttransfer
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fecomponenttransfer>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fecomponenttransfer: typeof Fecomponenttransfer;
/**
* A motion-enhanced fecomposite element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fecomposite
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fecomposite>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fecomposite: typeof Fecomposite;
/**
* A motion-enhanced feconvolvematrix element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.feconvolvematrix
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.feconvolvematrix>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
feconvolvematrix: typeof Feconvolvematrix;
/**
* A motion-enhanced fediffuselighting element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fediffuselighting
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fediffuselighting>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fediffuselighting: typeof Fediffuselighting;
/**
* A motion-enhanced fedisplacementmap element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fedisplacementmap
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fedisplacementmap>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fedisplacementmap: typeof Fedisplacementmap;
/**
* A motion-enhanced fedistantlight element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fedistantlight
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fedistantlight>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fedistantlight: typeof Fedistantlight;
/**
* A motion-enhanced feflood element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.feflood
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.feflood>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
feflood: typeof Feflood;
/**
* A motion-enhanced fefunca element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fefunca
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fefunca>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fefunca: typeof Fefunca;
/**
* A motion-enhanced fefuncb element with animation capabilities.
*
* [Motion Documentation](https://motion.dev/docs/react-motion-component)
*
* Currently supported features:
* * `initial`
* * `animate`
* * `transition`
* * `whileTap`
* * `whileHover`
* * `onAnimationStart`
* * `onAnimationComplete`
* * `onHoverStart`
* * `onHoverEnd`
* * `layout`
*
* ```svelte
* <motion.fefuncb
* initial={{ opacity: 0, scale: 0.8 }}
* animate={{ opacity: 1, scale: 1 }}
* transition={{ duration: 0.3 }}
* whileHover={{ scale: 1.05 }}
* whileTap={{ scale: 0.95 }}
* >
* Content
* </motion.fefuncb>
* ```
*
* Note: Some motion features are still under development.
* Check documentation for latest updates.
*/
fefuncb: typeof Fefuncb;
/**
* A m