0.2.0 - Mid migration

This commit is contained in:
Daniel Mason 2022-04-25 14:47:15 +12:00
parent 139e6a915e
commit 7e38fdbd7d
42393 changed files with 5358157 additions and 62 deletions

View file

@ -0,0 +1,211 @@
'use strict';
var React = require('react');
var createCache = require('@emotion/cache');
var _extends = require('@babel/runtime/helpers/extends');
var weakMemoize = require('@emotion/weak-memoize');
var isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode = require('../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.cjs.js');
var utils = require('@emotion/utils');
var serialize = require('@emotion/serialize');
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
var createCache__default = /*#__PURE__*/_interopDefault(createCache);
var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var weakMemoize__default = /*#__PURE__*/_interopDefault(weakMemoize);
var hasOwnProperty = Object.prototype.hasOwnProperty;
var EmotionCacheContext = /* #__PURE__ */React.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
// because this module is primarily intended for the browser and node
// but it's also required in react native and similar environments sometimes
// and we could have a special build just for that
// but this is much easier and the native packages
// might use a different theme context in the future anyway
typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache__default['default']({
key: 'css'
}) : null);
if (process.env.NODE_ENV !== 'production') {
EmotionCacheContext.displayName = 'EmotionCacheContext';
}
var CacheProvider = EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return React.useContext(EmotionCacheContext);
};
var withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/React.forwardRef(function (props, ref) {
// the cache will never be null in the browser
var cache = React.useContext(EmotionCacheContext);
return func(props, cache, ref);
});
};
var ThemeContext = /* #__PURE__ */React.createContext({});
if (process.env.NODE_ENV !== 'production') {
ThemeContext.displayName = 'EmotionThemeContext';
}
var useTheme = function useTheme() {
return React.useContext(ThemeContext);
};
var getTheme = function getTheme(outerTheme, theme) {
if (typeof theme === 'function') {
var mergedTheme = theme(outerTheme);
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
}
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 _extends__default['default']({}, outerTheme, theme);
};
var createCacheWithTheme = /* #__PURE__ */weakMemoize__default['default'](function (outerTheme) {
return weakMemoize__default['default'](function (theme) {
return getTheme(outerTheme, theme);
});
});
var ThemeProvider = function ThemeProvider(props) {
var theme = React.useContext(ThemeContext);
if (props.theme !== theme) {
theme = createCacheWithTheme(theme)(props.theme);
}
return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || 'Component';
var render = function render(props, ref) {
var theme = React.useContext(ThemeContext);
return /*#__PURE__*/React.createElement(Component, _extends__default['default']({
theme: theme,
ref: ref
}, props));
}; // $FlowFixMe
var WithTheme = /*#__PURE__*/React.forwardRef(render);
WithTheme.displayName = "WithTheme(" + componentName + ")";
return isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode['default'](WithTheme, Component);
}
// thus we only need to replace what is a valid character for JS, but not for CSS
var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
return identifier.replace(/\$/g, '-');
};
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
var createEmotionProps = function createEmotionProps(type, props) {
if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration
props.css.indexOf(':') !== -1) {
throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
}
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key)) {
newProps[key] = props[key];
}
}
newProps[typePropName] = type;
if (process.env.NODE_ENV !== 'production') {
var error = new Error();
if (error.stack) {
// chrome
var match = error.stack.match(/at (?:Object\.|Module\.|)(?:jsx|createEmotionProps).*\n\s+at (?:Object\.|)([A-Z][A-Za-z0-9$]+) /);
if (!match) {
// safari and firefox
match = error.stack.match(/.*\n([A-Z][A-Za-z0-9$]+)@/);
}
if (match) {
newProps[labelPropName] = sanitizeIdentifier(match[1]);
}
}
}
return newProps;
};
var Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {
var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
// not passing the registered cache to serializeStyles because it would
// make certain babel optimisations not possible
if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
cssProp = cache.registered[cssProp];
}
var type = props[typePropName];
var registeredStyles = [cssProp];
var className = '';
if (typeof props.className === 'string') {
className = utils.getRegisteredStyles(cache.registered, registeredStyles, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serialize.serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext));
if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
var labelFromStack = props[labelPropName];
if (labelFromStack) {
serialized = serialize.serializeStyles([serialized, 'label:' + labelFromStack + ';']);
}
}
var rules = utils.insertStyles(cache, serialized, typeof type === 'string');
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
newProps[key] = props[key];
}
}
newProps.ref = ref;
newProps.className = className;
var ele = /*#__PURE__*/React.createElement(type, newProps);
return ele;
});
if (process.env.NODE_ENV !== 'production') {
Emotion.displayName = 'EmotionCssPropInternal';
}
exports.CacheProvider = CacheProvider;
exports.Emotion = Emotion;
exports.ThemeContext = ThemeContext;
exports.ThemeProvider = ThemeProvider;
exports.__unsafe_useEmotionCache = __unsafe_useEmotionCache;
exports.createEmotionProps = createEmotionProps;
exports.hasOwnProperty = hasOwnProperty;
exports.useTheme = useTheme;
exports.withEmotionCache = withEmotionCache;
exports.withTheme = withTheme;

View file

