huntabyte / shadcn-svelte

shadcn/ui, but for Svelte. ✨
https://next.shadcn-svelte.com
MIT License
5.45k stars 340 forks source link

bunx shadcn-svelte@next add sidebar-01 doesnt install the example correct #1390

Closed jesperordrup closed 2 weeks ago

jesperordrup commented 2 weeks ago

Describe the bug

2 errors

sidebar-page.svelte doesnt import AppSideBar correct:

import AppSidebar from "./components/app-sidebar.svelte";

Which gives a not found. Replaceding with:

import AppSidebar from "$lib/components/app-sidebar.svelte";

Running project gives me the following error

TypeError: __vite_ssr_import_1__.Provider is not a function

In src\lib\components\ui\tooltip\index.ts i find this line with an error

const Provider = TooltipPrimitive.Provider;

Error is Property 'Provider' does not exist on type 'typeof import("c:/code/sv/sv2/node_modules/bits-ui/dist/bits/tooltip/index

This file only exports:

export { default as Root } from "./components/tooltip.svelte";
export { default as Content } from "./components/tooltip-content.svelte";
export { default as Trigger } from "./components/tooltip-trigger.svelte";
export { default as Arrow } from "./components/tooltip-arrow.svelte";

Reproduction

Install clean svelte 5 using new sv selected bun Install shadcn acoording to https://next.shadcn-svelte.com/docs/installation/sveltekit Installed all UI components (accepted overriding everything) From https://next.shadcn-svelte.com/blocks installed first example

bunx shadcn-svelte@next add sidebar-01 Updated the reference in sidebar-page.svelte to import AppSidebar from "$lib/components/app-sidebar.svelte";

Update +page.svelte

image

ran bun dev

Error as described before

Logs

PS C:\code\sv\sv2> bun dev
$ vite dev
Using existing cloned repo
ℹ [paraglide] Compiling Messages into ./src/lib/paraglide

  VITE v5.4.10  ready in 1363 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

08.26.18 [vite-plugin-svelte] src/lib/components/app-sidebar.svelte:165:29 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.18 [vite-plugin-svelte] src/lib/components/search-form.svelte:16:19 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/breadcrumb/breadcrumb-link.svelte:33:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-group-action.svelte:38:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-action.svelte:45:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-button.svelte:79:21 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-sub-button.svelte:45:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-rail.svelte:22:19 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/button/button.svelte:63:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.19 [vite-plugin-svelte] src/lib/components/ui/button/button.svelte:72:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
TypeError: __vite_ssr_import_1__.Provider is not a function
    at Module.Sidebar_provider (C:/code/sv/sv2/src/lib/components/ui/sidebar/sidebar-provider.svelte:51:24)
    at Module.Sidebar_page [as default] (C:/code/sv/sv2/src/lib/components/sidebar-page.svelte:19:24)
    at _page (C:/code/sv/sv2/src/routes/+page.svelte:37:31)
    at children (C:/code/sv/sv2/.svelte-kit/generated/root.svelte:69:5)
    at children (C:\code\sv\sv2\src\routes\+layout.svelte:9:11)
    at Module.slot (C:\code\sv\sv2\node_modules\svelte\src\internal\server\index.js:433:3)
    at Module.ParaglideJS (C:/code/sv/sv2/node_modules/@inlang/paraglide-sveltekit/dist/runtime/ParaglideJS.svelte:102:25)
    at _layout (C:/code/sv/sv2/src/routes/+layout.svelte:19:24)
    at Root (C:/code/sv/sv2/.svelte-kit/generated/root.svelte:64:3)
    at Module.render (C:\code\sv\sv2\node_modules\svelte\src\internal\server\index.js:117:2)
08.26.21 [vite-plugin-svelte] src/lib/components/app-sidebar.svelte:165:29 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/search-form.svelte:16:19 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead   
08.26.21 [vite-plugin-svelte] src/lib/components/ui/breadcrumb/breadcrumb-link.svelte:33:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-group-action.svelte:38:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-action.svelte:45:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-button.svelte:79:21 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-menu-sub-button.svelte:45:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/sidebar/sidebar-rail.svelte:22:19 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/button/button.svelte:63:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead
08.26.21 [vite-plugin-svelte] src/lib/components/ui/button/button.svelte:72:20 `a11y-missing-attribute` is no longer valid — please use `a11y_missing_attribute` instead

System Info

Windows 11, new svelte 5

Severity

annoyance

jesperordrup commented 2 weeks ago

This only solves one of the two. This remains:

TypeError: __vite_ssr_import_1__.Provider is not a function

In src\lib

shyakadavis commented 2 weeks ago

What version of bits are you using? Is it the latest? Also, a repro would really help, because I couldn't reproduce this.

cozyGalvinism commented 1 week ago

I have the same issue, just created the project, added sidebar-01, same error. Version of bits-ui is 0.21.16.

cozyGalvinism commented 1 week ago

I think I found the issue. add sidebar-01 seems to install the latest stable bits-ui, whereas it actually needs to install a pre-release version for Svelte 5 compatibility.

After replacing the bits-ui version with one of the pre-releases, I was greeted with ShadCN:

image

jesperordrup commented 1 week ago

I have the same issue, just created the project, added sidebar-01, same error. Version of bits-ui is 0.21.16.

Thanks for covering :-) (Sorry for no response. Didnt see notification. )