@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

async-stack

type-safe and headless builder for async component stack

@svelte-put/async-stack

new

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

movable

move node on mousedown

@svelte-put/movable

stable

preaction

allow Svelte action to spread SSR-friendly attriutes

@svelte-put/preaction

beta

popover

Minimal and ssr-friendly enhancements to Popover API with idiomatic Svelte

@svelte-put/popover

new

preprocess-auto-slug

svelte preprocessor to add id attribute and anchor tag

@svelte-put/preprocess-auto-slug

stable

preprocess-external-link

svelte preprocessor to add appropriate attributes to anchor tags for external links

@svelte-put/preprocess-external-link

new

qr

render QR as img or svg, optionally with logo

@svelte-put/qr

stable

resize

Svelte action wrapper 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

swipeable

set up quick swipe gesture action on element

@svelte-put/swipeable

new

Inspiration & AcknowledgementThere

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