@ -0,0 +1,235 @@
import { createContext, useContext, forwardRef, createElement, Fragment } from 'react';
import createCache from '@emotion/cache';
import _extends from '@babel/runtime/helpers/esm/extends';
import weakMemoize from '@emotion/weak-memoize';
import hoistNonReactStatics from '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.esm.js';
import { getRegisteredStyles, insertStyles } from '@emotion/utils';
import { serializeStyles } from '@emotion/serialize';
var isBrowser = typeof document !== 'undefined';
var hasOwnProperty = Object.prototype.hasOwnProperty;
var EmotionCacheContext = /* #__PURE__ */createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
// because this module is primarily intended for the browser and node
// but it's also required in react native and similar environments sometimes
// and we could have a special build just for that
// but this is much easier and the native packages
// might use a different theme context in the future anyway
typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({
key: 'css'
}) : null);
if (process.env.NODE_ENV !== 'production') {
EmotionCacheContext.displayName = 'EmotionCacheContext';
}
var CacheProvider = EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return useContext(EmotionCacheContext);
};
var withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/forwardRef(function (props, ref) {
// the cache will never be null in the browser
var cache = useContext(EmotionCacheContext);
return func(props, cache, ref);
});
};
if (!isBrowser) {
withEmotionCache = function withEmotionCache(func) {
return function (props) {
var cache = useContext(EmotionCacheContext);
if (cache === null) {
// yes, we're potentially creating this on every render
// it doesn't actually matter though since it's only on the server
// so there will only every be a single render
// that could change in the future because of suspense and etc. but for now,
// this works and i don't want to optimise for a future thing that we aren't sure about
cache = createCache({
key: 'css'
});
return /*#__PURE__*/createElement(EmotionCacheContext.Provider, {
value: cache
}, func(props, cache));
} else {
return func(props, cache);
}
};
};
}
var ThemeContext = /* #__PURE__ */createContext({});
if (process.env.NODE_ENV !== 'production') {
ThemeContext.displayName = 'EmotionThemeContext';
}
var useTheme = function useTheme() {
return useContext(ThemeContext);
};
var getTheme = function getTheme(outerTheme, theme) {
if (typeof theme === 'function') {
var mergedTheme = theme(outerTheme);
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
}
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 _extends({}, outerTheme, theme);
};
var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
return weakMemoize(function (theme) {
return getTheme(outerTheme, theme);
});
});
var ThemeProvider = function ThemeProvider(props) {
var theme = useContext(ThemeContext);
if (props.theme !== theme) {
theme = createCacheWithTheme(theme)(props.theme);
}
return /*#__PURE__*/createElement(ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || 'Component';
var render = function render(props, ref) {
var theme = useContext(ThemeContext);
return /*#__PURE__*/createElement(Component, _extends({
theme: theme,
ref: ref
}, props));
}; // $FlowFixMe
var WithTheme = /*#__PURE__*/forwardRef(render);
WithTheme.displayName = "WithTheme(" + componentName + ")";
return hoistNonReactStatics(WithTheme, Component);
}
// thus we only need to replace what is a valid character for JS, but not for CSS
var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
return identifier.replace(/\$/g, '-');
};
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
var createEmotionProps = function createEmotionProps(type, props) {
if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration
props.css.indexOf(':') !== -1) {
throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
}
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key)) {
newProps[key] = props[key];
}
}
newProps[typePropName] = type;
if (process.env.NODE_ENV !== 'production') {
var error = new Error();
if (error.stack) {
// chrome
var match = error.stack.match(/at (?:Object\.|Module\.|)(?:jsx|createEmotionProps).*\n\s+at (?:Object\.|)([A-Z][A-Za-z0-9$]+) /);
if (!match) {
// safari and firefox
match = error.stack.match(/.*\n([A-Z][A-Za-z0-9$]+)@/);
}
if (match) {
newProps[labelPropName] = sanitizeIdentifier(match[1]);
}
}
}
return newProps;
};
var Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {
var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
// not passing the registered cache to serializeStyles because it would
// make certain babel optimisations not possible
if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
cssProp = cache.registered[cssProp];
}
var type = props[typePropName];
var registeredStyles = [cssProp];
var className = '';
if (typeof props.className === 'string') {
className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serializeStyles(registeredStyles, undefined, useContext(ThemeContext));
if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
var labelFromStack = props[labelPropName];
if (labelFromStack) {
serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);
}
}
var rules = insertStyles(cache, serialized, typeof type === 'string');
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
newProps[key] = props[key];
}
}
newProps.ref = ref;
newProps.className = className;
var ele = /*#__PURE__*/createElement(type, newProps);
if (!isBrowser && rules !== undefined) {
var _ref;
var serializedNames = serialized.name;
var next = serialized.next;
while (next !== undefined) {
serializedNames += ' ' + next.name;
next = next.next;
}
return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + " " + serializedNames, _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}
return ele;
});
if (process.env.NODE_ENV !== 'production') {
Emotion.displayName = 'EmotionCssPropInternal';
}
export { CacheProvider as C, Emotion as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwnProperty as h, isBrowser as i, useTheme as u, withEmotionCache as w };

View file

