How to use create-emotion - 5 common examples

import createEmotion from 'create-emotion'

// $ExpectType Emotion
const emotion0 = createEmotion()
// $ExpectType Emotion
const emotion1 = createEmotion({
  container: document.head !== null ? document.head : undefined,
  nonce: 'fasefw'
})

// $ExpectError
createEmotion('abc')
// $ExpectError
createEmotion({}, undefined as any)

const {
  flush,
  hydrate,
  cx,
  merge,

import createEmotion from 'create-emotion'

// $ExpectType Emotion
const emotion0 = createEmotion()
// $ExpectType Emotion
const emotion1 = createEmotion({
  container: document.head !== null ? document.head : undefined,
  nonce: 'fasefw'
})

// $ExpectError
createEmotion('abc')
// $ExpectError
createEmotion({}, undefined as any)

const {
  flush,
  hydrate,
  cx,
  merge,
  getRegisteredStyles,
  css,

import createEmotion from 'create-emotion'

// $ExpectType Emotion
const emotion0 = createEmotion()
// $ExpectType Emotion
const emotion1 = createEmotion({
  container: document.head !== null ? document.head : undefined,
  nonce: 'fasefw'
})

// $ExpectError
createEmotion('abc')
// $ExpectError
createEmotion({}, undefined as any)

const {
  flush,
  hydrate,
  cx,
  merge,
  getRegisteredStyles,
  css,
  injectGlobal,
  keyframes,
  sheet,
  cache
} = emotion0

if (context.__CATALOG_EMOTION_INSTANCE__ === undefined) {
  context.__CATALOG_EMOTION_INSTANCE__ = {};
}

export const {
  flush,
  hydrate,
  cx,
  merge,
  getRegisteredStyles,
  injectGlobal,
  keyframes,
  css,
  sheet,
  caches
} = createEmotion(context.__CATALOG_EMOTION_INSTANCE__, {
  // The key option is required when there will be multiple instances in a single app
  key: "catalog"
});

function createEmotionInstance() {
  const head = document.head;
  const config = {
    container: document.createElement('div'),
    key: 'leafygreen-ui',
  };

  head.insertBefore(config.container, head.firstChild);

  return createEmotion(config);
}