How to use the @emotion/weak-memoize function in @emotion/weak-memoize

To help you get started, we’ve selected a few @emotion/weak-memoize 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 emotion-js / emotion / packages / weak-memoize / __tests__ / index.js View on Github external
test('it works', () => {
  let doThing = weakMemoize(obj => {
    return {}
  })

  let firstArg = {}

  let firstResult = doThing(firstArg)

  let secondResult = doThing(firstArg)

  expect(firstResult).toBe(secondResult)

  let newObj = {}

  let newResult = doThing(newObj)

  expect(newResult).not.toBe(firstResult)
github emotion-js / emotion / packages / cache / src / index.js View on Github external
: weakMemoize(() => {
      let getCache = weakMemoize(() => ({}))
      let prefixTrueCache = {}
      let prefixFalseCache = {}
      return prefix => {
        if (prefix === undefined || prefix === true) {
          return prefixTrueCache
        }
        if (prefix === false) {
          return prefixFalseCache
        }
        return getCache(prefix)
      }
    })
github blocks / blocks / packages / blocks-ui / src / device-preview.js View on Github external
useRef,
  useState
} from 'react'
import { createPortal } from 'react-dom'
import { ZoomIn, ZoomOut } from 'react-feather'
import mergeRefs from 'react-merge-refs'
import { CacheProvider, Global } from '@emotion/core'
import createCache from '@emotion/cache'
import weakMemoize from '@emotion/weak-memoize'

import { IconButton } from './ui'
import { useScrollSync } from './hooks'

const MIN_ZOOM_LEVEL = 25

const createCacheWithContainer = weakMemoize(container =>
  createCache({ container })
)

const Frame = ({ children, setFrame, ...restProps }) => {
  const frameRef = useRef()
  const [[head, body], setNodes] = useState([])
  useLayoutEffect(() => {
    setFrame(frameRef.current)
  })
  useLayoutEffect(() => {
    const { contentDocument } = frameRef.current
    setFrame(frameRef.current)
    setNodes([contentDocument.head, contentDocument.body])
  }, [])
  return (
github emotion-js / emotion / packages / theme / src / index.js View on Github external
let merge = weakMemoize(theme => {
    return weakMemoize(theme)
  })
github emotion-js / emotion / next-packages / provider / src / index.js View on Github external
}
    return mergedTheme
  }
  if (
    process.env.NODE_ENV !== 'production' &&
    Object.prototype.toString.call(theme) !== '[object Object]'
  ) {
    throw new Error(
      '[@emotion/provider] Please make your theme prop a plain object'
    )
  }

  return { ...outerTheme, ...theme }
}

let createCreateCacheWithTheme = weakMemoize(cache => {
  return weakMemoize(theme => {
    let actualTheme = getTheme(cache.theme, theme)
    return {
      ...cache,
      theme: actualTheme
    }
  })
})

export default withCSSContext((props: Props, context) => {
  if (props.theme !== context.theme) {
    context = createCreateCacheWithTheme(context)(props.theme)
  }
  return {props.children}
})
github emotion-js / emotion / packages / cache / src / index.js View on Github external
type StylisPlugins = StylisPlugin[] | StylisPlugin

export type Options = {
  nonce?: string,
  stylisPlugins?: StylisPlugins,
  prefix?: PrefixOption,
  key?: string,
  container?: HTMLElement,
  speedy?: boolean
}

let rootServerStylisCache = {}

let getServerStylisCache = isBrowser
  ? undefined
  : weakMemoize(() => {
      let getCache = weakMemoize(() => ({}))
      let prefixTrueCache = {}
      let prefixFalseCache = {}
      return prefix => {
        if (prefix === undefined || prefix === true) {
          return prefixTrueCache
        }
        if (prefix === false) {
          return prefixFalseCache
        }
        return getCache(prefix)
      }
    })

let createCache = (options?: Options): EmotionCache => {
  if (options === undefined) options = {}
github emotion-js / emotion / packages / emotion-theming / src / theme-provider.js View on Github external
}
    return mergedTheme
  }
  if (
    process.env.NODE_ENV !== 'production' &&
    (theme == null || typeof theme !== 'object' || Array.isArray(theme))
  ) {
    throw new Error(
      '[ThemeProvider] Please make your theme prop a plain object'
    )
  }

  return { ...outerTheme, ...theme }
}

let createCacheWithTheme = weakMemoize(outerTheme => {
  return weakMemoize(theme => {
    return getTheme(outerTheme, theme)
  })
})

type Props = {
  theme: Object | (Object => Object),
  children: React.Node
}

let ThemeProvider = (props: Props) => {
  return (
    
      {theme => {
        if (props.theme !== theme) {
          theme = createCacheWithTheme(theme)(props.theme)
github emotion-js / emotion / packages / theme / src / index.js View on Github external
function renderInnerCSSVarsProvider(theme: Theme, children: React.Node) {
    return (
      
        
          <div style="{getInlineStyles(theme," data-theme-emotion="{prefix}">
            {children}
          </div>
        
      
    )
  }
  let isStringTheme = typeof defaultTheme === 'string'
  let merge = weakMemoize(theme =&gt; {
    return weakMemoize(theme)
  })

  let Provider = (props: ProviderProps) =&gt; {
    let { theme, children } = props
    if (shouldUseCSSVars) {
      if (typeof theme === 'function') {
        return (
          
            {outerTheme =&gt; {
              return renderInnerCSSVarsProvider(
                (isStringTheme ? theme : merge(theme))(outerTheme),
                children
              )
            }}

@emotion/weak-memoize

A memoization function that uses a WeakMap

MIT
Latest version published 4 months ago

Package Health Score

84 / 100
Full package analysis

Popular @emotion/weak-memoize functions

Similar packages