Type alias Styled<TTheme>

Styled<TTheme>: { global: (<TExtraProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TExtraProps, readonly [TTheme]>) => VFC<TExtraProps>); mixin: (<TProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TProps>) => StyleMixin<TProps>); <TComponent>(component: TComponent, displayName?: string): StyleTaggedTemplateFunction<ComponentProps<TComponent>, TTheme> }

Type Parameters

Type declaration

    • <TComponent>(component: TComponent, displayName?: string): StyleTaggedTemplateFunction<ComponentProps<TComponent>, TTheme>
    • The styled API returned by the createStyled factory function.

      Create's a styled component when called as a function.

      const StyledComponent = styled('div')``;
      const StyledComponent = styled('div')<ExtraProps>``;

      See also:

      • Styled.global styled.global for creating global styles
      • Styled.mixin styled.mixin for creating style mixins.

      Type Parameters

      • TComponent extends keyof IntrinsicElements | JSXElementConstructor<any>

      Parameters

      • component: TComponent
      • Optional displayName: string

      Returns StyleTaggedTemplateFunction<ComponentProps<TComponent>, TTheme>

  • Readonly global: (<TExtraProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TExtraProps, readonly [TTheme]>) => VFC<TExtraProps>)
      • <TExtraProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TExtraProps, readonly [TTheme]>): VFC<TExtraProps>
      • Create a global style component.

        const GlobalStyle = styled.global``;
        const GlobalStyle = styled.global<Props>``;

        Type Parameters

        • TExtraProps extends {} = {}

        Parameters

        • template: TemplateStringsArray
        • Rest ...values: StyleTemplateValues<TExtraProps, readonly [TTheme]>

        Returns VFC<TExtraProps>

  • Readonly mixin: (<TProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TProps>) => StyleMixin<TProps>)
      • <TProps>(template: TemplateStringsArray, ...values: StyleTemplateValues<TProps>): StyleMixin<TProps>
      • Create a style mixin function.

        A style "mixin" is a function which returns a style string.

        const mixin = styled.mixin``;
        const mixin = styled.mixin<Props>``;

        Type Parameters

        • TProps extends {}

        Parameters

        Returns StyleMixin<TProps>

Generated using TypeDoc