@ -0,0 +1,99 @@
"use strict";
var React = require("react"), createCache = require("@emotion/cache"), _extends = require("@babel/runtime/helpers/extends"), weakMemoize = require("@emotion/weak-memoize"), isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode = require("../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.cjs.prod.js"), utils = require("@emotion/utils"), serialize = require("@emotion/serialize");
function _interopDefault(e) {
return e && e.__esModule ? e : {
default: e
};
}
var createCache__default = _interopDefault(createCache), _extends__default = _interopDefault(_extends), weakMemoize__default = _interopDefault(weakMemoize), isBrowser = "undefined" != typeof document, hasOwnProperty = Object.prototype.hasOwnProperty, EmotionCacheContext = React.createContext("undefined" != typeof HTMLElement ? createCache__default.default({
key: "css"
}) : null);
var CacheProvider = EmotionCacheContext.Provider, __unsafe_useEmotionCache = function() {
return React.useContext(EmotionCacheContext);
};
exports.withEmotionCache = function(func) {
return React.forwardRef((function(props, ref) {
var cache = React.useContext(EmotionCacheContext);
return func(props, cache, ref);
}));
}, isBrowser || (exports.withEmotionCache = function(func) {
return function(props) {
var cache = React.useContext(EmotionCacheContext);
return null === cache ? (cache = createCache__default.default({
key: "css"
}), React.createElement(EmotionCacheContext.Provider, {
value: cache
}, func(props, cache))) : func(props, cache);
};
});
var ThemeContext = React.createContext({});
var useTheme = function() {
return React.useContext(ThemeContext);
}, getTheme = function(outerTheme, theme) {
if ("function" == typeof theme) {
var mergedTheme = theme(outerTheme);
return mergedTheme;
}
return _extends__default.default({}, outerTheme, theme);
}, createCacheWithTheme = weakMemoize__default.default((function(outerTheme) {
return weakMemoize__default.default((function(theme) {
return getTheme(outerTheme, theme);
}));
})), ThemeProvider = function(props) {
var theme = React.useContext(ThemeContext);
return props.theme !== theme && (theme = createCacheWithTheme(theme)(props.theme)),
React.createElement(ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || "Component", render = function(props, ref) {
var theme = React.useContext(ThemeContext);
return React.createElement(Component, _extends__default.default({
theme: theme,
ref: ref
}, props));
}, WithTheme = React.forwardRef(render);
return WithTheme.displayName = "WithTheme(" + componentName + ")", isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode.default(WithTheme, Component);
}
var sanitizeIdentifier = function(identifier) {
return identifier.replace(/\$/g, "-");
}, typePropName = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", labelPropName = "__EMOTION_LABEL_PLEASE_DO_NOT_USE__", createEmotionProps = function(type, props) {
var newProps = {};
for (var key in props) hasOwnProperty.call(props, key) && (newProps[key] = props[key]);
return newProps[typePropName] = type, newProps;
}, Emotion = exports.withEmotionCache((function(props, cache, ref) {
var cssProp = props.css;
"string" == typeof cssProp && void 0 !== cache.registered[cssProp] && (cssProp = cache.registered[cssProp]);
var type = props[typePropName], registeredStyles = [ cssProp ], className = "";
"string" == typeof props.className ? className = utils.getRegisteredStyles(cache.registered, registeredStyles, props.className) : null != props.className && (className = props.className + " ");
var serialized = serialize.serializeStyles(registeredStyles, void 0, React.useContext(ThemeContext)), rules = utils.insertStyles(cache, serialized, "string" == typeof type);
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) hasOwnProperty.call(props, key) && "css" !== key && key !== typePropName && (newProps[key] = props[key]);
newProps.ref = ref, newProps.className = className;
var ele = React.createElement(type, newProps);
if (!isBrowser && void 0 !== rules) {
for (var _ref, serializedNames = serialized.name, next = serialized.next; void 0 !== next; ) serializedNames += " " + next.name,
next = next.next;
return React.createElement(React.Fragment, null, React.createElement("style", ((_ref = {})["data-emotion"] = cache.key + " " + serializedNames,
_ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}
return ele;
}));
exports.CacheProvider = CacheProvider, exports.Emotion = Emotion, exports.ThemeContext = ThemeContext,
exports.ThemeProvider = ThemeProvider, exports.__unsafe_useEmotionCache = __unsafe_useEmotionCache,
exports.createEmotionProps = createEmotionProps, exports.hasOwnProperty = hasOwnProperty,
exports.isBrowser = isBrowser, exports.useTheme = useTheme, exports.withTheme = withTheme;

View file

@ -0,0 +1,194 @@
import { createContext, useContext, forwardRef, createElement } from 'react';
import createCache from '@emotion/cache';
import _extends from '@babel/runtime/helpers/esm/extends';
import weakMemoize from '@emotion/weak-memoize';
import hoistNonReactStatics from '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.esm.js';
import { getRegisteredStyles, insertStyles } from '@emotion/utils';
import { serializeStyles } from '@emotion/serialize';
var hasOwnProperty = Object.prototype.hasOwnProperty;
var EmotionCacheContext = /* #__PURE__ */createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
// because this module is primarily intended for the browser and node
// but it's also required in react native and similar environments sometimes
// and we could have a special build just for that
// but this is much easier and the native packages
// might use a different theme context in the future anyway
typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({
key: 'css'
}) : null);
if (process.env.NODE_ENV !== 'production') {
EmotionCacheContext.displayName = 'EmotionCacheContext';
}
var CacheProvider = EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return useContext(EmotionCacheContext);
};
var withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/forwardRef(function (props, ref) {
// the cache will never be null in the browser
var cache = useContext(EmotionCacheContext);
return func(props, cache, ref);
});
};
var ThemeContext = /* #__PURE__ */createContext({});
if (process.env.NODE_ENV !== 'production') {
ThemeContext.displayName = 'EmotionThemeContext';
}
var useTheme = function useTheme() {
return useContext(ThemeContext);
};
var getTheme = function getTheme(outerTheme, theme) {
if (typeof theme === 'function') {
var mergedTheme = theme(outerTheme);
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
}
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 _extends({}, outerTheme, theme);
};
var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
return weakMemoize(function (theme) {
return getTheme(outerTheme, theme);
});
});
var ThemeProvider = function ThemeProvider(props) {
var theme = useContext(ThemeContext);
if (props.theme !== theme) {
theme = createCacheWithTheme(theme)(props.theme);
}
return /*#__PURE__*/createElement(ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || 'Component';
var render = function render(props, ref) {
var theme = useContext(ThemeContext);
return /*#__PURE__*/createElement(Component, _extends({
theme: theme,
ref: ref
}, props));
}; // $FlowFixMe
var WithTheme = /*#__PURE__*/forwardRef(render);
WithTheme.displayName = "WithTheme(" + componentName + ")";
return hoistNonReactStatics(WithTheme, Component);
}
// thus we only need to replace what is a valid character for JS, but not for CSS
var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
return identifier.replace(/\$/g, '-');
};
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
var createEmotionProps = function createEmotionProps(type, props) {
if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration
props.css.indexOf(':') !== -1) {
throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
}
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key)) {
newProps[key] = props[key];
}
}
newProps[typePropName] = type;
if (process.env.NODE_ENV !== 'production') {
var error = new Error();
if (error.stack) {
// chrome
var match = error.stack.match(/at (?:Object\.|Module\.|)(?:jsx|createEmotionProps).*\n\s+at (?:Object\.|)([A-Z][A-Za-z0-9$]+) /);
if (!match) {
// safari and firefox
match = error.stack.match(/.*\n([A-Z][A-Za-z0-9$]+)@/);
}
if (match) {
newProps[labelPropName] = sanitizeIdentifier(match[1]);
}
}
}
return newProps;
};
var Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {
var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
// not passing the registered cache to serializeStyles because it would
// make certain babel optimisations not possible
if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
cssProp = cache.registered[cssProp];
}
var type = props[typePropName];
var registeredStyles = [cssProp];
var className = '';
if (typeof props.className === 'string') {
className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serializeStyles(registeredStyles, undefined, useContext(ThemeContext));
if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
var labelFromStack = props[labelPropName];
if (labelFromStack) {
serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);
}
}
var rules = insertStyles(cache, serialized, typeof type === 'string');
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
newProps[key] = props[key];
}
}
newProps.ref = ref;
newProps.className = className;
var ele = /*#__PURE__*/createElement(type, newProps);
return ele;
});
if (process.env.NODE_ENV !== 'production') {
Emotion.displayName = 'EmotionCssPropInternal';
}
export { CacheProvider as C, Emotion as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwnProperty as h, useTheme as u, withEmotionCache as w };

View file

