styled-selector

Get static CSS(-in-JS) selectors from React components

Usage no npm install needed!

<script type="module">
  import styledSelector from 'https://cdn.skypack.dev/styled-selector';
</script>

README

styled-selector

Generated with nod NPM version Build Status Coverage Status

Get static CSS(-in-JS) selectors (like .sc-htpNat) from React components

Install

$ npm i styled-selector

Usage

Styled Components

import styled from "styled-components";
import s from "styled-selector";

const Comp = styled.div``;

s(Comp); // .sc-htpNat

Emotion

import styled, { css } from "react-emotion";
import s from "styled-selector";

const Comp = styled("div")``;

s(Comp); // .css-htpNat

const className = css``;

s(className); // .css-htpNat

Reuse

import styled from "styled-components";
import use from "reuse";
import s from "styled-selector";

const Comp = use(styled.div``);

s(Comp); // .sc-htpNat

Custom

import React from "react";
import s from "styled-selector";

const Comp = () => <div id="foo" />;
Comp.selector = "#foo";

s(Comp); // #foo

License

MIT © Haz