@leafygreen-ui/emotion - npm Package Compare versions

Comparing version 3.0.1 to 4.0.0

CHANGELOG.md

 # @leafygreen-ui/emotion
 
+## 4.0.0
+
+### Major Changes
+
+- f6e5655a: Upgrades to emotion v11. See (Emotion Docs)[https://emotion.sh/docs/emotion-11] for more on this version. Additionally, updates where leafygreen styles are injected into the `head` element.
+
 ## 3.0.1
@@ -4,0 +10,0 @@

dist/emotion.d.ts

@@ -1,3 +0,3 @@
-declare const _default: import("create-emotion").Emotion;
+declare const _default: import("@emotion/css/types/create-instance").Emotion;
 export default _default;
 //# sourceMappingURL=emotion.d.ts.map

dist/esm/index.js

@@ -1,2 +0,2 @@
-import e from"create-emotion";import r from"create-emotion-server";var t=function(){var r={key:"leafygreen-ui"};if("undefined"!=typeof window){r.container=document.createElement("div");var t=document.head;t.insertBefore(r.container,t.firstChild)}return e(r)}(),o=t.flush,n=t.hydrate,i=t.cx,a=t.merge,c=t.getRegisteredStyles,d=t.injectGlobal,f=t.keyframes,m=t.css,s=t.sheet,l=t.cache,u=r(l),y=u.extractCritical,h=u.renderStylesToString,g=u.renderStylesToNodeStream;export default t;export{l as cache,m as css,i as cx,y as extractCritical,o as flush,c as getRegisteredStyles,n as hydrate,d as injectGlobal,f as keyframes,a as merge,g as renderStylesToNodeStream,h as renderStylesToString,s as sheet};
+import e from"@emotion/css/create-instance";import r from"@emotion/server/create-instance";var t=e({key:"leafygreen-ui",prepend:!0}),a=t.flush,o=t.hydrate,s=t.cx,c=t.merge,i=t.getRegisteredStyles,n=t.injectGlobal,l=t.keyframes,m=t.css,d=t.sheet,y=t.cache,f=r(y),p=f.extractCritical,g=f.renderStylesToString,S=f.renderStylesToNodeStream;export default t;export{y as cache,m as css,s as cx,p as extractCritical,a as flush,i as getRegisteredStyles,o as hydrate,n as injectGlobal,l as keyframes,c as merge,S as renderStylesToNodeStream,g as renderStylesToString,d as sheet};
 //# sourceMappingURL=index.js.map

dist/index.d.ts

 /// <reference types="node" />
 import emotion from './emotion';
-export declare const flush: () => void, hydrate: (ids: string[]) => void, cx: (...classNames: import("create-emotion").ClassNamesArg[]) => string, merge: (className: string) => string, getRegisteredStyles: (registeredStyles: string[], className: string) => string, injectGlobal: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): void;
-    (...args: import("create-emotion").Interpolation<undefined>[]): void;
+export declare const flush: () => void, hydrate: (ids: string[]) => void, cx: (...classNames: import("@emotion/css/types/create-instance").ClassNamesArg[]) => string, merge: (className: string) => string, getRegisteredStyles: (registeredStyles: string[], className: string) => string, injectGlobal: {
+    (template: TemplateStringsArray, ...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): void;
+    (...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): void;
 }, keyframes: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): string;
-    (...args: import("create-emotion").Interpolation<undefined>[]): string;
+    (template: TemplateStringsArray, ...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): string;
+    (...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): string;
 }, css: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): string;