@ -0,0 +1,252 @@
'use strict';
var React = require('react');
var createCache = require('@emotion/cache');
var _extends = require('@babel/runtime/helpers/extends');
var weakMemoize = require('@emotion/weak-memoize');
var isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode = require('../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.cjs.dev.js');
var utils = require('@emotion/utils');
var serialize = require('@emotion/serialize');
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
var createCache__default = /*#__PURE__*/_interopDefault(createCache);
var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var weakMemoize__default = /*#__PURE__*/_interopDefault(weakMemoize);
var isBrowser = typeof document !== 'undefined';
var hasOwnProperty = Object.prototype.hasOwnProperty;
var EmotionCacheContext = /* #__PURE__ */React.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
// because this module is primarily intended for the browser and node
// but it's also required in react native and similar environments sometimes
// and we could have a special build just for that
// but this is much easier and the native packages
// might use a different theme context in the future anyway
typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache__default['default']({
key: 'css'
}) : null);
if (process.env.NODE_ENV !== 'production') {
EmotionCacheContext.displayName = 'EmotionCacheContext';
}
var CacheProvider = EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return React.useContext(EmotionCacheContext);
};
exports.withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/React.forwardRef(function (props, ref) {
// the cache will never be null in the browser
var cache = React.useContext(EmotionCacheContext);
return func(props, cache, ref);
});
};
if (!isBrowser) {
exports.withEmotionCache = function withEmotionCache(func) {
return function (props) {
var cache = React.useContext(EmotionCacheContext);
if (cache === null) {
// yes, we're potentially creating this on every render
// it doesn't actually matter though since it's only on the server
// so there will only every be a single render
// that could change in the future because of suspense and etc. but for now,
// this works and i don't want to optimise for a future thing that we aren't sure about
cache = createCache__default['default']({
key: 'css'
});
return /*#__PURE__*/React.createElement(EmotionCacheContext.Provider, {
value: cache
}, func(props, cache));
} else {
return func(props, cache);
}
};
};
}
var ThemeContext = /* #__PURE__ */React.createContext({});
if (process.env.NODE_ENV !== 'production') {
ThemeContext.displayName = 'EmotionThemeContext';
}
var useTheme = function useTheme() {
return React.useContext(ThemeContext);
};
var getTheme = function getTheme(outerTheme, theme) {
if (typeof theme === 'function') {
var mergedTheme = theme(outerTheme);
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
}
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 _extends__default['default']({}, outerTheme, theme);
};
var createCacheWithTheme = /* #__PURE__ */weakMemoize__default['default'](function (outerTheme) {
return weakMemoize__default['default'](function (theme) {
return getTheme(outerTheme, theme);
});
});
var ThemeProvider = function ThemeProvider(props) {
var theme = React.useContext(ThemeContext);
if (props.theme !== theme) {
theme = createCacheWithTheme(theme)(props.theme);
}
return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || 'Component';
var render = function render(props, ref) {
var theme = React.useContext(ThemeContext);
return /*#__PURE__*/React.createElement(Component, _extends__default['default']({
theme: theme,
ref: ref
}, props));
}; // $FlowFixMe
var WithTheme = /*#__PURE__*/React.forwardRef(render);
WithTheme.displayName = "WithTheme(" + componentName + ")";
return isolatedHoistNonReactStaticsDoNotUseThisInYourCode_dist_emotionReactIsolatedHoistNonReactStaticsDoNotUseThisInYourCode['default'](WithTheme, Component);
}
// thus we only need to replace what is a valid character for JS, but not for CSS
var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
return identifier.replace(/\$/g, '-');
};
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
var createEmotionProps = function createEmotionProps(type, props) {
if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration
props.css.indexOf(':') !== -1) {
throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
}
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key)) {
newProps[key] = props[key];
}
}
newProps[typePropName] = type;
if (process.env.NODE_ENV !== 'production') {
var error = new Error();
if (error.stack) {
// chrome
var match = error.stack.match(/at (?:Object\.|Module\.|)(?:jsx|createEmotionProps).*\n\s+at (?:Object\.|)([A-Z][A-Za-z0-9$]+) /);
if (!match) {
// safari and firefox
match = error.stack.match(/.*\n([A-Z][A-Za-z0-9$]+)@/);
}
if (match) {
newProps[labelPropName] = sanitizeIdentifier(match[1]);
}
}
}
return newProps;
};
var Emotion = /* #__PURE__ */exports.withEmotionCache(function (props, cache, ref) {
var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
// not passing the registered cache to serializeStyles because it would
// make certain babel optimisations not possible
if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
cssProp = cache.registered[cssProp];
}
var type = props[typePropName];
var registeredStyles = [cssProp];
var className = '';
if (typeof props.className === 'string') {
className = utils.getRegisteredStyles(cache.registered, registeredStyles, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serialize.serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext));
if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
var labelFromStack = props[labelPropName];
if (labelFromStack) {
serialized = serialize.serializeStyles([serialized, 'label:' + labelFromStack + ';']);
}
}
var rules = utils.insertStyles(cache, serialized, typeof type === 'string');
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) {
if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
newProps[key] = props[key];
}
}
newProps.ref = ref;
newProps.className = className;
var ele = /*#__PURE__*/React.createElement(type, newProps);
if (!isBrowser && rules !== undefined) {
var _ref;
var serializedNames = serialized.name;
var next = serialized.next;
while (next !== undefined) {
serializedNames += ' ' + next.name;
next = next.next;
}
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + " " + serializedNames, _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}
return ele;
});
if (process.env.NODE_ENV !== 'production') {
Emotion.displayName = 'EmotionCssPropInternal';
}
exports.CacheProvider = CacheProvider;
exports.Emotion = Emotion;
exports.ThemeContext = ThemeContext;
exports.ThemeProvider = ThemeProvider;
exports.__unsafe_useEmotionCache = __unsafe_useEmotionCache;
exports.createEmotionProps = createEmotionProps;
exports.hasOwnProperty = hasOwnProperty;
exports.isBrowser = isBrowser;
exports.useTheme = useTheme;
exports.withTheme = withTheme;

View file

