JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 27
  • Score
    100M100P100Q60146F
  • License MIT

A React

Package Exports

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (srotas) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    Srotas Logo

    Srotas πŸ”

    Node.js Version TypeScript React Vite License

    Srotas (ΰ€Έΰ₯ΰ€°ΰ₯‹ΰ€€ΰ€Έΰ₯) is a lightweight React-friendly utility library offering a set of reusable event handler functions. It helps developers avoid boilerplate code by offering common event handling patterns β€” debouncing, throttling, blocking key presses, preventing right clicks, and more.

    The name Srotas β€” derived from Sanskrit β€” means β€œstream” or β€œflow”, a poetic nod to the flow of events this library elegantly manages.


    Features 🌊

    • 🎯 Focused API: Tiny, purposeful, and highly reusable event utilities.
    • πŸ’‘ Typed Handlers: Built with full TypeScript support and IDE autocompletion.
    • βš›οΈ React-Ready: Designed for seamless integration in React apps.
    • ⚑ Zero Dependencies: Tree-shakable and dependency-free.
    • πŸ§ͺ Dev-First: Built with Vite, TypeScript, and tested for production use.

    Installation πŸ“¦

    npm install srotas
    # or
    yarn add srotas
    # or
    pnpm add srotas

    Usage βš™οΈ

    import {
      preventDefaultOnly,
      stopPropagationOnly,
      preventAndStopEvent,
      debounceEvent,
      throttleEvent,
    } from "srotas";
    
    <button onClick={preventAndStopEvent}>Click</button>

    You can also use more advanced handlers like:

    <input
      onKeyDown={(e) => blockKeyPress(e, ["Enter", "Escape"])}
      onChange={debounceEvent((e) => handleInputChange(e), 300)}
    />

    Exports πŸ“€

    General Handlers

    preventDefaultOnly(e)
    stopPropagationOnly(e)
    preventAndStopEvent(e)

    Debug Handlers

    logEventDetails(e)

    Context-Specific Handlers

    preventRightClick(e)
    focusElement("#input-id")
    preventDrag(e)
    blockKeyPress(e, ["Enter", "Escape"])

    Utility Handlers

    debounceEvent(handlerFn, delay)
    throttleEvent(handlerFn, limit)

    All handlers are strongly typed and compatible with React's synthetic events.


    Project Structure πŸ“‚

    srotas/
    β”œβ”€β”€ src/               # Source files
    β”‚   β”œβ”€β”€ handlers/      # All utility/event handler functions
    β”‚   └── index.ts       # Entry point for all exports
    β”œβ”€β”€ tests/             # Unit tests
    β”œβ”€β”€ dist/              # Bundled output (auto-generated)
    β”œβ”€β”€ vite.config.ts     # Vite configuration
    β”œβ”€β”€ tsconfig.json      # TypeScript config
    β”œβ”€β”€ package.json       # Package metadata
    β”œβ”€β”€ LICENSE.md         # MIT License
    └── README.md          # Project documentation

    Scripts πŸš€

    # Build the package
    npm run build
    
    # Formatting code
    npm run format
    
    # Lint for errors
    npm run lint

    License πŸ“œ

    This project is licensed under the MIT License. See the LICENSE file for details.


    Acknowledgments πŸ™

    • Inspired by repetitive patterns seen across frontend projects β€” especially in form handling, keyboard interactivity, and user inputs.
    • The name Srotas reflects the idea of controlling streams and flows β€” whether of data, events, or user interaction.
    • Built with 🧑 by Tejas and open to contributions.