@builder.io/react 2.0.4-3 → 2.0.4-6

package/src/components/builder-block.component.tsx

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 
 import { Builder, builder, BuilderElement, Component } from '@builder.io/sdk';
-import { ClassNames, jsx } from '@emotion/core';
+import { ClassNames, jsx } from '@emotion/react';
 import React from 'react';
 import { Size, sizeNames, sizes } from '../constants/device-sizes.constant';
 import { set } from '../functions/set';

package/src/components/builder-blocks.component.tsx

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { jsx } from '@emotion/core';
+import { jsx } from '@emotion/react';
 import React from 'react';
 import { Builder } from '@builder.io/sdk';
 import { BuilderBlock } from './builder-block.component';

package/src/components/builder-component.component.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { jsx, css } from '@emotion/core';
+import { jsx, css, CacheProvider } from '@emotion/react';
+import createCache from '@emotion/cache';
 import { BuilderContent, getContentWithInfo } from './builder-content.component';
 import { BuilderBlocks } from './builder-blocks.component';
 import {
@@ -100,6 +101,7 @@ const sizeMap = {
 
 const fetchCache: { [key: string]: any } = {};
 
+const cache = createCache({ key: 'builder'});
 export interface BuilderComponentProps {
   /**
    * @package
@@ -942,6 +944,7 @@ export class BuilderComponent extends React.Component<
         key={this.state.key}
         ref={ref => (this.ref = ref)}
       >
+        <CacheProvider value={cache}>
         <BuilderMetaContext.Consumer>
           {value => (
             <BuilderMetaContext.Provider
@@ -1113,6 +1116,7 @@ export class BuilderComponent extends React.Component<
             </BuilderMetaContext.Provider>
           )}
         </BuilderMetaContext.Consumer>
+        </CacheProvider>
       </WrapComponent>
     );
   }

package/src/components/insert-spacer.component.tsx

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { jsx } from '@emotion/core';
+import { jsx } from '@emotion/react';
 
 import React from 'react';
 import { Builder } from '@builder.io/sdk';

package/src/functions/safe-dynamic-require.ts

@@ -6,5 +6,5 @@ const noop = () => null;
 // Allow us to require things dynamically safe from webpack bundling
 
 export let safeDynamicRequire: typeof require;
-if (typeof globalThis.require === 'function') safeDynamicRequire = globalThis.require;
+if (typeof globalThis.require === 'function') safeDynamicRequire = eval('require');
 safeDynamicRequire ??= noop as any;