Svelte Number Spinner

Overview

The Svelte Number Spinner is an innovative number input component designed to enhance user experience by allowing easy value adjustments through both mouse and keyboard interactions. With its recent updates, it has become more versatile than ever, including support for mobile devices. Whether you’re implementing simple functionality or need a more sophisticated control for numeric inputs, this component caters to various needs with its flexibility and user-friendly design.

This number spinner not only streamlines input processes but also offers customizable features that allow developers to tailor it to their specific applications. It serves as a reliable choice for anyone looking to integrate efficient number selection within their Svelte projects.

Features

• Highly Configurable: Customize values through various props like min, max, step, and precision to suit any use case.
• Keyboard and Mouse Support: Users can adjust the number easily using the mouse or keyboard, with contextual steps varying by holding Alt or Alt+Shift.
• Touch Support: Fully optimized for mobile devices with touch, making it accessible for all users regardless of the platform.
• Numerous Input Formats: Handle number inputs with options for decimals and formatting functions to suit different scenarios.
• Flexible Interaction Modes: Choose between horizontal and vertical dragging for input, allowing for intuitive control based on user preference.
• Custom Styling Options: Apply custom styles for various states, including focused and editing, to match your application’s design aesthetics.
• Circular Range: Optionally enable a circular range, perfect for applications involving angles or time settings.
• Speed Adjustments: Control the speed of value changes during mouse drag, offering additional refinement for user interactions.