How to use the astroturf.styled function in astroturf

To help you get started, we’ve selected a few astroturf examples, based on popular ways it is used in public projects.

github 4Catalyzer / astroturf / test / __file_snapshots__ / loader__with-props.js View on Github external
import { styled } from "astroturf";

const RedPasswordInput = /*#__PURE__*/ styled("input", null, {
  displayName: "RedPasswordInput",
  styles: require("./with-props-RedPasswordInput.css"),
  attrs: props => ({ ...props, type: "password" }),
  vars: []
});

const RedPasswordInput2 = /*#__PURE__*/ styled("input", null, {
  displayName: "RedPasswordInput2",
  styles: require("./with-props-RedPasswordInput2.css"),
  attrs: p => ({
    type: "password"
  }),
  vars: []
});
github 4Catalyzer / astroturf / test / fixtures / with-props.js View on Github external
import { styled } from 'astroturf';

const RedPasswordInput = styled('input').attrs({ type: 'password' })`
  background-color: red;
`;

const RedPasswordInput2 = styled('input').attrs(p => ({
  type: 'password',
}))`
  background-color: red;
`;
github 4Catalyzer / astroturf / test / fixtures / hoist-import.js View on Github external
import { styled } from 'astroturf';

const ButtonBase = styled('button')`
  @import '~./styles/mixins.scss';

  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
`;
github 4Catalyzer / astroturf / test / fixtures / with-props.js View on Github external
import { styled } from 'astroturf';

const RedPasswordInput = styled('input').attrs({ type: 'password' })`
  background-color: red;
`;

const RedPasswordInput2 = styled('input').attrs(p => ({
  type: 'password',
}))`
  background-color: red;
`;
github 4Catalyzer / astroturf / test / __file_snapshots__ / loader__with-props.js View on Github external
import { styled } from "astroturf";

const RedPasswordInput = /*#__PURE__*/ styled("input", null, {
  displayName: "RedPasswordInput",
  styles: require("./with-props-RedPasswordInput.css"),
  attrs: props => ({ ...props, type: "password" }),
  vars: []
});

const RedPasswordInput2 = /*#__PURE__*/ styled("input", null, {
  displayName: "RedPasswordInput2",
  styles: require("./with-props-RedPasswordInput2.css"),
  attrs: p => ({
    type: "password"
  }),
  vars: []
});

astroturf

Extract and process inline CSS literals in JavaScript files

MIT
Latest version published 8 months ago

Package Health Score

64 / 100
Full package analysis