Anything using new(ish) DaisyUI or Skeleton completely bricks Svane

[jwatts777]

Was trying to build a sandbox to work on #7, but ran into issues of my own.

https://www.reddit.com/r/sveltejs/comments/vc7cnw/require_is_not_defined/

Best case for a fix is advising users of more vite changes (don't have a working example of this, will update)

Reproduce - Skeleton || DaisyUI Install Svane Typical Error code "Missing "./dist/index.js" specifier in "@shipbit/svane" package"

[cogscides]

I too cannot run Svane with Skeleton UI on the board

[jwatts777]

@cogscides After looking at how the tailwind.config is consumed, I think that this tool is mostly dead. This bar is bottom centered, but that can be changed with a simple bottom-0 -> top-0. It's not a perfect replica, but I hope this helps. Make sure to change the <span>'s if you have non-standard breakpoints defined.

{#if dev}
    <div class="absolute">
        <div class="fixed inset-x-0 bottom-0 z-50 flex justify-center rounded border border-gray-400 bg-gray-200 p-2 text-sm text-pink-600">
            <svg class="inline h-6 w-auto" viewBox="0 0 80 64" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path
                    fill="url(#paint0_linear)"
                    fill-rule="evenodd"
                    clip-rule="evenodd"
                    d="M32 16C24.8 16 20.3 19.6 18.5 26.8C21.2 23.2 24.35 21.85 27.95 22.75C30.004 23.2635 31.4721 24.7536 33.0971 26.4031C35.7443 29.0901 38.8081 32.2 45.5 32.2C52.7 32.2 57.2 28.6 59 21.4C56.3 25 53.15 26.35 49.55 25.45C47.496 24.9365 46.0279 23.4464 44.4029 21.7969C41.7557 19.1099 38.6919 16 32 16ZM18.5 32.2C11.3 32.2 6.8 35.8 5 43C7.7 39.4 10.85 38.05 14.45 38.95C16.504 39.4635 17.9721 40.9536 19.5971 42.6031C22.2443 45.2901 25.3081 48.4 32 48.4C39.2 48.4 43.7 44.8 45.5 37.6C42.8 41.2 39.65 42.55 36.05 41.65C33.996 41.1365 32.5279 39.6464 30.9029 37.9969C28.2557 35.3099 25.1919 32.2 18.5 32.2Z"
                ></path>
                <defs>
                    <linearGradient id="paint0_linear" x1="3.5" y1="16" x2="59" y2="48" gradientUnits="userSpaceOnUse">
                        <stop stop-color="#2298BD"></stop>
                        <stop offset="1" stop-color="#0ED7B5"></stop>
                    </linearGradient>
                </defs>
            </svg>
            Current breakpoint
            <span class="ml-1 sm:hidden md:hidden lg:hidden xl:hidden 2xl:hidden">default (&lt; 640px)</span>
            <span class="ml-1 hidden font-extrabold sm:inline md:hidden lg:hidden xl:hidden 2xl:hidden">sm</span>
            <span class="ml-1 hidden font-extrabold md:inline lg:hidden xl:hidden 2xl:hidden">md</span>
            <span class="ml-1 hidden font-extrabold lg:inline xl:hidden 2xl:hidden">lg</span>
            <span class="ml-1 hidden font-extrabold xl:inline 2xl:hidden">xl</span>
            <span class="ml-1 hidden font-extrabold 2xl:inline">2xl</span>
        </div>
    </div>
{/if} 

Ex:

[Shackless]

Yeah sorry, I haven't worked on Svane for a while and currently don't have time to do so. I can merge PRs. You could also fork it or take the idea to implement your own - I won't be mad and would probably use it, too ;)

[jwatts777]

@Shackless No worries. I'll @ you when I release.

I doubt that I will implement the progress bar, it would be extremely hard to guarantee that we're pulling the correct page height/width, especially given that Skeleton has deprecated App Shell, and layouts won't be standardized much.

Any other concerns or wants?