StyletronServer

StyletronServer

A Styletron class for extracting styles during server-side rendering

Constructor

new StyletronServer()

Source:

Create a new StyletronServer instance

Extends

Methods

getStylesheets() → {Array}

Source:

Get an array of stylesheet objects

Example
const styletron = new StyletronServer();

styletron.injectDeclaration({prop: 'color', val: 'red'});
// → 'a'
styletron.getStylesheets();
// → [{css: '.a{color:red}'}]
Returns:

Array of stylesheet objects

Type
Array

getStylesheetsOldIE() → {Array}

Source:

Get an array of stylesheet objects, with ≤IE9 limit of max 4095 rules per stylesheet

Example
const styletron = new StyletronServer();

styletron.injectDeclaration({prop: 'color', val: 'red'});
// → 'a'
styletron.getStylesheetsOldIE();
// → [{css: '.a{color:red}'}]
Returns:

Array of stylesheet objects

Type
Array

getStylesheetsHtml(className) → {String}

Source:

Get a string of style elements for server rendering

Example
const styletron = new StyletronServer();
styletron.injectDeclaration({prop: 'color', val: 'red'});
// → 'a'
styletron.getStylesheetsHtml();
// → '<style class="_styletron_hydrate_">.a{color:red}</style>'
styletron.getStylesheetsHtml('custom_class');
// → '<style class="custom_class">.a{color:red}</style>'
Parameters:
Name Type Default Description
className String _styletron_hydrate_

Class name for style elements
Returns:

The string of HTML

Type
String

getStylesheetsHtmlOldIE(className) → {String}

Source:

Get a string of style elements for server rendering, with ≤IE9 limit of max 4095 rules per sheet

Example
const styletron = new StyletronServer();
styletron.injectDeclaration({prop: 'color', val: 'red'});
// → 'a'
styletron.getStylesheetsHtml();
// → '<style class="_styletron_hydrate_">.a{color:red}</style>'
styletron.getStylesheetsHtml('custom_class');
// → '<style class="custom_class">.a{color:red}</style>'
Parameters:
Name Type Default Description
className String _styletron_hydrate_

Class name for style elements
Returns:

The string of HTML

Type
String

getCss() → {String}

Source:

Get the CSS string. For hydrating styles on the client, getStylesheetsHtml or getStylesheets should be used instead.

Example
const styletron = new StyletronServer();

styletron.injectDeclaration({prop: 'color', val: 'red'});
// → 'a'
styletron.getCss();
// → '.a{color:red}'
Returns:

The string of CSS

Type
String

injectDeclaration(decl) → {string|undefined}

Source:
Overrides:

Injects a declaration (if not already injected) and returns a class name

Parameters:
Name Type Description
decl object

The CSS declaration object

Properties
Name Type Attributes Description
prop string

The property name
val string

The property value
media string <optional>

The media query
pseudo string <optional>

The pseudo selector
Returns:

The class name for the declaration

Type
string | undefined