Home

Awesome

<div align="center">

@svelte-put

MIT MadeWithSvelte.com

Useful svelte stuff to put in your projects

svelte-put

</div>

[!NOTE] > Svelte 5 is coming! All action-based packages in this collection should continue to work, while others are being updated to support the new version. Support for Svelte 4 and lower will be dropped in the next major releases.

Documentation

See the dedicated documentation page here.

Packages

@svelte-put includes several packages that have self-managed release cycles, listed below. Check out their corresponding README for more details.

PackageShort DescriptionVersionChangelogDocs
@svelte-put/async-stackcomponent & utilities for async-stacknpm.async-stack.badgeChangelogdocs.badge
@svelte-put/avatarcomponent & utilities for avatarnpm.avatar.badgeChangelogdocs.badge
@svelte-put/clickoutsideevent for clicking outside nodenpm.clickoutside.badgeChangelogdocs.badge
@svelte-put/cloudflare-turnstileevent for clicking outside nodenpm.cloudflare-turnstile.badgeChangelogdocs.badge
@svelte-put/copycopy text to clipboardnpm.copy.badgeChangelogdocs.badge
@svelte-put/dragscrolladd drag-to-scroll behaviornpm.dragscroll.badgeChangelogdocs.badge
@svelte-put/intersectwrapper for IntersectionObservernpm.intersect.badgeChangelogdocs.badge
@svelte-put/inline-svgdynamically inline SVGsnpm.inline-svg.badgeChangelogdocs.badge
@svelte-put/lockscrolllock scroll, hide scrollbarnpm.lockscroll.badgeChangelogdocs.badge
@svelte-put/movablemove node on mousedownnpm.movable.badgeChangelogdocs.badge
@svelte-put/preactionmove node on mousedownnpm.preaction.badgeChangelogdocs.badge
@svelte-put/popovermove node on mousedownnpm.popover.badgeChangelogdocs.badge
@svelte-put/preprocess-auto-slugauto add id and anchor to selected nodesnpm.preprocess-auto-slug.badgeChangelogdocs.badge
@svelte-put/preprocess-external-linkauto add id and anchor to selected nodesnpm.preprocess-external-link.badgeChangelogdocs.badge
@svelte-put/qrrender QR as img or svgnpm.qr.badgeChangelogdocs.badge
@svelte-put/resizewrapper for ResizeObservernpm.resize.badgeChangelogdocs.badge
@svelte-put/shortcutadd keyboard shortcuts to nodenpm.shortcut.badgeChangelogdocs.badge
@svelte-put/tocaction & utilities for building table of contentsnpm.toc.badgeChangelogdocs.badge
<!-- ### In the Pipeline These are some packages that will be added in the future (as soon as I find time, and the implementation has matured & become generic enough). | Package | Category | Short Description | Status | Docs | | ----------------------------------- | --------- | ----------------------------- | ----------- | ----------- | Names for those packages may change. -->

Contributing

This project is a monorepo using turborepo under the hood. Familiarity with turborepo is not required but encouraged.

For a quick start, run the script below at project root to see what commands are available.

pnpm turbo
<!-- github specifics --> <!-- heading badge --> <!-- npm --> <!-- svelte REPL --> <!-- docs linking -->