JSPM

dice-react-roller

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

A highly customizable dice roll package built in 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 (dice-react-roller) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    react-dice-roll

    A highly customizable dice roll package built in react.

    Live Demo

    Installation

    Use the package manager yarn to install react-dice-roll.

    yarn add react-dice-roll

    or using npm

    npm install react-dice-roll

    Usage

    import Dice from 'react-dice-roll';
    <Dice onRoll={(value) => console.log(value)} />

    Usage

    Prop Type Default Description
    rollingTime number 1000 Rolling time for dice in milliseconds
    onRoll (value) => void - Function which receives the values between 1 - 6 after the dice roll
    triggers string[] ['click'] Accepts an array of key strings which replaces the default trigger of dice roll onClick. Multiple key strings can be passed as an array including the click to use multiple triggers for dice roll key. eg: ['Enter', 'a', 'click']
    defaultValue number (1-6) 6 Default value of the dice before rolling
    size number 250 Dimensions of the dice in pixels
    sound string - URL for the sound to play on dice roll
    disabled boolean - Whether the dice is disabled or not
    faces string[] - Array of image urls for custom sides of the dice
    faceBg string - Custom background color for the dice face
    placement top-left, top-right, bottom-left, bottom-right - Placement of the device if put inside a relative positioned element
    cheatValue number (1-6) - Cheat Value for the dice. If passed, dice will always roll to this value
    externalTrigger boolean - Whether to use an external button to trigger or not, use useState to set it dynamically

    Contributing

    Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

    License

    MIT