insomnia/packages/insomnia-components
Jack Kavanagh 9c269f40cc
class to pure the second pass (#4831)
Co-authored-by: Dimitri Mitropoulos <dimitrimitropoulos@gmail.com>
2022-06-02 14:28:15 -04:00
..
src class to pure the second pass (#4831) 2022-06-02 14:28:15 -04:00
.eslintignore
.eslintrc.js
.gitignore
.npmignore
.nvmrc
jest.config.js
package-lock.json
package.json
README.md
svgr.config.js
tsconfig.build.json
tsconfig.json
vite.config.ts

insomnia-components

insomnia-components is a React component library of UI elements needed to build Insomnia.

SVGs

We use SVGR on the source SVGs to minify and convert them to React components. This conversion happens during npm run bootstrap.

The generated icons can automatically be bound to the theme library built into Insomnia, by following a few rules. In the source SVG:

  1. All background colors should be black (#000)
  2. All foreground colors should be white (#FFF)

SVGR converts these colors to fill='' and fill='currentColor' respectively. These icons are exposed via svg-icon.js, which sets the css fill and color of the SVG according to the required theme.