LottieFiles / dotlottie-web

Official LottieFiles player for rendering Lottie and dotLottie animations in the web. Supports React, Vue, Svelte, SolidJS and Web Components.
https://developers.lottiefiles.com/docs/dotlottie-player/
MIT License
191 stars 11 forks source link

`dotlottie` player doesn't support JS Object as input but `LottiePlayer` does #222

Closed baseplate-admin closed 5 months ago

baseplate-admin commented 5 months ago

Overview

For example i can do something like this in LottiePlayer

<scirpt lang='ts'>
    import { LottiePlayer } from "@lottiefiles/svelte-lottie-player";
    let scroll: object;
    let squiggle: object;
    let stars: object;

    onMount(async () => {
        import("./lotties/bg-lottie.json").then((res) => {
            bg_lottie = res.default;
        });
        import("./lotties/squiggle.json").then((res) => {
            squiggle = res.default;
        });
        import("./lotties/stars.json").then((res) => {
            stars = res.default;
        });
        import("./lotties/scroll.json").then((res) => {
            scroll = res.default;
        });
    });
</script>
<LottiePlayer
    src={stars}
    autoplay={true}
    loop={false}
    renderer="svg"
    background="transparent"
/>
<LottiePlayer
    src={scroll}
    autoplay={true}
    loop={false}
    renderer="svg"
    background="transparent"
/>
<LottiePlayer
    src={squiggle }
    autoplay={true}
    loop={false}
    renderer="svg"
    background="transparent"
/>

But this is not doable in dotlottie

Consuming repo

What repo were you working in when this issue occurred?

https://github.com/coreproject-moe/CoreProject-Monorepo/blob/bb4996c8f434466cb0d4d8ed1a4aa1719ebe8e18/backend/django_core/static_src/components/page/home/Index.svelte#L100C1-L106C19

Labels

theashraf commented 5 months ago

For dotLottie-svelte, the src prop is expected to be a URL. If you want to pass the animation JSON directly, use the data prop instead and pass the animation JSON to the data prop.

baseplate-admin commented 5 months ago

Alright makes sense. i will get back to you

theashraf commented 5 months ago

@baseplate-admin will close this issue, feel free to reopen if it's not resolved, thanks