@ -0,0 +1,355 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var React = require('react');
require('@emotion/cache');
var emotionElement = require('./emotion-element-35a6e288.browser.cjs.js');
require('@babel/runtime/helpers/extends');
require('@emotion/weak-memoize');
require('hoist-non-react-statics');
require('../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.cjs.js');
var utils = require('@emotion/utils');
var serialize = require('@emotion/serialize');
var sheet = require('@emotion/sheet');
var pkg = {
name: "@emotion/react",
version: "11.4.1",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
types: "types/index.d.ts",
files: [
"src",
"dist",
"jsx-runtime",
"jsx-dev-runtime",
"isolated-hoist-non-react-statics-do-not-use-this-in-your-code",
"types/*.d.ts",
"macro.js",
"macro.d.ts",
"macro.js.flow"
],
sideEffects: false,
author: "mitchellhamilton <mitchell@mitchellhamilton.me>",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.13.10",
"@emotion/cache": "^11.4.0",
"@emotion/serialize": "^1.0.2",
"@emotion/sheet": "^1.0.2",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
"@babel/core": "^7.0.0",
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@babel/core": {
optional: true
},
"@types/react": {
optional: true
}
},
devDependencies: {
"@babel/core": "^7.13.10",
"@emotion/css": "11.1.3",
"@emotion/css-prettifier": "1.0.0",
"@emotion/server": "11.4.0",
"@emotion/styled": "11.3.0",
"@types/react": "^16.9.11",
dtslint: "^0.3.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [
"./index.js",
"./jsx-runtime.js",
"./jsx-dev-runtime.js",
"./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js"
],
umdName: "emotionReact"
}
};
var jsx = function jsx(type, props) {
var args = arguments;
if (props == null || !emotionElement.hasOwnProperty.call(props, 'css')) {
// $FlowFixMe
return React.createElement.apply(undefined, args);
}
var argsLength = args.length;
var createElementArgArray = new Array(argsLength);
createElementArgArray[0] = emotionElement.Emotion;
createElementArgArray[1] = emotionElement.createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) {
createElementArgArray[i] = args[i];
} // $FlowFixMe
return React.createElement.apply(null, createElementArgArray);
};
var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */emotionElement.withEmotionCache(function (props, cache) {
if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is
// probably using the custom createElement which
// means it will be turned into a className prop
// $FlowFixMe I don't really want to add it to the type since it shouldn't be used
props.className || props.css)) {
console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
warnedAboutCssPropForGlobal = true;
}
var styles = props.styles;
var serialized = serialize.serializeStyles([styles], undefined, React.useContext(emotionElement.ThemeContext));
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = React.useRef();
React.useLayoutEffect(function () {
var key = cache.key + "-global";
var sheet$1 = new sheet.StyleSheet({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet$1.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
node.setAttribute('data-emotion', key);
sheet$1.hydrate([node]);
}
sheetRef.current = [sheet$1, rehydrating];
return function () {
sheet$1.flush();
};
}, [cache]);
React.useLayoutEffect(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
utils.insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
});
if (process.env.NODE_ENV !== 'production') {
Global.displayName = 'EmotionGlobal';
}
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return serialize.serializeStyles(args);
}
var keyframes = function keyframes() {
var insertable = css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
var classnames = function classnames(args) {
var len = args.length;
var i = 0;
var cls = '';
for (; i < len; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
}
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
function merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = utils.getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var ClassNames = /* #__PURE__ */emotionElement.withEmotionCache(function (props, cache) {
var hasRendered = false;
var css = function css() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('css can only be used during render');
}
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = serialize.serializeStyles(args, cache.registered);
{
utils.insertStyles(cache, serialized, false);
}
return cache.key + "-" + serialized.name;
};
var cx = function cx() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('cx can only be used during render');
}
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return merge(cache.registered, css, classnames(args));
};
var content = {
css: css,
cx: cx,
theme: React.useContext(emotionElement.ThemeContext)
};
var ele = props.children(content);
hasRendered = true;
return ele;
});
if (process.env.NODE_ENV !== 'production') {
ClassNames.displayName = 'EmotionClassNames';
}
if (process.env.NODE_ENV !== 'production') {
var isBrowser = "object" !== 'undefined'; // #1727 for some reason Jest evaluates modules twice if some consuming module gets mocked with jest.mock
var isJest = typeof jest !== 'undefined';
if (isBrowser && !isJest) {
var globalContext = isBrowser ? window : global;
var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
if (globalContext[globalKey]) {
console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
}
globalContext[globalKey] = true;
}
}
exports.CacheProvider = emotionElement.CacheProvider;
exports.ThemeContext = emotionElement.ThemeContext;
exports.ThemeProvider = emotionElement.ThemeProvider;
exports.__unsafe_useEmotionCache = emotionElement.__unsafe_useEmotionCache;
exports.useTheme = emotionElement.useTheme;
exports.withEmotionCache = emotionElement.withEmotionCache;
exports.withTheme = emotionElement.withTheme;
exports.ClassNames = ClassNames;
exports.Global = Global;
exports.createElement = jsx;
exports.css = css;
exports.jsx = jsx;
exports.keyframes = keyframes;

View file

@ -0,0 +1,340 @@
import { createElement, useContext, useRef, useLayoutEffect } from 'react';
import '@emotion/cache';
import { h as hasOwnProperty, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext } from './emotion-element-99289b21.browser.esm.js';
export { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-99289b21.browser.esm.js';
import '@babel/runtime/helpers/extends';
import '@emotion/weak-memoize';
import 'hoist-non-react-statics';
import '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.esm.js';
import { insertStyles, getRegisteredStyles } from '@emotion/utils';
import { serializeStyles } from '@emotion/serialize';
import { StyleSheet } from '@emotion/sheet';
var pkg = {
name: "@emotion/react",
version: "11.4.1",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
types: "types/index.d.ts",
files: [
"src",
"dist",
"jsx-runtime",
"jsx-dev-runtime",
"isolated-hoist-non-react-statics-do-not-use-this-in-your-code",
"types/*.d.ts",
"macro.js",
"macro.d.ts",
"macro.js.flow"
],
sideEffects: false,
author: "mitchellhamilton <mitchell@mitchellhamilton.me>",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.13.10",
"@emotion/cache": "^11.4.0",
"@emotion/serialize": "^1.0.2",
"@emotion/sheet": "^1.0.2",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
"@babel/core": "^7.0.0",
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@babel/core": {
optional: true
},
"@types/react": {
optional: true
}
},
devDependencies: {
"@babel/core": "^7.13.10",
"@emotion/css": "11.1.3",
"@emotion/css-prettifier": "1.0.0",
"@emotion/server": "11.4.0",
"@emotion/styled": "11.3.0",
"@types/react": "^16.9.11",
dtslint: "^0.3.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [
"./index.js",
"./jsx-runtime.js",
"./jsx-dev-runtime.js",
"./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js"
],
umdName: "emotionReact"
}
};
var jsx = function jsx(type, props) {
var args = arguments;
if (props == null || !hasOwnProperty.call(props, 'css')) {
// $FlowFixMe
return createElement.apply(undefined, args);
}
var argsLength = args.length;
var createElementArgArray = new Array(argsLength);
createElementArgArray[0] = Emotion;
createElementArgArray[1] = createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) {
createElementArgArray[i] = args[i];
} // $FlowFixMe
return createElement.apply(null, createElementArgArray);
};
var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */withEmotionCache(function (props, cache) {
if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is
// probably using the custom createElement which
// means it will be turned into a className prop
// $FlowFixMe I don't really want to add it to the type since it shouldn't be used
props.className || props.css)) {
console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
warnedAboutCssPropForGlobal = true;
}
var styles = props.styles;
var serialized = serializeStyles([styles], undefined, useContext(ThemeContext));
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = useRef();
useLayoutEffect(function () {
var key = cache.key + "-global";
var sheet = new StyleSheet({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
node.setAttribute('data-emotion', key);
sheet.hydrate([node]);
}
sheetRef.current = [sheet, rehydrating];
return function () {
sheet.flush();
};
}, [cache]);
useLayoutEffect(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
});
if (process.env.NODE_ENV !== 'production') {
Global.displayName = 'EmotionGlobal';
}
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return serializeStyles(args);
}
var keyframes = function keyframes() {
var insertable = css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
var classnames = function classnames(args) {
var len = args.length;
var i = 0;
var cls = '';
for (; i < len; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
}
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
function merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var ClassNames = /* #__PURE__ */withEmotionCache(function (props, cache) {
var hasRendered = false;
var css = function css() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('css can only be used during render');
}
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = serializeStyles(args, cache.registered);
{
insertStyles(cache, serialized, false);
}
return cache.key + "-" + serialized.name;
};
var cx = function cx() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('cx can only be used during render');
}
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return merge(cache.registered, css, classnames(args));
};
var content = {
css: css,
cx: cx,
theme: useContext(ThemeContext)
};
var ele = props.children(content);
hasRendered = true;
return ele;
});
if (process.env.NODE_ENV !== 'production') {
ClassNames.displayName = 'EmotionClassNames';
}
if (process.env.NODE_ENV !== 'production') {
var isBrowser = "object" !== 'undefined'; // #1727 for some reason Jest evaluates modules twice if some consuming module gets mocked with jest.mock
var isJest = typeof jest !== 'undefined';
if (isBrowser && !isJest) {
var globalContext = isBrowser ? window : global;
var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
if (globalContext[globalKey]) {
console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
}
globalContext[globalKey] = true;
}
}
export { ClassNames, Global, jsx as createElement, css, jsx, keyframes };

