How to use the react-jss/lib/jss.SheetsRegistry function in react-jss

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

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github adrivelasco / graphql-pwa-workshop / server / app / renderHtml / mui-theme.js View on Github external
constructor() {
    // Create a sheetsRegistry instance.
    this.sheetsRegistry = new SheetsRegistry();

    // Create a theme instance.
    this.theme = createMuiTheme({
      palette: {
        primary: green,
        accent: red,
        type: 'light'
      }
    });

    this.generateClassName = createGenerateClassName();
    this.grabCss = this.grabCss.bind(this);
  }
github goemonjs / goemon / src / client / base / common / route.tsx View on Github external
export function renderOnServer(componant, theme, req, context, store) {

  // Create a sheetsRegistry instance.
  const sheetsRegistry = new SheetsRegistry();

  const generateClassName = createGenerateClassName();

  const html = renderToString(
    
      
        
          
            {componant}
          
        
      
    
  );

  const css = sheetsRegistry.toString();
github glassechidna / practical-react-ssr / src / server / index.js View on Github external
function render(req: $Subtype<$Request>, res: $Response) {
	const history = createHistory({initialEntries: [req.path]})
	const initialPath = history.location.pathname

	const store = createStore(history)

	const jss = createJss(jssPreset())

	const sheetsRegistry = new SheetsRegistry()

	const matchedRoute = flattenedRoutes.find(route => matchPath(req.url, routeProps(route)))
	const promises = []

	if (matchedRoute && matchedRoute.loadData) {
		promises.push(...matchedRoute.loadData.map(loadData => loadData(store.dispatch, req, res)))
	}

	return Promise.all(promises).then(() => {
		// Server's node instance can't reload files (HMR is for serving files to the client) so SSR is disabled during development to avoid getting out of sync.
		const html = renderToString(
github elmadev / elmaonline-site / src / server.js View on Github external
// You can access redux through react-redux connect
      store,
      storeSubscription: null,
      // Apollo Client for use with react-apollo
      client: apolloClient,
    };

    const route = await router.resolve(context);

    if (route.redirect) {
      res.redirect(route.status || 302, route.redirect);
      return;
    }

    const data = { ...route };
    const sheetsRegistry = new SheetsRegistry();
    const sheetsManager = new Map();
    const generateClassName = createGenerateClassName();

    const rootComponent = (
      
        
          
            {route.component}
          
        
      
    );
    await getDataFromTree(rootComponent);
github react-static / react-static / archives / old-examples / material-ui / static.config.js View on Github external
renderToHtml: (render, Comp, meta) => {
    // Create a sheetsRegistry instance.
    const sheetsRegistry = new SheetsRegistry()

    // Create a MUI theme instance.
    const muiTheme = createMuiTheme(theme)

    const generateClassName = createGenerateClassName()

    const html = render(
      
        
          
        
      
    )

    meta.jssStyles = sheetsRegistry.toString()
github goemonjs / goemon / src / routes / member.tsx View on Github external
router.get('*', isAuthenticated, (req, res) => {
  const sheetsRegistry = new SheetsRegistry();

  // Set initial state of store
  let initialState = InitialState;
  initialState.memberState.displayName = req.user.displayName;
  const store = configureStore(InitialState);

  // Component
  const component = (req, store, i18n) => {
    return (
      
        
      
    );
  };

  const cssGenerator = () => {
github verekia / js-stack-boilerplate / src / _server / render-page.js View on Github external
const renderPage = (ctx: Object, pageData?: Object = {}) => {
  const sheetsRegistry = new SheetsRegistry()
  const generateClassName = createGenerateClassName()
  const store = createStore(() => ({ page: pageData, general: getGeneralData(ctx) }))
  const routerContext = {}
  const appHtml = ReactDOMServer.renderToString(
    
      
        
          
            
          
        
      
    ,
  )
  if (routerContext.action === 'REPLACE') {
    ctx.redirect(routerContext.url)
github ErikDakoda / vulcan-material-ui / server / wrapWithMuiTheme.jsx View on Github external
function wrapWithMuiTheme (app, { req, res, store, apolloClient }) {
  const sheetsRegistry = new SheetsRegistry();
  req.sheetsRegistry = sheetsRegistry;
  
  const sheetsManager = new Map();

  const theme = getCurrentTheme();
  
  const generateClassName = createGenerateClassName({ seed: '0' });
  
  return (
    
      
        
          {app}