@humanspeak/svelte-motion 0.0.6 → 0.0.8

package/README.md

@@ -16,6 +16,130 @@
 
 Just a little wrapper for motion. I love their work! The typical this is a WIP, if you have issues please give me a react example working so that I can work to ensure its running properly 😍
 
+## Supported Elements
+
+### Regular Elements
+
+- `motion.a`
+- `motion.article`
+- `motion.aside`
+- `motion.blockquote`
+- `motion.button`
+- `motion.code`
+- `motion.dd`
+- `motion.div`
+- `motion.dl`
+- `motion.dt`
+- `motion.fieldset`
+- `motion.figcaption`
+- `motion.figure`
+- `motion.footer`
+- `motion.form`
+- `motion.h1`
+- `motion.h2`
+- `motion.h3`
+- `motion.h4`
+- `motion.h5`
+- `motion.h6`
+- `motion.header`
+- `motion.label`
+- `motion.legend`
+- `motion.li`
+- `motion.main`
+- `motion.nav`
+- `motion.ol`
+- `motion.option`
+- `motion.p`
+- `motion.pre`
+- `motion.section`
+- `motion.select`
+- `motion.span`
+- `motion.table`
+- `motion.tbody`
+- `motion.td`
+- `motion.textarea`
+- `motion.tfoot`
+- `motion.th`
+- `motion.thead`
+- `motion.tr`
+- `motion.ul`
+
+### Void Elements
+
+- `motion.area`
+- `motion.base`
+- `motion.br`
+- `motion.col`
+- `motion.embed`
+- `motion.hr`
+- `motion.img`
+- `motion.input`
+- `motion.param`
+- `motion.source`
+- `motion.track`
+- `motion.wbr`
+
+### Regular Elements
+
+- `motion.a`
+- `motion.article`
+- `motion.aside`
+- `motion.blockquote`
+- `motion.button`
+- `motion.code`
+- `motion.dd`
+- `motion.div`
+- `motion.dl`
+- `motion.dt`
+- `motion.fieldset`
+- `motion.figcaption`
+- `motion.figure`
+- `motion.footer`
+- `motion.form`
+- `motion.h1`
+- `motion.h2`
+- `motion.h3`
+- `motion.h4`
+- `motion.h5`
+- `motion.h6`
+- `motion.header`
+- `motion.label`
+- `motion.legend`
+- `motion.li`
+- `motion.main`
+- `motion.nav`
+- `motion.ol`
+- `motion.option`
+- `motion.p`
+- `motion.pre`
+- `motion.section`
+- `motion.select`
+- `motion.span`
+- `motion.table`
+- `motion.tbody`
+- `motion.td`
+- `motion.textarea`
+- `motion.tfoot`
+- `motion.th`
+- `motion.thead`
+- `motion.tr`
+- `motion.ul`
+
+### Void Elements
+
+- `motion.area`
+- `motion.base`
+- `motion.br`
+- `motion.col`
+- `motion.embed`
+- `motion.hr`
+- `motion.img`
+- `motion.input`
+- `motion.param`
+- `motion.source`
+- `motion.track`
+- `motion.wbr`
+
 ## External Dependencies
 
 This package carefully selects its dependencies to provide a robust and maintainable solution:

package/dist/html/A.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="a" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/A.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const A: import("svelte").Component<HTMLElementProps, {}, "">;
+type A = ReturnType<typeof A>;
+export default A;

package/dist/html/Area.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLVoidElementProps } from '../types.js'
+
+    let { ...rest } = $props<HTMLVoidElementProps>()
+</script>
+
+<MotionContainer tag="area" {...rest} />

package/dist/html/Area.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLVoidElementProps } from '../types.js';
+declare const Area: import("svelte").Component<HTMLVoidElementProps, {}, "">;
+type Area = ReturnType<typeof Area>;
+export default Area;

package/dist/html/Article.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="article" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Article.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Article: import("svelte").Component<HTMLElementProps, {}, "">;
+type Article = ReturnType<typeof Article>;
+export default Article;

package/dist/html/Aside.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="aside" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Aside.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Aside: import("svelte").Component<HTMLElementProps, {}, "">;
+type Aside = ReturnType<typeof Aside>;
+export default Aside;

package/dist/html/Base.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLVoidElementProps } from '../types.js'
+
+    let { ...rest } = $props<HTMLVoidElementProps>()
+</script>
+
+<MotionContainer tag="base" {...rest} />

package/dist/html/Base.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLVoidElementProps } from '../types.js';
+declare const Base: import("svelte").Component<HTMLVoidElementProps, {}, "">;
+type Base = ReturnType<typeof Base>;
+export default Base;

package/dist/html/Blockquote.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="blockquote" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Blockquote.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Blockquote: import("svelte").Component<HTMLElementProps, {}, "">;
+type Blockquote = ReturnType<typeof Blockquote>;
+export default Blockquote;

package/dist/html/Br.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLVoidElementProps } from '../types.js'
+
+    let { ...rest } = $props<HTMLVoidElementProps>()
+</script>
+
+<MotionContainer tag="br" {...rest} />

package/dist/html/Br.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLVoidElementProps } from '../types.js';
+declare const Br: import("svelte").Component<HTMLVoidElementProps, {}, "">;
+type Br = ReturnType<typeof Br>;
+export default Br;

package/dist/{svelte/html → html}/Button.svelte

@@ -1,13 +1,10 @@
 <script lang="ts">
     import MotionContainer from './_MotionContainer.svelte'
-    import type { Snippet } from 'svelte'
+    import type { HTMLElementProps } from '../types.js'
 
