Piximi
  • Piximi
  • Development
    • How to develop for Piximi
      • Getting Started
      • Packages
      • React
      • Scripts & Lerna
      • FAQ
Powered by GitBook
On this page
  • Organization
  • Cascading Style Sheets (CSS)

Was this helpful?

Export as PDF
  1. Development
  2. How to develop for Piximi

React

How we use React in Piximi

Organization

Use the following directory structure for new React components:

Foo/Foo.css.ts
Foo/Foo.stories.tsx
Foo/Foo.test.tsx
Foo/Foo.tsx
Foo/index.ts

If your component has one or more child components, use the following directory structure:

Foo/Bar/Bar.css.ts
Foo/Bar/Bar.stories.tsx
Foo/Bar/Bar.test.tsx
Foo/Bar/Bar.tsx
Foo/Bar/index.ts
Foo/Foo/Foo.css.ts
Foo/Foo/Foo.stories.tsx
Foo/Foo/Foo.test.tsx
Foo/Foo/Foo.tsx
Foo/Foo/index.ts
Foo/index.ts

A component shouldn’t publicly export any of their child components. In the previous example, Foo/index.ts should only export Foo:

export { Foo } from "./Foo";

Cascading Style Sheets (CSS)

import {Theme} from "@material-ui/core";
import {createStyles} from "@material-ui/styles";

export const styles = ({ palette, spacing }: Theme) => createStyles({});
PreviousPackagesNextScripts & Lerna

Last updated 5 years ago

Was this helpful?