@lightspeed/cirrus

Cirrus, all inclusive

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@lightspeed/cirrus
7.5.03 years ago5 years agoMinified + gzip package size for @lightspeed/cirrus in KB

Readme

Cirrus components
A package containing all Cirrus React components.
Refer to main README for usage.

Building Cirrus for production

Both steps are self contained in their own command.
To build, run the following command:
yarn build

This will do the followng in order:
  • automatically flush the dist folder
  • generate icons/flags into their respective component folder
  • transpile any files within the src folder
  • copy straggler files based on a pre-defined whitelist (e.g: json files)

Please note, that during the transpilation phase, the story.js file and whatever files contained within a folder named examples will be ignored.
You may notice that there are empty folders that get outputted into the dist folder. These will get auto ignored during the publish phase.

Publishing Cirrus

First, make sure you've went through the release workflow, skip step 3 (npm publish)
Then, to publish, run the following command:
yarn release

This will build and publish the recently built components.
If you didn't properly bump the version, npm will throw an error. So no need to worry of squashing a previously published version.

Styled System Props

| Component Name | styled-system props | | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ | | Alert | space | | Bone | space | | | width | | | bgColor | | Button | space | | Card | colors | | CardSection | space | | Box | space | | | width | | | fontSize | | | colors | | Flex (extends Box) | flex, flexWrap, flexDirection, alignItems, justifyContent | | Divider | space | | Group | flex, justifyContent | | GroupItem | flex | | | width | | GroupAddon | width | | Logo | width | | Text | fontSize | | | space | | | fontFamily, textAlign, fontWeight, letterSpacing, lineHeight | | | textTransform (custom property that takes any text-transform values) | | | fontSize | | | textColor | | | fontSize |