Svelte Put

screenshot of Svelte Put
svelte
vite

Useful svelte stuff to put in your projects

Overview:

The @svelte-put library includes multiple packages that provide useful functionality for Svelte projects. These packages have self-managed release cycles and are listed below. Each package offers a specific feature, such as avatar components, click outside events, copying text to clipboard, drag-to-scroll behavior, and more. The library also includes documentation for each package, making it easy to understand and implement these features in your Svelte projects.

Features:

  • @svelte-put/avatar: Provides components and utilities for avatar images.
  • @svelte-put/clickoutside: Triggers an event when clicking outside a specific node.
  • @svelte-put/copy: Allows copying text to the clipboard.
  • @svelte-put/dragscroll: Adds drag-to-scroll behavior to elements.
  • @svelte-put/intersect: A wrapper for IntersectionObserver, useful for tracking when an element enters or exits the viewport.
  • @svelte-put/inline-svg: Dynamically inserts SVGs into the DOM.
  • @svelte-put/lockscroll: Locks the scroll and hides the scrollbar on a specific element.
  • @svelte-put/modal: Builds type-safe asynchronous modals.
  • @svelte-put/movable: Allows moving a node when it's clicked or dragged.
  • @svelte-put/noti: Builds type-safe and headless asynchronous notification components.
  • @svelte-put/preprocess-auto-slug: Automatically adds an ID and anchor to selected nodes during Svelte preprocessing.
svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

Stylelint

Stylelint is a modern linter for CSS that helps you avoid errors and enforce consistent styling conventions. It provides rules for detecting errors and warnings, and can be configured to match your specific project's requirements.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.