Svelte-Custom-Roulette

W.I.P

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",
  ]
</script>

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

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.