View file

@ -0,0 +1,408 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var React = require('react');
require('@emotion/cache');
var emotionElement = require('./emotion-element-ce965253.cjs.dev.js');
require('@babel/runtime/helpers/extends');
require('@emotion/weak-memoize');
require('hoist-non-react-statics');
require('../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.cjs.dev.js');
var utils = require('@emotion/utils');
var serialize = require('@emotion/serialize');
var sheet = require('@emotion/sheet');
var pkg = {
name: "@emotion/react",
version: "11.4.1",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
types: "types/index.d.ts",
files: [
"src",
"dist",
"jsx-runtime",
"jsx-dev-runtime",
"isolated-hoist-non-react-statics-do-not-use-this-in-your-code",
"types/*.d.ts",
"macro.js",
"macro.d.ts",
"macro.js.flow"
],
sideEffects: false,
author: "mitchellhamilton <mitchell@mitchellhamilton.me>",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.13.10",
"@emotion/cache": "^11.4.0",
"@emotion/serialize": "^1.0.2",
"@emotion/sheet": "^1.0.2",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
"@babel/core": "^7.0.0",
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@babel/core": {
optional: true
},
"@types/react": {
optional: true
}
},
devDependencies: {
"@babel/core": "^7.13.10",
"@emotion/css": "11.1.3",
"@emotion/css-prettifier": "1.0.0",
"@emotion/server": "11.4.0",
"@emotion/styled": "11.3.0",
"@types/react": "^16.9.11",
dtslint: "^0.3.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [
"./index.js",
"./jsx-runtime.js",
"./jsx-dev-runtime.js",
"./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js"
],
umdName: "emotionReact"
}
};
var jsx = function jsx(type, props) {
var args = arguments;
if (props == null || !emotionElement.hasOwnProperty.call(props, 'css')) {
// $FlowFixMe
return React.createElement.apply(undefined, args);
}
var argsLength = args.length;
var createElementArgArray = new Array(argsLength);
createElementArgArray[0] = emotionElement.Emotion;
createElementArgArray[1] = emotionElement.createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) {
createElementArgArray[i] = args[i];
} // $FlowFixMe
return React.createElement.apply(null, createElementArgArray);
};
var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */emotionElement.withEmotionCache(function (props, cache) {
if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is
// probably using the custom createElement which
// means it will be turned into a className prop
// $FlowFixMe I don't really want to add it to the type since it shouldn't be used
props.className || props.css)) {
console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
warnedAboutCssPropForGlobal = true;
}
var styles = props.styles;
var serialized = serialize.serializeStyles([styles], undefined, React.useContext(emotionElement.ThemeContext));
if (!emotionElement.isBrowser) {
var _ref;
var serializedNames = serialized.name;
var serializedStyles = serialized.styles;
var next = serialized.next;
while (next !== undefined) {
serializedNames += ' ' + next.name;
serializedStyles += next.styles;
next = next.next;
}
var shouldCache = cache.compat === true;
var rules = cache.insert("", {
name: serializedNames,
styles: serializedStyles
}, cache.sheet, shouldCache);
if (shouldCache) {
return null;
}
return /*#__PURE__*/React.createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + "-global " + serializedNames, _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref));
} // yes, i know these hooks are used conditionally
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = React.useRef();
React.useLayoutEffect(function () {
var key = cache.key + "-global";
var sheet$1 = new sheet.StyleSheet({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet$1.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
node.setAttribute('data-emotion', key);
sheet$1.hydrate([node]);
}
sheetRef.current = [sheet$1, rehydrating];
return function () {
sheet$1.flush();
};
}, [cache]);
React.useLayoutEffect(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
utils.insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
});
if (process.env.NODE_ENV !== 'production') {
Global.displayName = 'EmotionGlobal';
}
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return serialize.serializeStyles(args);
}
var keyframes = function keyframes() {
var insertable = css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
var classnames = function classnames(args) {
var len = args.length;
var i = 0;
var cls = '';
for (; i < len; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
}
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
function merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = utils.getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var ClassNames = /* #__PURE__ */emotionElement.withEmotionCache(function (props, cache) {
var rules = '';
var serializedHashes = '';
var hasRendered = false;
var css = function css() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('css can only be used during render');
}
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = serialize.serializeStyles(args, cache.registered);
if (emotionElement.isBrowser) {
utils.insertStyles(cache, serialized, false);
} else {
var res = utils.insertStyles(cache, serialized, false);
if (res !== undefined) {
rules += res;
}
}
if (!emotionElement.isBrowser) {
serializedHashes += " " + serialized.name;
}
return cache.key + "-" + serialized.name;
};
var cx = function cx() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('cx can only be used during render');
}
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return merge(cache.registered, css, classnames(args));
};
var content = {
css: css,
cx: cx,
theme: React.useContext(emotionElement.ThemeContext)
};
var ele = props.children(content);
hasRendered = true;
if (!emotionElement.isBrowser && rules.length !== 0) {
var _ref;
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + " " + serializedHashes.substring(1), _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}
return ele;
});
if (process.env.NODE_ENV !== 'production') {
ClassNames.displayName = 'EmotionClassNames';
}
if (process.env.NODE_ENV !== 'production') {
var isBrowser = typeof document !== 'undefined'; // #1727 for some reason Jest evaluates modules twice if some consuming module gets mocked with jest.mock
var isJest = typeof jest !== 'undefined';
if (isBrowser && !isJest) {
var globalContext = isBrowser ? window : global;
var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
if (globalContext[globalKey]) {
console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
}
globalContext[globalKey] = true;
}
}
exports.CacheProvider = emotionElement.CacheProvider;
exports.ThemeContext = emotionElement.ThemeContext;
exports.ThemeProvider = emotionElement.ThemeProvider;
exports.__unsafe_useEmotionCache = emotionElement.__unsafe_useEmotionCache;
exports.useTheme = emotionElement.useTheme;
Object.defineProperty(exports, 'withEmotionCache', {
enumerable: true,
get: function () {
return emotionElement.withEmotionCache;
}
});
exports.withTheme = emotionElement.withTheme;
exports.ClassNames = ClassNames;
exports.Global = Global;
exports.createElement = jsx;
exports.css = css;
exports.jsx = jsx;
exports.keyframes = keyframes;

