Skip to content

Add Svelte 5 support via /svelte subpath export#13

Open
MathiasWP wants to merge 1 commit into
warper-org:mainfrom
MathiasWP:add-svelte-5-support
Open

Add Svelte 5 support via /svelte subpath export#13
MathiasWP wants to merge 1 commit into
warper-org:mainfrom
MathiasWP:add-svelte-5-support

Conversation

@MathiasWP

Copy link
Copy Markdown

Summary

Adds Svelte 5 as a first-class adapter alongside the existing React one, via the subpath export @itsmeadarsh/warper/svelte. The Svelte build does not pull React into its import graph — both react and svelte are now optional peer deps.

  • New exports: createVirtualizer (rune-based hook) + <Warper> .svelte component, mirroring the React hook + component surface.
  • Shared core: the zero-allocation TypedArray buffer pools were extracted out of react/hooks/useVirtualizer.ts into core/buffers.ts so both adapters reuse the same hot-path scratch space.
  • Types split: types/core.ts is framework-agnostic; types/react.ts holds the React-only types. types/index.ts re-exports both, so existing React imports are unchanged.
  • Build: new build:svelte script runs @sveltejs/package with a dedicated tsconfig.svelte.json, emitting dist/svelte/ with .svelte.d.ts types.
  • .svelte-kit/ (scratch dir from svelte-package) is gitignored.

Idiomatic Svelte 5 choices (verified against svelte.dev docs)

  • $state.raw for the range object — TypedArray-backed views are reassigned wholesale, so deep proxy reactivity would be pure overhead.
  • @attach attachments (Svelte 5.29+) instead of use: actions for the scroll container.
  • on() from svelte/events for the scroll listener.
  • style: directives for dynamic style values (height / transform); static styles stay in a single style attribute.
  • Typed Snippet<[number]> children; {@render children(itemIndex)}.
  • Plain $effect for lifecycle (consumers needing non-component usage can wrap in $effect.root).

Test plan

  • bun install succeeds; no React-related warnings in a Svelte-only consumer environment.
  • bun run build produces dist/svelte/index.js, components/Warper.svelte, hooks/createVirtualizer.svelte.js plus matching .d.ts files.
  • React entrypoint (@itsmeadarsh/warper) still builds and the existing examples (bun run example:list etc.) still run.
  • Smoke test in a SvelteKit / Vite-Svelte playground: import { Warper, createVirtualizer } from @itsmeadarsh/warper/svelte, render 1M rows, verify scroll, range.items updates, scrollToIndex works.

🤖 Generated with Claude Code

Exposes createVirtualizer (rune-based hook) and <Warper> .svelte
component to Svelte 5 consumers without pulling React into their
import graph.

- Subpath export @itsmeadarsh/warper/svelte (single package)
- React and Svelte are both optional peer deps via peerDependenciesMeta
- Shared core: TypedArray buffer pools extracted to core/buffers.ts
  so both adapters reuse the zero-allocation hot path
- types/ split into core (framework-agnostic) and react (React-only)
- Idiomatic Svelte 5: $state.raw for the range object, @Attach
  attachments instead of use: actions, on() from svelte/events for
  the scroll listener, style: directives for dynamic style values,
  typed Snippet<[number]> children

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant