@svelte-put

svelte-put is a collection of useful svelte actions, utilities, and minimal components extracted from (my) real world projects that might be helpful for yours.

Packages

@svelte-put includes several packages with self-manged release cycles, listed below. Check out their corresponding documentation for more details.

ID

Description

Version

Status

avatar

component & utilities for building avatars

@svelte-put/avatar

stable

clickoutside

event for clicking outside node

@svelte-put/clickoutside

stable

cloudflare-turnstile

action for rendering Cloudflare turnstile into HTML node

@svelte-put/cloudflare-turnstile

new

copy

action & utilities to copy text to clipboard

@svelte-put/copy

stable

dragscroll

action to add "drag-to-scroll" behavior

@svelte-put/dragscroll

stable

inline-svg

solution for inlining SVGs in svelte land

@svelte-put/inline-svg

stable

intersect

svelte action that wraps for IntersectionObserver

@svelte-put/intersect

stable

lockscroll

locking scroll and hide scrollbar within an HTML element

@svelte-put/lockscroll

stable

modal

type-safe async modal builder

@svelte-put/modal

stable

movable

move node on mousedown

@svelte-put/movable

stable

noti

type-safe and headless async notification builder

@svelte-put/noti

stable

preprocess-auto-slug

svelte preprocessor to add id attribute and anchor tag

@svelte-put/preprocess-auto-slug

stable

preprocess-inline-svg

svelte preprocessor to inline static svg at build time

@svelte-put/preprocess-inline-svg

stable

qr

render QR as img or svg, optionally with logo

@svelte-put/qr

stable

resize

svelte action that wraps for ResizeObserver

@svelte-put/resize

stable

shortcut

add keyboard shortcuts to node

@svelte-put/shortcut

stable

toc

action and utilities for building table of contents

@svelte-put/toc

stable

tooltip

over-engineered, type-safe, headless, and extensible tooltip builder via Svelte action

@svelte-put/tooltip

stable

Inspiration & Acknowledgement

There is already a great pool of svelte actions collected by Shawn and other contributors that you should check out. There might be some duplications here and there. However:

  • Shawn’s project aims to be a source for RFCs into Svelte; I believe stuff I am putting here should stay in user land.
  • I prefer having separate packages for their dedicated purposes (instead of one package that exports everything).
  • I want to incrementally include more than just actions int his collection.

For those reasons, a monorepo seems like a good fit, hence this project. To contribute or support the project, head over to the contributing page.

Happy coding! 👨‍💻

Edit this page on Github