Skip to content

colinwilliams91/svelte-custom-roulette

 
 

Repository files navigation

Svelte-Custom-Roulette


As of 6/16/23 this Library is release (v0.1.1). It is stable and can accept props, however, custom labels need to be rotated. published npm package


Installation

$ npm i svelte-custom-roulette

Quick Start

<script>
  import { Wheel } from "svelte-custom-roulette";

  const items = [
    "item 1",
    "item 2",
    "item 3",
  ]

  <Wheel
    {items}
    size={800}
    textColor="black"
    pointerColor="purple"
    pointerSize={60}
    >

</script>

API

Props Type Default Description
items String[] ["yes", "no", "maybe"] pass an array to populate wheel segments with custom items to documentation inside the README
size Number 400 pass a number for the size of the wheel, aspect ratio is 1
colors String[] [randomly generated === items.length] pass an array of strings representing the colors you would like to override wheel segments. this prop is experimental
textColor String "white" pass a color to override the color of wheel segments' text to documentation inside the README
pointerColor String "black" pass a string for the color of the pointer you want
pointerSize Number size / 8 pass a number to size the pointer in px to the center of the wheel, by default this will be 1/8 of the wheel size
pointerTextColor String "white" pass a string to set text color inside pointer




Contribute

The JoCo team warmly welcomes contributions to all of our Open Source projects. Svelte-Custom-Roulette's contribution protocol is as follows:

  • Star and Fork the repository
  • Create a feature branch
  • We are fans of Angular Git Commit Protocol so please, loosely, follow this structure; including header & body syntax including scope and files changed inside your commit message
  • Submit your Pull Request

License

Svelte Custom Roulette is MIT licensed. Please propogate within whatever circumstances you wish.

Releases

No releases published

Packages

No packages published

Languages

  • Svelte 88.5%
  • JavaScript 7.8%
  • HTML 3.7%