-    (...args: import("create-emotion").Interpolation<undefined>[]): string;
-}, sheet: import("create-emotion").StyleSheet, cache: import("create-emotion").EmotionCache;
-export declare const extractCritical: (html: string) => import("create-emotion-server").EmotionCritical, renderStylesToString: (html: string) => string, renderStylesToNodeStream: () => NodeJS.ReadWriteStream;
+    (template: TemplateStringsArray, ...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): string;
+    (...args: import("@emotion/css/types/create-instance").CSSInterpolation[]): string;
+}, sheet: import("@emotion/css/types/create-instance").CSSStyleSheet, cache: import("@emotion/utils").EmotionCache;
+export declare const extractCritical: (html: string) => import("@emotion/server/types/create-instance").EmotionCritical, renderStylesToString: (html: string) => string, renderStylesToNodeStream: () => NodeJS.ReadWriteStream;
 export default emotion;
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("create-emotion"),require("create-emotion-server")):"function"==typeof define&&define.amd?define(["exports","create-emotion","create-emotion-server"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/emotion"]={},e.createEmotion,e.createEmotionServer)}(this,(function(e,t,r){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(t),i=n(r);var a=function(){var e={key:"leafygreen-ui"};if("undefined"!=typeof window){e.container=document.createElement("div");var t=document.head;t.insertBefore(e.container,t.firstChild)}return o.default(e)}(),c=a.flush,d=a.hydrate,f=a.cx,s=a.merge,l=a.getRegisteredStyles,u=a.injectGlobal,y=a.keyframes,m=a.css,h=a.sheet,g=a.cache,S=i.default(g),p=S.extractCritical,v=S.renderStylesToString,b=S.renderStylesToNodeStream;e.cache=g,e.css=m,e.cx=f,e.default=a,e.extractCritical=p,e.flush=c,e.getRegisteredStyles=l,e.hydrate=d,e.injectGlobal=u,e.keyframes=y,e.merge=s,e.renderStylesToNodeStream=b,e.renderStylesToString=v,e.sheet=h,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@emotion/css/create-instance"),require("@emotion/server/create-instance")):"function"==typeof define&&define.amd?define(["exports","@emotion/css/create-instance","@emotion/server/create-instance"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/emotion"]={},e.createEmotion,e.createEmotionServer)}(this,(function(e,t,r){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(t),i=n(r);var s=o.default({key:"leafygreen-ui",prepend:!0}),a=s.flush,c=s.hydrate,l=s.cx,d=s.merge,f=s.getRegisteredStyles,u=s.injectGlobal,y=s.keyframes,m=s.css,g=s.sheet,h=s.cache,p=i.default(h),S=p.extractCritical,b=p.renderStylesToString,x=p.renderStylesToNodeStream;e.cache=h,e.css=m,e.cx=l,e.default=s,e.extractCritical=S,e.flush=a,e.getRegisteredStyles=f,e.hydrate=c,e.injectGlobal=u,e.keyframes=y,e.merge=d,e.renderStylesToNodeStream=x,e.renderStylesToString=b,e.sheet=g,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@leafygreen-ui/emotion",
-  "version": "3.0.1",
+  "version": "4.0.0",
   "description": "leafyGreen UI Kit's Custom Instance of Emotion",
@@ -24,7 +24,7 @@ "main": "./dist/index.js",
   "dependencies": {
-    "create-emotion": "^10.0.7",
-    "create-emotion-server": "10.0.27",
-    "emotion": "^10.0.7"
+    "@emotion/css": "^11.1.3",
+    "@emotion/react": "^11.4.0",
+    "@emotion/server": "^11.4.0"
   },
   "gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0"
 }

src/emotion.ts

@@ -1,8 +0,3 @@
-import createEmotion from 'create-emotion';
+import createEmotion, { Options } from '@emotion/css/create-instance';
 
-interface CreateEmotionConfig {
-  key: string;
-  container?: HTMLElement;
-}
-
 // In case the original emotion, and create-emotion packages become unsupported,
@@ -12,15 +7,9 @@ // we should consider implementing our own wrapper around createCache like what's
 //
-// https://github.com/emotion-js/emotion/blob/master/packages/create-emotion/src/index.js
+// https://github.com/emotion-js/emotion/blob/emotion%4010.0.6/packages/create-emotion/src/index.js
 function createEmotionInstance() {
-  const config: CreateEmotionConfig = {
+  const config: Options = {
     key: 'leafygreen-ui',
+    prepend: true,
   };
 
-  if (typeof window !== 'undefined') {
-    config.container = document.createElement('div');
-
-    const head = document.head;
-    head.insertBefore(config.container, head.firstChild);
-  }
-
   return createEmotion(config);
@@ -27,0 +16,0 @@ }

src/index.ts

 import emotion from './emotion';
-import createEmotionServer from 'create-emotion-server';
+import createEmotionServer from '@emotion/server/create-instance';
 
@@ -4,0 +4,0 @@ export const {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

165201

decreased by-0.43%

Number of package files

15

decreased by-11.76%

Lines of code

70

decreased by-26.32%

Dependency changes

• + Added@emotion/css@^11.1.3

• + Added@emotion/react@^11.4.0

• + Added@emotion/server@^11.4.0

• + Added@emotion/babel-plugin@11.12.0(transitive)

• + Added@emotion/cache@11.13.1(transitive)

• + Added@emotion/css@11.13.4(transitive)

• + Added@emotion/hash@0.9.2(transitive)

• + Added@emotion/memoize@0.9.0(transitive)

• + Added@emotion/serialize@1.3.2(transitive)

• + Added@emotion/server@11.11.0(transitive)

• + Added@emotion/sheet@1.4.0(transitive)

• + Added@emotion/unitless@0.10.0(transitive)

• + Added@emotion/utils@1.4.1(transitive)

• + Added@emotion/weak-memoize@0.4.0(transitive)

• + Addedbabel-plugin-macros@3.1.0(transitive)

• + Addedcosmiconfig@7.1.0(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addedescape-string-regexp@4.0.0(transitive)

• + Addedstylis@4.2.0(transitive)

• - Removedcreate-emotion@^10.0.7

• - Removedcreate-emotion-server@10.0.27

• - Removedemotion@^10.0.7

• - Removed@emotion/cache@10.0.29(transitive)

• - Removed@emotion/hash@0.8.0(transitive)

• - Removed@emotion/memoize@0.7.4(transitive)

• - Removed@emotion/serialize@0.11.16(transitive)

• - Removed@emotion/sheet@0.9.4(transitive)

• - Removed@emotion/stylis@0.8.5(transitive)

• - Removed@emotion/unitless@0.7.5(transitive)

• - Removed@emotion/utils@0.11.3(transitive)

• - Removed@emotion/weak-memoize@0.2.5(transitive)

• - Removedbabel-plugin-emotion@10.2.2(transitive)

• - Removedbabel-plugin-macros@2.8.0(transitive)

• - Removedbabel-plugin-syntax-jsx@6.18.0(transitive)

• - Removedcosmiconfig@6.0.0(transitive)

• - Removedcreate-emotion@10.0.27(transitive)

• - Removedcreate-emotion-server@10.0.27(transitive)

• - Removedcsstype@2.6.21(transitive)

• - Removedemotion@10.0.27(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)