soundmolto/goku-design-system

Design system for SoundMolto, written for Preact X (Will be hosted once a CI/CD situation is sorted out)

Goku Design System

Design system for SoundMolto products.

Very WIP, lots of things need to be implemented.

Requirements

• Accessible by default (provide support for disabling animations, controls for increasing word spacing etc)
• Small (Components should never exceed 10kb)
• Fast (Threaded if they are heavy)
• Bleeding edge now, stable by the time it's finished.
• Easy to onboard developers

TODO

(everything)

• Add custom addons that will add in support for the following

  • Toggle dark/light theme
  • Toggle no-animation mode
  • Toggle waveform on & off for profile view
  • Toggle other states as i find them

• Sidebar

• Appbar

• Card

• Panel

• Input

• Button

• Form

• WebAudio (w/ a dash of sugar)

• Waveform (interactable waveform)

• Scrub (a trackbar that you can "scrub" through to set the current time in a track)

• Scrollable List (eg/ React Window)

  • Filterable List
  • Sortable List

• Charts

• Modal

• Avatar

• Image (w/ basic things like lazy loading etc)

• Floating panel

• Sliding Panel

• Timeline

• Badge

• Bubble text (text component that has a background w/ curved borders to make it kinda bubbled)

• Icons