Luckybeard NPM

Luckybeard CLI

Luckybeard CLI is a cli tool-chain specifically created to assist developers. It makes use of various tools

Install Luckybeard CLI with npm

  npm install -g luckybeard

luckybeard list-components
luckybeard generate-components

luckybeard is used as-is and the author takes no responsibility for any loss or damages.

1st the responsive object will contain all of its modes right before the final value, i.e. responsive.screen.breakpoints = {desktop: 123, mobile: 11} instead of responsive.screen.breakpoints = 12
Once that object is built when generating the types, take the current version of the object, find the responsive key and each of its descendants that contain all of the modes as a child, then set the value equal to the first child so that we can determine the type correctly
generate the types using the temporary object theming.d.ts
now let's generate a ts export which is theme: ThemeType = {} and replace each of its values with its css selector equivalent
generate a css file - each theme has its own data-theme="mode" selector with nested media queries for responsiveness.
generate a css file containing all of the media queries for the responsive objects
make sure that font names can work as Figree instead of "Figtgree", we might have to generate string values as strings with quotes

optimize css generation by reducing media queries
generate css snippets or look at other means of intellisense when writing out css within css/scss files
tidy up functions and move them out to other files as theming/index.ts has become quite bloated
look at error handling during css generation
write tests to validate that output is correct
add better type support for things like modes, figma variables etc.