Socket
Socket
Sign inDemoInstall

@emotion/cache

Package Overview
Dependencies
Maintainers
4
Versions
77
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@emotion/cache - npm Package Compare versions

Comparing version 11.11.0 to 11.12.0

3

dist/declarations/types/index.d.ts
// Definitions by: Junyoung Clare Jang <https://github.com/Ailrun>
// TypeScript Version: 2.2
/// <reference types="node" />
import { EmotionCache } from '@emotion/utils'

@@ -4,0 +7,0 @@

47

dist/emotion-cache.browser.esm.js

@@ -453,3 +453,7 @@ import { StyleSheet } from '@emotion/sheet';

var createCache = function createCache(options) {
var createCache = function
/*: EmotionCache */
createCache(options
/*: Options */
) {
var key = options.key;

@@ -467,3 +471,5 @@

Array.prototype.forEach.call(ssrStyles, function (node) {
Array.prototype.forEach.call(ssrStyles, function (node
/*: HTMLStyleElement */
) {
// we want to only move elements which have a space in the data-emotion attribute value

@@ -480,2 +486,3 @@ // because that indicates that it is an Emotion 11 server-side rendered style elements

}
document.head.appendChild(node);

@@ -489,3 +496,2 @@ node.setAttribute('data-s', '');

if (process.env.NODE_ENV !== 'production') {
// $FlowFixMe
if (/[^a-z-]/.test(key)) {

@@ -498,2 +504,4 @@ throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");

var container;
/* : Node */
var nodesToHydrate = [];

@@ -505,4 +513,6 @@

// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node
/*: HTMLStyleElement */
) {
var attrib = node.getAttribute("data-emotion").split(' ');

@@ -518,3 +528,10 @@ for (var i = 1; i < attrib.length; i++) {

var _insert;
/*: (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
) => string | void */
var omnipresentPlugins = [compat, removeLabel];

@@ -552,3 +569,13 @@

_insert = function insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: void */
insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
currentSheet = sheet;

@@ -558,3 +585,5 @@

currentSheet = {
insert: function insert(rule) {
insert: function insert(rule
/*: string */
) {
sheet.insert(rule + serialized.map);

@@ -573,3 +602,5 @@ }

var cache = {
var cache
/*: EmotionCache */
= {
key: key,

@@ -576,0 +607,0 @@ sheet: new StyleSheet({

84

dist/emotion-cache.cjs.dev.js

@@ -460,3 +460,17 @@ 'use strict';

/* import type { StylisPlugin } from './types' */
var isBrowser = typeof document !== 'undefined';
/*
export type Options = {
nonce?: string,
stylisPlugins?: StylisPlugin[],
key: string,
container?: HTMLElement,
speedy?: boolean,
prepend?: boolean,
insertionPoint?: HTMLElement
}
*/
var getServerStylisCache = isBrowser ? undefined : weakMemoize__default["default"](function () {

@@ -472,3 +486,7 @@ return memoize__default["default"](function () {

var createCache = function createCache(options) {
var createCache = function
/*: EmotionCache */
createCache(options
/*: Options */
) {
var key = options.key;

@@ -486,3 +504,5 @@

Array.prototype.forEach.call(ssrStyles, function (node) {
Array.prototype.forEach.call(ssrStyles, function (node
/*: HTMLStyleElement */
) {
// we want to only move elements which have a space in the data-emotion attribute value

@@ -499,2 +519,3 @@ // because that indicates that it is an Emotion 11 server-side rendered style elements

}
document.head.appendChild(node);

@@ -508,3 +529,2 @@ node.setAttribute('data-s', '');

if (process.env.NODE_ENV !== 'production') {
// $FlowFixMe
if (/[^a-z-]/.test(key)) {

@@ -517,2 +537,4 @@ throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");

var container;
/* : Node */
var nodesToHydrate = [];

@@ -524,4 +546,6 @@

// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node
/*: HTMLStyleElement */
) {
var attrib = node.getAttribute("data-emotion").split(' ');

@@ -537,3 +561,10 @@ for (var i = 1; i < attrib.length; i++) {

var _insert;
/*: (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
) => string | void */
var omnipresentPlugins = [compat, removeLabel];

@@ -571,3 +602,13 @@

_insert = function insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: void */
insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
currentSheet = sheet;

@@ -577,3 +618,5 @@

currentSheet = {
insert: function insert(rule) {
insert: function insert(rule
/*: string */
) {
sheet.insert(rule + serialized.map);

@@ -597,8 +640,13 @@ }

return stylis.serialize(stylis.compile(styles), _serializer);
}; // $FlowFixMe
};
var serverStylisCache = getServerStylisCache(stylisPlugins)(key);
var getRules = function getRules(selector, serialized) {
var getRules = function
/*: string */
getRules(selector
/*: string */
, serialized
/*: SerializedStyles */
) {
var name = serialized.name;

@@ -613,3 +661,13 @@

_insert = function _insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: string | void */
_insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
var name = serialized.name;

@@ -650,3 +708,5 @@ var rules = getRules(selector, serialized);

var cache = {
var cache
/*: EmotionCache */
= {
key: key,

@@ -653,0 +713,0 @@ sheet: new sheet.StyleSheet({

79

dist/emotion-cache.cjs.prod.js

@@ -352,3 +352,17 @@ 'use strict';

/* import type { StylisPlugin } from './types' */
var isBrowser = typeof document !== 'undefined';
/*
export type Options = {
nonce?: string,
stylisPlugins?: StylisPlugin[],
key: string,
container?: HTMLElement,
speedy?: boolean,
prepend?: boolean,
insertionPoint?: HTMLElement
}
*/
var getServerStylisCache = isBrowser ? undefined : weakMemoize__default["default"](function () {

@@ -364,3 +378,7 @@ return memoize__default["default"](function () {

var createCache = function createCache(options) {
var createCache = function
/*: EmotionCache */
createCache(options
/*: Options */
) {
var key = options.key;

@@ -374,3 +392,5 @@

Array.prototype.forEach.call(ssrStyles, function (node) {
Array.prototype.forEach.call(ssrStyles, function (node
/*: HTMLStyleElement */
) {
// we want to only move elements which have a space in the data-emotion attribute value

@@ -387,2 +407,3 @@ // because that indicates that it is an Emotion 11 server-side rendered style elements

}
document.head.appendChild(node);

@@ -397,2 +418,4 @@ node.setAttribute('data-s', '');

var container;
/* : Node */
var nodesToHydrate = [];

@@ -404,4 +427,6 @@

// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node
/*: HTMLStyleElement */
) {
var attrib = node.getAttribute("data-emotion").split(' ');

@@ -417,3 +442,10 @@ for (var i = 1; i < attrib.length; i++) {

var _insert;
/*: (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
) => string | void */
var omnipresentPlugins = [compat, removeLabel];

@@ -432,3 +464,13 @@

_insert = function insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: void */
insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
currentSheet = sheet;

@@ -449,8 +491,13 @@

return stylis.serialize(stylis.compile(styles), _serializer);
}; // $FlowFixMe
};
var serverStylisCache = getServerStylisCache(stylisPlugins)(key);
var getRules = function getRules(selector, serialized) {
var getRules = function
/*: string */
getRules(selector
/*: string */
, serialized
/*: SerializedStyles */
) {
var name = serialized.name;

@@ -465,3 +512,13 @@

_insert = function _insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: string | void */
_insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
var name = serialized.name;

@@ -496,3 +553,5 @@ var rules = getRules(selector, serialized);

var cache = {
var cache
/*: EmotionCache */
= {
key: key,

@@ -499,0 +558,0 @@ sheet: new sheet.StyleSheet({

84

dist/emotion-cache.esm.js

@@ -451,3 +451,17 @@ import { StyleSheet } from '@emotion/sheet';

/* import type { StylisPlugin } from './types' */
var isBrowser = typeof document !== 'undefined';
/*
export type Options = {
nonce?: string,
stylisPlugins?: StylisPlugin[],
key: string,
container?: HTMLElement,
speedy?: boolean,
prepend?: boolean,
insertionPoint?: HTMLElement
}
*/
var getServerStylisCache = isBrowser ? undefined : weakMemoize(function () {

@@ -463,3 +477,7 @@ return memoize(function () {

var createCache = function createCache(options) {
var createCache = function
/*: EmotionCache */
createCache(options
/*: Options */
) {
var key = options.key;

@@ -477,3 +495,5 @@

Array.prototype.forEach.call(ssrStyles, function (node) {
Array.prototype.forEach.call(ssrStyles, function (node
/*: HTMLStyleElement */
) {
// we want to only move elements which have a space in the data-emotion attribute value

@@ -490,2 +510,3 @@ // because that indicates that it is an Emotion 11 server-side rendered style elements

}
document.head.appendChild(node);

@@ -499,3 +520,2 @@ node.setAttribute('data-s', '');

if (process.env.NODE_ENV !== 'production') {
// $FlowFixMe
if (/[^a-z-]/.test(key)) {

@@ -508,2 +528,4 @@ throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");

var container;
/* : Node */
var nodesToHydrate = [];

@@ -515,4 +537,6 @@

// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node
/*: HTMLStyleElement */
) {
var attrib = node.getAttribute("data-emotion").split(' ');

@@ -528,3 +552,10 @@ for (var i = 1; i < attrib.length; i++) {

var _insert;
/*: (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
) => string | void */
var omnipresentPlugins = [compat, removeLabel];

@@ -562,3 +593,13 @@

_insert = function insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: void */
insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
currentSheet = sheet;

@@ -568,3 +609,5 @@

currentSheet = {
insert: function insert(rule) {
insert: function insert(rule
/*: string */
) {
sheet.insert(rule + serialized.map);

@@ -588,8 +631,13 @@ }

return serialize(compile(styles), _serializer);
}; // $FlowFixMe
};
var serverStylisCache = getServerStylisCache(stylisPlugins)(key);
var getRules = function getRules(selector, serialized) {
var getRules = function
/*: string */
getRules(selector
/*: string */
, serialized
/*: SerializedStyles */
) {
var name = serialized.name;

@@ -604,3 +652,13 @@

_insert = function _insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: string | void */
_insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
var name = serialized.name;

@@ -641,3 +699,5 @@ var rules = getRules(selector, serialized);

var cache = {
var cache
/*: EmotionCache */
= {
key: key,

@@ -644,0 +704,0 @@ sheet: new StyleSheet({

55

dist/emotion-cache.worker.esm.js

@@ -451,2 +451,14 @@ import { StyleSheet } from '@emotion/sheet';

/*
export type Options = {
nonce?: string,
stylisPlugins?: StylisPlugin[],
key: string,
container?: HTMLElement,
speedy?: boolean,
prepend?: boolean,
insertionPoint?: HTMLElement
}
*/
var getServerStylisCache = weakMemoize(function () {

@@ -462,3 +474,7 @@ return memoize(function () {

var createCache = function createCache(options) {
var createCache = function
/*: EmotionCache */
createCache(options
/*: Options */
) {
var key = options.key;

@@ -473,3 +489,2 @@

if (process.env.NODE_ENV !== 'production') {
// $FlowFixMe
if (/[^a-z-]/.test(key)) {

@@ -482,6 +497,15 @@ throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");

var container;
/* : Node */
var nodesToHydrate = [];
var _insert;
/*: (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
) => string | void */
var omnipresentPlugins = [compat, removeLabel];

@@ -505,8 +529,13 @@

return serialize(compile(styles), _serializer);
}; // $FlowFixMe
};
var serverStylisCache = getServerStylisCache(stylisPlugins)(key);
var getRules = function getRules(selector, serialized) {
var getRules = function
/*: string */
getRules(selector
/*: string */
, serialized
/*: SerializedStyles */
) {
var name = serialized.name;

@@ -521,3 +550,13 @@

_insert = function _insert(selector, serialized, sheet, shouldCache) {
_insert = function
/*: string | void */
_insert(selector
/*: string */
, serialized
/*: SerializedStyles */
, sheet
/*: StyleSheet */
, shouldCache
/*: boolean */
) {
var name = serialized.name;

@@ -558,3 +597,5 @@ var rules = getRules(selector, serialized);

var cache = {
var cache
/*: EmotionCache */
= {
key: key,

@@ -561,0 +602,0 @@ sheet: new StyleSheet({

12

package.json
{
"name": "@emotion/cache",
"version": "11.11.0",
"version": "11.12.0",
"description": "emotion's cache",

@@ -29,6 +29,6 @@ "main": "dist/emotion-cache.cjs.js",

"dependencies": {
"@emotion/memoize": "^0.8.1",
"@emotion/sheet": "^1.2.2",
"@emotion/utils": "^1.2.1",
"@emotion/weak-memoize": "^0.3.1",
"@emotion/memoize": "^0.9.0",
"@emotion/sheet": "^1.3.0",
"@emotion/utils": "^1.3.0",
"@emotion/weak-memoize": "^0.4.0",
"stylis": "4.2.0"

@@ -39,3 +39,3 @@ },

"@emotion/hash": "*",
"typescript": "^4.5.5"
"typescript": "^5.4.5"
},

@@ -42,0 +42,0 @@ "files": [

68

src/index.js

@@ -1,4 +0,3 @@

// @flow
import { StyleSheet } from '@emotion/sheet'
import { type EmotionCache, type SerializedStyles } from '@emotion/utils'
/* import { type EmotionCache, type SerializedStyles } from '@emotion/utils' */
import {

@@ -21,6 +20,7 @@ serialize,

import { prefixer } from './prefixer'
import type { StylisPlugin } from './types'
/* import type { StylisPlugin } from './types' */
let isBrowser = typeof document !== 'undefined'
/*
export type Options = {

@@ -35,2 +35,3 @@ nonce?: string,

}
*/

@@ -48,3 +49,3 @@ let getServerStylisCache = isBrowser

let createCache = (options: Options): EmotionCache => {
let createCache = (options /*: Options */) /*: EmotionCache */ => {
let key = options.key

@@ -68,3 +69,3 @@

// that creating a cache works inside of render of a React component
Array.prototype.forEach.call(ssrStyles, (node: HTMLStyleElement) => {
Array.prototype.forEach.call(ssrStyles, (node /*: HTMLStyleElement */) => {
// we want to only move elements which have a space in the data-emotion attribute value

@@ -76,5 +77,3 @@ // because that indicates that it is an Emotion 11 server-side rendered style elements

// will not result in the Emotion 10 styles being destroyed
const dataEmotionAttribute = ((node.getAttribute(
'data-emotion'
): any): string)
const dataEmotionAttribute = node.getAttribute('data-emotion')
if (dataEmotionAttribute.indexOf(' ') === -1) {

@@ -84,3 +83,3 @@ return

;((document.head: any): HTMLHeadElement).appendChild(node)
document.head.appendChild(node)
node.setAttribute('data-s', '')

@@ -93,3 +92,2 @@ })

if (process.env.NODE_ENV !== 'production') {
// $FlowFixMe
if (/[^a-z-]/.test(key)) {

@@ -102,6 +100,6 @@ throw new Error(

let inserted = {}
let container: Node
let container /* : Node */
const nodesToHydrate = []
if (isBrowser) {
container = options.container || ((document.head: any): HTMLHeadElement)
container = options.container || document.head

@@ -112,7 +110,4 @@ Array.prototype.forEach.call(

document.querySelectorAll(`style[data-emotion^="${key} "]`),
(node: HTMLStyleElement) => {
const attrib = ((node.getAttribute(`data-emotion`): any): string).split(
' '
)
// $FlowFixMe
(node /*: HTMLStyleElement */) => {
const attrib = node.getAttribute(`data-emotion`).split(' ')
for (let i = 1; i < attrib.length; i++) {

@@ -126,3 +121,3 @@ inserted[attrib[i]] = true

let insert: (
let insert /*: (
selector: string,

@@ -132,4 +127,3 @@ serialized: SerializedStyles,

shouldCache: boolean
) => string | void
) => string | void */
const omnipresentPlugins = [compat, removeLabel]

@@ -176,7 +170,7 @@

insert = (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
): void => {
selector /*: string */,
serialized /*: SerializedStyles */,
sheet /*: StyleSheet */,
shouldCache /*: boolean */
) /*: void */ => {
currentSheet = sheet

@@ -188,4 +182,4 @@ if (

currentSheet = {
insert: (rule: string) => {
sheet.insert(rule + ((serialized.map: any): string))
insert: (rule /*: string */) => {
sheet.insert(rule + serialized.map)
}

@@ -208,5 +202,7 @@ }

// $FlowFixMe
let serverStylisCache = getServerStylisCache(stylisPlugins)(key)
let getRules = (selector: string, serialized: SerializedStyles): string => {
let getRules = (
selector /*: string */,
serialized /*: SerializedStyles */
) /*: string */ => {
let name = serialized.name

@@ -221,7 +217,7 @@ if (serverStylisCache[name] === undefined) {

insert = (
selector: string,
serialized: SerializedStyles,
sheet: StyleSheet,
shouldCache: boolean
): string | void => {
selector /*: string */,
serialized /*: SerializedStyles */,
sheet /*: StyleSheet */,
shouldCache /*: boolean */
) /*: string | void */ => {
let name = serialized.name

@@ -263,7 +259,7 @@ let rules = getRules(selector, serialized)

const cache: EmotionCache = {
const cache /*: EmotionCache */ = {
key,
sheet: new StyleSheet({
key,
container: ((container: any): Node),
container,
nonce: options.nonce,

@@ -270,0 +266,0 @@ speedy: options.speedy,

20

src/types.js

@@ -1,12 +0,11 @@

// @flow
/*
export type StylisElement = {
type: string,
value: string,
props: Array<string>,
root: StylisElement | null,
children: Array<StylisElement>,
line: number,
column: number,
length: number,
type: string
value: string
props: Array<string>
root: StylisElement | null
children: Array<StylisElement>
line: number
column: number
length: number
return: string

@@ -27,1 +26,2 @@ }

) => string | void
*/

3

types/index.d.ts
// Definitions by: Junyoung Clare Jang <https://github.com/Ailrun>
// TypeScript Version: 2.2
/// <reference types="node" />
import { EmotionCache } from '@emotion/utils'

@@ -4,0 +7,0 @@ 

dist/emotion-cache.cjs.js.flow
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc