@ellentorg/possimus-eius-quos v3.14.129
Compiled
A familiar and performant compile time CSS-in-JS library for React.
Usage
import { styled, ClassNames } from '@ellentorg/possimus-eius-quos';
// Tie styles to an element
<div css={{ color: 'purple' }} />
// Create a component that ties styles to an element
const StyledButton = styled.button`
color: ${(props) => props.color};
`;
// Use a component where styles are not necessarily tied to an element
<ClassNames>
{({ css }) => children({ className: css({ fontSize: 12 }) })}
</ClassNames>
Extract styles
Turn on extraction and all components styled in your app and sourced through NPM will have their runtime stripped and styles extracted to an atomic style sheet.
-import { CC, CS } from '@ellentorg/possimus-eius-quos/runtime';
-
-const _2 = '._syaz1q9v{color: hotpink}';
-const _ = '._1wybfyhu{font-size: 48px}';
-
export const LargeHotPinkText = () => (
- <CC>
- <CS>{[_, _2]}</CS>
<span className="_syaz1q9v _1wybfyhu">Hello world</span>
- </CC>
);
._1wybfyhu {
font-size: 48px;
}
._syaz1q9v {
color: hotpink;
}
See CSS extraction for more information.
Installation
Install the React package.
npm install @ellentorg/possimus-eius-quos
Then configure your bundler of choice or use Babel directly.
Webpack
Install the Webpack loader.
npm install @compiled/webpack-loader --save-dev
See installation for more information.
Parcel
Install the Parcel v2 configuration.
npm install @compiled/parcel-config --save-dev
Extend from the .parcelrc
configuration:
{
"extends": ["...", "@compiled/parcel-config"]
}
See installation for more information.
Babel
Install the Babel plugin.
npm install @compiled/babel-plugin --save-dev
See installation for more information.
Contributions
Contributions are welcomed! Please see CONTRIBUTING.md to get started.
11 months ago
1 year ago
11 months ago
1 year ago
11 months ago
11 months ago
11 months ago
11 months ago
1 year ago
11 months ago
1 year ago
1 year ago
11 months ago
11 months ago
11 months ago
1 year ago
11 months ago
1 year ago
11 months ago
11 months ago
1 year ago
11 months ago
1 year ago
11 months ago
1 year ago
10 months ago
10 months ago
11 months ago
11 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
1 year ago
10 months ago
1 year ago
1 year ago
1 year ago
1 year ago
10 months ago
10 months ago
10 months ago
12 months ago
12 months ago
12 months ago
12 months ago
11 months ago
11 months ago
1 year ago
1 year ago
11 months ago
11 months ago
12 months ago
12 months ago
11 months ago
11 months ago
12 months ago
1 year ago
12 months ago
1 year ago
12 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
11 months ago
11 months ago
1 year ago
1 year ago
11 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
10 months ago
10 months ago
1 year ago
10 months ago
1 year ago
1 year ago
12 months ago
1 year ago
1 year ago
12 months ago
12 months ago
1 year ago
12 months ago
1 year ago
1 year ago
12 months ago
1 year ago
1 year ago
12 months ago
12 months ago
12 months ago
12 months ago
12 months ago
11 months ago
11 months ago
11 months ago
11 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago