Nomadic People Migration

    cursor-flashlight
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.1 • Public • Published

    minified-gzipped-size

    cursor-flashlight 🔦

    A tiny library to add flashlight effect to your website 🔦

    Try it on CodeSandbox

    demo

    Note: The effect won't show on devices without mouse (e.g.: smartphones)

    Usage

    Simply import the module and enable the flashlight with the size of the flashlight circle.

    import { enable } from 'cursor-flashlight';
    
    enable({ size: '15vmax' });

    Example with React

    import React from 'react';
    import {
      enable,
      disable,
      isEnabled,
    } from 'cursor-flashlight';
    
    const App = () => {
      const handleToggleFlashlight = () => {
        if (isEnabled()) {
          disable()
        } else {
          enable({ size: '15vmax' })
        }
      }
    
      return (
        <div>
          Lorem ipsum stuffs
          <button onClick={handleToggleFlashlight}>Toggle flashlight</button>
        </div>
      )
    };

    Install

    npm i cursor-flashlight

    DownloadsWeekly Downloads

    5

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    9.5 MB

    Total Files

    23

    Last publish

    Collaborators

    • jackyef