View file

@ -0,0 +1,7 @@
'use strict';
if (process.env.NODE_ENV === "production") {
module.exports = require("./emotion-react.cjs.prod.js");
} else {
module.exports = require("./emotion-react.cjs.dev.js");
}

View file

@ -0,0 +1,2 @@
// @flow
export * from "../src/index.js";

View file

@ -0,0 +1,198 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
});
var React = require("react");
require("@emotion/cache");
var emotionElement = require("./emotion-element-94e2cf49.cjs.prod.js");
require("@babel/runtime/helpers/extends"), require("@emotion/weak-memoize"), require("hoist-non-react-statics"),
require("../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.cjs.prod.js");
var utils = require("@emotion/utils"), serialize = require("@emotion/serialize"), sheet = require("@emotion/sheet"), pkg = {
name: "@emotion/react",
version: "11.4.1",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
types: "types/index.d.ts",
files: [ "src", "dist", "jsx-runtime", "jsx-dev-runtime", "isolated-hoist-non-react-statics-do-not-use-this-in-your-code", "types/*.d.ts", "macro.js", "macro.d.ts", "macro.js.flow" ],
sideEffects: !1,
author: "mitchellhamilton <mitchell@mitchellhamilton.me>",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.13.10",
"@emotion/cache": "^11.4.0",
"@emotion/serialize": "^1.0.2",
"@emotion/sheet": "^1.0.2",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
"@babel/core": "^7.0.0",
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@babel/core": {
optional: !0
},
"@types/react": {
optional: !0
}
},
devDependencies: {
"@babel/core": "^7.13.10",
"@emotion/css": "11.1.3",
"@emotion/css-prettifier": "1.0.0",
"@emotion/server": "11.4.0",
"@emotion/styled": "11.3.0",
"@types/react": "^16.9.11",
dtslint: "^0.3.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [ "./index.js", "./jsx-runtime.js", "./jsx-dev-runtime.js", "./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js" ],
umdName: "emotionReact"
}
}, jsx = function(type, props) {
var args = arguments;
if (null == props || !emotionElement.hasOwnProperty.call(props, "css")) return React.createElement.apply(void 0, args);
var argsLength = args.length, createElementArgArray = new Array(argsLength);
createElementArgArray[0] = emotionElement.Emotion, createElementArgArray[1] = emotionElement.createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) createElementArgArray[i] = args[i];
return React.createElement.apply(null, createElementArgArray);
}, warnedAboutCssPropForGlobal = !1, Global = emotionElement.withEmotionCache((function(props, cache) {
var styles = props.styles, serialized = serialize.serializeStyles([ styles ], void 0, React.useContext(emotionElement.ThemeContext));
if (!emotionElement.isBrowser) {
for (var _ref, serializedNames = serialized.name, serializedStyles = serialized.styles, next = serialized.next; void 0 !== next; ) serializedNames += " " + next.name,
serializedStyles += next.styles, next = next.next;
var shouldCache = !0 === cache.compat, rules = cache.insert("", {
name: serializedNames,
styles: serializedStyles
}, cache.sheet, shouldCache);
return shouldCache ? null : React.createElement("style", ((_ref = {})["data-emotion"] = cache.key + "-global " + serializedNames,
_ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref));
}
var sheetRef = React.useRef();
return React.useLayoutEffect((function() {
var key = cache.key + "-global", sheet$1 = new sheet.StyleSheet({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
}), rehydrating = !1, node = document.querySelector('style[data-emotion="' + key + " " + serialized.name + '"]');
return cache.sheet.tags.length && (sheet$1.before = cache.sheet.tags[0]), null !== node && (rehydrating = !0,
node.setAttribute("data-emotion", key), sheet$1.hydrate([ node ])), sheetRef.current = [ sheet$1, rehydrating ],
function() {
sheet$1.flush();
};
}), [ cache ]), React.useLayoutEffect((function() {
var sheetRefCurrent = sheetRef.current, sheet = sheetRefCurrent[0];
if (sheetRefCurrent[1]) sheetRefCurrent[1] = !1; else {
if (void 0 !== serialized.next && utils.insertStyles(cache, serialized.next, !0),
sheet.tags.length) {
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element, sheet.flush();
}
cache.insert("", serialized, sheet, !1);
}
}), [ cache, serialized.name ]), null;
}));
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
return serialize.serializeStyles(args);
}
var keyframes = function() {
var insertable = css.apply(void 0, arguments), name = "animation-" + insertable.name;
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
}, classnames = function classnames(args) {
for (var len = args.length, i = 0, cls = ""; i < len; i++) {
var arg = args[i];
if (null != arg) {
var toAdd = void 0;
switch (typeof arg) {
case "boolean":
break;
case "object":
if (Array.isArray(arg)) toAdd = classnames(arg); else for (var k in toAdd = "",
arg) arg[k] && k && (toAdd && (toAdd += " "), toAdd += k);
break;
default:
toAdd = arg;
}
toAdd && (cls && (cls += " "), cls += toAdd);
}
}
return cls;
};
function merge(registered, css, className) {
var registeredStyles = [], rawClassName = utils.getRegisteredStyles(registered, registeredStyles, className);
return registeredStyles.length < 2 ? className : rawClassName + css(registeredStyles);
}
var isBrowser, isJest, globalContext, globalKey, ClassNames = emotionElement.withEmotionCache((function(props, cache) {
var _ref, rules = "", serializedHashes = "", css = function() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
var serialized = serialize.serializeStyles(args, cache.registered);
if (emotionElement.isBrowser) utils.insertStyles(cache, serialized, !1); else {
var res = utils.insertStyles(cache, serialized, !1);
void 0 !== res && (rules += res);
}
return emotionElement.isBrowser || (serializedHashes += " " + serialized.name),
cache.key + "-" + serialized.name;
}, content = {
css: css,
cx: function() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) args[_key2] = arguments[_key2];
return merge(cache.registered, css, classnames(args));
},
theme: React.useContext(emotionElement.ThemeContext)
}, ele = props.children(content);
return !0, emotionElement.isBrowser || 0 === rules.length ? ele : React.createElement(React.Fragment, null, React.createElement("style", ((_ref = {})["data-emotion"] = cache.key + " " + serializedHashes.substring(1),
_ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}));
exports.CacheProvider = emotionElement.CacheProvider, exports.ThemeContext = emotionElement.ThemeContext,
exports.ThemeProvider = emotionElement.ThemeProvider, exports.__unsafe_useEmotionCache = emotionElement.__unsafe_useEmotionCache,
exports.useTheme = emotionElement.useTheme, Object.defineProperty(exports, "withEmotionCache", {
enumerable: !0,
get: function() {
return emotionElement.withEmotionCache;
}
}), exports.withTheme = emotionElement.withTheme, exports.ClassNames = ClassNames,
exports.Global = Global, exports.createElement = jsx, exports.css = css, exports.jsx = jsx,
exports.keyframes = keyframes;