-    type Props = {
-        children?: Snippet
-        [key: string]: unknown
-    }
+    type Props = HTMLElementProps
 
-    let { children, ...rest }: Props = $props()
+    let { children, ...rest } = $props<HTMLElementProps>()
 </script>
 
 <MotionContainer tag="button" {...rest}>

package/dist/html/Button.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Button: import("svelte").Component<HTMLElementProps, {}, "">;
+type Button = ReturnType<typeof Button>;
+export default Button;

package/dist/html/Code.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="code" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Code.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Code: import("svelte").Component<HTMLElementProps, {}, "">;
+type Code = ReturnType<typeof Code>;
+export default Code;

package/dist/html/Col.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLVoidElementProps } from '../types.js'
+
+    let { ...rest } = $props<HTMLVoidElementProps>()
+</script>
+
+<MotionContainer tag="col" {...rest} />

package/dist/html/Col.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLVoidElementProps } from '../types.js';
+declare const Col: import("svelte").Component<HTMLVoidElementProps, {}, "">;
+type Col = ReturnType<typeof Col>;
+export default Col;

package/dist/html/Dd.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="dd" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Dd.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Dd: import("svelte").Component<HTMLElementProps, {}, "">;
+type Dd = ReturnType<typeof Dd>;
+export default Dd;

package/dist/{svelte/html → html}/Div.svelte

@@ -1,13 +1,10 @@
 <script lang="ts">
     import MotionContainer from './_MotionContainer.svelte'
-    import type { Snippet } from 'svelte'
+    import type { HTMLElementProps } from '../types.js'
 
-    type Props = {
-        children?: Snippet
-        [key: string]: unknown
-    }
+    type Props = HTMLElementProps
 
-    let { children, ...rest }: Props = $props()
+    let { children, ...rest } = $props<HTMLElementProps>()
 </script>
 
 <MotionContainer tag="div" {...rest}>

package/dist/html/Div.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Div: import("svelte").Component<HTMLElementProps, {}, "">;
+type Div = ReturnType<typeof Div>;
+export default Div;

package/dist/html/Dl.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="dl" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Dl.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Dl: import("svelte").Component<HTMLElementProps, {}, "">;
+type Dl = ReturnType<typeof Dl>;
+export default Dl;

package/dist/html/Dt.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="dt" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Dt.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Dt: import("svelte").Component<HTMLElementProps, {}, "">;
+type Dt = ReturnType<typeof Dt>;
+export default Dt;

package/dist/html/Embed.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLVoidElementProps } from '../types.js'
+
+    let { ...rest } = $props<HTMLVoidElementProps>()
+</script>
+
+<MotionContainer tag="embed" {...rest} />

package/dist/html/Embed.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLVoidElementProps } from '../types.js';
+declare const Embed: import("svelte").Component<HTMLVoidElementProps, {}, "">;
+type Embed = ReturnType<typeof Embed>;
+export default Embed;

package/dist/html/Fieldset.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="fieldset" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Fieldset.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Fieldset: import("svelte").Component<HTMLElementProps, {}, "">;
+type Fieldset = ReturnType<typeof Fieldset>;
+export default Fieldset;

package/dist/html/Figcaption.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="figcaption" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Figcaption.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Figcaption: import("svelte").Component<HTMLElementProps, {}, "">;
+type Figcaption = ReturnType<typeof Figcaption>;
+export default Figcaption;

package/dist/html/Figure.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="figure" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Figure.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Figure: import("svelte").Component<HTMLElementProps, {}, "">;
+type Figure = ReturnType<typeof Figure>;
+export default Figure;

package/dist/html/Footer.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="footer" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Footer.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Footer: import("svelte").Component<HTMLElementProps, {}, "">;
+type Footer = ReturnType<typeof Footer>;
+export default Footer;

package/dist/html/Form.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="form" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/Form.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const Form: import("svelte").Component<HTMLElementProps, {}, "">;
+type Form = ReturnType<typeof Form>;
+export default Form;

package/dist/html/H1.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h1" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H1.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H1: import("svelte").Component<HTMLElementProps, {}, "">;
+type H1 = ReturnType<typeof H1>;
+export default H1;

package/dist/html/H2.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h2" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H2.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H2: import("svelte").Component<HTMLElementProps, {}, "">;
+type H2 = ReturnType<typeof H2>;
+export default H2;

package/dist/html/H3.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h3" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H3.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H3: import("svelte").Component<HTMLElementProps, {}, "">;
+type H3 = ReturnType<typeof H3>;
+export default H3;

package/dist/html/H4.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h4" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H4.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H4: import("svelte").Component<HTMLElementProps, {}, "">;
+type H4 = ReturnType<typeof H4>;
+export default H4;

package/dist/html/H5.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h5" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H5.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H5: import("svelte").Component<HTMLElementProps, {}, "">;
+type H5 = ReturnType<typeof H5>;
+export default H5;

package/dist/html/H6.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="h6" {...rest}>
+    {@render children?.()}
+</MotionContainer>

package/dist/html/H6.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { HTMLElementProps } from '../types.js';
+declare const H6: import("svelte").Component<HTMLElementProps, {}, "">;
+type H6 = ReturnType<typeof H6>;
+export default H6;

package/dist/html/Header.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+    import MotionContainer from './_MotionContainer.svelte'
+    import type { HTMLElementProps } from '../types.js'
+
+    type Props = HTMLElementProps
+
+    let { children, ...rest } = $props<HTMLElementProps>()
+</script>
+
+<MotionContainer tag="header" {...rest}>
+    {@render children?.()}
+</MotionContainer>