CSS Class associated with the current component.

const button = style({
  base: css({
    color: "DarkSlateGray"
  })
})

<div className={button()} />

To be used as resolve within config.rules:

{
  rules: [
    // label?prop=value&other=propValue
    // if the style has base eg no prop is required
    ['label(\\?.+)?', style( /* ... *\/ )],

    // if the style requires at least one prop
    ['label\\?(.+)', style( /* ... *\/ )],
  ]
}

The first group is used to extract the props using !URLSearchParams | URLSearchParams.

CSS Class associated with the current component.

const button = style({
  base: css`
    color: "DarkSlateGray"
  `
})

<div className={button.className} />

CSS Selector associated with the current component.

const button = style({
  base: css({
    color: "DarkSlateGray"
  })
})

const Card = styled({
  base: css`
    & ${button.selector} {
      boxShadow: "0 0 0 5px"
    }
  `
})