View file

@ -0,0 +1,388 @@
import { createElement, useContext, useRef, useLayoutEffect, Fragment } from 'react';
import '@emotion/cache';
import { h as hasOwnProperty, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext, i as isBrowser$1 } from './emotion-element-8d26346b.esm.js';
export { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-8d26346b.esm.js';
import '@babel/runtime/helpers/extends';
import '@emotion/weak-memoize';
import 'hoist-non-react-statics';
import '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.esm.js';
import { insertStyles, getRegisteredStyles } from '@emotion/utils';
import { serializeStyles } from '@emotion/serialize';
import { StyleSheet } from '@emotion/sheet';
var pkg = {
name: "@emotion/react",
version: "11.4.1",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
types: "types/index.d.ts",
files: [
"src",
"dist",
"jsx-runtime",
"jsx-dev-runtime",
"isolated-hoist-non-react-statics-do-not-use-this-in-your-code",
"types/*.d.ts",
"macro.js",
"macro.d.ts",
"macro.js.flow"
],
sideEffects: false,
author: "mitchellhamilton <mitchell@mitchellhamilton.me>",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.13.10",
"@emotion/cache": "^11.4.0",
"@emotion/serialize": "^1.0.2",
"@emotion/sheet": "^1.0.2",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
"@babel/core": "^7.0.0",
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@babel/core": {
optional: true
},
"@types/react": {
optional: true
}
},
devDependencies: {
"@babel/core": "^7.13.10",
"@emotion/css": "11.1.3",
"@emotion/css-prettifier": "1.0.0",
"@emotion/server": "11.4.0",
"@emotion/styled": "11.3.0",
"@types/react": "^16.9.11",
dtslint: "^0.3.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [
"./index.js",
"./jsx-runtime.js",
"./jsx-dev-runtime.js",
"./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js"
],
umdName: "emotionReact"
}
};
var jsx = function jsx(type, props) {
var args = arguments;
if (props == null || !hasOwnProperty.call(props, 'css')) {
// $FlowFixMe
return createElement.apply(undefined, args);
}
var argsLength = args.length;
var createElementArgArray = new Array(argsLength);
createElementArgArray[0] = Emotion;
createElementArgArray[1] = createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) {
createElementArgArray[i] = args[i];
} // $FlowFixMe
return createElement.apply(null, createElementArgArray);
};
var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */withEmotionCache(function (props, cache) {
if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is
// probably using the custom createElement which
// means it will be turned into a className prop
// $FlowFixMe I don't really want to add it to the type since it shouldn't be used
props.className || props.css)) {
console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
warnedAboutCssPropForGlobal = true;
}
var styles = props.styles;
var serialized = serializeStyles([styles], undefined, useContext(ThemeContext));
if (!isBrowser$1) {
var _ref;
var serializedNames = serialized.name;
var serializedStyles = serialized.styles;
var next = serialized.next;
while (next !== undefined) {
serializedNames += ' ' + next.name;
serializedStyles += next.styles;
next = next.next;
}
var shouldCache = cache.compat === true;
var rules = cache.insert("", {
name: serializedNames,
styles: serializedStyles
}, cache.sheet, shouldCache);
if (shouldCache) {
return null;
}
return /*#__PURE__*/createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + "-global " + serializedNames, _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref));
} // yes, i know these hooks are used conditionally
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = useRef();
useLayoutEffect(function () {
var key = cache.key + "-global";
var sheet = new StyleSheet({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
node.setAttribute('data-emotion', key);
sheet.hydrate([node]);
}
sheetRef.current = [sheet, rehydrating];
return function () {
sheet.flush();
};
}, [cache]);
useLayoutEffect(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
});
if (process.env.NODE_ENV !== 'production') {
Global.displayName = 'EmotionGlobal';
}
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return serializeStyles(args);
}
var keyframes = function keyframes() {
var insertable = css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
var classnames = function classnames(args) {
var len = args.length;
var i = 0;
var cls = '';
for (; i < len; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
}
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
function merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var ClassNames = /* #__PURE__ */withEmotionCache(function (props, cache) {
var rules = '';
var serializedHashes = '';
var hasRendered = false;
var css = function css() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('css can only be used during render');
}
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = serializeStyles(args, cache.registered);
if (isBrowser$1) {
insertStyles(cache, serialized, false);
} else {
var res = insertStyles(cache, serialized, false);
if (res !== undefined) {
rules += res;
}
}
if (!isBrowser$1) {
serializedHashes += " " + serialized.name;
}
return cache.key + "-" + serialized.name;
};
var cx = function cx() {
if (hasRendered && process.env.NODE_ENV !== 'production') {
throw new Error('cx can only be used during render');
}
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return merge(cache.registered, css, classnames(args));
};
var content = {
css: css,
cx: cx,
theme: useContext(ThemeContext)
};
var ele = props.children(content);
hasRendered = true;
if (!isBrowser$1 && rules.length !== 0) {
var _ref;
return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + " " + serializedHashes.substring(1), _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref)), ele);
}
return ele;
});
if (process.env.NODE_ENV !== 'production') {
ClassNames.displayName = 'EmotionClassNames';
}
if (process.env.NODE_ENV !== 'production') {
var isBrowser = typeof document !== 'undefined'; // #1727 for some reason Jest evaluates modules twice if some consuming module gets mocked with jest.mock
var isJest = typeof jest !== 'undefined';
if (isBrowser && !isJest) {
var globalContext = isBrowser ? window : global;
var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
if (globalContext[globalKey]) {
console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
}
globalContext[globalKey] = true;
}
}
export { ClassNames, Global, jsx as createElement, css, jsx, keyframes };

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long