expo/styleguide

Foundational styles for Expo interfaces.

@expo/styleguide-*

A collection of packages used to share styles and icons across Expo websites and projects.

Get started

1. Install dependencies with

   yarn

2. Configure styleguide-icons. Read packages/styleguide-icons/README.md to set up your credentials (Expo staff only) to generate icons.

3. Build the packages with

   yarn build

   It can take several minutes to build the icons package.

4. Develop with

   yarn dev

styleguide's Issues

Add Storybook package

Add styleguide-storybook (for web), and show colors, shadows, icons, etc.

Update READMEs of packages

We should describe how to get started and what you can do with each package's exports.

Investigate a better way to publish these packages

I converted the repo to use changesets. This library should work in theory but there are a few issues:

• I have to run yarn create:release, which creates a changeset file with the proposed changes. (not an issue)
• Then I have to run yarn version, which incorrectly adds a version to the base repo's package.json. I've tried ignoring it in the changesets config. I've also looked at other repos with changesets and they don't seem to have this issue. Once I add a random (unused git tag) number, then it will correctly version the other two packages (styleguide and styleguide-native).
• Finally, I have to run a command like yarn publish:patch. I'm not entirely sure we need this command. (sort of an issue, but more user error than an issue with changesets)

Ideally, I'd like to run one command yarn publish:patch or similar to version all packages and publish them, like we used to do with lerna. We could bring back lerna just for publishing. There might also be another solution. This issue is to investigate what options there are to see what will work for us.

Export Theme type from styleguide-native

When using styleguide-native, it's helpful to have a type for the theme object exported. Create that type and export it alongside the other imports for that package.

Centralize colors into a common package that other packages reference

We export colors in styleguide and styleguide-native. Each are manually configured. When we want to add a new theme color, there will be multiple places in multiple packages to update. Instead, we could make a new package, styleguide-colors, and have it export all color values needed. Then styleguide and styleguide-native can consume the colors and create the color objects they need when built.

Improve Duotone icons fill visibility in dark mode

Why

Ref: #61 (comment)