diff --git a/dist/cjs/index.js b/dist/cjs/index.js index 31eb742..58556f3 100644 --- a/dist/cjs/index.js +++ b/dist/cjs/index.js @@ -2,12 +2,88 @@ Object.defineProperty(exports, '__esModule', { value: true }); -var React$v = require('react'); +var React = require('react'); var Amplify = require('aws-amplify'); var Auth = require('@aws-amplify/auth'); +var TextField$3 = require('@material-ui/core/TextField'); +var CircularProgress = require('@material-ui/core/CircularProgress'); +var Grid = require('@material-ui/core/Grid'); +var Button$2 = require('@material-ui/core/Button'); +var CreateIcon = require('@material-ui/icons/CreateOutlined'); +var styles$2 = require('@material-ui/core/styles'); +var core = require('@material-ui/core'); +var Box = require('@material-ui/core/Box'); +var Paper = require('@material-ui/core/Paper'); +var AddIcon = require('@material-ui/icons/Add'); +var ArrowUpward = require('@material-ui/icons/ArrowUpward'); +var ArrowDownward = require('@material-ui/icons/ArrowDownward'); +var Remove = require('@material-ui/icons/Remove'); +var Typography = require('@material-ui/core/Typography'); +var List$3 = require('@material-ui/core/List'); +var ListItem = require('@material-ui/core/ListItem'); +var ListItemIcon = require('@material-ui/core/ListItemIcon'); +var ErrorIcon$1 = require('@material-ui/icons/Error'); +var ListItemText = require('@material-ui/core/ListItemText'); +var Divider = require('@material-ui/core/Divider'); +var FormControl = require('@material-ui/core/FormControl'); +var FormHelperText = require('@material-ui/core/FormHelperText'); +var Input$1 = require('@material-ui/core/Input'); +var InputLabel = require('@material-ui/core/InputLabel'); +var Checkbox = require('@material-ui/core/Checkbox'); +var FormControlLabel = require('@material-ui/core/FormControlLabel'); +var FormLabel = require('@material-ui/core/FormLabel'); +var FormGroup = require('@material-ui/core/FormGroup'); +var Radio = require('@material-ui/core/Radio'); +var RadioGroup = require('@material-ui/core/RadioGroup'); +var Slider = require('@material-ui/core/Slider'); +var MenuItem = require('@material-ui/core/MenuItem'); +var ExitIcon = require('@material-ui/icons/PowerSettingsNew'); var ReactDOM = require('react-dom'); +var icons = require('@material-ui/icons'); +var DownloadIcon = require('@material-ui/icons/GetApp'); +var Inbox = require('@material-ui/icons/Inbox'); var uiComponents = require('@aws-amplify/ui-components'); var uiReact = require('@aws-amplify/ui-react'); +var Toolbar = require('@material-ui/core/Toolbar'); +var ActionList = require('@material-ui/icons/List'); +var ContentSave = require('@material-ui/icons/Save'); +var colorManipulator = require('@material-ui/core/styles/colorManipulator'); +var ActionDelete = require('@material-ui/icons/Delete'); +var Dialog = require('@material-ui/core/Dialog'); +var DialogActions = require('@material-ui/core/DialogActions'); +var DialogContent = require('@material-ui/core/DialogContent'); +var DialogContentText = require('@material-ui/core/DialogContentText'); +var DialogTitle = require('@material-ui/core/DialogTitle'); +var ActionCheck = require('@material-ui/icons/CheckCircle'); +var AlertError = require('@material-ui/icons/ErrorOutline'); +var IconButton$2 = require('@material-ui/core/IconButton'); +var ActionHide = require('@material-ui/icons/HighlightOff'); +var Menu$1 = require('@material-ui/core/Menu'); +var ContentFilter = require('@material-ui/icons/FilterList'); +var ClearIcon = require('@material-ui/icons/Clear'); +var Progress = require('@material-ui/core/LinearProgress'); +var Switch$1 = require('@material-ui/core/Switch'); +var Card = require('@material-ui/core/Card'); +var ChevronLeft = require('@material-ui/icons/ChevronLeft'); +var ChevronRight = require('@material-ui/icons/ChevronRight'); +var CardContent = require('@material-ui/core/CardContent'); +var CloseIcon = require('@material-ui/icons/Close'); +var ExpandMoreIcon = require('@material-ui/icons/ExpandMore'); +var TableCell = require('@material-ui/core/TableCell'); +var DoneIcon = require('@material-ui/icons/Done'); +var MenuIcon = require('@material-ui/icons/Menu'); +var Tooltip = require('@material-ui/core/Tooltip'); +var NavigationRefresh = require('@material-ui/icons/Refresh'); +var AccountCircle = require('@material-ui/icons/AccountCircle'); +var useScrollTrigger = require('@material-ui/core/useScrollTrigger'); +var Slide = require('@material-ui/core/Slide'); +var DefaultIcon = require('@material-ui/icons/ViewList'); +var DashboardIcon = require('@material-ui/icons/Dashboard'); +var Snackbar = require('@material-ui/core/Snackbar'); +var ErrorIcon = require('@material-ui/icons/Report'); +var History = require('@material-ui/icons/History'); +var HotTub = require('@material-ui/icons/HotTub'); +var LockIcon = require('@material-ui/icons/Lock'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } @@ -31,15 +107,86 @@ function _interopNamespace(e) { return Object.freeze(n); } -var React__default = /*#__PURE__*/_interopDefaultLegacy(React$v); -var React__namespace = /*#__PURE__*/_interopNamespace(React$v); +var React__default = /*#__PURE__*/_interopDefaultLegacy(React); +var React__namespace = /*#__PURE__*/_interopNamespace(React); var Amplify__default = /*#__PURE__*/_interopDefaultLegacy(Amplify); var Auth__default = /*#__PURE__*/_interopDefaultLegacy(Auth); +var TextField__default = /*#__PURE__*/_interopDefaultLegacy(TextField$3); +var CircularProgress__default = /*#__PURE__*/_interopDefaultLegacy(CircularProgress); +var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid); +var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button$2); +var CreateIcon__default = /*#__PURE__*/_interopDefaultLegacy(CreateIcon); +var Box__default = /*#__PURE__*/_interopDefaultLegacy(Box); +var Paper__default = /*#__PURE__*/_interopDefaultLegacy(Paper); +var AddIcon__default = /*#__PURE__*/_interopDefaultLegacy(AddIcon); +var ArrowUpward__default = /*#__PURE__*/_interopDefaultLegacy(ArrowUpward); +var ArrowDownward__default = /*#__PURE__*/_interopDefaultLegacy(ArrowDownward); +var Remove__default = /*#__PURE__*/_interopDefaultLegacy(Remove); +var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography); +var List__default = /*#__PURE__*/_interopDefaultLegacy(List$3); +var ListItem__default = /*#__PURE__*/_interopDefaultLegacy(ListItem); +var ListItemIcon__default = /*#__PURE__*/_interopDefaultLegacy(ListItemIcon); +var ErrorIcon__default$1 = /*#__PURE__*/_interopDefaultLegacy(ErrorIcon$1); +var ListItemText__default = /*#__PURE__*/_interopDefaultLegacy(ListItemText); +var Divider__default = /*#__PURE__*/_interopDefaultLegacy(Divider); +var FormControl__default = /*#__PURE__*/_interopDefaultLegacy(FormControl); +var FormHelperText__default = /*#__PURE__*/_interopDefaultLegacy(FormHelperText); +var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input$1); +var InputLabel__default = /*#__PURE__*/_interopDefaultLegacy(InputLabel); +var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox); +var FormControlLabel__default = /*#__PURE__*/_interopDefaultLegacy(FormControlLabel); +var FormLabel__default = /*#__PURE__*/_interopDefaultLegacy(FormLabel); +var FormGroup__default = /*#__PURE__*/_interopDefaultLegacy(FormGroup); +var Radio__default = /*#__PURE__*/_interopDefaultLegacy(Radio); +var RadioGroup__default = /*#__PURE__*/_interopDefaultLegacy(RadioGroup); +var Slider__default = /*#__PURE__*/_interopDefaultLegacy(Slider); +var MenuItem__default = /*#__PURE__*/_interopDefaultLegacy(MenuItem); +var ExitIcon__default = /*#__PURE__*/_interopDefaultLegacy(ExitIcon); var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM); -var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM); - -function _extends$m() { - _extends$m = Object.assign || function (target) { +var DownloadIcon__default = /*#__PURE__*/_interopDefaultLegacy(DownloadIcon); +var Inbox__default = /*#__PURE__*/_interopDefaultLegacy(Inbox); +var Toolbar__default = /*#__PURE__*/_interopDefaultLegacy(Toolbar); +var ActionList__default = /*#__PURE__*/_interopDefaultLegacy(ActionList); +var ContentSave__default = /*#__PURE__*/_interopDefaultLegacy(ContentSave); +var ActionDelete__default = /*#__PURE__*/_interopDefaultLegacy(ActionDelete); +var Dialog__default = /*#__PURE__*/_interopDefaultLegacy(Dialog); +var DialogActions__default = /*#__PURE__*/_interopDefaultLegacy(DialogActions); +var DialogContent__default = /*#__PURE__*/_interopDefaultLegacy(DialogContent); +var DialogContentText__default = /*#__PURE__*/_interopDefaultLegacy(DialogContentText); +var DialogTitle__default = /*#__PURE__*/_interopDefaultLegacy(DialogTitle); +var ActionCheck__default = /*#__PURE__*/_interopDefaultLegacy(ActionCheck); +var AlertError__default = /*#__PURE__*/_interopDefaultLegacy(AlertError); +var IconButton__default = /*#__PURE__*/_interopDefaultLegacy(IconButton$2); +var ActionHide__default = /*#__PURE__*/_interopDefaultLegacy(ActionHide); +var Menu__default = /*#__PURE__*/_interopDefaultLegacy(Menu$1); +var ContentFilter__default = /*#__PURE__*/_interopDefaultLegacy(ContentFilter); +var ClearIcon__default = /*#__PURE__*/_interopDefaultLegacy(ClearIcon); +var Progress__default = /*#__PURE__*/_interopDefaultLegacy(Progress); +var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch$1); +var Card__default = /*#__PURE__*/_interopDefaultLegacy(Card); +var ChevronLeft__default = /*#__PURE__*/_interopDefaultLegacy(ChevronLeft); +var ChevronRight__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRight); +var CardContent__default = /*#__PURE__*/_interopDefaultLegacy(CardContent); +var CloseIcon__default = /*#__PURE__*/_interopDefaultLegacy(CloseIcon); +var ExpandMoreIcon__default = /*#__PURE__*/_interopDefaultLegacy(ExpandMoreIcon); +var TableCell__default = /*#__PURE__*/_interopDefaultLegacy(TableCell); +var DoneIcon__default = /*#__PURE__*/_interopDefaultLegacy(DoneIcon); +var MenuIcon__default = /*#__PURE__*/_interopDefaultLegacy(MenuIcon); +var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip); +var NavigationRefresh__default = /*#__PURE__*/_interopDefaultLegacy(NavigationRefresh); +var AccountCircle__default = /*#__PURE__*/_interopDefaultLegacy(AccountCircle); +var useScrollTrigger__default = /*#__PURE__*/_interopDefaultLegacy(useScrollTrigger); +var Slide__default = /*#__PURE__*/_interopDefaultLegacy(Slide); +var DefaultIcon__default = /*#__PURE__*/_interopDefaultLegacy(DefaultIcon); +var DashboardIcon__default = /*#__PURE__*/_interopDefaultLegacy(DashboardIcon); +var Snackbar__default = /*#__PURE__*/_interopDefaultLegacy(Snackbar); +var ErrorIcon__default = /*#__PURE__*/_interopDefaultLegacy(ErrorIcon); +var History__default = /*#__PURE__*/_interopDefaultLegacy(History); +var HotTub__default = /*#__PURE__*/_interopDefaultLegacy(HotTub); +var LockIcon__default = /*#__PURE__*/_interopDefaultLegacy(LockIcon); + +function _extends$l() { + _extends$l = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; @@ -53,7 +200,7 @@ function _extends$m() { return target; }; - return _extends$m.apply(this, arguments); + return _extends$l.apply(this, arguments); } function _defineProperty$h(obj, key, value) { @@ -660,7 +807,7 @@ function combineReducers(reducers) { * from right to left. For example, compose(f, g, h) is identical to doing * (...args) => f(g(h(...args))). */ -function compose$1() { +function compose() { for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) { funcs[_key] = arguments[_key]; } @@ -721,7 +868,7 @@ function applyMiddleware() { var chain = middlewares.map(function (middleware) { return middleware(middlewareAPI); }); - _dispatch = compose$1.apply(void 0, chain)(store.dispatch); + _dispatch = compose.apply(void 0, chain)(store.dispatch); return _objectSpread2(_objectSpread2({}, store), {}, { dispatch: _dispatch }); @@ -742,21 +889,6 @@ if (process.env.NODE_ENV !== 'production' && typeof isCrushed.name === 'string' var commonjsGlobal$1 = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {}; -function getAugmentedNamespace(n) { - if (n.__esModule) return n; - var a = Object.defineProperty({}, '__esModule', {value: true}); - Object.keys(n).forEach(function (k) { - var d = Object.getOwnPropertyDescriptor(n, k); - Object.defineProperty(a, k, d.get ? d : { - enumerable: true, - get: function () { - return n[k]; - } - }); - }); - return a; -} - var propTypes = {exports: {}}; var reactIs$6 = {exports: {}}; @@ -1988,13 +2120,13 @@ var Subscription = /*#__PURE__*/function () { // is created synchronously, otherwise a store update may occur before the // subscription is created and an inconsistent state may be observed -var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React$v.useLayoutEffect : React$v.useEffect; +var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? React.useLayoutEffect : React.useEffect; function Provider(_ref) { var store = _ref.store, context = _ref.context, children = _ref.children; - var contextValue = React$v.useMemo(function () { + var contextValue = React.useMemo(function () { var subscription = new Subscription(store); subscription.onStateChange = subscription.notifyNestedSubs; return { @@ -2002,7 +2134,7 @@ function Provider(_ref) { subscription: subscription }; }, [store]); - var previousState = React$v.useMemo(function () { + var previousState = React.useMemo(function () { return store.getState(); }, [store]); useIsomorphicLayoutEffect(function () { @@ -2314,7 +2446,7 @@ function getStatics(component) { return TYPE_STATICS[component['$$typeof']] || REACT_STATICS; } -var defineProperty$5 = Object.defineProperty; +var defineProperty$4 = Object.defineProperty; var getOwnPropertyNames = Object.getOwnPropertyNames; var getOwnPropertySymbols = Object.getOwnPropertySymbols; var getOwnPropertyDescriptor$2 = Object.getOwnPropertyDescriptor; @@ -2348,7 +2480,7 @@ function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) { try { // Avoid failures from read-only properties - defineProperty$5(targetComponent, key, descriptor); + defineProperty$4(targetComponent, key, descriptor); } catch (e) {} } } @@ -2748,7 +2880,7 @@ _ref) { var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component'; var displayName = getDisplayName(wrappedComponentName); - var selectorFactoryOptions = _extends$m({}, connectOptions, { + var selectorFactoryOptions = _extends$l({}, connectOptions, { getDisplayName: getDisplayName, methodName: methodName, renderCountProp: renderCountProp, @@ -2768,12 +2900,12 @@ _ref) { // that just executes the given callback immediately. - var usePureOnlyMemo = pure ? React$v.useMemo : function (callback) { + var usePureOnlyMemo = pure ? React.useMemo : function (callback) { return callback(); }; function ConnectFunction(props) { - var _useMemo = React$v.useMemo(function () { + var _useMemo = React.useMemo(function () { // Distinguish between actual "data" props that were passed to the wrapper component, // and values needed to control behavior (forwarded refs, alternate context instances). // To maintain the wrapperProps object reference, memoize this destructuring. @@ -2786,13 +2918,13 @@ _ref) { reactReduxForwardedRef = _useMemo[1], wrapperProps = _useMemo[2]; - var ContextToUse = React$v.useMemo(function () { + var ContextToUse = React.useMemo(function () { // Users may optionally pass in a custom context instance to use instead of our ReactReduxContext. // Memoize the check that determines which context instance we should use. return propsContext && propsContext.Consumer && reactIs$3.exports.isContextConsumer( /*#__PURE__*/React__default['default'].createElement(propsContext.Consumer, null)) ? propsContext : Context; }, [propsContext, Context]); // Retrieve the store and ancestor subscription via context, if available - var contextValue = React$v.useContext(ContextToUse); // The store _must_ exist as either a prop or in context. + var contextValue = React.useContext(ContextToUse); // The store _must_ exist as either a prop or in context. // We'll check to see if it _looks_ like a Redux store first. // This allows us to pass through a `store` prop that is just a plain value. @@ -2805,13 +2937,13 @@ _ref) { var store = didStoreComeFromProps ? props.store : contextValue.store; - var childPropsSelector = React$v.useMemo(function () { + var childPropsSelector = React.useMemo(function () { // The child props selector needs the store reference as an input. // Re-create this selector whenever the store changes. return createChildSelector(store); }, [store]); - var _useMemo2 = React$v.useMemo(function () { + var _useMemo2 = React.useMemo(function () { if (!shouldHandleStateChanges) return NO_SUBSCRIPTION_ARRAY; // This Subscription's source should match where store came from: props vs. context. A component // connected to the store via props shouldn't use subscription from context, or vice versa. @@ -2828,7 +2960,7 @@ _ref) { // and memoize that value to avoid unnecessary context updates. - var overriddenContextValue = React$v.useMemo(function () { + var overriddenContextValue = React.useMemo(function () { if (didStoreComeFromProps) { // This component is directly subscribed to a store from props. // We don't want descendants reading from this store - pass down whatever @@ -2838,13 +2970,13 @@ _ref) { // connected descendants won't update until after this component is done - return _extends$m({}, contextValue, { + return _extends$l({}, contextValue, { subscription: subscription }); }, [didStoreComeFromProps, contextValue, subscription]); // We need to force this wrapper component to re-render whenever a Redux store update // causes a change to the calculated child component props (or we caught an error in mapState) - var _useReducer = React$v.useReducer(storeStateUpdatesReducer, EMPTY_ARRAY, initStateUpdates), + var _useReducer = React.useReducer(storeStateUpdatesReducer, EMPTY_ARRAY, initStateUpdates), _useReducer$ = _useReducer[0], previousStateUpdateResult = _useReducer$[0], forceComponentUpdateDispatch = _useReducer[1]; // Propagate any mapState/mapDispatch errors upwards @@ -2855,10 +2987,10 @@ _ref) { } // Set up refs to coordinate values between the subscription effect and the render logic - var lastChildProps = React$v.useRef(); - var lastWrapperProps = React$v.useRef(wrapperProps); - var childPropsFromStoreUpdate = React$v.useRef(); - var renderIsScheduled = React$v.useRef(false); + var lastChildProps = React.useRef(); + var lastWrapperProps = React.useRef(wrapperProps); + var childPropsFromStoreUpdate = React.useRef(); + var renderIsScheduled = React.useRef(false); var actualChildProps = usePureOnlyMemo(function () { // Tricky logic here: // - This render may have been triggered by a Redux store update that produced new child props @@ -2884,14 +3016,14 @@ _ref) { useIsomorphicLayoutEffectWithArgs(subscribeUpdates, [shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, childPropsFromStoreUpdate, notifyNestedSubs, forceComponentUpdateDispatch], [store, subscription, childPropsSelector]); // Now that all that's done, we can finally try to actually render the child component. // We memoize the elements for the rendered child component as an optimization. - var renderedWrappedComponent = React$v.useMemo(function () { - return /*#__PURE__*/React__default['default'].createElement(WrappedComponent, _extends$m({}, actualChildProps, { + var renderedWrappedComponent = React.useMemo(function () { + return /*#__PURE__*/React__default['default'].createElement(WrappedComponent, _extends$l({}, actualChildProps, { ref: reactReduxForwardedRef })); }, [reactReduxForwardedRef, WrappedComponent, actualChildProps]); // If React sees the exact same element reference as last time, it bails out of re-rendering // that child, same as if it was wrapped in React.memo() or returned false from shouldComponentUpdate. - var renderedChild = React$v.useMemo(function () { + var renderedChild = React.useMemo(function () { if (shouldHandleStateChanges) { // If this component is subscribed to store updates, we need to pass its own // subscription instance down to our descendants. That means rendering the same @@ -2913,7 +3045,7 @@ _ref) { if (forwardRef) { var forwarded = React__default['default'].forwardRef(function forwardConnectRef(props, ref) { - return /*#__PURE__*/React__default['default'].createElement(Connect, _extends$m({}, props, { + return /*#__PURE__*/React__default['default'].createElement(Connect, _extends$l({}, props, { reactReduxForwardedRef: ref })); }); @@ -3114,7 +3246,7 @@ function whenMapStateToPropsIsMissing(mapStateToProps) { var defaultMapStateToPropsFactories = [whenMapStateToPropsIsFunction, whenMapStateToPropsIsMissing]; function defaultMergeProps(stateProps, dispatchProps, ownProps) { - return _extends$m({}, ownProps, stateProps, dispatchProps); + return _extends$l({}, ownProps, stateProps, dispatchProps); } function wrapMergePropsFunc(mergeProps) { return function initMergePropsProxy(dispatch, _ref) { @@ -3318,7 +3450,7 @@ function createConnect(_temp) { var initMapStateToProps = match$1(mapStateToProps, mapStateToPropsFactories, 'mapStateToProps'); var initMapDispatchToProps = match$1(mapDispatchToProps, mapDispatchToPropsFactories, 'mapDispatchToProps'); var initMergeProps = match$1(mergeProps, mergePropsFactories, 'mergeProps'); - return connectHOC(selectorFactory, _extends$m({ + return connectHOC(selectorFactory, _extends$l({ // used in error messages methodName: 'connect', // used to compute Connect's displayName from the wrapped component's displayName. @@ -3359,7 +3491,7 @@ var connect = /*#__PURE__*/createConnect(); */ function useReduxContext() { - var contextValue = React$v.useContext(ReactReduxContext); + var contextValue = React.useContext(ReactReduxContext); if (process.env.NODE_ENV !== 'production' && !contextValue) { throw new Error('could not find react-redux context value; please ensure the component is wrapped in a '); @@ -3381,7 +3513,7 @@ function createStoreHook(context) { } var useReduxContext$1 = context === ReactReduxContext ? useReduxContext : function () { - return React$v.useContext(context); + return React.useContext(context); }; return function useStore() { var _useReduxContext = useReduxContext$1(), @@ -3455,18 +3587,18 @@ var refEquality = function refEquality(a, b) { }; function useSelectorWithStoreAndSubscription(selector, equalityFn, store, contextSub) { - var _useReducer = React$v.useReducer(function (s) { + var _useReducer = React.useReducer(function (s) { return s + 1; }, 0), forceRender = _useReducer[1]; - var subscription = React$v.useMemo(function () { + var subscription = React.useMemo(function () { return new Subscription(store, contextSub); }, [store, contextSub]); - var latestSubscriptionCallbackError = React$v.useRef(); - var latestSelector = React$v.useRef(); - var latestStoreState = React$v.useRef(); - var latestSelectedState = React$v.useRef(); + var latestSubscriptionCallbackError = React.useRef(); + var latestSelector = React.useRef(); + var latestStoreState = React.useRef(); + var latestSelectedState = React.useRef(); var storeState = store.getState(); var selectedState; @@ -3543,7 +3675,7 @@ function createSelectorHook(context) { } var useReduxContext$1 = context === ReactReduxContext ? useReduxContext : function () { - return React$v.useContext(context); + return React.useContext(context); }; return function useSelector(selector, equalityFn) { if (equalityFn === void 0) { @@ -3569,7 +3701,7 @@ function createSelectorHook(context) { contextSub = _useReduxContext.subscription; var selectedState = useSelectorWithStoreAndSubscription(selector, equalityFn, store, contextSub); - React$v.useDebugValue(selectedState); + React.useDebugValue(selectedState); return selectedState; }; } @@ -3814,7 +3946,7 @@ function createLocation(path, state, key, currentLocation) { location.state = state; } else { // One-arg form: push(location) - location = _extends$m({}, path); + location = _extends$l({}, path); if (location.pathname === undefined) location.pathname = ''; if (location.search) { @@ -4034,7 +4166,7 @@ function createBrowserHistory(props) { var transitionManager = createTransitionManager(); function setState(nextState) { - _extends$m(history, nextState); + _extends$l(history, nextState); history.length = globalHistory.length; transitionManager.notifyListeners(history.location, history.action); @@ -4307,7 +4439,7 @@ function createHashHistory(props) { var transitionManager = createTransitionManager(); function setState(nextState) { - _extends$m(history, nextState); + _extends$l(history, nextState); history.length = globalHistory.length; transitionManager.notifyListeners(history.location, history.action); @@ -4525,7 +4657,7 @@ function createHashHistory(props) { return history; } -function clamp$3(n, lowerBound, upperBound) { +function clamp(n, lowerBound, upperBound) { return Math.min(Math.max(n, lowerBound), upperBound); } /** @@ -4549,7 +4681,7 @@ function createMemoryHistory(props) { var transitionManager = createTransitionManager(); function setState(nextState) { - _extends$m(history, nextState); + _extends$l(history, nextState); history.length = history.entries.length; transitionManager.notifyListeners(history.location, history.action); @@ -4559,7 +4691,7 @@ function createMemoryHistory(props) { return Math.random().toString(36).substr(2, keyLength); } - var index = clamp$3(initialIndex, 0, initialEntries.length - 1); + var index = clamp(initialIndex, 0, initialEntries.length - 1); var entries = initialEntries.map(function (entry) { return typeof entry === 'string' ? createLocation(entry, undefined, createKey()) : createLocation(entry, undefined, entry.key || createKey()); }); // Public interface @@ -4606,7 +4738,7 @@ function createMemoryHistory(props) { } function go(n) { - var nextIndex = clamp$3(history.index + n, 0, history.entries.length - 1); + var nextIndex = clamp(history.index + n, 0, history.entries.length - 1); var action = 'POP'; var location = history.entries[nextIndex]; transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) { @@ -4764,7 +4896,7 @@ function createReactContext(defaultValue, calculateChangedBits) { }; return Provider; - }(React$v.Component); + }(React.Component); Provider.childContextTypes = (_Provider$childContex = {}, _Provider$childContex[contextProp] = PropTypes.object.isRequired, _Provider$childContex); @@ -4827,7 +4959,7 @@ function createReactContext(defaultValue, calculateChangedBits) { }; return Consumer; - }(React$v.Component); + }(React.Component); Consumer.contextTypes = (_Consumer$contextType = {}, _Consumer$contextType[contextProp] = PropTypes.object, _Consumer$contextType); return { @@ -5729,7 +5861,7 @@ function Redirect(_ref) { var history = context.history, staticContext = context.staticContext; var method = push ? history.push : history.replace; - var location = createLocation(computedMatch ? typeof to === "string" ? generatePath(to, computedMatch.params) : _extends$m({}, to, { + var location = createLocation(computedMatch ? typeof to === "string" ? generatePath(to, computedMatch.params) : _extends$l({}, to, { pathname: generatePath(to.pathname, computedMatch.params) }) : to); // When rendering in a static context, // set the new location immediately. @@ -5746,7 +5878,7 @@ function Redirect(_ref) { onUpdate: function onUpdate(self, prevProps) { var prevLocation = createLocation(prevProps.to); - if (!locationsAreEqual(prevLocation, _extends$m({}, location, { + if (!locationsAreEqual(prevLocation, _extends$l({}, location, { key: prevLocation.key }))) { method(location); @@ -5879,7 +6011,7 @@ function (_React$Component) { var match = _this.props.computedMatch ? _this.props.computedMatch // already computed the match for us : _this.props.path ? matchPath(location.pathname, _this.props) : context$1.match; - var props = _extends$m({}, context$1, { + var props = _extends$l({}, context$1, { location: location, match: match }); @@ -5937,7 +6069,7 @@ function addLeadingSlash(path) { function addBasename(basename, location) { if (!basename) return location; - return _extends$m({}, location, { + return _extends$l({}, location, { pathname: addLeadingSlash(basename) + location.pathname }); } @@ -5946,7 +6078,7 @@ function stripBasename(basename, location) { if (!basename) return location; var base = addLeadingSlash(basename); if (location.pathname.indexOf(base) !== 0) return location; - return _extends$m({}, location, { + return _extends$l({}, location, { pathname: location.pathname.substr(base.length) }); } @@ -5961,7 +6093,7 @@ function staticHandler(methodName) { }; } -function noop$6() {} +function noop$5() {} /** * The public top-level API for a "static" , so-called because it * can't actually change the current location. Instead, it just records @@ -5993,11 +6125,11 @@ function (_React$Component) { }; _this.handleListen = function () { - return noop$6; + return noop$5; }; _this.handleBlock = function () { - return noop$6; + return noop$5; }; return _this; @@ -6040,7 +6172,7 @@ function (_React$Component) { listen: this.handleListen, block: this.handleBlock }; - return React__default['default'].createElement(Router, _extends$m({}, rest, { + return React__default['default'].createElement(Router, _extends$l({}, rest, { history: history, staticContext: context })); @@ -6065,7 +6197,7 @@ if (process.env.NODE_ENV !== "production") { * The public API for rendering the first that matches. */ -var Switch$2 = +var Switch = /*#__PURE__*/ function (_React$Component) { _inheritsLoose(Switch, _React$Component); @@ -6091,7 +6223,7 @@ function (_React$Component) { if (match == null && React__default['default'].isValidElement(child)) { element = child; var path = child.props.path || child.props.from; - match = path ? matchPath(location.pathname, _extends$m({}, child.props, { + match = path ? matchPath(location.pathname, _extends$l({}, child.props, { path: path })) : context.match; } @@ -6107,12 +6239,12 @@ function (_React$Component) { }(React__default['default'].Component); if (process.env.NODE_ENV !== "production") { - Switch$2.propTypes = { + Switch.propTypes = { children: PropTypes.node, location: PropTypes.object }; - Switch$2.prototype.componentDidUpdate = function (prevProps) { + Switch.prototype.componentDidUpdate = function (prevProps) { process.env.NODE_ENV !== "production" ? warning$3(!(this.props.location && !prevProps.location), ' elements should not change from uncontrolled to controlled (or vice versa). You initially used no "location" prop and then provided one on a subsequent render.') : void 0; process.env.NODE_ENV !== "production" ? warning$3(!(!this.props.location && prevProps.location), ' elements should not change from controlled to uncontrolled (or vice versa). You provided a "location" prop initially but omitted it on a subsequent render.') : void 0; }; @@ -6131,7 +6263,7 @@ function withRouter(Component) { return React__default['default'].createElement(context.Consumer, null, function (context) { !context ? process.env.NODE_ENV !== "production" ? invariant(false, "You should not use <" + displayName + " /> outside a ") : invariant(false) : void 0; - return React__default['default'].createElement(Component, _extends$m({}, remainingProps, context, { + return React__default['default'].createElement(Component, _extends$l({}, remainingProps, context, { ref: wrappedComponentRef })); }); @@ -7898,14 +8030,14 @@ var updateLocation = function updateLocation(method) { var push$1 = updateLocation('push'); var replace$1 = updateLocation('replace'); -function _typeof$f(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$f = function _typeof(obj) { return typeof obj; }; } else { _typeof$f = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$f(obj); } +function _typeof$e(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$e = function _typeof(obj) { return typeof obj; }; } else { _typeof$e = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$e(obj); } var createSelectors = function createSelectors(structure) { var getIn = structure.getIn, toJS = structure.toJS; var isRouter = function isRouter(value) { - return value != null && _typeof$f(value) === 'object' && getIn(value, ['location']) && getIn(value, ['action']); + return value != null && _typeof$e(value) === 'object' && getIn(value, ['location']) && getIn(value, ['action']); }; var getRouter = function getRouter(state) { @@ -7972,11 +8104,11 @@ var createSelectors = function createSelectors(structure) { var createSelectors$1 = createSelectors; -function _typeof$e(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$e = function _typeof(obj) { return typeof obj; }; } else { _typeof$e = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$e(obj); } +function _typeof$d(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$d = function _typeof(obj) { return typeof obj; }; } else { _typeof$d = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$d(obj); } -function _extends$l() { _extends$l = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); } +function _extends$k() { _extends$k = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); } -function _classCallCheck$c(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function _classCallCheck$b(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _defineProperties$a(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } @@ -7984,7 +8116,7 @@ function _createClass$c(Constructor, protoProps, staticProps) { if (protoProps) function _createSuper(Derived) { return function () { var Super = _getPrototypeOf$9(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf$9(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn$9(this, result); }; } -function _possibleConstructorReturn$9(self, call) { if (call && (_typeof$e(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$a(self); } +function _possibleConstructorReturn$9(self, call) { if (call && (_typeof$d(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$a(self); } function _assertThisInitialized$a(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } @@ -8015,7 +8147,7 @@ var createConnectedRouter = function createConnectedRouter(structure) { function ConnectedRouter(props) { var _this; - _classCallCheck$c(this, ConnectedRouter); + _classCallCheck$b(this, ConnectedRouter); _this = _super.call(this, props); var store = props.store, @@ -8108,7 +8240,7 @@ var createConnectedRouter = function createConnectedRouter(structure) { }]); return ConnectedRouter; - }(React$v.PureComponent); + }(React.PureComponent); ConnectedRouter.propTypes = { store: PropTypes.shape({ @@ -8147,7 +8279,7 @@ var createConnectedRouter = function createConnectedRouter(structure) { return /*#__PURE__*/React__default['default'].createElement(Context.Consumer, null, function (_ref) { var store = _ref.store; - return /*#__PURE__*/React__default['default'].createElement(ConnectedRouter, _extends$l({ + return /*#__PURE__*/React__default['default'].createElement(ConnectedRouter, _extends$k({ store: store }, props)); }); @@ -8161,17 +8293,17 @@ var createConnectedRouter = function createConnectedRouter(structure) { var createConnectedRouter$1 = createConnectedRouter; -function _slicedToArray$1(arr, i) { return _arrayWithHoles$1(arr) || _iterableToArrayLimit$1(arr, i) || _unsupportedIterableToArray$2(arr, i) || _nonIterableRest$1(); } +function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$2(arr, i) || _nonIterableRest(); } -function _nonIterableRest$1() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); } function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } -function _iterableToArrayLimit$1(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } +function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } -function _arrayWithHoles$1(arr) { if (Array.isArray(arr)) return arr; } +function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } @@ -8205,7 +8337,7 @@ var injectQuery = function injectQuery(location) { var query = queries.reduce(function (acc, currentQuery) { // Split on `=`, to get key and value var _currentQuery$split = currentQuery.split('='), - _currentQuery$split2 = _slicedToArray$1(_currentQuery$split, 2), + _currentQuery$split2 = _slicedToArray(_currentQuery$split, 2), queryKey = _currentQuery$split2[0], queryValue = _currentQuery$split2[1]; @@ -8409,7 +8541,7 @@ var defaultProvider = { getPermissions: function () { return Promise.resolve(); }, getIdentity: function () { return Promise.resolve(defaultIdentity$1); }, }; -var AuthContext = React$v.createContext(defaultProvider); +var AuthContext = React.createContext(defaultProvider); AuthContext.displayName = 'AuthContext'; var AuthContext$1 = AuthContext; @@ -8420,7 +8552,7 @@ var defaultAuthParams$1 = { /** * Get the authProvider stored in the context */ -var useAuthProvider = function () { return React$v.useContext(AuthContext$1); }; +var useAuthProvider = function () { return React.useContext(AuthContext$1); }; var useAuthProvider$1 = useAuthProvider; var CLEAR_STATE = 'RA/CLEAR_STATE'; @@ -8553,7 +8685,7 @@ var LinkAnchor = forwardRef(function (_ref, forwardedRef) { var target = rest.target; - var props = _extends$m({}, rest, { + var props = _extends$l({}, rest, { onClick: function onClick(event) { try { if (_onClick) _onClick(event); @@ -8607,7 +8739,7 @@ var Link$2 = forwardRef(function (_ref2, forwardedRef) { var location = normalizeToLocation(resolveToLocation(to, context.location), context.location); var href = location ? history.createHref(location) : ""; - var props = _extends$m({}, rest, { + var props = _extends$l({}, rest, { href: href, navigate: function navigate() { var location = resolveToLocation(to, context.location); @@ -8629,12 +8761,12 @@ var Link$2 = forwardRef(function (_ref2, forwardedRef) { if (process.env.NODE_ENV !== "production") { var toType = PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]); - var refType$2 = PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.shape({ + var refType = PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.shape({ current: PropTypes.any })]); Link$2.displayName = "Link"; Link$2.propTypes = { - innerRef: refType$2, + innerRef: refType, onClick: PropTypes.func, replace: PropTypes.bool, target: PropTypes.string, @@ -8698,9 +8830,9 @@ var NavLink = forwardRef$1(function (_ref, forwardedRef) { }) : null; var isActive = !!(isActiveProp ? isActiveProp(match, currentLocation) : match); var className = isActive ? joinClassnames(classNameProp, activeClassName) : classNameProp; - var style = isActive ? _extends$m({}, styleProp, {}, activeStyle) : styleProp; + var style = isActive ? _extends$l({}, styleProp, {}, activeStyle) : styleProp; - var props = _extends$m({ + var props = _extends$l({ "aria-current": isActive && ariaCurrent || null, className: className, style: style, @@ -8721,7 +8853,7 @@ var NavLink = forwardRef$1(function (_ref, forwardedRef) { if (process.env.NODE_ENV !== "production") { NavLink.displayName = "NavLink"; var ariaCurrentType = PropTypes.oneOf(["page", "step", "location", "date", "time", "true"]); - NavLink.propTypes = _extends$m({}, Link$2.propTypes, { + NavLink.propTypes = _extends$l({}, Link$2.propTypes, { "aria-current": ariaCurrentType, activeClassName: PropTypes.string, activeStyle: PropTypes.object, @@ -8769,7 +8901,7 @@ var useLogout = function () { * See: https://reacttraining.com/react-router/web/api/history/history-is-mutable */ var history = useHistory(); - var logout = React$v.useCallback(function (params, redirectTo, redirectToCurrentLocationAfterLogin) { + var logout = React.useCallback(function (params, redirectTo, redirectToCurrentLocationAfterLogin) { if (params === void 0) { params = {}; } if (redirectTo === void 0) { redirectTo = defaultAuthParams$1.loginUrl; } if (redirectToCurrentLocationAfterLogin === void 0) { redirectToCurrentLocationAfterLogin = true; } @@ -8800,7 +8932,7 @@ var useLogout = function () { return redirectToFromProvider; }); }, [authProvider, history, dispatch]); - var logoutWithoutProvider = React$v.useCallback(function (_) { + var logoutWithoutProvider = React.useCallback(function (_) { history.push({ pathname: defaultAuthParams$1.loginUrl, state: { @@ -8872,7 +9004,7 @@ var resetNotification = function () { return ({ */ var useNotify = function () { var dispatch = useDispatch(); - return React$v.useCallback(function (message, type, messageArgs, undoable, autoHideDuration) { + return React.useCallback(function (message, type, messageArgs, undoable, autoHideDuration) { if (type === void 0) { type = 'info'; } if (messageArgs === void 0) { messageArgs = {}; } if (undoable === void 0) { undoable = false; } @@ -8925,7 +9057,7 @@ var useCheckAuth = function () { var authProvider = useAuthProvider$1(); var notify = useNotify$1(); var logout = useLogout$1(); - var checkAuth = React$v.useCallback(function (params, logoutOnFailure, redirectTo, disableNotification) { + var checkAuth = React.useCallback(function (params, logoutOnFailure, redirectTo, disableNotification) { if (params === void 0) { params = {}; } if (logoutOnFailure === void 0) { logoutOnFailure = true; } if (redirectTo === void 0) { redirectTo = defaultAuthParams$1.loginUrl; } @@ -8984,7 +9116,7 @@ var emptyParams$2 = {}; var useAuthenticated = (function (params) { if (params === void 0) { params = emptyParams$2; } var checkAuth = useCheckAuth$1(); - React$v.useEffect(function () { + React.useEffect(function () { checkAuth(params).catch(function () { }); }, [checkAuth, params]); }); @@ -9448,7 +9580,7 @@ var asyncTag = '[object AsyncFunction]', * _.isFunction(/abc/); * // => false */ -function isFunction$9(value) { +function isFunction$8(value) { if (!isObject$j(value)) { return false; } @@ -9458,7 +9590,7 @@ function isFunction$9(value) { return tag == funcTag$2 || tag == genTag$1 || tag == asyncTag || tag == proxyTag; } -var isFunction_1 = isFunction$9; +var isFunction_1 = isFunction$8; var root$7 = _root; @@ -9516,7 +9648,7 @@ function toSource$2(func) { var _toSource = toSource$2; -var isFunction$8 = isFunction_1, +var isFunction$7 = isFunction_1, isMasked = _isMasked, isObject$i = isObject_1, toSource$1 = _toSource; @@ -9558,7 +9690,7 @@ function baseIsNative$1(value) { if (!isObject$i(value) || isMasked(value)) { return false; } - var pattern = isFunction$8(value) ? reIsNative : reIsHostCtor; + var pattern = isFunction$7(value) ? reIsNative : reIsHostCtor; return pattern.test(toSource$1(value)); } @@ -9573,14 +9705,14 @@ var _baseIsNative = baseIsNative$1; * @returns {*} Returns the property value. */ -function getValue$4(object, key) { +function getValue$3(object, key) { return object == null ? undefined : object[key]; } -var _getValue = getValue$4; +var _getValue = getValue$3; var baseIsNative = _baseIsNative, - getValue$3 = _getValue; + getValue$2 = _getValue; /** * Gets the native function at `key` of `object`. @@ -9591,7 +9723,7 @@ var baseIsNative = _baseIsNative, * @returns {*} Returns the function if it's native, else `undefined`. */ function getNative$7(object, key) { - var value = getValue$3(object, key); + var value = getValue$2(object, key); return baseIsNative(value) ? value : undefined; } @@ -10994,7 +11126,7 @@ function baseKeys$2(object) { var _baseKeys = baseKeys$2; -var isFunction$7 = isFunction_1, +var isFunction$6 = isFunction_1, isLength$1 = isLength_1; /** @@ -11023,7 +11155,7 @@ var isFunction$7 = isFunction_1, * // => false */ function isArrayLike$7(value) { - return value != null && isLength$1(value.length) && !isFunction$7(value); + return value != null && isLength$1(value.length) && !isFunction$6(value); } var isArrayLike_1 = isArrayLike$7; @@ -11060,15 +11192,15 @@ var arrayLikeKeys$1 = _arrayLikeKeys, * _.keys('hi'); * // => ['0', '1'] */ -function keys$b(object) { +function keys$a(object) { return isArrayLike$6(object) ? arrayLikeKeys$1(object) : baseKeys$1(object); } -var keys_1$1 = keys$b; +var keys_1$1 = keys$a; var baseGetAllKeys$1 = _baseGetAllKeys, getSymbols$2 = _getSymbols, - keys$a = keys_1$1; + keys$9 = keys_1$1; /** * Creates an array of own enumerable property names and symbols of `object`. @@ -11078,7 +11210,7 @@ var baseGetAllKeys$1 = _baseGetAllKeys, * @returns {Array} Returns the array of property names and symbols. */ function getAllKeys$2(object) { - return baseGetAllKeys$1(object, keys$a, getSymbols$2); + return baseGetAllKeys$1(object, keys$9, getSymbols$2); } var _getAllKeys = getAllKeys$2; @@ -11416,15 +11548,15 @@ var isEqual_1 = isEqual$3; // thanks Kent C Dodds for the following helpers function useSafeSetState(initialState) { - var _a = React$v.useState(initialState), state = _a[0], setState = _a[1]; - var mountedRef = React$v.useRef(false); - React$v.useEffect(function () { + var _a = React.useState(initialState), state = _a[0], setState = _a[1]; + var mountedRef = React.useRef(false); + React.useEffect(function () { mountedRef.current = true; return function () { mountedRef.current = false; }; }, []); - var safeSetState = React$v.useCallback(function (args) { + var safeSetState = React.useCallback(function (args) { if (mountedRef.current) { return setState(args); } @@ -11433,8 +11565,8 @@ function useSafeSetState(initialState) { } function useTimeout(ms) { if (ms === void 0) { ms = 0; } - var _a = React$v.useState(false), ready = _a[0], setReady = _a[1]; - React$v.useEffect(function () { + var _a = React.useState(false), ready = _a[0], setReady = _a[1]; + React.useEffect(function () { var timer = setTimeout(function () { setReady(true); }, ms); @@ -11490,7 +11622,7 @@ var useAuthState = function (params) { authenticated: true, }), state = _a[0], setState = _a[1]; var checkAuth = useCheckAuth$1(); - React$v.useEffect(function () { + React.useEffect(function () { checkAuth(params, false) .then(function () { return setState({ loading: false, loaded: true, authenticated: true }); @@ -11537,7 +11669,7 @@ var getPermissionsWithoutProvider = function () { return Promise.resolve([]); }; */ var useGetPermissions = function () { var authProvider = useAuthProvider$1(); - var getPermissions = React$v.useCallback(function (params) { + var getPermissions = React.useCallback(function (params) { if (params === void 0) { params = {}; } return authProvider.getPermissions(params); }, [authProvider]); @@ -11593,7 +11725,7 @@ var usePermissionsOptimized = function (params) { permissions: alreadyFetchedPermissions[key], }), state = _a[0], setState = _a[1]; var getPermissions = useGetPermissions$1(); - React$v.useEffect(function () { + React.useEffect(function () { getPermissions(params) .then(function (permissions) { if (!isEqual_1(permissions, state.permissions)) { @@ -11639,7 +11771,7 @@ var __rest$12 = (undefined && undefined.__rest) || function (s, e) { } return t; }; -var isEmptyChildren = function (children) { return React$v.Children.count(children) === 0; }; +var isEmptyChildren = function (children) { return React.Children.count(children) === 0; }; /** * After checking that the user is authenticated, * retrieves the user's permissions for a specific context. @@ -11683,7 +11815,7 @@ var WithPermissions = function (_a) { var permissions = usePermissionsOptimized$1(authParams).permissions; // render even though the usePermissions() call isn't finished (optimistic rendering) if (component) { - return React$v.createElement(component, __assign$1B({ permissions: permissions }, props)); + return React.createElement(component, __assign$1B({ permissions: permissions }, props)); } // @deprecated if (render) { @@ -11727,7 +11859,7 @@ var useLogin = function () { var dispatch = useDispatch(); var nextPathName = locationState && locationState.nextPathname; var nextSearch = locationState && locationState.nextSearch; - var login = React$v.useCallback(function (params, pathName) { + var login = React.useCallback(function (params, pathName) { if (params === void 0) { params = {}; } return authProvider.login(params).then(function (ret) { dispatch(resetNotification()); @@ -11739,7 +11871,7 @@ var useLogin = function () { return ret; }); }, [authProvider, history, nextPathName, nextSearch, dispatch]); - var loginWithoutProvider = React$v.useCallback(function (_, __) { + var loginWithoutProvider = React.useCallback(function (_, __) { dispatch(resetNotification()); history.push(defaultAuthParams$1.afterLoginUrl); return Promise.resolve(); @@ -11824,7 +11956,7 @@ var useGetIdentity = function () { loaded: false, }), state = _a[0], setState = _a[1]; var authProvider = useAuthProvider$1(); - React$v.useEffect(function () { + React.useEffect(function () { if (authProvider && typeof authProvider.getIdentity === 'function') { var callAuthProvider = function () { return __awaiter$b(void 0, void 0, void 0, function () { var identity, error_1; @@ -11980,12 +12112,12 @@ var kTrue = /*#__PURE__*/ konst(true); -var noop$5 = function noop() {}; +var noop$4 = function noop() {}; if (process.env.NODE_ENV !== 'production' && typeof Proxy !== 'undefined') { - noop$5 = + noop$4 = /*#__PURE__*/ - new Proxy(noop$5, { + new Proxy(noop$4, { set: function set() { throw internalErr('There was an attempt to assign a property to internal `noop` function.'); } @@ -12002,7 +12134,7 @@ function check$1(value, predicate, error) { } } var assignWithSymbols = function assignWithSymbols(target, source) { - _extends$m(target, source); + _extends$l(target, source); if (Object.getOwnPropertySymbols) { Object.getOwnPropertySymbols(source).forEach(function (s) { @@ -12150,7 +12282,7 @@ function createAllStyleChildCallbacks(shape, parentCallback) { } }; - chCbAtKey.cancel = noop$5; + chCbAtKey.cancel = noop$4; childCallbacks[key] = chCbAtKey; }); @@ -13707,7 +13839,7 @@ var __assign$1x = (undefined && undefined.__assign) || function () { var useRedirect = function () { var dispatch = useDispatch(); var history = useHistory(); // Note: history is mutable. This prevents render loops in useCallback. - return React$v.useCallback(function (redirectTo, basePath, id, data, state) { + return React.useCallback(function (redirectTo, basePath, id, data, state) { if (basePath === void 0) { basePath = ''; } if (state === void 0) { state = {}; } if (!redirectTo) { @@ -13744,13 +13876,13 @@ var useRedirect$1 = useRedirect; */ var useRefresh = function () { var dispatch = useDispatch(); - return React$v.useCallback(function (hard) { + return React.useCallback(function (hard) { dispatch(refreshView(hard)); }, [dispatch]); }; var useRefresh$1 = useRefresh; -var TranslationContext = React$v.createContext({ +var TranslationContext = React.createContext({ locale: 'en', setLocale: function () { }, i18nProvider: { @@ -13781,8 +13913,8 @@ TranslationContext.displayName = 'TranslationContext'; * } */ var useTranslate = function () { - var _a = React$v.useContext(TranslationContext), i18nProvider = _a.i18nProvider, locale = _a.locale; - var translate = React$v.useCallback(function (key, options) { + var _a = React.useContext(TranslationContext), i18nProvider = _a.i18nProvider, locale = _a.locale; + var translate = React.useCallback(function (key, options) { return i18nProvider.translate(key, options); }, // update the hook each time the locale changes @@ -14927,7 +15059,7 @@ var FieldTitle = function (_a) { }; // What? TypeScript loses the displayName if we don't set it explicitly FieldTitle.displayName = 'FieldTitle'; -var FieldTitle$1 = React$v.memo(FieldTitle); +var FieldTitle$1 = React.memo(FieldTitle); /** * A specialized version of `_.map` for arrays without support for iteratee @@ -15032,7 +15164,7 @@ function isStrictComparable$2(value) { var _isStrictComparable = isStrictComparable$2; var isStrictComparable$1 = _isStrictComparable, - keys$9 = keys_1$1; + keys$8 = keys_1$1; /** * Gets the property names, values, and compare flags of `object`. @@ -15042,7 +15174,7 @@ var isStrictComparable$1 = _isStrictComparable, * @returns {Array} Returns the match data of `object`. */ function getMatchData$1(object) { - var result = keys$9(object), + var result = keys$8(object), length = result.length; while (length--) { @@ -15210,7 +15342,7 @@ var FUNC_ERROR_TEXT$2 = 'Expected a function'; * // Replace `_.memoize.Cache`. * _.memoize.Cache = WeakMap; */ -function memoize$5(func, resolver) { +function memoize$4(func, resolver) { if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) { throw new TypeError(FUNC_ERROR_TEXT$2); } @@ -15226,16 +15358,16 @@ function memoize$5(func, resolver) { memoized.cache = cache.set(key, result) || cache; return result; }; - memoized.cache = new (memoize$5.Cache || MapCache); + memoized.cache = new (memoize$4.Cache || MapCache); return memoized; } // Expose `MapCache`. -memoize$5.Cache = MapCache; +memoize$4.Cache = MapCache; -var memoize_1 = memoize$5; +var memoize_1 = memoize$4; -var memoize$4 = memoize_1; +var memoize$3 = memoize_1; /** Used as the maximum memoize cache size. */ var MAX_MEMOIZE_SIZE = 500; @@ -15249,7 +15381,7 @@ var MAX_MEMOIZE_SIZE = 500; * @returns {Function} Returns the new memoized function. */ function memoizeCapped$1(func) { - var result = memoize$4(func, function(key) { + var result = memoize$3(func, function(key) { if (cache.size === MAX_MEMOIZE_SIZE) { cache.clear(); } @@ -15707,7 +15839,7 @@ var _baseIteratee = baseIteratee$2; var getNative = _getNative; -var defineProperty$4 = (function() { +var defineProperty$3 = (function() { try { var func = getNative(Object, 'defineProperty'); func({}, '', {}); @@ -15715,9 +15847,9 @@ var defineProperty$4 = (function() { } catch (e) {} }()); -var _defineProperty$e = defineProperty$4; +var _defineProperty$e = defineProperty$3; -var defineProperty$3 = _defineProperty$e; +var defineProperty$2 = _defineProperty$e; /** * The base implementation of `assignValue` and `assignMergeValue` without @@ -15729,8 +15861,8 @@ var defineProperty$3 = _defineProperty$e; * @param {*} value The value to assign. */ function baseAssignValue$3(object, key, value) { - if (key == '__proto__' && defineProperty$3) { - defineProperty$3(object, key, { + if (key == '__proto__' && defineProperty$2) { + defineProperty$2(object, key, { 'configurable': true, 'enumerable': true, 'value': value, @@ -16341,7 +16473,7 @@ var __assign$1v = (undefined && undefined.__assign) || function () { var isObject$e = function (obj) { return obj && Object.prototype.toString.call(obj) === '[object Object]'; }; -var isEmpty$3 = function (obj) { +var isEmpty$2 = function (obj) { return obj instanceof Date ? false : obj === '' || @@ -16356,7 +16488,7 @@ var removeEmpty = function (object) { if (isObject$e(object[key])) { child = removeEmpty(object[key]); } - return isEmpty$3(child) ? acc : __assign$1v(__assign$1v({}, acc), (_a = {}, _a[key] = child, _a)); + return isEmpty$2(child) ? acc : __assign$1v(__assign$1v({}, acc), (_a = {}, _a[key] = child, _a)); }, {}); }; var removeEmpty$1 = removeEmpty; @@ -16399,7 +16531,7 @@ var __assign$1u = (undefined && undefined.__assign) || function () { }; return __assign$1u.apply(this, arguments); }; -var styles$1b = { +var styles$1 = { root: { width: '100vw', height: '100vh', @@ -16445,29 +16577,29 @@ var styles$1b = { height: 100, }, }; -var Button$3 = function (_a) { +var Button$1 = function (_a) { var img = _a.img, label = _a.label, href = _a.href; - var _b = React$v.useState(false), hovered = _b[0], setHovered = _b[1]; + var _b = React.useState(false), hovered = _b[0], setHovered = _b[1]; return (React__namespace.createElement("div", null, React__namespace.createElement("a", { href: href, style: hovered - ? __assign$1u(__assign$1u({}, styles$1b.link), styles$1b.linkHovered) : styles$1b.link, onMouseEnter: function () { return setHovered(true); }, onMouseLeave: function () { return setHovered(false); } }, - React__namespace.createElement("img", { src: img, alt: label, style: styles$1b.image }), + ? __assign$1u(__assign$1u({}, styles$1.link), styles$1.linkHovered) : styles$1.link, onMouseEnter: function () { return setHovered(true); }, onMouseLeave: function () { return setHovered(false); } }, + React__namespace.createElement("img", { src: img, alt: label, style: styles$1.image }), React__namespace.createElement("br", null), label))); }; var Ready = (function () { - return process.env.NODE_ENV === 'production' ? (React__namespace.createElement("span", null)) : (React__namespace.createElement("div", { style: styles$1b.root }, - React__namespace.createElement("div", { style: styles$1b.main }, - React__namespace.createElement("img", { style: styles$1b.logo, src: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTMxIDEzMSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTMxIDEzMTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMyMjI0NTg7fQoJLnN0MXtmaWxsOiM1MTUzN0Q7fQoJLnN0MntmaWxsOiNBM0E0Qjk7fQoJLnN0M3tmaWxsOiMwMDAyM0I7fQoJLnN0NHtmaWxsOiNGRkZGRkY7fQoJLnN0NXtlbmFibGUtYmFja2dyb3VuZDpuZXcgICAgO30KPC9zdHlsZT4KPHRpdGxlPkxvZ29fc29tYnJlX2FpPC90aXRsZT4KPGcgaWQ9IlJlY3RhbmdsZV81NiI+Cgk8Zz4KCQk8cmVjdCB4PSIxOS4xIiB5PSIxOSIgdHJhbnNmb3JtPSJtYXRyaXgoMC41IC0wLjg2NiAwLjg2NiAwLjUgLTIzLjkyMjYgODkuNTQ2KSIgY2xhc3M9InN0MCIgd2lkdGg9IjkyLjkiIGhlaWdodD0iOTIuOSIvPgoJCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik04MywxMzAuM0wwLjgsODIuOUw0OC4yLDAuN2w4Mi4yLDQ3LjVMODMsMTMwLjN6IE0zLjUsODIuMWw3OC43LDQ1LjVsNDUuNS03OC43TDQ5LDMuNEwzLjUsODIuMXoiLz4KCTwvZz4KPC9nPgo8ZyBpZD0iUmVjdGFuZ2xlXzU2LTIiPgoJPGc+CgkJPHJlY3QgeD0iMTkiIHk9IjE5LjEiIHRyYW5zZm9ybT0ibWF0cml4KDAuODY2IC0wLjUgMC41IDAuODY2IC0yMy45Nzc3IDQxLjUyNykiIGNsYXNzPSJzdDAiIHdpZHRoPSI5Mi45IiBoZWlnaHQ9IjkyLjkiLz4KCQk8cGF0aCBjbGFzcz0ic3QyIiBkPSJNNDcuOSwxMzFMMCw0OEw4My4xLDBsNDgsODMuMUw0Ny45LDEzMXogTTQuMSw0OS4xbDQ1LDc3LjlsNzcuOS00NUw4Miw0LjFMNC4xLDQ5LjF6Ii8+Cgk8L2c+CjwvZz4KPGcgaWQ9IlJlY3RhbmdsZV81Ni0zIj4KCTxnPgoJCTxyZWN0IHg9IjE5LjEiIHk9IjE5IiBjbGFzcz0ic3QzIiB3aWR0aD0iOTIuOSIgaGVpZ2h0PSI5Mi45Ii8+CgkJPHBhdGggY2xhc3M9InN0NCIgZD0iTTExNC41LDExNC41SDE2LjZWMTYuNWg5Ny45VjExNC41eiBNMjEuNiwxMDkuNWg4Ny45VjIxLjVIMjEuNlYxMDkuNXoiLz4KCTwvZz4KPC9nPgo8ZyBpZD0iUmEiPgoJPGcgY2xhc3M9InN0NSI+CgkJPHBhdGggY2xhc3M9InN0NCIgZD0iTTU5LDg2LjdsLTYuNy0xOS4yaC0xLjJIMzguOXYxOS4yaC01LjZWMzguNWgxOC41YzMuNiwwLDYuMywwLjYsOC4xLDEuOGMxLjgsMS4yLDMsMi44LDMuNSw0LjgKCQkJYzAuNSwyLDAuOCw0LjYsMC44LDcuOGMwLDMuNS0wLjQsNi40LTEuMyw4LjdjLTAuOCwyLjMtMi42LDMuOS01LjMsNC44TDY1LDg2LjdINTl6IE01NS43LDYxLjZjMS4yLTAuNywyLTEuNywyLjQtMwoJCQljMC40LTEuMywwLjYtMy4yLDAuNi01LjZjMC0yLjUtMC4yLTQuMy0wLjUtNS42Yy0wLjMtMS4zLTEuMS0yLjItMi4zLTIuOWMtMS4yLTAuNy0zLTEtNS41LTFIMzguOXYxOS4xSDUwCgkJCUM1Mi41LDYyLjYsNTQuNCw2Mi4zLDU1LjcsNjEuNnoiLz4KCQk8cGF0aCBjbGFzcz0ic3Q0IiBkPSJNNzQuMyw4NWMtMS42LTEuNS0yLjUtNC4yLTIuNS04LjJjMC0yLjcsMC4zLTQuOCwwLjktNi4zYzAuNi0xLjUsMS42LTIuNiwzLTMuM2MxLjQtMC43LDMuNC0xLDYtMQoJCQljMS4zLDAsNS4xLDAuMSwxMS40LDAuM3YtMi40YzAtMi45LTAuMi01LTAuNy02LjJjLTAuNS0xLjItMS4zLTItMi42LTIuNGMtMS4yLTAuMy0zLjMtMC41LTYuMy0wLjVjLTEuMywwLTMsMC4xLTQuOSwwLjIKCQkJYy0yLDAuMS0zLjYsMC4zLTQuOCwwLjV2LTQuM2MzLjMtMC43LDcuMS0xLDExLjQtMWMzLjcsMCw2LjUsMC40LDguNCwxLjJjMS44LDAuOCwzLjEsMi4yLDMuOCw0LjFjMC43LDEuOSwxLDQuNywxLDguNHYyMi41aC00LjgKCQkJbC0wLjMtNWgtMC4zYy0wLjgsMi4yLTIuMiwzLjctNC4xLDQuNGMtMS45LDAuNy00LjEsMS4xLTYuNiwxLjFDNzguNiw4Ny4yLDc2LDg2LjUsNzQuMyw4NXogTTg5LjEsODJjMS4yLTAuNCwyLjItMS4yLDIuOC0yLjQKCQkJYzAuOS0xLjgsMS4zLTQuMywxLjMtNy4zdi0yaC0xMGMtMS43LDAtMywwLjItMy44LDAuNWMtMC44LDAuMy0xLjQsMC45LTEuNywxLjhjLTAuMywwLjktMC41LDIuMi0wLjUsNGMwLDEuOCwwLjIsMy4xLDAuNiwzLjkKCQkJYzAuNCwwLjgsMS4xLDEuNCwyLDEuOGMxLDAuMywyLjUsMC41LDQuNSwwLjVDODYuMiw4Mi42LDg3LjgsODIuNCw4OS4xLDgyeiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", alt: "react-admin logo" }), + return process.env.NODE_ENV === 'production' ? (React__namespace.createElement("span", null)) : (React__namespace.createElement("div", { style: styles$1.root }, + React__namespace.createElement("div", { style: styles$1.main }, + React__namespace.createElement("img", { style: styles$1.logo, src: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMTMxIDEzMSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTMxIDEzMTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMyMjI0NTg7fQoJLnN0MXtmaWxsOiM1MTUzN0Q7fQoJLnN0MntmaWxsOiNBM0E0Qjk7fQoJLnN0M3tmaWxsOiMwMDAyM0I7fQoJLnN0NHtmaWxsOiNGRkZGRkY7fQoJLnN0NXtlbmFibGUtYmFja2dyb3VuZDpuZXcgICAgO30KPC9zdHlsZT4KPHRpdGxlPkxvZ29fc29tYnJlX2FpPC90aXRsZT4KPGcgaWQ9IlJlY3RhbmdsZV81NiI+Cgk8Zz4KCQk8cmVjdCB4PSIxOS4xIiB5PSIxOSIgdHJhbnNmb3JtPSJtYXRyaXgoMC41IC0wLjg2NiAwLjg2NiAwLjUgLTIzLjkyMjYgODkuNTQ2KSIgY2xhc3M9InN0MCIgd2lkdGg9IjkyLjkiIGhlaWdodD0iOTIuOSIvPgoJCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik04MywxMzAuM0wwLjgsODIuOUw0OC4yLDAuN2w4Mi4yLDQ3LjVMODMsMTMwLjN6IE0zLjUsODIuMWw3OC43LDQ1LjVsNDUuNS03OC43TDQ5LDMuNEwzLjUsODIuMXoiLz4KCTwvZz4KPC9nPgo8ZyBpZD0iUmVjdGFuZ2xlXzU2LTIiPgoJPGc+CgkJPHJlY3QgeD0iMTkiIHk9IjE5LjEiIHRyYW5zZm9ybT0ibWF0cml4KDAuODY2IC0wLjUgMC41IDAuODY2IC0yMy45Nzc3IDQxLjUyNykiIGNsYXNzPSJzdDAiIHdpZHRoPSI5Mi45IiBoZWlnaHQ9IjkyLjkiLz4KCQk8cGF0aCBjbGFzcz0ic3QyIiBkPSJNNDcuOSwxMzFMMCw0OEw4My4xLDBsNDgsODMuMUw0Ny45LDEzMXogTTQuMSw0OS4xbDQ1LDc3LjlsNzcuOS00NUw4Miw0LjFMNC4xLDQ5LjF6Ii8+Cgk8L2c+CjwvZz4KPGcgaWQ9IlJlY3RhbmdsZV81Ni0zIj4KCTxnPgoJCTxyZWN0IHg9IjE5LjEiIHk9IjE5IiBjbGFzcz0ic3QzIiB3aWR0aD0iOTIuOSIgaGVpZ2h0PSI5Mi45Ii8+CgkJPHBhdGggY2xhc3M9InN0NCIgZD0iTTExNC41LDExNC41SDE2LjZWMTYuNWg5Ny45VjExNC41eiBNMjEuNiwxMDkuNWg4Ny45VjIxLjVIMjEuNlYxMDkuNXoiLz4KCTwvZz4KPC9nPgo8ZyBpZD0iUmEiPgoJPGcgY2xhc3M9InN0NSI+CgkJPHBhdGggY2xhc3M9InN0NCIgZD0iTTU5LDg2LjdsLTYuNy0xOS4yaC0xLjJIMzguOXYxOS4yaC01LjZWMzguNWgxOC41YzMuNiwwLDYuMywwLjYsOC4xLDEuOGMxLjgsMS4yLDMsMi44LDMuNSw0LjgKCQkJYzAuNSwyLDAuOCw0LjYsMC44LDcuOGMwLDMuNS0wLjQsNi40LTEuMyw4LjdjLTAuOCwyLjMtMi42LDMuOS01LjMsNC44TDY1LDg2LjdINTl6IE01NS43LDYxLjZjMS4yLTAuNywyLTEuNywyLjQtMwoJCQljMC40LTEuMywwLjYtMy4yLDAuNi01LjZjMC0yLjUtMC4yLTQuMy0wLjUtNS42Yy0wLjMtMS4zLTEuMS0yLjItMi4zLTIuOWMtMS4yLTAuNy0zLTEtNS41LTFIMzguOXYxOS4xSDUwCgkJCUM1Mi41LDYyLjYsNTQuNCw2Mi4zLDU1LjcsNjEuNnoiLz4KCQk8cGF0aCBjbGFzcz0ic3Q0IiBkPSJNNzQuMyw4NWMtMS42LTEuNS0yLjUtNC4yLTIuNS04LjJjMC0yLjcsMC4zLTQuOCwwLjktNi4zYzAuNi0xLjUsMS42LTIuNiwzLTMuM2MxLjQtMC43LDMuNC0xLDYtMQoJCQljMS4zLDAsNS4xLDAuMSwxMS40LDAuM3YtMi40YzAtMi45LTAuMi01LTAuNy02LjJjLTAuNS0xLjItMS4zLTItMi42LTIuNGMtMS4yLTAuMy0zLjMtMC41LTYuMy0wLjVjLTEuMywwLTMsMC4xLTQuOSwwLjIKCQkJYy0yLDAuMS0zLjYsMC4zLTQuOCwwLjV2LTQuM2MzLjMtMC43LDcuMS0xLDExLjQtMWMzLjcsMCw2LjUsMC40LDguNCwxLjJjMS44LDAuOCwzLjEsMi4yLDMuOCw0LjFjMC43LDEuOSwxLDQuNywxLDguNHYyMi41aC00LjgKCQkJbC0wLjMtNWgtMC4zYy0wLjgsMi4yLTIuMiwzLjctNC4xLDQuNGMtMS45LDAuNy00LjEsMS4xLTYuNiwxLjFDNzguNiw4Ny4yLDc2LDg2LjUsNzQuMyw4NXogTTg5LjEsODJjMS4yLTAuNCwyLjItMS4yLDIuOC0yLjQKCQkJYzAuOS0xLjgsMS4zLTQuMywxLjMtNy4zdi0yaC0xMGMtMS43LDAtMywwLjItMy44LDAuNWMtMC44LDAuMy0xLjQsMC45LTEuNywxLjhjLTAuMywwLjktMC41LDIuMi0wLjUsNGMwLDEuOCwwLjIsMy4xLDAuNiwzLjkKCQkJYzAuNCwwLjgsMS4xLDEuNCwyLDEuOGMxLDAuMywyLjUsMC41LDQuNSwwLjVDODYuMiw4Mi42LDg3LjgsODIuNCw4OS4xLDgyeiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", alt: "react-admin logo" }), React__namespace.createElement("h1", null, "Welcome to React-admin"), React__namespace.createElement("div", null, "Your application is properly configured.", React__namespace.createElement("br", null), "Now you can add a as child of .")), - React__namespace.createElement("div", { style: styles$1b.secondary }, - React__namespace.createElement(Button$3, { href: "https://marmelab.com/react-admin/Readme.html", img: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IgoJIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnIGlkPSJCb3VuZGluZ19Cb3giPgoJPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CjwvZz4KPGcgaWQ9IkZsYXQiPgoJPGcgaWQ9InVpX3g1Rl9zcGVjX3g1Rl9oZWFkZXJfY29weV8yIj4KCTwvZz4KCTxnPgoJCTxwYXRoIGQ9Ik0yMSw1Yy0xLjExLTAuMzUtMi4zMy0wLjUtMy41LTAuNWMtMS45NSwwLTQuMDUsMC40LTUuNSwxLjVjLTEuNDUtMS4xLTMuNTUtMS41LTUuNS0xLjVTMi40NSw0LjksMSw2djE0LjY1CgkJCWMwLDAuMjUsMC4yNSwwLjUsMC41LDAuNWMwLjEsMCwwLjE1LTAuMDUsMC4yNS0wLjA1QzMuMSwyMC40NSw1LjA1LDIwLDYuNSwyMGMxLjk1LDAsNC4wNSwwLjQsNS41LDEuNWMxLjM1LTAuODUsMy44LTEuNSw1LjUtMS41CgkJCWMxLjY1LDAsMy4zNSwwLjMsNC43NSwxLjA1YzAuMSwwLjA1LDAuMTUsMC4wNSwwLjI1LDAuMDVjMC4yNSwwLDAuNS0wLjI1LDAuNS0wLjVWNkMyMi40LDUuNTUsMjEuNzUsNS4yNSwyMSw1eiBNMywxOC41VjcKCQkJYzEuMS0wLjM1LDIuMy0wLjUsMy41LTAuNWMxLjM0LDAsMy4xMywwLjQxLDQuNSwwLjk5djExLjVDOS42MywxOC40MSw3Ljg0LDE4LDYuNSwxOEM1LjMsMTgsNC4xLDE4LjE1LDMsMTguNXogTTIxLDE4LjUKCQkJYy0xLjEtMC4zNS0yLjMtMC41LTMuNS0wLjVjLTEuMzQsMC0zLjEzLDAuNDEtNC41LDAuOTlWNy40OWMxLjM3LTAuNTksMy4xNi0wLjk5LDQuNS0wLjk5YzEuMiwwLDIuNCwwLjE1LDMuNSwwLjVWMTguNXoiLz4KCQk8cGF0aCBvcGFjaXR5PSIwLjMiIGQ9Ik0xMSw3LjQ5QzkuNjMsNi45MSw3Ljg0LDYuNSw2LjUsNi41QzUuMyw2LjUsNC4xLDYuNjUsMyw3djExLjVDNC4xLDE4LjE1LDUuMywxOCw2LjUsMTgKCQkJYzEuMzQsMCwzLjEzLDAuNDEsNC41LDAuOTlWNy40OXoiLz4KCTwvZz4KCTxnPgoJCTxwYXRoIGQ9Ik0xNy41LDEwLjVjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNlY5LjI0QzE5LjIxLDkuMDksMTguMzYsOSwxNy41LDljLTEuMjgsMC0yLjQ2LDAuMTYtMy41LDAuNDd2MS41NwoJCQlDMTQuOTksMTAuNjksMTYuMTgsMTAuNSwxNy41LDEwLjV6Ii8+CgkJPHBhdGggZD0iTTE3LjUsMTMuMTZjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNlYxMS45Yy0wLjc5LTAuMTUtMS42NC0wLjI0LTIuNS0wLjI0Yy0xLjI4LDAtMi40NiwwLjE2LTMuNSwwLjQ3djEuNTcKCQkJQzE0Ljk5LDEzLjM2LDE2LjE4LDEzLjE2LDE3LjUsMTMuMTZ6Ii8+CgkJPHBhdGggZD0iTTE3LjUsMTUuODNjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNnYtMS41MmMtMC43OS0wLjE1LTEuNjQtMC4yNC0yLjUtMC4yNGMtMS4yOCwwLTIuNDYsMC4xNi0zLjUsMC40N3YxLjU3CgkJCUMxNC45OSwxNi4wMiwxNi4xOCwxNS44MywxNy41LDE1LjgzeiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", label: "Documentation" }), - React__namespace.createElement(Button$3, { href: "https://github.com/marmelab/react-admin/tree/master/examples", img: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDI0djI0SDBWMHoiLz48cGF0aCBkPSJNOS40IDE2LjZMNC44IDEybDQuNi00LjZMOCA2bC02IDYgNiA2IDEuNC0xLjR6bTUuMiAwbDQuNi00LjYtNC42LTQuNkwxNiA2bDYgNi02IDYtMS40LTEuNHoiLz48L3N2Zz4=", label: "Examples" }), - React__namespace.createElement(Button$3, { href: "https://stackoverflow.com/questions/tagged/react-admin", img: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IgoJIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnIGlkPSJCb3VuZGluZ19Cb3giPgoJPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CjwvZz4KPGcgaWQ9IkZsYXQiPgoJPGcgaWQ9InVpX3g1Rl9zcGVjX3g1Rl9oZWFkZXJfY29weV8yIj4KCTwvZz4KCTxnPgoJCTxjaXJjbGUgb3BhY2l0eT0iMC4zIiBjeD0iOSIgY3k9IjgiIHI9IjIiLz4KCQk8cGF0aCBvcGFjaXR5PSIwLjMiIGQ9Ik05LDE1Yy0yLjcsMC01LjgsMS4yOS02LDIuMDFMMywxOGgxMnYtMUMxNC44LDE2LjI5LDExLjcsMTUsOSwxNXoiLz4KCQk8cGF0aCBkPSJNMTYuNjcsMTMuMTNDMTguMDQsMTQuMDYsMTksMTUuMzIsMTksMTd2M2g0di0zQzIzLDE0LjgyLDE5LjQzLDEzLjUzLDE2LjY3LDEzLjEzeiIvPgoJCTxwYXRoIGQ9Ik0xNSwxMmMyLjIxLDAsNC0xLjc5LDQtNGMwLTIuMjEtMS43OS00LTQtNGMtMC40NywwLTAuOTEsMC4xLTEuMzMsMC4yNEMxNC41LDUuMjcsMTUsNi41OCwxNSw4cy0wLjUsMi43My0xLjMzLDMuNzYKCQkJQzE0LjA5LDExLjksMTQuNTMsMTIsMTUsMTJ6Ii8+CgkJPHBhdGggZD0iTTksMTJjMi4yMSwwLDQtMS43OSw0LTRjMC0yLjIxLTEuNzktNC00LTRTNSw1Ljc5LDUsOEM1LDEwLjIxLDYuNzksMTIsOSwxMnogTTksNmMxLjEsMCwyLDAuOSwyLDJjMCwxLjEtMC45LDItMiwyCgkJCVM3LDkuMSw3LDhDNyw2LjksNy45LDYsOSw2eiIvPgoJCTxwYXRoIGQ9Ik05LDEzYy0yLjY3LDAtOCwxLjM0LTgsNHYzaDE2di0zQzE3LDE0LjM0LDExLjY3LDEzLDksMTN6IE0xNSwxOEgzbDAtMC45OUMzLjIsMTYuMjksNi4zLDE1LDksMTVzNS44LDEuMjksNiwyVjE4eiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", label: "Community" })))); + React__namespace.createElement("div", { style: styles$1.secondary }, + React__namespace.createElement(Button$1, { href: "https://marmelab.com/react-admin/Readme.html", img: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IgoJIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnIGlkPSJCb3VuZGluZ19Cb3giPgoJPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CjwvZz4KPGcgaWQ9IkZsYXQiPgoJPGcgaWQ9InVpX3g1Rl9zcGVjX3g1Rl9oZWFkZXJfY29weV8yIj4KCTwvZz4KCTxnPgoJCTxwYXRoIGQ9Ik0yMSw1Yy0xLjExLTAuMzUtMi4zMy0wLjUtMy41LTAuNWMtMS45NSwwLTQuMDUsMC40LTUuNSwxLjVjLTEuNDUtMS4xLTMuNTUtMS41LTUuNS0xLjVTMi40NSw0LjksMSw2djE0LjY1CgkJCWMwLDAuMjUsMC4yNSwwLjUsMC41LDAuNWMwLjEsMCwwLjE1LTAuMDUsMC4yNS0wLjA1QzMuMSwyMC40NSw1LjA1LDIwLDYuNSwyMGMxLjk1LDAsNC4wNSwwLjQsNS41LDEuNWMxLjM1LTAuODUsMy44LTEuNSw1LjUtMS41CgkJCWMxLjY1LDAsMy4zNSwwLjMsNC43NSwxLjA1YzAuMSwwLjA1LDAuMTUsMC4wNSwwLjI1LDAuMDVjMC4yNSwwLDAuNS0wLjI1LDAuNS0wLjVWNkMyMi40LDUuNTUsMjEuNzUsNS4yNSwyMSw1eiBNMywxOC41VjcKCQkJYzEuMS0wLjM1LDIuMy0wLjUsMy41LTAuNWMxLjM0LDAsMy4xMywwLjQxLDQuNSwwLjk5djExLjVDOS42MywxOC40MSw3Ljg0LDE4LDYuNSwxOEM1LjMsMTgsNC4xLDE4LjE1LDMsMTguNXogTTIxLDE4LjUKCQkJYy0xLjEtMC4zNS0yLjMtMC41LTMuNS0wLjVjLTEuMzQsMC0zLjEzLDAuNDEtNC41LDAuOTlWNy40OWMxLjM3LTAuNTksMy4xNi0wLjk5LDQuNS0wLjk5YzEuMiwwLDIuNCwwLjE1LDMuNSwwLjVWMTguNXoiLz4KCQk8cGF0aCBvcGFjaXR5PSIwLjMiIGQ9Ik0xMSw3LjQ5QzkuNjMsNi45MSw3Ljg0LDYuNSw2LjUsNi41QzUuMyw2LjUsNC4xLDYuNjUsMyw3djExLjVDNC4xLDE4LjE1LDUuMywxOCw2LjUsMTgKCQkJYzEuMzQsMCwzLjEzLDAuNDEsNC41LDAuOTlWNy40OXoiLz4KCTwvZz4KCTxnPgoJCTxwYXRoIGQ9Ik0xNy41LDEwLjVjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNlY5LjI0QzE5LjIxLDkuMDksMTguMzYsOSwxNy41LDljLTEuMjgsMC0yLjQ2LDAuMTYtMy41LDAuNDd2MS41NwoJCQlDMTQuOTksMTAuNjksMTYuMTgsMTAuNSwxNy41LDEwLjV6Ii8+CgkJPHBhdGggZD0iTTE3LjUsMTMuMTZjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNlYxMS45Yy0wLjc5LTAuMTUtMS42NC0wLjI0LTIuNS0wLjI0Yy0xLjI4LDAtMi40NiwwLjE2LTMuNSwwLjQ3djEuNTcKCQkJQzE0Ljk5LDEzLjM2LDE2LjE4LDEzLjE2LDE3LjUsMTMuMTZ6Ii8+CgkJPHBhdGggZD0iTTE3LjUsMTUuODNjMC44OCwwLDEuNzMsMC4wOSwyLjUsMC4yNnYtMS41MmMtMC43OS0wLjE1LTEuNjQtMC4yNC0yLjUtMC4yNGMtMS4yOCwwLTIuNDYsMC4xNi0zLjUsMC40N3YxLjU3CgkJCUMxNC45OSwxNi4wMiwxNi4xOCwxNS44MywxNy41LDE1LjgzeiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", label: "Documentation" }), + React__namespace.createElement(Button$1, { href: "https://github.com/marmelab/react-admin/tree/master/examples", img: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDI0djI0SDBWMHoiLz48cGF0aCBkPSJNOS40IDE2LjZMNC44IDEybDQuNi00LjZMOCA2bC02IDYgNiA2IDEuNC0xLjR6bTUuMiAwbDQuNi00LjYtNC42LTQuNkwxNiA2bDYgNi02IDYtMS40LTEuNHoiLz48L3N2Zz4=", label: "Examples" }), + React__namespace.createElement(Button$1, { href: "https://stackoverflow.com/questions/tagged/react-admin", img: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIzLjAuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IgoJIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnIGlkPSJCb3VuZGluZ19Cb3giPgoJPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CjwvZz4KPGcgaWQ9IkZsYXQiPgoJPGcgaWQ9InVpX3g1Rl9zcGVjX3g1Rl9oZWFkZXJfY29weV8yIj4KCTwvZz4KCTxnPgoJCTxjaXJjbGUgb3BhY2l0eT0iMC4zIiBjeD0iOSIgY3k9IjgiIHI9IjIiLz4KCQk8cGF0aCBvcGFjaXR5PSIwLjMiIGQ9Ik05LDE1Yy0yLjcsMC01LjgsMS4yOS02LDIuMDFMMywxOGgxMnYtMUMxNC44LDE2LjI5LDExLjcsMTUsOSwxNXoiLz4KCQk8cGF0aCBkPSJNMTYuNjcsMTMuMTNDMTguMDQsMTQuMDYsMTksMTUuMzIsMTksMTd2M2g0di0zQzIzLDE0LjgyLDE5LjQzLDEzLjUzLDE2LjY3LDEzLjEzeiIvPgoJCTxwYXRoIGQ9Ik0xNSwxMmMyLjIxLDAsNC0xLjc5LDQtNGMwLTIuMjEtMS43OS00LTQtNGMtMC40NywwLTAuOTEsMC4xLTEuMzMsMC4yNEMxNC41LDUuMjcsMTUsNi41OCwxNSw4cy0wLjUsMi43My0xLjMzLDMuNzYKCQkJQzE0LjA5LDExLjksMTQuNTMsMTIsMTUsMTJ6Ii8+CgkJPHBhdGggZD0iTTksMTJjMi4yMSwwLDQtMS43OSw0LTRjMC0yLjIxLTEuNzktNC00LTRTNSw1Ljc5LDUsOEM1LDEwLjIxLDYuNzksMTIsOSwxMnogTTksNmMxLjEsMCwyLDAuOSwyLDJjMCwxLjEtMC45LDItMiwyCgkJCVM3LDkuMSw3LDhDNyw2LjksNy45LDYsOSw2eiIvPgoJCTxwYXRoIGQ9Ik05LDEzYy0yLjY3LDAtOCwxLjM0LTgsNHYzaDE2di0zQzE3LDE0LjM0LDExLjY3LDEzLDksMTN6IE0xNSwxOEgzbDAtMC45OUMzLjIsMTYuMjksNi4zLDE1LDksMTVzNS44LDEuMjksNiwyVjE4eiIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=", label: "Community" })))); }); var getMutationMode = function (mutationMode, undoable) { @@ -16494,7 +16626,7 @@ var getMutationMode = function (mutationMode, undoable) { */ var useUnselectAll = function (resource1) { var dispatch = useDispatch(); - return React$v.useCallback(function (resource2) { + return React.useCallback(function (resource2) { warning$2(!resource2 && !resource1, "You didn't specify the resource at initialization (useUnselectAll('posts')) nor when using the callback (unselectAll('posts'))"); dispatch(setListSelectedIds(resource2 || resource1, [])); }, [dispatch, resource1]); @@ -16574,7 +16706,7 @@ var useLogoutIfAccessDenied = function () { var logout = useLogout$1(); var notify = useNotify$1(); var history = useHistory(); - var logoutIfAccessDenied = React$v.useCallback(function (error, disableNotification) { + var logoutIfAccessDenied = React.useCallback(function (error, disableNotification) { return authProvider .checkError(error) .then(function () { return false; }) @@ -16712,7 +16844,7 @@ var convertLegacyDataProvider = function (legacyDataProvider) { }; var convertLegacyDataProvider$1 = convertLegacyDataProvider; -var DataProviderContext = React$v.createContext(null); +var DataProviderContext = React.createContext(null); DataProviderContext.displayName = 'DataProviderContext'; var DataProviderContext$1 = DataProviderContext; @@ -17534,7 +17666,7 @@ var assignMergeValue$1 = _assignMergeValue, isArray$d = isArray_1, isArrayLikeObject$4 = isArrayLikeObject_1, isBuffer$2 = isBuffer$5.exports, - isFunction$6 = isFunction_1, + isFunction$5 = isFunction_1, isObject$c = isObject_1, isPlainObject$3 = isPlainObject_1, isTypedArray$1 = isTypedArray_1, @@ -17601,7 +17733,7 @@ function baseMergeDeep$1(object, source, key, srcIndex, mergeFunc, customizer, s if (isArguments$4(objValue)) { newValue = toPlainObject(objValue); } - else if (!isObject$c(objValue) || isFunction$6(objValue)) { + else if (!isObject$c(objValue) || isFunction$5(objValue)) { newValue = initCloneObject$1(srcValue); } } @@ -17752,7 +17884,7 @@ function constant$1(value) { var constant_1 = constant$1; var constant = constant_1, - defineProperty$2 = _defineProperty$e, + defineProperty$1 = _defineProperty$e, identity$3 = identity_1; /** @@ -17763,8 +17895,8 @@ var constant = constant_1, * @param {Function} string The `toString` result. * @returns {Function} Returns `func`. */ -var baseSetToString$1 = !defineProperty$2 ? identity$3 : function(func, string) { - return defineProperty$2(func, 'toString', { +var baseSetToString$1 = !defineProperty$1 ? identity$3 : function(func, string) { + return defineProperty$1(func, 'toString', { 'configurable': true, 'enumerable': false, 'value': constant(string), @@ -17949,11 +18081,11 @@ var baseMerge$2 = _baseMerge, * _.merge(object, other); * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] } */ -var merge$1 = createAssigner$1(function(object, source, srcIndex) { +var merge = createAssigner$1(function(object, source, srcIndex) { baseMerge$2(object, source, srcIndex); }); -var merge_1 = merge$1; +var merge_1 = merge; var defaultDataProvider = { create: function () { return Promise.resolve({ data: null }); }, @@ -19059,12 +19191,12 @@ var __rest$$ = (undefined && undefined.__rest) || function (s, e) { */ var useDataProvider = function () { var dispatch = useDispatch(); - var dataProvider = React$v.useContext(DataProviderContext$1) || defaultDataProvider; + var dataProvider = React.useContext(DataProviderContext$1) || defaultDataProvider; // optimistic mode can be triggered by a previous optimistic or undoable query var isOptimistic = useSelector(function (state) { return state.admin.ui.optimistic; }); var store = useStore(); var logoutIfAccessDenied = useLogoutIfAccessDenied$1(); - var dataProviderProxy = React$v.useMemo(function () { + var dataProviderProxy = React.useMemo(function () { return new Proxy(dataProvider, { get: function (target, name) { if (typeof name === 'symbol') { @@ -19170,7 +19302,7 @@ var useDeclarativeSideEffects = function () { var redirect = useRedirect$1(); var refresh = useRefresh$1(); var unselectAll = useUnselectAll$1(); - return React$v.useMemo(function () { return function (resource, _a) { + return React.useMemo(function () { return function (resource, _a) { var _b = _a === void 0 ? defaultSideEffects : _a, onSuccess = _b.onSuccess, onFailure = _b.onFailure; var convertToFunctionSideEffect = function (resource, sideEffects) { if (!sideEffects || typeof sideEffects === 'function') { @@ -19242,7 +19374,7 @@ var useDataProviderWithDeclarativeSideEffects = function () { var dataProvider = useDataProvider$1(); var getSideEffects = useDeclarativeSideEffects$1(); // @ts-ignore - var dataProviderProxy = React$v.useMemo(function () { + var dataProviderProxy = React.useMemo(function () { return new Proxy(dataProvider, { get: function (target, name) { if (typeof name === 'symbol') { @@ -19444,7 +19576,7 @@ var useMutation = function (query, options) { var dataProvider = useDataProvider$1(); var dataProviderWithDeclarativeSideEffects = useDataProviderWithDeclarativeSideEffects$1(); /* eslint-disable react-hooks/exhaustive-deps */ - var mutate = React$v.useCallback(function (callTimeQuery, callTimeOptions) { + var mutate = React.useCallback(function (callTimeQuery, callTimeOptions) { var finalDataProvider = hasDeclarativeSideEffectsSupport(options, callTimeOptions) ? dataProviderWithDeclarativeSideEffects : dataProvider; @@ -19706,17 +19838,17 @@ var useQueryWithStore = function (query, options, dataSelector, totalSelector, i var version = useVersion$1(); // used to allow force reload // used to force a refetch without relying on version // which might trigger other queries as well - var _a = React$v.useState(0), innerVersion = _a[0], setInnerVersion = _a[1]; + var _a = React.useState(0), innerVersion = _a[0], setInnerVersion = _a[1]; var requestSignature = JSON.stringify({ query: query, options: options, version: version, innerVersion: innerVersion, }); - var requestSignatureRef = React$v.useRef(requestSignature); + var requestSignatureRef = React.useRef(requestSignature); var data = useSelector(dataSelector); var total = useSelector(totalSelector); - var refetch = React$v.useCallback(function () { + var refetch = React.useCallback(function () { setInnerVersion(function (prevInnerVersion) { return prevInnerVersion + 1; }); }, []); var _b = useSafeSetState({ @@ -19727,7 +19859,7 @@ var useQueryWithStore = function (query, options, dataSelector, totalSelector, i loaded: (options === null || options === void 0 ? void 0 : options.enabled) === false ? false : isDataLoaded(data), refetch: refetch, }), state = _b[0], setState = _b[1]; - React$v.useEffect(function () { + React.useEffect(function () { if (requestSignatureRef.current !== requestSignature) { // request has changed, reset the loading state requestSignatureRef.current = requestSignature; @@ -19762,7 +19894,7 @@ var useQueryWithStore = function (query, options, dataSelector, totalSelector, i options.enabled, ]); var dataProvider = useDataProvider$1(); - React$v.useEffect(function () { + React.useEffect(function () { // When several identical queries are issued during the same tick, // we only pass one query to the dataProvider. // To achieve that, the closure keeps a list of dataProvider promises @@ -19914,7 +20046,7 @@ var defaultData = {}; */ var useGetMainList = function (resource, pagination, sort, filter, options) { var requestSignature = JSON.stringify({ pagination: pagination, sort: sort, filter: filter }); - var memo = React$v.useRef({}); + var memo = React.useRef({}); var _a = useQueryWithStore({ type: 'getList', resource: resource, payload: { pagination: pagination, sort: sort, filter: filter } }, options, // ids and data selector function (state) { @@ -19966,7 +20098,7 @@ var useGetMainList = function (resource, pagination, sort, filter, options) { } return memo.current.result; }, function () { return null; }, isDataLoaded), _b = _a.data, finalIds = _b.finalIds, finalTotal = _b.finalTotal, allRecords = _b.allRecords, error = _a.error, loading = _a.loading, loaded = _a.loaded, refetch = _a.refetch; - var data = React$v.useMemo(function () { + var data = React.useMemo(function () { return typeof finalIds === 'undefined' ? defaultData : finalIds @@ -20285,7 +20417,7 @@ var nativeMax = Math.max, * // Cancel the trailing debounced invocation. * jQuery(window).on('popstate', debounced.cancel); */ -function debounce$3(func, wait, options) { +function debounce$1(func, wait, options) { var lastArgs, lastThis, maxWait, @@ -20410,9 +20542,9 @@ function debounce$3(func, wait, options) { return debounced; } -var debounce_1 = debounce$3; +var debounce_1 = debounce$1; -var debounce$4 = debounce_1; +var debounce$2 = debounce_1; var Symbol$3 = _Symbol, isArguments$3 = isArguments_1, @@ -20615,14 +20747,14 @@ var _arrayIncludesWith = arrayIncludesWith$3; * // => [undefined, undefined] */ -function noop$4() { +function noop$3() { // No operation performed. } -var noop_1 = noop$4; +var noop_1 = noop$3; var Set$1 = _Set, - noop$3 = noop_1, + noop$2 = noop_1, setToArray$1 = _setToArray; /** Used as references for various `Number` constants. */ @@ -20635,7 +20767,7 @@ var INFINITY$1 = 1 / 0; * @param {Array} values The values to add to the set. * @returns {Object} Returns the new set. */ -var createSet$1 = !(Set$1 && (1 / setToArray$1(new Set$1([,-0]))[1]) == INFINITY$1) ? noop$3 : function(values) { +var createSet$1 = !(Set$1 && (1 / setToArray$1(new Set$1([,-0]))[1]) == INFINITY$1) ? noop$2 : function(values) { return new Set$1(values); }; @@ -20978,13 +21110,13 @@ var useListParams = function (_a) { var dispatch = useDispatch(); var location = useLocation(); var history = useHistory(); - var _f = React$v.useState(defaultParams), localParams = _f[0], setLocalParams = _f[1]; + var _f = React.useState(defaultParams), localParams = _f[0], setLocalParams = _f[1]; var params = useSelector(function (reduxState) { return reduxState.admin.resources[resource] ? reduxState.admin.resources[resource].list.params : defaultParams; }, shallowEqual$2); - var tempParams = React$v.useRef(); + var tempParams = React.useRef(); var requestSignature = [ location.search, resource, @@ -20997,7 +21129,7 @@ var useListParams = function (_a) { var queryFromLocation = syncWithLocation ? parseQueryFromLocation(location) : {}; - var query = React$v.useMemo(function () { + var query = React.useMemo(function () { return getQuery({ queryFromLocation: queryFromLocation, params: syncWithLocation ? params : localParams, @@ -21011,12 +21143,12 @@ var useListParams = function (_a) { // the categories products on the demo), we need to persist them in the // redux state as well so that we don't lose them after a redirection back // to the list - React$v.useEffect(function () { + React.useEffect(function () { if (Object.keys(queryFromLocation).length > 0) { dispatch(changeListParams(resource, query)); } }, []); // eslint-disable-line - var changeParams = React$v.useCallback(function (action) { + var changeParams = React.useCallback(function (action) { if (!tempParams.current) { // no other changeParams action dispatched this tick tempParams.current = queryReducer$1(query, action); @@ -21040,22 +21172,22 @@ var useListParams = function (_a) { tempParams.current = queryReducer$1(tempParams.current, action); } }, requestSignature); // eslint-disable-line react-hooks/exhaustive-deps - var setSort = React$v.useCallback(function (sort, order) { + var setSort = React.useCallback(function (sort, order) { return changeParams({ type: SET_SORT, payload: { sort: sort, order: order }, }); }, requestSignature // eslint-disable-line react-hooks/exhaustive-deps ); - var setPage = React$v.useCallback(function (newPage) { return changeParams({ type: SET_PAGE, payload: newPage }); }, requestSignature // eslint-disable-line react-hooks/exhaustive-deps + var setPage = React.useCallback(function (newPage) { return changeParams({ type: SET_PAGE, payload: newPage }); }, requestSignature // eslint-disable-line react-hooks/exhaustive-deps ); - var setPerPage = React$v.useCallback(function (newPerPage) { + var setPerPage = React.useCallback(function (newPerPage) { return changeParams({ type: SET_PER_PAGE, payload: newPerPage }); }, requestSignature // eslint-disable-line react-hooks/exhaustive-deps ); var filterValues = query.filter || emptyObject; var displayedFilterValues = query.displayedFilters || emptyObject; - var debouncedSetFilters = debounce$4(function (filter, displayedFilters) { + var debouncedSetFilters = debounce$2(function (filter, displayedFilters) { changeParams({ type: SET_FILTER, payload: { @@ -21064,7 +21196,7 @@ var useListParams = function (_a) { }, }); }, debounce); - var setFilters = React$v.useCallback(function (filter, displayedFilters, debounce) { + var setFilters = React.useCallback(function (filter, displayedFilters, debounce) { if (debounce === void 0) { debounce = true; } return debounce ? debouncedSetFilters(filter, displayedFilters) @@ -21077,13 +21209,13 @@ var useListParams = function (_a) { }); }, requestSignature // eslint-disable-line react-hooks/exhaustive-deps ); - var hideFilter = React$v.useCallback(function (filterName) { + var hideFilter = React.useCallback(function (filterName) { changeParams({ type: HIDE_FILTER, payload: filterName, }); }, requestSignature); // eslint-disable-line react-hooks/exhaustive-deps - var showFilter = React$v.useCallback(function (filterName, defaultValue) { + var showFilter = React.useCallback(function (filterName, defaultValue) { changeParams({ type: SHOW_FILTER, payload: { @@ -21200,7 +21332,7 @@ var useRecordSelection = function (resource) { ? reduxState.admin.resources[resource].list.selectedIds : defaultRecords; }, shallowEqual$2); - var selectionModifiers = React$v.useMemo(function () { return ({ + var selectionModifiers = React.useMemo(function () { return ({ select: function (newIds) { dispatch(setListSelectedIds(resource, newIds)); }, @@ -21264,17 +21396,17 @@ var joinRows$1 = function joinRows(rows, join) { /* jshint node:true */ -var _typeof$d = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; +var _typeof$c = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var _createClass$b = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); -function _classCallCheck$b(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function _classCallCheck$a(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var helper$2 = helper$4; var Handler$1 = function () { function Handler(options) { - _classCallCheck$b(this, Handler); + _classCallCheck$a(this, Handler); this._options = options; @@ -21360,7 +21492,7 @@ var Handler$1 = function () { element = this.castValue(element, item, index, parent); //try simple value by highier performance switch - switch (typeof element === 'undefined' ? 'undefined' : _typeof$d(element)) { + switch (typeof element === 'undefined' ? 'undefined' : _typeof$c(element)) { case 'string': return [{ item: item, @@ -21510,7 +21642,7 @@ function isInstanceOfTypeName(element, typeName) { } //literals in javascript cannot be checked by instance of - switch (typeof element === 'undefined' ? 'undefined' : _typeof$d(element)) { + switch (typeof element === 'undefined' ? 'undefined' : _typeof$c(element)) { case 'string': return typeName === "String"; case 'boolean': @@ -21576,7 +21708,7 @@ var escapeDelimiters = function escapedDelimiters(textDelimiter, rowDelimiter, f var _createClass$a = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); -function _classCallCheck$a(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function _classCallCheck$9(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var EOL = eol; var joinRows = joinRows$1; @@ -21585,7 +21717,7 @@ var helper$1 = helper$4; var Parser$1 = function () { function Parser(options) { - _classCallCheck$a(this, Parser); + _classCallCheck$9(this, Parser); this._options = this._parseOptions(options) || {}; this._handler = new Handler(this._options); @@ -21956,7 +22088,7 @@ var useListController = function (props) { if (!resource) { throw new Error(" was called outside of a ResourceContext and without a resource prop. You must set the resource prop."); } - if (filter && React$v.isValidElement(filter)) { + if (filter && React.isValidElement(filter)) { throw new Error(' received a React element as `filter` props. If you intended to set the list filter elements, use the `filters` (with an s) prop instead. The `filter` prop is internal and should not be set by the developer.'); } var translate = useTranslate$1(); @@ -21992,7 +22124,7 @@ var useListController = function (props) { }, }), ids = _g.ids, data = _g.data, total = _g.total, error = _g.error, loading = _g.loading, loaded = _g.loaded, refetch = _g.refetch; var totalPages = Math.ceil(total / query.perPage) || 1; - React$v.useEffect(function () { + React.useEffect(function () { if (query.page <= 0 || (!loading && query.page > 1 && ids.length === 0)) { // Query for a page that doesn't exist, set page to 1 @@ -22004,7 +22136,7 @@ var useListController = function (props) { queryModifiers.setPage(totalPages); } }, [loading, query.page, ids, queryModifiers, total, totalPages]); - var currentSort = React$v.useMemo(function () { return ({ + var currentSort = React.useMemo(function () { return ({ field: query.sort, order: query.order, }); }, [query.sort, query.order]); @@ -22120,7 +22252,7 @@ var useListController$1 = useListController; * } */ var useLocale = function () { - var locale = React$v.useContext(TranslationContext).locale; + var locale = React.useContext(TranslationContext).locale; return locale; }; var useLocale$1 = useLocale; @@ -22154,13 +22286,13 @@ var TranslationProvider = function (props) { locale: i18nProvider ? i18nProvider.getLocale() : 'en', i18nProvider: i18nProvider, }), state = _a[0], setState = _a[1]; - var setLocale = React$v.useCallback(function (newLocale) { + var setLocale = React.useCallback(function (newLocale) { return setState(function (state) { return (__assign$1h(__assign$1h({}, state), { locale: newLocale })); }); }, [setState]); // Allow locale modification by including setLocale in the context // This can't be done in the initial state because setState doesn't exist yet - var value = React$v.useMemo(function () { return (__assign$1h(__assign$1h({}, state), { setLocale: setLocale })); }, [setLocale, state]); - return (React__default['default'].createElement(TranslationContext.Provider, { value: value }, React$v.Children.only(children))); + var value = React.useMemo(function () { return (__assign$1h(__assign$1h({}, state), { setLocale: setLocale })); }, [setLocale, state]); + return (React__default['default'].createElement(TranslationContext.Provider, { value: value }, React.Children.only(children))); }; var TranslationProvider$1 = TranslationProvider; @@ -22256,7 +22388,7 @@ var DEFAULT_LOCALE = 'en'; * ); * }; */ -var ListContext$2 = React$v.createContext({ +var ListContext = React.createContext({ basePath: null, currentSort: null, data: null, @@ -22283,8 +22415,8 @@ var ListContext$2 = React$v.createContext({ showFilter: null, total: null, }); -ListContext$2.displayName = 'ListContext'; -var ListContext$3 = ListContext$2; +ListContext.displayName = 'ListContext'; +var ListContext$1 = ListContext; var basePickBy = _basePickBy, hasIn = hasIn_1; @@ -22407,7 +22539,7 @@ var pick_1 = pick; * ); * }; */ -var ListFilterContext = React$v.createContext({ +var ListFilterContext = React.createContext({ displayedFilters: null, filterValues: null, hideFilter: null, @@ -22416,7 +22548,7 @@ var ListFilterContext = React$v.createContext({ resource: null, }); var usePickFilterContext = function (context) { - return React$v.useMemo(function () { + return React.useMemo(function () { return pick_1(context, [ 'displayedFilters', 'filterValues', @@ -22474,7 +22606,7 @@ var ListFilterContext$1 = ListFilterContext; * ); * }; */ -var ListPaginationContext = React$v.createContext({ +var ListPaginationContext = React.createContext({ loading: null, page: null, perPage: null, @@ -22485,7 +22617,7 @@ var ListPaginationContext = React$v.createContext({ }); ListPaginationContext.displayName = 'ListPaginationContext'; var usePickPaginationContext = function (context) { - return React$v.useMemo(function () { + return React.useMemo(function () { return pick_1(context, [ 'loading', 'page', @@ -22540,13 +22672,13 @@ var ListPaginationContext$1 = ListPaginationContext; * ); * }; */ -var ListSortContext = React$v.createContext({ +var ListSortContext = React.createContext({ currentSort: null, setSort: null, resource: null, }); var usePickSortContext = function (context) { - return React$v.useMemo(function () { return pick_1(context, ['currentSort', 'setSort', 'resource']); }, + return React.useMemo(function () { return pick_1(context, ['currentSort', 'setSort', 'resource']); }, // eslint-disable-next-line react-hooks/exhaustive-deps [context.currentSort, context.setSort]); }; @@ -22582,7 +22714,7 @@ var ListSortContext$1 = ListSortContext; */ var ListContextProvider = function (_a) { var value = _a.value, children = _a.children; - return (React__namespace.createElement(ListContext$3.Provider, { value: value }, + return (React__namespace.createElement(ListContext$1.Provider, { value: value }, React__namespace.createElement(ListFilterContext$1.Provider, { value: usePickFilterContext(value) }, React__namespace.createElement(ListSortContext$1.Provider, { value: usePickSortContext(value) }, React__namespace.createElement(ListPaginationContext$1.Provider, { value: usePickPaginationContext(value) }, children))))); @@ -22613,7 +22745,7 @@ var useExpanded = function (resource, id) { var expanded = expandedList === undefined ? false : expandedList.map(function (el) { return el == id; }).indexOf(true) !== -1; // eslint-disable-line eqeqeq - var toggleExpanded = React$v.useCallback(function () { + var toggleExpanded = React.useCallback(function () { dispatch(toggleListItemExpand(resource, id)); }, [dispatch, resource, id]); return [expanded, toggleExpanded]; @@ -22774,10 +22906,10 @@ var defaults_1 = defaults$1; * } */ var useListContext = function (props) { - var context = React$v.useContext(ListContext$3); + var context = React.useContext(ListContext$1); // Props take precedence over the context // @ts-ignore - return React$v.useMemo(function () { + return React.useMemo(function () { return defaults_1({}, props != null ? extractListContextProps(props) : {}, context); }, [context, props]); }; @@ -22880,7 +23012,7 @@ var useReference$1 = useReference; * @see useListController for how it is filled */ var useListPaginationContext = function (props) { - var context = React$v.useContext(ListPaginationContext$1); + var context = React.useContext(ListPaginationContext$1); if (!context.setPage) { /** * The element isn't inside a @@ -23147,7 +23279,7 @@ var setInRecursor = function setInRecursor(current, index, path, value, destroyA } // set result in key - return _extends$m({}, current, (_extends2 = {}, _extends2[key] = _result, _extends2)); + return _extends$l({}, current, (_extends2 = {}, _extends2[key] = _result, _extends2)); } // array set @@ -23359,7 +23491,7 @@ function filterFormState(state, previousState, subscription, force) { // -var memoize$3 = function memoize(fn) { +var memoize$2 = function memoize(fn) { var lastArgs; var lastResult; return function () { @@ -23496,7 +23628,7 @@ function createForm(config) { dirtySinceLastSubmit: false, modifiedSinceLastSubmit: false, errors: {}, - initialValues: initialValues && _extends$m({}, initialValues), + initialValues: initialValues && _extends$l({}, initialValues), invalid: false, pristine: true, submitting: false, @@ -23505,7 +23637,7 @@ function createForm(config) { resetWhileSubmitting: false, valid: true, validating: 0, - values: initialValues ? _extends$m({}, initialValues) : {} + values: initialValues ? _extends$l({}, initialValues) : {} }, lastFormState: undefined }; @@ -23533,7 +23665,7 @@ function createForm(config) { if (state.fields[from]) { var _extends2, _extends3; - state.fields = _extends$m({}, state.fields, (_extends2 = {}, _extends2[to] = _extends$m({}, state.fields[from], { + state.fields = _extends$l({}, state.fields, (_extends2 = {}, _extends2[to] = _extends$l({}, state.fields[from], { name: to, // rebind event handlers blur: function blur() { @@ -23548,7 +23680,7 @@ function createForm(config) { lastFieldState: undefined }), _extends2)); delete state.fields[from]; - state.fieldSubscribers = _extends$m({}, state.fieldSubscribers, (_extends3 = {}, _extends3[to] = state.fieldSubscribers[from], _extends3)); + state.fieldSubscribers = _extends$l({}, state.fieldSubscribers, (_extends3 = {}, _extends3[to] = state.fieldSubscribers[from], _extends3)); delete state.fieldSubscribers[from]; var value = getIn(state.formState.values, from); state.formState.values = setIn(state.formState.values, from, undefined) || {}; @@ -23604,7 +23736,7 @@ function createForm(config) { var promises = []; if (validate) { - var errorsOrPromise = validate(_extends$m({}, state.formState.values)); // clone to avoid writing + var errorsOrPromise = validate(_extends$l({}, state.formState.values)); // clone to avoid writing if (isPromise(errorsOrPromise)) { promises.push(errorsOrPromise.then(setErrors)); @@ -23666,7 +23798,7 @@ function createForm(config) { var fields = state.fields, formState = state.formState; - var safeFields = _extends$m({}, fields); + var safeFields = _extends$l({}, fields); var fieldKeys = Object.keys(safeFields); @@ -23711,7 +23843,7 @@ function createForm(config) { } var processErrors = function processErrors() { - var merged = _extends$m({}, limitedFieldLevelValidation ? formState.errors : {}, recordLevelErrors); + var merged = _extends$l({}, limitedFieldLevelValidation ? formState.errors : {}, recordLevelErrors); var forEachError = function forEachError(fn) { fieldKeys.forEach(function (name) { @@ -23780,7 +23912,7 @@ function createForm(config) { fieldSubscribers = state.fieldSubscribers, formState = state.formState; - var safeFields = _extends$m({}, fields); + var safeFields = _extends$l({}, fields); var notifyField = function notifyField(name) { var field = safeFields[name]; @@ -23816,7 +23948,7 @@ function createForm(config) { formState = state.formState, lastFormState = state.lastFormState; - var safeFields = _extends$m({}, fields); + var safeFields = _extends$l({}, fields); var safeFieldKeys = Object.keys(safeFields); // calculate dirty/pristine @@ -23948,7 +24080,7 @@ function createForm(config) { if (previous) { // can only blur registered fields delete formState.active; - fields[name] = _extends$m({}, previous, { + fields[name] = _extends$l({}, previous, { active: false, touched: true }); @@ -23976,7 +24108,7 @@ function createForm(config) { if (previous) { // only track modified for registered fields - fields[name] = _extends$m({}, previous, { + fields[name] = _extends$l({}, previous, { modified: true, modifiedSinceLastSubmit: !!formState.lastSubmittedValues }); @@ -24028,7 +24160,7 @@ function createForm(config) { var fields = state.fields, formState = state.formState; - var safeFields = _extends$m({}, fields); + var safeFields = _extends$l({}, fields); var values = typeof data === 'function' ? data(formState.values) : data; @@ -24092,7 +24224,7 @@ function createForm(config) { var index = state.fieldSubscribers[name].index++; // save field subscriber callback state.fieldSubscribers[name].entries[index] = { - subscriber: memoize$3(subscriber), + subscriber: memoize$2(subscriber), subscription: subscription, notified: false }; @@ -24232,7 +24364,7 @@ function createForm(config) { * Resets all field flags (e.g. touched, visited, etc.) to their initial state */ resetFieldState: function resetFieldState(name) { - state.fields[name] = _extends$m({}, state.fields[name], { + state.fields[name] = _extends$l({}, state.fields[name], { active: false, lastFieldState: undefined, modified: false, @@ -24260,7 +24392,7 @@ function createForm(config) { api.batch(function () { for (var name in state.fields) { api.resetFieldState(name); - state.fields[name] = _extends$m({}, state.fields[name], { + state.fields[name] = _extends$l({}, state.fields[name], { active: false, lastFieldState: undefined, modified: false, @@ -24356,7 +24488,7 @@ function createForm(config) { delete formState.submitErrors; delete formState.submitError; - formState.lastSubmittedValues = _extends$m({}, formState.values); + formState.lastSubmittedValues = _extends$l({}, formState.values); if (hasSyncErrors()) { markAllFieldsTouched(); @@ -24422,7 +24554,7 @@ function createForm(config) { formState.submitting = true; formState.submitFailed = false; formState.submitSucceeded = false; - formState.lastSubmittedValues = _extends$m({}, formState.values); + formState.lastSubmittedValues = _extends$l({}, formState.values); resetModifiedAfterSubmit(); // onSubmit is either sync, callback or async with a Promise var result = onSubmit(formState.values, api, complete); @@ -24462,7 +24594,7 @@ function createForm(config) { throw new Error('No subscription provided. What values do you want to listen to?'); } - var memoized = memoize$3(subscriber); + var memoized = memoize$2(subscriber); var subscribers = state.subscribers; var index = subscribers.index++; subscribers.entries[index] = { @@ -24742,7 +24874,7 @@ function ReactFinalForm(_ref) { }; var renderProps = { - form: _extends$m({}, form, { + form: _extends$l({}, form, { reset: function reset(eventOrValues) { if (isSyntheticEvent(eventOrValues)) { // it's a React SyntheticEvent, call reset with no arguments @@ -24757,7 +24889,7 @@ function ReactFinalForm(_ref) { addLazyFormState(renderProps, state); return /*#__PURE__*/React__namespace.createElement(ReactFinalFormContext.Provider, { value: form - }, renderComponent(_extends$m({}, rest, { + }, renderComponent(_extends$l({}, rest, { __versions: versions$1 }), renderProps, 'ReactFinalForm')); } @@ -24833,7 +24965,7 @@ function FormSpy(_ref) { } var renderProps = { - form: _extends$m({}, reactFinalForm, { + form: _extends$l({}, reactFinalForm, { reset: function reset(eventOrValues) { if (isSyntheticEvent(eventOrValues)) { // it's a React SyntheticEvent, call reset with no arguments @@ -24844,7 +24976,7 @@ function FormSpy(_ref) { } }) }; - return renderComponent(_extends$m({}, rest, renderProps), state, 'FormSpy'); + return renderComponent(_extends$l({}, rest, renderProps), state, 'FormSpy'); } var isReactNative = typeof window !== 'undefined' && window.navigator && window.navigator.product && window.navigator.product === 'ReactNative'; @@ -24865,7 +24997,7 @@ var getSelectedValues = function getSelectedValues(options) { return result; }; -var getValue$2 = function getValue(event, currentValue, valueProp, isReactNative) { +var getValue$1 = function getValue(event, currentValue, valueProp, isReactNative) { if (!isReactNative && event.nativeEvent && event.nativeEvent.text !== undefined) { return event.nativeEvent.text; } @@ -25064,7 +25196,7 @@ function useField(name, config) { } } - var value = event && event.target ? getValue$2(event, state.value, _value, isReactNative) : event; + var value = event && event.target ? getValue$1(event, state.value, _value, isReactNative) : event; state.change(parse(value, name)); }, // eslint-disable-next-line react-hooks/exhaustive-deps [_value, name, parse, state.change, state.value, type]), @@ -25076,7 +25208,7 @@ function useField(name, config) { var meta = {}; addLazyFieldMetaState(meta, state); - var input = _extends$m({ + var input = _extends$l({ name: name, get value() { @@ -25183,12 +25315,12 @@ var Field = /*#__PURE__*/React__namespace.forwardRef(function Field(_ref, ref) { }); if (typeof children === 'function') { - return children(_extends$m({}, field, rest)); + return children(_extends$l({}, field, rest)); } if (typeof component === 'string') { // ignore meta, combine input with any other props - return /*#__PURE__*/React__namespace.createElement(component, _extends$m({}, field.input, { + return /*#__PURE__*/React__namespace.createElement(component, _extends$l({}, field.input, { children: children, ref: ref }, rest)); @@ -25198,7 +25330,7 @@ var Field = /*#__PURE__*/React__namespace.forwardRef(function Field(_ref, ref) { throw new Error('prop name cannot be undefined in component'); } - return renderComponent(_extends$m({ + return renderComponent(_extends$l({ children: children, component: component, ref: ref @@ -25276,7 +25408,7 @@ var useDeleteWithUndoController = function (props) { }, mutationMode: 'undoable', }), deleteOne = _b[0], loading = _b[1].loading; - var handleDelete = React$v.useCallback(function (event) { + var handleDelete = React.useCallback(function (event) { event.stopPropagation(); deleteOne({ payload: { id: record.id, previousData: record }, @@ -25344,7 +25476,7 @@ var useDeleteWithUndoController$1 = useDeleteWithUndoController; var useDeleteWithConfirmController = function (props) { var record = props.record, redirectTo = props.redirect, basePath = props.basePath, mutationMode = props.mutationMode, onClick = props.onClick, onSuccess = props.onSuccess, onFailure = props.onFailure; var resource = useResourceContext(props); - var _a = React$v.useState(false), open = _a[0], setOpen = _a[1]; + var _a = React.useState(false), open = _a[0], setOpen = _a[1]; var notify = useNotify$1(); var redirect = useRedirect$1(); var refresh = useRefresh$1(); @@ -25389,7 +25521,7 @@ var useDeleteWithConfirmController = function (props) { setOpen(false); e.stopPropagation(); }; - var handleDelete = React$v.useCallback(function (event) { + var handleDelete = React.useCallback(function (event) { event.stopPropagation(); deleteOne({ payload: { id: record.id, previousData: record }, @@ -25402,7 +25534,7 @@ var useDeleteWithConfirmController = function (props) { }; var useDeleteWithConfirmController$1 = useDeleteWithConfirmController; -React$v.createContext({}); +React.createContext({}); /** * Get modifiers for a save() function, and the way to update them. * @@ -25421,7 +25553,7 @@ React$v.createContext({}); */ var useSaveModifiers = function (_a) { var onSuccess = _a.onSuccess, onFailure = _a.onFailure, transform = _a.transform; - var onSuccessRef = React$v.useRef(onSuccess); + var onSuccessRef = React.useRef(onSuccess); var setOnSuccess = function (onSuccess) { onSuccessRef.current = function (response) { // reset onSuccess for next submission @@ -25429,7 +25561,7 @@ var useSaveModifiers = function (_a) { return onSuccess(response); }; }; - var onFailureRef = React$v.useRef(onFailure); + var onFailureRef = React.useRef(onFailure); var setOnFailure = function (onFailure) { onFailureRef.current = function (error) { // reset onFailure for next submission @@ -25437,7 +25569,7 @@ var useSaveModifiers = function (_a) { return onFailure(error); }; }; - var transformRef = React$v.useRef(transform); + var transformRef = React.useRef(transform); var setTransform = function (transform) { transformRef.current = function (data) { // reset transform for next submission @@ -25487,7 +25619,7 @@ var useCreateController = function (props) { } var _b = useSaveModifiers({ onSuccess: onSuccess, onFailure: onFailure, transform: transform }), onSuccessRef = _b.onSuccessRef, setOnSuccess = _b.setOnSuccess, onFailureRef = _b.onFailureRef, setOnFailure = _b.setOnFailure, transformRef = _b.transformRef, setTransform = _b.setTransform; var _c = useCreate$1(resource), create = _c[0], saving = _c[1].loading; - var save = React$v.useCallback(function (data, redirectTo, _a) { + var save = React.useCallback(function (data, redirectTo, _a) { if (redirectTo === void 0) { redirectTo = 'list'; } var _b = _a === void 0 ? {} : _a, onSuccessFromSave = _b.onSuccess, onFailureFromSave = _b.onFailure, transformFromSave = _b.transform; return Promise.resolve(transformFromSave @@ -25643,7 +25775,7 @@ var useEditController = function (props) { }); var _e = useUpdate$1(resource, id, {}, // set by the caller record), update = _e[0], saving = _e[1].loading; - var save = React$v.useCallback(function (data, redirectTo, _a) { + var save = React.useCallback(function (data, redirectTo, _a) { if (redirectTo === void 0) { redirectTo = DefaultRedirect; } var _b = _a === void 0 ? {} : _a, onSuccessFromSave = _b.onSuccess, onFailureFromSave = _b.onFailure, transformFromSave = _b.transform; return Promise.resolve(transformFromSave @@ -25743,7 +25875,7 @@ var DefaultRedirect = 'list'; * ); * }; */ -var RecordContext = React$v.createContext(undefined); +var RecordContext = React.createContext(undefined); var RecordContextProvider = function (_a) { var children = _a.children, value = _a.value; return (React__namespace.createElement(RecordContext.Provider, { value: value }, children)); @@ -25780,11 +25912,11 @@ RecordContext.displayName = 'RecordContext'; var useRecordContext = function (props) { // Can't find a way to specify the RecordType when CreateContext is declared // @ts-ignore - var context = React$v.useContext(RecordContext); + var context = React.useContext(RecordContext); return (props && props.record) || context; }; -var SaveContext = React$v.createContext(undefined); +var SaveContext = React.createContext(undefined); /** * Get the save() function and its status * @@ -25798,7 +25930,7 @@ var SaveContext = React$v.createContext(undefined); * } = useSaveContext(); */ var useSaveContext = function (props) { - var context = React$v.useContext(SaveContext); + var context = React.useContext(SaveContext); if (!context || !context.save || !context.setOnFailure) { /** * The element isn't inside a @@ -25887,7 +26019,7 @@ var useGetMany = function (resource, ids, options) { if (options === void 0) { options = { enabled: true }; } // we can't use useQueryWithStore here because we're aggregating queries first // therefore part of the useQueryWithStore logic will have to be repeated below - var selectMany = React$v.useMemo(makeGetManySelector, []); + var selectMany = React.useMemo(makeGetManySelector, []); var data = useSelector(function (state) { return selectMany(state, resource, ids); }); @@ -25895,7 +26027,7 @@ var useGetMany = function (resource, ids, options) { // used to force a refetch without relying on version // which might trigger other queries as well var _a = useSafeSetState(0), innerVersion = _a[0], setInnerVersion = _a[1]; - var refetch = React$v.useCallback(function () { + var refetch = React.useCallback(function () { setInnerVersion(function (prevInnerVersion) { return prevInnerVersion + 1; }); }, [setInnerVersion]); var _b = useSafeSetState({ @@ -25909,7 +26041,7 @@ var useGetMany = function (resource, ids, options) { setState(__assign$1g(__assign$1g({}, state), { data: data })); } dataProvider = useDataProvider$1(); // not the best way to pass the dataProvider to a function outside the hook, but I couldn't find a better one - React$v.useEffect(function () { + React.useEffect(function () { if (options.enabled === false) { return; } @@ -25973,7 +26105,7 @@ var makeGetManySelector = function () { /** * Call the dataProvider once per resource */ -var callQueries = debounce$4(function () { +var callQueries = debounce$2(function () { var resources = Object.keys(queriesToCall); resources.forEach(function (resource) { var queries = __spreadArrays$5(queriesToCall[resource]); // cloning to avoid side effects @@ -26140,7 +26272,7 @@ var oneToMany = oneToManyReducer; */ var useUpdate = function (resource, id, data, previousData, options) { var _a = useMutation$1({ type: 'update', resource: resource, payload: { id: id, data: data, previousData: previousData } }, options), mutate = _a[0], state = _a[1]; - var update = React$v.useCallback(function (resource, id, data, previousData, options) { + var update = React.useCallback(function (resource, id, data, previousData, options) { if (typeof resource === 'string') { var query = { type: 'update', @@ -26210,7 +26342,7 @@ var useUpdate$1 = useUpdate; */ var useCreate = function (resource, data, options) { var _a = useMutation$1({ type: 'create', resource: resource, payload: { data: data } }, options), mutate = _a[0], state = _a[1]; - var create = React$v.useCallback(function (resource, data, options) { + var create = React.useCallback(function (resource, data, options) { if (typeof resource === 'string') { var query = { type: 'create', @@ -26279,7 +26411,7 @@ var useCreate$1 = useCreate; var useDelete = function (resource, id, previousData, options) { if (previousData === void 0) { previousData = {}; } var _a = useMutation$1({ type: 'delete', resource: resource, payload: { id: id, previousData: previousData } }, options), mutate = _a[0], state = _a[1]; - var deleteOne = React$v.useCallback(function (resource, id, previousData, options) { + var deleteOne = React.useCallback(function (resource, id, previousData, options) { if (typeof resource === 'string') { var query = { type: 'delete', @@ -26347,7 +26479,7 @@ var useDelete$1 = useDelete; */ var useDeleteMany = function (resource, ids, options) { var _a = useMutation$1({ type: 'deleteMany', resource: resource, payload: { ids: ids } }, options), mutate = _a[0], state = _a[1]; - var deleteMany = React$v.useCallback(function (resource, ids, options) { + var deleteMany = React.useCallback(function (resource, ids, options) { if (typeof resource === 'string') { var query = { type: 'deleteMany', @@ -26382,7 +26514,7 @@ var useRefreshWhenVisible = function (delay) { if (delay === void 0) { delay = 1000 * 60 * 5; } var refresh = useRefresh$1(); var automaticRefreshEnabled = useIsAutomaticRefreshEnabled$1(); - React$v.useEffect(function () { + React.useEffect(function () { if (typeof document === 'undefined') return; var lastHiddenTime; @@ -27063,7 +27195,7 @@ function runRaceEffect(env, effects, cb, _ref12) { } }; - chCbAtKey.cancel = noop$5; + chCbAtKey.cancel = noop$4; childCbs[key] = chCbAtKey; }); @@ -27186,7 +27318,7 @@ function forkQueue(mainTask, onAbort, cont) { } remove$1(tasks, task); - task.cont = noop$5; + task.cont = noop$4; if (isErr) { abort(res); @@ -27210,7 +27342,7 @@ function forkQueue(mainTask, onAbort, cont) { completed = true; tasks.forEach(function (t) { - t.cont = noop$5; + t.cont = noop$4; t.cancel(); }); tasks = []; @@ -27307,7 +27439,7 @@ function newTask(env, mainTask, parentContext, parentEffectId, meta, isRoot, con var _task; if (cont === void 0) { - cont = noop$5; + cont = noop$4; } var status = RUNNING; @@ -27430,7 +27562,7 @@ function proc(env, iterator$1, parentContext, parentEffectId, meta, isRoot, cont on it. It allows propagating cancellation to child effects **/ - next.cancel = noop$5; + next.cancel = noop$4; /** Creates a main task to track the main flow */ var mainTask = { @@ -27598,7 +27730,7 @@ function proc(env, iterator$1, parentContext, parentEffectId, meta, isRoot, cont } effectSettled = true; - cb.cancel = noop$5; // defensive measure + cb.cancel = noop$4; // defensive measure if (env.sagaMonitor) { if (isErr) { @@ -27616,7 +27748,7 @@ function proc(env, iterator$1, parentContext, parentEffectId, meta, isRoot, cont } // tracks down the current cancel - currCb.cancel = noop$5; // setup cancellation logic on the parent cb + currCb.cancel = noop$4; // setup cancellation logic on the parent cb cb.cancel = function () { // prevents cancelling an already completed effect @@ -27627,7 +27759,7 @@ function proc(env, iterator$1, parentContext, parentEffectId, meta, isRoot, cont effectSettled = true; currCb.cancel(); // propagates cancel downward - currCb.cancel = noop$5; // defensive measure + currCb.cancel = noop$4; // defensive measure env.sagaMonitor && env.sagaMonitor.effectCancelled(effectId); }; @@ -27668,12 +27800,12 @@ function runSaga(_ref, saga) { if (sagaMonitor) { // monitors are expected to have a certain interface, let's fill-in any missing ones - sagaMonitor.rootSagaStarted = sagaMonitor.rootSagaStarted || noop$5; - sagaMonitor.effectTriggered = sagaMonitor.effectTriggered || noop$5; - sagaMonitor.effectResolved = sagaMonitor.effectResolved || noop$5; - sagaMonitor.effectRejected = sagaMonitor.effectRejected || noop$5; - sagaMonitor.effectCancelled = sagaMonitor.effectCancelled || noop$5; - sagaMonitor.actionDispatched = sagaMonitor.actionDispatched || noop$5; + sagaMonitor.rootSagaStarted = sagaMonitor.rootSagaStarted || noop$4; + sagaMonitor.effectTriggered = sagaMonitor.effectTriggered || noop$4; + sagaMonitor.effectResolved = sagaMonitor.effectResolved || noop$4; + sagaMonitor.effectRejected = sagaMonitor.effectRejected || noop$4; + sagaMonitor.effectCancelled = sagaMonitor.effectCancelled || noop$4; + sagaMonitor.actionDispatched = sagaMonitor.actionDispatched || noop$4; sagaMonitor.rootSagaStarted({ effectId: effectId, saga: saga, @@ -27704,7 +27836,7 @@ function runSaga(_ref, saga) { var finalizeRunEffect; if (effectMiddlewares) { - var middleware = compose$1.apply(void 0, effectMiddlewares); + var middleware = compose.apply(void 0, effectMiddlewares); finalizeRunEffect = function finalizeRunEffect(runEffect) { return function (effect, effectId, currCb) { @@ -27758,7 +27890,7 @@ function sagaMiddlewareFactory(_temp) { function sagaMiddleware(_ref2) { var getState = _ref2.getState, dispatch = _ref2.dispatch; - boundRunSaga = runSaga.bind(null, _extends$m({}, options, { + boundRunSaga = runSaga.bind(null, _extends$l({}, options, { context: context, channel: channel, dispatch: dispatch, @@ -27871,7 +28003,7 @@ var createAdminStore = (function (_a) { trace: true, traceLimit: 25, })) || - compose$1; + compose; var store = createStore(resettableAppReducer, typeof initialState === 'function' ? initialState() : initialState, composeEnhancers(applyMiddleware(sagaMiddleware, routerMiddleware$1(history)))); sagaMiddleware.run(saga); return store; @@ -27879,7 +28011,7 @@ var createAdminStore = (function (_a) { var CoreAdminContext = function (_a) { var authProvider = _a.authProvider, dataProvider = _a.dataProvider, i18nProvider = _a.i18nProvider, children = _a.children, history = _a.history, customReducers = _a.customReducers, customSagas = _a.customSagas, initialState = _a.initialState; - var reduxIsAlreadyInitialized = !!React$v.useContext(ReactReduxContext); + var reduxIsAlreadyInitialized = !!React.useContext(ReactReduxContext); if (!dataProvider) { throw new Error("Missing dataProvider prop.\nReact-admin requires a valid dataProvider function to work."); } @@ -27895,7 +28027,7 @@ var CoreAdminContext = function (_a) { React__namespace.createElement(DataProviderContext$1.Provider, { value: finalDataProvider }, React__namespace.createElement(TranslationProvider$1, { i18nProvider: i18nProvider }, typeof window !== 'undefined' ? (React__namespace.createElement(ConnectedRouter, { history: finalHistory }, children)) : (children))))); }; - var store = React$v.useState(function () { + var store = React.useState(function () { return !reduxIsAlreadyInitialized ? createAdminStore({ authProvider: finalAuthProvider, @@ -27937,18 +28069,18 @@ var RoutesWithLayout = function (_a) { var firstChild = childrenAsArray.length > 0 ? childrenAsArray[0] : null; - return (React__default['default'].createElement(Switch$2, null, + return (React__default['default'].createElement(Switch, null, customRoutes && - customRoutes.map(function (route, key) { return React$v.cloneElement(route, { key: key }); }), - React$v.Children.map(children, function (child) { return (React__default['default'].createElement(Route, { key: child.props.name, path: "/" + child.props.name, render: function (props) { - return React$v.cloneElement(child, __assign$1d({ + customRoutes.map(function (route, key) { return React.cloneElement(route, { key: key }); }), + React.Children.map(children, function (child) { return (React__default['default'].createElement(Route, { key: child.props.name, path: "/" + child.props.name, render: function (props) { + return React.cloneElement(child, __assign$1d({ // The context prop instruct the Resource component to // render itself as a standard component intent: 'route' }, props)); } })); }), dashboard ? (React__default['default'].createElement(Route, { exact: true, path: "/", render: function (routeProps) { return (React__default['default'].createElement(WithPermissions$1, __assign$1d({ authParams: defaultAuthParams, component: dashboard }, routeProps))); } })) : firstChild ? (React__default['default'].createElement(Route, { exact: true, path: "/", render: function () { return React__default['default'].createElement(Redirect, { to: "/" + firstChild.props.name }); } })) : null, React__default['default'].createElement(Route, { render: function (routeProps) { - return React$v.createElement(catchAll, __assign$1d(__assign$1d({}, routeProps), { title: title })); + return React.createElement(catchAll, __assign$1d(__assign$1d({}, routeProps), { title: title })); } }))); }; var RoutesWithLayout$1 = RoutesWithLayout; @@ -27976,7 +28108,7 @@ var RoutesWithLayout$1 = RoutesWithLayout; */ var useScrollToTop = function () { var history = useHistory(); - React$v.useEffect(function () { + React.useEffect(function () { return history.listen(function (location, action) { var _a; if (action !== 'POP' && ((_a = location.state) === null || _a === void 0 ? void 0 : _a._scrollToTop) && @@ -28041,7 +28173,7 @@ var CoreAdminRouter = function (props) { var oneSecondHasPassed = useTimeout(1000); var _a = useSafeSetState([]), computedChildren = _a[0], setComputedChildren = _a[1]; useScrollToTop(); - React$v.useEffect(function () { + React.useEffect(function () { if (typeof props.children === 'function') { initializeResources(); } @@ -28082,7 +28214,7 @@ var CoreAdminRouter = function (props) { return route.props.render(__assign$1c(__assign$1c({}, routeProps), { title: props.title })); } if (route.props.component) { - return React$v.createElement(route.props.component, __assign$1c(__assign$1c({}, routeProps), { title: props.title })); + return React.createElement(route.props.component, __assign$1c(__assign$1c({}, routeProps), { title: props.title })); } }; var layout = props.layout, catchAll = props.catchAll, children = props.children, customRoutes = props.customRoutes, dashboard = props.dashboard, LoadingPage = props.loading, logout = props.logout, menu = props.menu, Ready = props.ready, theme = props.theme, title = props.title; @@ -28092,11 +28224,11 @@ var CoreAdminRouter = function (props) { if ((typeof children === 'function' && (!computedChildren || computedChildren.length === 0)) || (Array.isArray(children) && children.length === 0)) { - return (React__default['default'].createElement(Switch$2, null, + return (React__default['default'].createElement(Switch, null, customRoutes .filter(function (route) { return route.props.noLayout; }) .map(function (route, key) { - return React$v.cloneElement(route, { + return React.cloneElement(route, { key: key, render: function (routeProps) { return renderCustomRoutesWithoutLayout(route, routeProps); @@ -28112,19 +28244,19 @@ var CoreAdminRouter = function (props) { return (React__default['default'].createElement("div", null, // Render every resource children outside the React Router Switch // as we need all of them and not just the one rendered - React$v.Children.map(childrenToRender, function (child) { - return React$v.cloneElement(child, { + React.Children.map(childrenToRender, function (child) { + return React.cloneElement(child, { key: child.props.name, // The context prop instructs the Resource component to not render anything // but simply to register itself as a known resource intent: 'registration', }); }), - React__default['default'].createElement(Switch$2, null, + React__default['default'].createElement(Switch, null, customRoutes .filter(function (route) { return route.props.noLayout; }) .map(function (route, key) { - return React$v.cloneElement(route, { + return React.cloneElement(route, { key: key, render: function (routeProps) { return renderCustomRoutesWithoutLayout(route, routeProps); @@ -28133,14 +28265,14 @@ var CoreAdminRouter = function (props) { }); }), React__default['default'].createElement(Route, { path: "/", render: function () { - return React$v.createElement(layout, { + return React.createElement(layout, { dashboard: dashboard, logout: logout, menu: menu, theme: theme, title: title, - }, React__default['default'].createElement(RoutesWithLayout$1, { catchAll: catchAll, customRoutes: customRoutes.filter(function (route) { return !route.props.noLayout; }), dashboard: dashboard, title: title }, React$v.Children.map(childrenToRender, function (child) { - return React$v.cloneElement(child, { + }, React__default['default'].createElement(RoutesWithLayout$1, { catchAll: catchAll, customRoutes: customRoutes.filter(function (route) { return !route.props.noLayout; }), dashboard: dashboard, title: title }, React.Children.map(childrenToRender, function (child) { + return React.cloneElement(child, { key: child.props.name, intent: 'route', }); @@ -28171,10 +28303,10 @@ var CoreAdminUI = function (_a) { var _b = _a.catchAll, catchAll = _b === void 0 ? Noop : _b, children = _a.children, _c = _a.customRoutes, customRoutes = _c === void 0 ? [] : _c, dashboard = _a.dashboard, _d = _a.disableTelemetry, disableTelemetry = _d === void 0 ? false : _d, _e = _a.layout, layout = _e === void 0 ? DefaultLayout$1 : _e, _f = _a.loading, loading = _f === void 0 ? Noop : _f, _g = _a.loginPage, loginPage = _g === void 0 ? false : _g, logout = _a.logout, menu = _a.menu, // deprecated, use a custom layout instead _h = _a.ready, // deprecated, use a custom layout instead ready = _h === void 0 ? Ready : _h, theme = _a.theme, _j = _a.title, title = _j === void 0 ? 'React Admin' : _j; - var logoutElement = React$v.useMemo(function () { return logout && React$v.createElement(logout); }, [ + var logoutElement = React.useMemo(function () { return logout && React.createElement(logout); }, [ logout, ]); - React$v.useEffect(function () { + React.useEffect(function () { if (disableTelemetry || process.env.NODE_ENV !== 'production' || typeof window === 'undefined' || @@ -28185,9 +28317,9 @@ var CoreAdminUI = function (_a) { var img = new Image(); img.src = "https://react-admin-telemetry.marmelab.com/react-admin-telemetry?domain=" + window.location.hostname; }, [disableTelemetry]); - return (React__namespace.createElement(Switch$2, null, + return (React__namespace.createElement(Switch, null, loginPage !== false && loginPage !== true ? (React__namespace.createElement(Route, { exact: true, path: "/login", render: function (props) { - return React$v.createElement(loginPage, __assign$1b(__assign$1b({}, props), { title: title, + return React.createElement(loginPage, __assign$1b(__assign$1b({}, props), { title: title, theme: theme })); } })) : null, React__namespace.createElement(Route, { path: "/", render: function (props) { return (React__namespace.createElement(CoreAdminRouter$1, __assign$1b({ catchAll: catchAll, customRoutes: customRoutes, dashboard: dashboard, layout: layout, loading: loading, logout: logoutElement, menu: menu, ready: ready, theme: theme, title: title }, props), children)); } }))); @@ -28212,7 +28344,7 @@ var CoreAdminUI$1 = CoreAdminUI; * ); * }; */ -var ResourceContext$1 = React$v.createContext(undefined); +var ResourceContext$1 = React.createContext(undefined); var ResourceContextProvider = function (_a) { var children = _a.children, value = _a.value; @@ -28245,7 +28377,7 @@ var defaultOptions$1 = {}; var ResourceRegister = function (_a) { var name = _a.name, list = _a.list, create = _a.create, edit = _a.edit, show = _a.show, icon = _a.icon, _b = _a.options, options = _b === void 0 ? defaultOptions$1 : _b; var dispatch = useDispatch(); - React$v.useEffect(function () { + React.useEffect(function () { dispatch(registerResource({ name: name, options: options, @@ -28263,7 +28395,7 @@ var ResourceRoutes = function (_a) { var name = _a.name, match = _a.match, list = _a.list, create = _a.create, edit = _a.edit, show = _a.show, _b = _a.options, options = _b === void 0 ? defaultOptions$1 : _b; var isRegistered = useSelector(function (state) { return !!state.admin.resources[name]; }); var basePath = match ? match.path : ''; - var resourceData = React$v.useMemo(function () { return ({ + var resourceData = React.useMemo(function () { return ({ resource: name, options: options, hasList: !!list, @@ -28272,13 +28404,13 @@ var ResourceRoutes = function (_a) { hasCreate: !!create, }); }, [name, options, create, edit, list, show]); // match tends to change even on the same route ; using memo to avoid an extra render - return React$v.useMemo(function () { + return React.useMemo(function () { // if the registration hasn't finished, no need to render if (!isRegistered) { return null; } return (React__namespace.createElement(ResourceContextProvider, { value: name }, - React__namespace.createElement(Switch$2, null, + React__namespace.createElement(Switch, null, create && (React__namespace.createElement(Route, { path: basePath + "/create", render: function (routeProps) { return (React__namespace.createElement(WithPermissions$1, __assign$1a({ component: create, basePath: basePath }, routeProps, resourceData))); } })), show && (React__namespace.createElement(Route, { path: basePath + "/:id/show", render: function (routeProps) { return (React__namespace.createElement(WithPermissions$1, __assign$1a({ component: show, basePath: basePath, id: decodeURIComponent(routeProps.match .params.id) }, routeProps, resourceData))); } })), @@ -28326,7 +28458,7 @@ var Resource$2 = Resource$1; * @returns {ResourceContextValue} The resource name, e.g. 'posts' */ var useResourceContext = function (props) { - var context = React$v.useContext(ResourceContext$1); + var context = React.useContext(ResourceContext$1); return (props && props.resource) || context; }; @@ -28337,7 +28469,7 @@ var useResourceDefinition = function (props) { var resource = useResourceContext(props); var resources = useSelector(getResources); var hasCreate = props.hasCreate, hasEdit = props.hasEdit, hasList = props.hasList, hasShow = props.hasShow; - var definition = React$v.useMemo(function () { + var definition = React.useMemo(function () { var definitionFromRedux = resources.find(function (r) { return (r === null || r === void 0 ? void 0 : r.name) === resource; }); return defaults_1({}, { hasCreate: hasCreate, @@ -29286,7 +29418,7 @@ var fetchRelatedRecords$1 = fetchRelatedRecords; /* eslint-disable no-underscore-dangle */ /* @link http://stackoverflow.com/questions/46155/validate-email-address-in-javascript */ var EMAIL_REGEX = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; // eslint-disable-line no-useless-escape -var isEmpty$2 = function (value) { +var isEmpty$1 = function (value) { return typeof value === 'undefined' || value === null || value === '' || @@ -29313,7 +29445,7 @@ var getMessage = function (message, messageArgs, value, values) { // If we define validation functions directly in JSX, it will // result in a new function at every render, and then trigger infinite re-render. // Hence, we memoize every built-in validator to prevent a "Maximum call stack" error. -var memoize$2 = function (fn) { +var memoize$1 = function (fn) { return memoize_1(fn, function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { @@ -29322,7 +29454,7 @@ var memoize$2 = function (fn) { return JSON.stringify(args); }); }; -var isFunction$5 = function (value) { return typeof value === 'function'; }; +var isFunction$4 = function (value) { return typeof value === 'function'; }; var combine2Validators = function (validator1, validator2) { return function (value, values, meta) { var result1 = validator1(value, values, meta); @@ -29349,7 +29481,7 @@ var composeValidators = function () { } var allValidators = (Array.isArray(validators[0]) ? validators[0] - : validators).filter(isFunction$5); + : validators).filter(isFunction$4); return allValidators.reduce(combine2Validators, function () { return null; }); }; /** @@ -29364,10 +29496,10 @@ var composeValidators = function () { * const titleValidators = [required('The title is required')]; * */ -memoize$2(function (message) { +memoize$1(function (message) { if (message === void 0) { message = 'ra.validation.required'; } return Object.assign(function (value, values) { - return isEmpty$2(value) + return isEmpty$1(value) ? getMessage(message, undefined, value, values) : undefined; }, { isRequired: true }); @@ -29385,10 +29517,10 @@ memoize$2(function (message) { * const passwordValidators = [minLength(10, 'Should be at least 10 characters')]; * */ -memoize$2(function (min, message) { +memoize$1(function (min, message) { if (message === void 0) { message = 'ra.validation.minLength'; } return function (value, values) { - return !isEmpty$2(value) && value.length < min + return !isEmpty$1(value) && value.length < min ? getMessage(message, { min: min }, value, values) : undefined; }; @@ -29406,10 +29538,10 @@ memoize$2(function (min, message) { * const nameValidators = [maxLength(10, 'Should be at most 10 characters')]; * */ -memoize$2(function (max, message) { +memoize$1(function (max, message) { if (message === void 0) { message = 'ra.validation.maxLength'; } return function (value, values) { - return !isEmpty$2(value) && value.length > max + return !isEmpty$1(value) && value.length > max ? getMessage(message, { max: max }, value, values) : undefined; }; @@ -29427,10 +29559,10 @@ memoize$2(function (max, message) { * const fooValidators = [minValue(5, 'Should be more than 5')]; * */ -memoize$2(function (min, message) { +memoize$1(function (min, message) { if (message === void 0) { message = 'ra.validation.minValue'; } return function (value, values) { - return !isEmpty$2(value) && value < min + return !isEmpty$1(value) && value < min ? getMessage(message, { min: min }, value, values) : undefined; }; @@ -29448,10 +29580,10 @@ memoize$2(function (min, message) { * const fooValidators = [maxValue(10, 'Should be less than 10')]; * */ -memoize$2(function (max, message) { +memoize$1(function (max, message) { if (message === void 0) { message = 'ra.validation.maxValue'; } return function (value, values) { - return !isEmpty$2(value) && value > max + return !isEmpty$1(value) && value > max ? getMessage(message, { max: max }, value, values) : undefined; }; @@ -29468,10 +29600,10 @@ memoize$2(function (max, message) { * const ageValidators = [number('Must be a number')]; * */ -memoize$2(function (message) { +memoize$1(function (message) { if (message === void 0) { message = 'ra.validation.number'; } return function (value, values) { - return !isEmpty$2(value) && isNaN(Number(value)) + return !isEmpty$1(value) && isNaN(Number(value)) ? getMessage(message, undefined, value, values) : undefined; }; @@ -29492,7 +29624,7 @@ memoize$2(function (message) { var regex$1 = memoize_1(function (pattern, message) { if (message === void 0) { message = 'ra.validation.regex'; } return function (value, values) { - return !isEmpty$2(value) && typeof value === 'string' && !pattern.test(value) + return !isEmpty$1(value) && typeof value === 'string' && !pattern.test(value) ? getMessage(message, { pattern: pattern }, value, values) : undefined; }; @@ -29511,7 +29643,7 @@ var regex$1 = memoize_1(function (pattern, message) { * const emailValidators = [email('Must be an email')]; * */ -memoize$2(function (message) { +memoize$1(function (message) { if (message === void 0) { message = 'ra.validation.email'; } return regex$1(EMAIL_REGEX, message); }); @@ -29535,17 +29667,17 @@ var oneOfTypeMessage = function (_a) { * const genderValidators = [choices(['male', 'female'], 'Must be either Male or Female')]; * */ -memoize$2(function (list, message) { +memoize$1(function (list, message) { if (message === void 0) { message = oneOfTypeMessage; } return function (value, values) { - return !isEmpty$2(value) && list.indexOf(value) === -1 + return !isEmpty$1(value) && list.indexOf(value) === -1 ? getMessage(message, { list: list }, value, values) : undefined; }; }); -function _extends$k() { - _extends$k = Object.assign || function (target) { +function _extends$j() { + _extends$j = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; @@ -29559,7 +29691,7 @@ function _extends$k() { return target; }; - return _extends$k.apply(this, arguments); + return _extends$j.apply(this, arguments); } // @@ -29569,7 +29701,7 @@ function moveFieldState(state, source, destKey, oldState) { } delete state.fields[source.name]; - state.fields[destKey] = _extends$k({}, source, { + state.fields[destKey] = _extends$j({}, source, { name: destKey, // prevent functions from being overwritten // if the state.fields[destKey] does not exist, it will be created @@ -29612,7 +29744,7 @@ var insert = function insert(_ref, state, _ref2) { return copy; }); - var backup = _extends$k({}, state.fields); // now we have increment any higher indexes + var backup = _extends$j({}, state.fields); // now we have increment any higher indexes var pattern = new RegExp("^" + escapeRegexTokens(name) + "\\[(\\d+)\\](.*)"); // we need to increment high indices first so @@ -29658,7 +29790,7 @@ function moveFields(name, matchPrefix, destIndex, state) { // function restoreFunctions(state, backupState) { Object.keys(state.fields).forEach(function (key) { - state.fields[key] = _extends$k({}, state.fields[key], { + state.fields[key] = _extends$j({}, state.fields[key], { change: state.fields[key].change || backupState.fields[key] && backupState.fields[key].change, blur: state.fields[key].blur || backupState.fields[key] && backupState.fields[key].blur, focus: state.fields[key].focus || backupState.fields[key] && backupState.fields[key].focus @@ -29698,8 +29830,8 @@ var move = function move(_ref, state, _ref2) { return copy; }); //make a copy of a state for further functions restore - var backupState = _extends$k({}, state, { - fields: _extends$k({}, state.fields) // move this row to tmp index + var backupState = _extends$j({}, state, { + fields: _extends$j({}, state.fields) // move this row to tmp index }); @@ -29786,8 +29918,8 @@ var remove = function remove(_ref, state, _ref2) { var pattern = new RegExp("^" + escapeRegexTokens(name) + "\\[(\\d+)\\](.*)"); - var backup = _extends$k({}, state, { - fields: _extends$k({}, state.fields) + var backup = _extends$j({}, state, { + fields: _extends$j({}, state.fields) }); Object.keys(state.fields).forEach(function (key) { @@ -29858,7 +29990,7 @@ var removeBatch = function removeBatch(_ref, state, _ref2) { var pattern = new RegExp("^" + escapeRegexTokens(name) + "\\[(\\d+)\\](.*)"); - var newState = _extends$k({}, state, { + var newState = _extends$j({}, state, { fields: {} }); @@ -29884,7 +30016,7 @@ var removeBatch = function removeBatch(_ref, state, _ref2) { // -var shift$1 = function shift(_ref, state, tools) { +var shift = function shift(_ref, state, tools) { var name = _ref[0]; return remove([name, 0], state, tools); }; @@ -29909,8 +30041,8 @@ var swap = function swap(_ref, state, _ref2) { return copy; }); //make a copy of a state for further functions restore - var backupState = _extends$k({}, state, { - fields: _extends$k({}, state.fields) // swap all field state that begin with "name[indexA]" with that under "name[indexB]" + var backupState = _extends$j({}, state, { + fields: _extends$j({}, state.fields) // swap all field state that begin with "name[indexA]" with that under "name[indexB]" }); @@ -29932,7 +30064,7 @@ var unshift = function unshift(_ref, state, tools) { }; // -var update$3 = function update(_ref, state, _ref2) { +var update$2 = function update(_ref, state, _ref2) { var name = _ref[0], index = _ref[1], value = _ref[2]; @@ -29953,13 +30085,13 @@ var mutators = { push: push, remove: remove, removeBatch: removeBatch, - shift: shift$1, + shift: shift, swap: swap, unshift: unshift, - update: update$3 + update: update$2 }; -var FormContext = React$v.createContext(undefined); +var FormContext = React.createContext(undefined); var isRequired = function (validate) { if (validate && validate.isRequired) { @@ -29979,13 +30111,13 @@ var isRequired$1 = isRequired; * * This should only be used through a FormGroupContextProvider. */ -var FormGroupContext = React$v.createContext(undefined); +var FormGroupContext = React.createContext(undefined); /** * Retrieve the name of the form group the consumer belongs to. May be undefined if the consumer is not inside a form group. */ var useFormGroupContext = function () { - var context = React$v.useContext(FormGroupContext); + var context = React.useContext(FormGroupContext); return context; }; @@ -29993,7 +30125,7 @@ var useFormGroupContext = function () { * Retrieve the form context enabling consumers to alter its save function or to register inputs inside a form group. * @returns {FormContext} The form context. */ -var useFormContext = function () { return React$v.useContext(FormContext); }; +var useFormContext = function () { return React.useContext(FormContext); }; var __assign$11 = (undefined && undefined.__assign) || function () { __assign$11 = Object.assign || function(t) { @@ -30023,7 +30155,7 @@ var useInput = function (_a) { var formGroupName = useFormGroupContext(); var formContext = useFormContext(); var record = useRecordContext(); - React$v.useEffect(function () { + React.useEffect(function () { if (!formContext || !formGroupName) { return; } @@ -30040,19 +30172,19 @@ var useInput = function (_a) { // Extract the event handlers so that we can provide ours // allowing users to provide theirs without breaking the form var onBlur = input.onBlur, onChange = input.onChange, onFocus = input.onFocus, inputProps = __rest$X(input, ["onBlur", "onChange", "onFocus"]); - var handleBlur = React$v.useCallback(function (event) { + var handleBlur = React.useCallback(function (event) { onBlur(event); if (typeof customOnBlur === 'function') { customOnBlur(event); } }, [onBlur, customOnBlur]); - var handleChange = React$v.useCallback(function (event) { + var handleChange = React.useCallback(function (event) { onChange(event); if (typeof customOnChange === 'function') { customOnChange(event); } }, [onChange, customOnChange]); - var handleFocus = React$v.useCallback(function (event) { + var handleFocus = React.useCallback(function (event) { onFocus(event); if (typeof customOnFocus === 'function') { customOnFocus(event); @@ -30061,7 +30193,7 @@ var useInput = function (_a) { // Every time the record changes and didn't include a value for this field var form = useForm(); var recordId = record === null || record === void 0 ? void 0 : record.id; - React$v.useEffect(function () { + React.useEffect(function () { if (input.value != null && input.value !== '') { return; } @@ -30133,9 +30265,9 @@ var ValidationError$3 = ValidationError$2; var useChoices = function (_a) { var _b = _a.optionText, optionText = _b === void 0 ? 'name' : _b, _c = _a.optionValue, optionValue = _c === void 0 ? 'id' : _c, _d = _a.disableValue, disableValue = _d === void 0 ? 'disabled' : _d, _e = _a.translateChoice, translateChoice = _e === void 0 ? true : _e; var translate = useTranslate$1(); - var getChoiceText = React$v.useCallback(function (choice) { - if (React$v.isValidElement(optionText)) { - return React$v.cloneElement(optionText, { + var getChoiceText = React.useCallback(function (choice) { + if (React.isValidElement(optionText)) { + return React.cloneElement(optionText, { record: choice, }); } @@ -30146,10 +30278,10 @@ var useChoices = function (_a) { ? translate(choiceName, { _: choiceName }) : choiceName; }, [optionText, translate, translateChoice]); - var getChoiceValue = React$v.useCallback(function (choice) { return get_1(choice, optionValue); }, [ + var getChoiceValue = React.useCallback(function (choice) { return get_1(choice, optionValue); }, [ optionValue, ]); - var getDisableValue = React$v.useCallback(function (choice) { return get_1(choice, disableValue); }, [ + var getDisableValue = React.useCallback(function (choice) { return get_1(choice, disableValue); }, [ disableValue, ]); return { @@ -31154,14 +31286,14 @@ keysShim.shim = function shimObjectKeys() { var objectKeys$1 = keysShim; -var keys$8 = objectKeys$1; +var keys$7 = objectKeys$1; var hasSymbols = typeof Symbol === 'function' && typeof Symbol('foo') === 'symbol'; var toStr = Object.prototype.toString; var concat = Array.prototype.concat; var origDefineProperty = Object.defineProperty; -var isFunction$4 = function (fn) { +var isFunction$3 = function (fn) { return typeof fn === 'function' && toStr.call(fn) === '[object Function]'; }; @@ -31180,8 +31312,8 @@ var arePropertyDescriptorsSupported = function () { }; var supportsDescriptors = origDefineProperty && arePropertyDescriptorsSupported(); -var defineProperty$1 = function (object, name, value, predicate) { - if (name in object && (!isFunction$4(predicate) || !predicate())) { +var defineProperty = function (object, name, value, predicate) { + if (name in object && (!isFunction$3(predicate) || !predicate())) { return; } if (supportsDescriptors) { @@ -31198,12 +31330,12 @@ var defineProperty$1 = function (object, name, value, predicate) { var defineProperties = function (object, map) { var predicates = arguments.length > 2 ? arguments[2] : {}; - var props = keys$8(map); + var props = keys$7(map); if (hasSymbols) { props = concat.call(props, Object.getOwnPropertySymbols(map)); } for (var i = 0; i < props.length; i += 1) { - defineProperty$1(object, props[i], map[props[i]], predicates[props[i]]); + defineProperty(object, props[i], map[props[i]], predicates[props[i]]); } }; @@ -31815,42 +31947,126 @@ var classnames$1 = {exports: {}}; var classnames = classnames$1.exports; -function chainPropTypes(propType1, propType2) { - if (process.env.NODE_ENV === 'production') { - return function () { - return null; +var __assign$Z = (undefined && undefined.__assign) || function () { + __assign$Z = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; }; - } + return __assign$Z.apply(this, arguments); +}; +var __rest$W = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var useStyles$J = styles$2.makeStyles(function (theme) { return ({ + link: { + textDecoration: 'none', + color: theme.palette.primary.main, + }, +}); }, { name: 'RaLink' }); +var Link = function (props) { + var to = props.to, children = props.children; props.classes; var className = props.className, rest = __rest$W(props, ["to", "children", "classes", "className"]); + var classes = useStyles$J(props); + return (React__namespace.createElement(Link$2, __assign$Z({ to: to, className: classnames(classes.link, className) }, rest), children)); +}; +Link.propTypes = { + className: PropTypes.string, + children: PropTypes.node, + to: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), +}; +var Link$1 = Link; - return function validate() { - return propType1.apply(void 0, arguments) || propType2.apply(void 0, arguments); - }; -} +var defaultTheme = { + palette: { + secondary: { + light: '#6ec6ff', + main: '#2196f3', + dark: '#0069c0', + contrastText: '#fff', + }, + }, + typography: { + h6: { + fontWeight: 400, + }, + }, + sidebar: { + width: 240, + closedWidth: 55, + }, + overrides: { + MuiFilledInput: { + root: { + backgroundColor: 'rgba(0, 0, 0, 0.04)', + '&$disabled': { + backgroundColor: 'rgba(0, 0, 0, 0.04)', + }, + }, + }, + MuiButtonBase: { + root: { + '&:hover:active::after': { + // recreate a static ripple color + // use the currentColor to make it work both for outlined and contained buttons + // but to dim the background without dimming the text, + // put another element on top with a limited opacity + content: '""', + display: 'block', + width: '100%', + height: '100%', + position: 'absolute', + top: 0, + right: 0, + backgroundColor: 'currentColor', + opacity: 0.3, + borderRadius: 'inherit', + }, + }, + }, + }, + props: { + MuiButtonBase: { + // disable ripple for perf reasons + disableRipple: true, + }, + }, +}; -function _typeof$c(obj) { +function _typeof$b(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { - _typeof$c = function _typeof(obj) { + _typeof$b = function _typeof(obj) { return typeof obj; }; } else { - _typeof$c = function _typeof(obj) { + _typeof$b = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } - return _typeof$c(obj); + return _typeof$b(obj); } function isPlainObject$2(item) { - return item && _typeof$c(item) === 'object' && item.constructor === Object; + return item && _typeof$b(item) === 'object' && item.constructor === Object; } function deepmerge(target, source) { var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : { clone: true }; - var output = options.clone ? _extends$m({}, target) : target; + var output = options.clone ? _extends$l({}, target) : target; if (isPlainObject$2(target) && isPlainObject$2(source)) { Object.keys(source).forEach(function (key) { @@ -31870,87 +32086,6 @@ function deepmerge(target, source) { return output; } -function isClassComponent$1(elementType) { - // elementType.prototype?.isReactComponent - var _elementType$prototyp = elementType.prototype, - prototype = _elementType$prototyp === void 0 ? {} : _elementType$prototyp; - return Boolean(prototype.isReactComponent); -} - -function acceptingRef(props, propName, componentName, location, propFullName) { - var element = props[propName]; - var safePropName = propFullName || propName; - - if (element == null) { - return null; - } - - var warningHint; - var elementType = element.type; - /** - * Blacklisting instead of whitelisting - * - * Blacklisting will miss some components, such as React.Fragment. Those will at least - * trigger a warning in React. - * We can't whitelist because there is no safe way to detect React.forwardRef - * or class components. "Safe" means there's no public API. - * - */ - - if (typeof elementType === 'function' && !isClassComponent$1(elementType)) { - warningHint = 'Did you accidentally use a plain function component for an element instead?'; - } - - if (warningHint !== undefined) { - return new Error("Invalid ".concat(location, " `").concat(safePropName, "` supplied to `").concat(componentName, "`. ") + "Expected an element that can hold a ref. ".concat(warningHint, " ") + 'For more information see https://material-ui.com/r/caveat-with-refs-guide'); - } - - return null; -} - -var elementAcceptingRef = chainPropTypes(PropTypes.element, acceptingRef); -elementAcceptingRef.isRequired = chainPropTypes(PropTypes.element.isRequired, acceptingRef); -var elementAcceptingRef$1 = elementAcceptingRef; - -function isClassComponent(elementType) { - // elementType.prototype?.isReactComponent - var _elementType$prototyp = elementType.prototype, - prototype = _elementType$prototyp === void 0 ? {} : _elementType$prototyp; - return Boolean(prototype.isReactComponent); -} - -function elementTypeAcceptingRef(props, propName, componentName, location, propFullName) { - var propValue = props[propName]; - var safePropName = propFullName || propName; - - if (propValue == null) { - return null; - } - - var warningHint; - /** - * Blacklisting instead of whitelisting - * - * Blacklisting will miss some components, such as React.Fragment. Those will at least - * trigger a warning in React. - * We can't whitelist because there is no safe way to detect React.forwardRef - * or class components. "Safe" means there's no public API. - * - */ - - if (typeof propValue === 'function' && !isClassComponent(propValue)) { - warningHint = 'Did you accidentally provide a plain function component instead?'; - } - - if (warningHint !== undefined) { - return new Error("Invalid ".concat(location, " `").concat(safePropName, "` supplied to `").concat(componentName, "`. ") + "Expected an element type that can hold a ref. ".concat(warningHint, " ") + 'For more information see https://material-ui.com/r/caveat-with-refs-guide'); - } - - return null; -} - -var elementTypeAcceptingRef$1 = chainPropTypes(propTypes.exports.elementType, elementTypeAcceptingRef); - // This module is based on https://github.com/airbnb/prop-types-exact repository. // However, in order to reduce the number of dependencies and to remove some extra safe checks // the module was forked. @@ -31961,7 +32096,7 @@ function exactProp(propTypes) { return propTypes; } - return _extends$m({}, propTypes, _defineProperty$h({}, specialProperty, function (props) { + return _extends$l({}, propTypes, _defineProperty$h({}, specialProperty, function (props) { var unsupportedProps = Object.keys(props).filter(function (prop) { return !propTypes.hasOwnProperty(prop); }); @@ -31976,29 +32111,6 @@ function exactProp(propTypes) { })); } -/** - * WARNING: Don't import this directly. - * Use `MuiError` from `@material-ui/utils/macros/MuiError.macro` instead. - * @param {number} code - */ -function formatMuiErrorMessage(code) { - // Apply babel-plugin-transform-template-literals in loose mode - // loose mode is safe iff we're concatenating primitives - // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose - - /* eslint-disable prefer-template */ - var url = 'https://material-ui.com/production-error/?code=' + code; - - for (var i = 1; i < arguments.length; i += 1) { - // rest params over-transpile for this case - // eslint-disable-next-line prefer-rest-params - url += '&args[]=' + encodeURIComponent(arguments[i]); - } - - return 'Minified Material-UI error #' + code + '; visit ' + url + ' for the full message.'; - /* eslint-enable prefer-template */ -} - // https://github.com/JamesMGreene/Function.name/blob/58b314d4a983110c3682f1228f845d39ccca1817/Function.name.js#L3 var fnNameMatchRegex = /^\s*function(?:\s|\s*\/\*.*\*\/\s*)+([^(\s/]*)\s*/; @@ -32045,7 +32157,7 @@ function getDisplayName(Component) { return getFunctionComponentName(Component, 'Component'); } - if (_typeof$c(Component) === 'object') { + if (_typeof$b(Component) === 'object') { switch (Component.$$typeof) { case reactIs$1.exports.ForwardRef: return getWrappedName(Component, Component.render, 'ForwardRef'); @@ -32061,29875 +32173,4291 @@ function getDisplayName(Component) { return undefined; } -function HTMLElementType(props, propName, componentName, location, propFullName) { - if (process.env.NODE_ENV === 'production') { - return null; - } - - var propValue = props[propName]; - var safePropName = propFullName || propName; - - if (propValue == null) { - return null; - } - - if (propValue && propValue.nodeType !== 1) { - return new Error("Invalid ".concat(location, " `").concat(safePropName, "` supplied to `").concat(componentName, "`. ") + "Expected an HTMLElement."); - } - - return null; -} - -/* eslint-disable */ -// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 -var ponyfillGlobal = typeof window != 'undefined' && window.Math == Math ? window : typeof self != 'undefined' && self.Math == Math ? self : Function('return this')(); - -var refType = PropTypes.oneOfType([PropTypes.func, PropTypes.object]); -var refType$1 = refType; +var hasSymbol = typeof Symbol === 'function' && Symbol.for; +var nested = hasSymbol ? Symbol.for('mui.nested') : '__THEME_NESTED__'; -/** @license Material-UI v4.11.2 +/** + * This is the list of the style rule name we use as drop in replacement for the built-in + * pseudo classes (:checked, :disabled, :focused, etc.). * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. + * Why do they exist in the first place? + * These classes are used at a specificity of 2. + * It allows them to override previously definied styles as well as + * being untouched by simple user overrides. */ -var esm = /*#__PURE__*/Object.freeze({ - __proto__: null, - chainPropTypes: chainPropTypes, - deepmerge: deepmerge, - elementAcceptingRef: elementAcceptingRef$1, - elementTypeAcceptingRef: elementTypeAcceptingRef$1, - exactProp: exactProp, - formatMuiErrorMessage: formatMuiErrorMessage, - getDisplayName: getDisplayName, - HTMLElementType: HTMLElementType, - ponyfillGlobal: ponyfillGlobal, - refType: refType$1 -}); +var pseudoClasses = ['checked', 'disabled', 'error', 'focused', 'focusVisible', 'required', 'expanded', 'selected']; // Returns a function which generates unique class names based on counters. +// When new generator function is created, rule counter is reset. +// We need to reset the rule counter for SSR for each request. +// +// It's inspired by +// https://github.com/cssinjs/jss/blob/4e6a05dd3f7b6572fdd3ab216861d9e446c20331/src/utils/createGenerateClassName.js -/* eslint-disable no-use-before-define */ +function createGenerateClassName() { + var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; + var _options$disableGloba = options.disableGlobal, + disableGlobal = _options$disableGloba === void 0 ? false : _options$disableGloba, + _options$productionPr = options.productionPrefix, + productionPrefix = _options$productionPr === void 0 ? 'jss' : _options$productionPr, + _options$seed = options.seed, + seed = _options$seed === void 0 ? '' : _options$seed; + var seedPrefix = seed === '' ? '' : "".concat(seed, "-"); + var ruleCounter = 0; -/** - * Returns a number whose value is limited to the given range. - * - * @param {number} value The value to be clamped - * @param {number} min The lower boundary of the output range - * @param {number} max The upper boundary of the output range - * @returns {number} A number in the range [min, max] - */ -function clamp$2(value) { - var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0; - var max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; + var getNextCounterId = function getNextCounterId() { + ruleCounter += 1; - if (process.env.NODE_ENV !== 'production') { - if (value < min || value > max) { - console.error("Material-UI: The value provided ".concat(value, " is out of range [").concat(min, ", ").concat(max, "].")); + if (process.env.NODE_ENV !== 'production') { + if (ruleCounter >= 1e10) { + console.warn(['Material-UI: You might have a memory leak.', 'The ruleCounter is not supposed to grow that much.'].join('')); + } } - } - return Math.min(Math.max(min, value), max); -} -/** - * Converts a color from CSS hex format to CSS rgb format. - * - * @param {string} color - Hex color, i.e. #nnn or #nnnnnn - * @returns {string} A CSS rgb color string - */ + return ruleCounter; + }; + return function (rule, styleSheet) { + var name = styleSheet.options.name; // Is a global static MUI style? -function hexToRgb$1(color) { - color = color.substr(1); - var re = new RegExp(".{1,".concat(color.length >= 6 ? 2 : 1, "}"), 'g'); - var colors = color.match(re); + if (name && name.indexOf('Mui') === 0 && !styleSheet.options.link && !disableGlobal) { + // We can use a shorthand class name, we never use the keys to style the components. + if (pseudoClasses.indexOf(rule.key) !== -1) { + return "Mui-".concat(rule.key); + } - if (colors && colors[0].length === 1) { - colors = colors.map(function (n) { - return n + n; - }); - } + var prefix = "".concat(seedPrefix).concat(name, "-").concat(rule.key); - return colors ? "rgb".concat(colors.length === 4 ? 'a' : '', "(").concat(colors.map(function (n, index) { - return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000; - }).join(', '), ")") : ''; -} -/** - * Converts a color from hsl format to rgb format. - * - * @param {string} color - HSL color values - * @returns {string} rgb color values - */ + if (!styleSheet.options.theme[nested] || seed !== '') { + return prefix; + } -function hslToRgb$1(color) { - color = decomposeColor$1(color); - var _color = color, - values = _color.values; - var h = values[0]; - var s = values[1] / 100; - var l = values[2] / 100; - var a = s * Math.min(l, 1 - l); + return "".concat(prefix, "-").concat(getNextCounterId()); + } - var f = function f(n) { - var k = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (n + h / 30) % 12; - return l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1); - }; + if (process.env.NODE_ENV === 'production') { + return "".concat(seedPrefix).concat(productionPrefix).concat(getNextCounterId()); + } - var type = 'rgb'; - var rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)]; + var suffix = "".concat(rule.key, "-").concat(getNextCounterId()); // Help with debuggability. - if (color.type === 'hsla') { - type += 'a'; - rgb.push(values[3]); - } + if (styleSheet.options.classNamePrefix) { + return "".concat(seedPrefix).concat(styleSheet.options.classNamePrefix, "-").concat(suffix); + } - return recomposeColor$1({ - type: type, - values: rgb - }); + return "".concat(seedPrefix).concat(suffix); + }; } -/** - * Returns an object with the type and values of a color. - * - * Note: Does not support rgb % values. - * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @returns {object} - A MUI color object: {type: string, values: number[]} - */ -function decomposeColor$1(color) { - // Idempotent - if (color.type) { - return color; - } +var _typeof$a = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; - if (color.charAt(0) === '#') { - return decomposeColor$1(hexToRgb$1(color)); +var isBrowser = (typeof window === "undefined" ? "undefined" : _typeof$a(window)) === "object" && (typeof document === "undefined" ? "undefined" : _typeof$a(document)) === 'object' && document.nodeType === 9; + +function _defineProperties$9(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ("value" in descriptor) descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); } +} - var marker = color.indexOf('('); - var type = color.substring(0, marker); +function _createClass$9(Constructor, protoProps, staticProps) { + if (protoProps) _defineProperties$9(Constructor.prototype, protoProps); + if (staticProps) _defineProperties$9(Constructor, staticProps); + return Constructor; +} - if (['rgb', 'rgba', 'hsl', 'hsla'].indexOf(type) === -1) { - throw new Error(process.env.NODE_ENV !== "production" ? "Material-UI: Unsupported `".concat(color, "` color.\nWe support the following formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla().") : formatMuiErrorMessage(3, color)); +function _assertThisInitialized$9(self) { + if (self === void 0) { + throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } - var values = color.substring(marker + 1, color.length - 1).split(','); - values = values.map(function (value) { - return parseFloat(value); - }); - return { - type: type, - values: values - }; + return self; } -/** - * Converts a color object with type and values to a string. - * - * @param {object} color - Decomposed color - * @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla' - * @param {array} color.values - [n,n,n] or [n,n,n,n] - * @returns {string} A CSS color string - */ -function recomposeColor$1(color) { - var type = color.type; - var values = color.values; +var plainObjectConstrurctor = {}.constructor; +function cloneStyle(style) { + if (style == null || typeof style !== 'object') return style; + if (Array.isArray(style)) return style.map(cloneStyle); + if (style.constructor !== plainObjectConstrurctor) return style; + var newStyle = {}; - if (type.indexOf('rgb') !== -1) { - // Only convert the first 3 values to int (i.e. not alpha) - values = values.map(function (n, i) { - return i < 3 ? parseInt(n, 10) : n; - }); - } else if (type.indexOf('hsl') !== -1) { - values[1] = "".concat(values[1], "%"); - values[2] = "".concat(values[2], "%"); + for (var name in style) { + newStyle[name] = cloneStyle(style[name]); } - return "".concat(type, "(").concat(values.join(', '), ")"); + return newStyle; } -/** - * Calculates the contrast ratio between two colors. - * - * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests - * - * @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @returns {number} A contrast ratio value in the range 0 - 21. - */ -function getContrastRatio$1(foreground, background) { - var lumA = getLuminance$1(foreground); - var lumB = getLuminance$1(background); - return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05); -} /** - * The relative brightness of any point in a color space, - * normalized to 0 for darkest black and 1 for lightest white. - * - * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests - * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @returns {number} The relative brightness of the color in the range 0 - 1 + * Create a rule instance. */ -function getLuminance$1(color) { - color = decomposeColor$1(color); - var rgb = color.type === 'hsl' ? decomposeColor$1(hslToRgb$1(color)).values : color.values; - rgb = rgb.map(function (val) { - val /= 255; // normalized +function createRule(name, decl, options) { + if (name === void 0) { + name = 'unnamed'; + } - return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4); - }); // Truncate at 3 digits + var jss = options.jss; + var declCopy = cloneStyle(decl); + var rule = jss.plugins.onCreateRule(name, declCopy, options); + if (rule) return rule; // It is an at-rule and it has no instance. - return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3)); -} -/** - * Darken or lighten a color, depending on its luminance. - * Light colors are darkened, dark colors are lightened. - * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @param {number} coefficient=0.15 - multiplier in the range 0 - 1 - * @returns {string} A CSS color string. Hex input values are returned as rgb - */ + if (name[0] === '@') { + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Unknown rule " + name) : void 0; + } -function emphasize$1(color) { - var coefficient = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.15; - return getLuminance$1(color) > 0.5 ? darken$1(color, coefficient) : lighten$1(color, coefficient); + return null; } -/** - * Set the absolute transparency of a color. - * Any existing alpha value is overwritten. - * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @param {number} value - value to set the alpha channel to in the range 0-1 - * @returns {string} A CSS color string. Hex input values are returned as rgb - */ -function alpha$1(color, value) { - color = decomposeColor$1(color); - value = clamp$2(value); +var join = function join(value, by) { + var result = ''; - if (color.type === 'rgb' || color.type === 'hsl') { - color.type += 'a'; + for (var i = 0; i < value.length; i++) { + // Remove !important from the value, it will be readded later. + if (value[i] === '!important') break; + if (result) result += by; + result += value[i]; } - color.values[3] = value; - return recomposeColor$1(color); -} + return result; +}; + /** - * Darkens a color. + * Converts array values to string. * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @param {number} coefficient - multiplier in the range 0 - 1 - * @returns {string} A CSS color string. Hex input values are returned as rgb + * `margin: [['5px', '10px']]` > `margin: 5px 10px;` + * `border: ['1px', '2px']` > `border: 1px, 2px;` + * `margin: [['5px', '10px'], '!important']` > `margin: 5px 10px !important;` + * `color: ['red', !important]` > `color: red !important;` */ +var toCssValue = function toCssValue(value, ignoreImportant) { + if (ignoreImportant === void 0) { + ignoreImportant = false; + } -function darken$1(color, coefficient) { - color = decomposeColor$1(color); - coefficient = clamp$2(coefficient); + if (!Array.isArray(value)) return value; + var cssValue = ''; // Support space separated values via `[['5px', '10px']]`. - if (color.type.indexOf('hsl') !== -1) { - color.values[2] *= 1 - coefficient; - } else if (color.type.indexOf('rgb') !== -1) { - for (var i = 0; i < 3; i += 1) { - color.values[i] *= 1 - coefficient; + if (Array.isArray(value[0])) { + for (var i = 0; i < value.length; i++) { + if (value[i] === '!important') break; + if (cssValue) cssValue += ', '; + cssValue += join(value[i], ' '); } + } else cssValue = join(value, ', '); // Add !important, because it was ignored. + + + if (!ignoreImportant && value[value.length - 1] === '!important') { + cssValue += ' !important'; } - return recomposeColor$1(color); -} + return cssValue; +}; + /** - * Lightens a color. - * - * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla() - * @param {number} coefficient - multiplier in the range 0 - 1 - * @returns {string} A CSS color string. Hex input values are returned as rgb + * Indent a string. + * http://jsperf.com/array-join-vs-for */ +function indentStr(str, indent) { + var result = ''; -function lighten$1(color, coefficient) { - color = decomposeColor$1(color); - coefficient = clamp$2(coefficient); - - if (color.type.indexOf('hsl') !== -1) { - color.values[2] += (100 - color.values[2]) * coefficient; - } else if (color.type.indexOf('rgb') !== -1) { - for (var i = 0; i < 3; i += 1) { - color.values[i] += (255 - color.values[i]) * coefficient; - } + for (var index = 0; index < indent; index++) { + result += ' '; } - return recomposeColor$1(color); + return result + str; } +/** + * Converts a Rule to CSS string. + */ -function _objectWithoutProperties$a(source, excluded) { - if (source == null) return {}; - var target = _objectWithoutPropertiesLoose$b(source, excluded); - var key, i; - - if (Object.getOwnPropertySymbols) { - var sourceSymbolKeys = Object.getOwnPropertySymbols(source); - for (i = 0; i < sourceSymbolKeys.length; i++) { - key = sourceSymbolKeys[i]; - if (excluded.indexOf(key) >= 0) continue; - if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; - target[key] = source[key]; - } +function toCss(selector, style, options) { + if (options === void 0) { + options = {}; } - return target; -} - -// Sorted ASC by size. That's important. -// It can't be configured as it's used statically for propTypes. -var keys$7 = ['xs', 'sm', 'md', 'lg', 'xl']; // Keep in mind that @media is inclusive by the CSS specification. + var result = ''; + if (!style) return result; + var _options = options, + _options$indent = _options.indent, + indent = _options$indent === void 0 ? 0 : _options$indent; + var fallbacks = style.fallbacks; + if (selector) indent++; // Apply fallbacks first. -function createBreakpoints(breakpoints) { - var _breakpoints$values = breakpoints.values, - values = _breakpoints$values === void 0 ? { - xs: 0, - sm: 600, - md: 960, - lg: 1280, - xl: 1920 - } : _breakpoints$values, - _breakpoints$unit = breakpoints.unit, - unit = _breakpoints$unit === void 0 ? 'px' : _breakpoints$unit, - _breakpoints$step = breakpoints.step, - step = _breakpoints$step === void 0 ? 5 : _breakpoints$step, - other = _objectWithoutProperties$a(breakpoints, ["values", "unit", "step"]); + if (fallbacks) { + // Array syntax {fallbacks: [{prop: value}]} + if (Array.isArray(fallbacks)) { + for (var index = 0; index < fallbacks.length; index++) { + var fallback = fallbacks[index]; - function up(key) { - var value = typeof values[key] === 'number' ? values[key] : key; - return "@media (min-width:".concat(value).concat(unit, ")"); - } + for (var prop in fallback) { + var value = fallback[prop]; - function down(key) { - var endIndex = keys$7.indexOf(key) + 1; - var upperbound = values[keys$7[endIndex]]; + if (value != null) { + if (result) result += '\n'; + result += indentStr(prop + ": " + toCssValue(value) + ";", indent); + } + } + } + } else { + // Object syntax {fallbacks: {prop: value}} + for (var _prop in fallbacks) { + var _value = fallbacks[_prop]; - if (endIndex === keys$7.length) { - // xl down applies to all sizes - return up('xs'); + if (_value != null) { + if (result) result += '\n'; + result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent); + } + } } - - var value = typeof upperbound === 'number' && endIndex > 0 ? upperbound : key; - return "@media (max-width:".concat(value - step / 100).concat(unit, ")"); } - function between(start, end) { - var endIndex = keys$7.indexOf(end); + for (var _prop2 in style) { + var _value2 = style[_prop2]; - if (endIndex === keys$7.length - 1) { - return up(start); + if (_value2 != null && _prop2 !== 'fallbacks') { + if (result) result += '\n'; + result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent); } + } // Allow empty style in this case, because properties will be added dynamically. - return "@media (min-width:".concat(typeof values[start] === 'number' ? values[start] : start).concat(unit, ") and ") + "(max-width:".concat((endIndex !== -1 && typeof values[keys$7[endIndex + 1]] === 'number' ? values[keys$7[endIndex + 1]] : end) - step / 100).concat(unit, ")"); - } - function only(key) { - return between(key, key); - } + if (!result && !options.allowEmpty) return result; // When rule is being stringified before selector was defined. - var warnedOnce = false; + if (!selector) return result; + indent--; + if (result) result = "\n" + result + "\n"; + return indentStr(selector + " {" + result, indent) + indentStr('}', indent); +} - function width(key) { - if (process.env.NODE_ENV !== 'production') { - if (!warnedOnce) { - warnedOnce = true; - console.warn(["Material-UI: The `theme.breakpoints.width` utility is deprecated because it's redundant.", 'Use the `theme.breakpoints.values` instead.'].join('\n')); - } - } +var escapeRegex = /([[\].#*$><+~=|^:(),"'`\s])/g; +var nativeEscape = typeof CSS !== 'undefined' && CSS.escape; +var escape = (function (str) { + return nativeEscape ? nativeEscape(str) : str.replace(escapeRegex, '\\$1'); +}); - return values[key]; +var BaseStyleRule = +/*#__PURE__*/ +function () { + function BaseStyleRule(key, style, options) { + this.type = 'style'; + this.key = void 0; + this.isProcessed = false; + this.style = void 0; + this.renderer = void 0; + this.renderable = void 0; + this.options = void 0; + var sheet = options.sheet, + Renderer = options.Renderer; + this.key = key; + this.options = options; + this.style = style; + if (sheet) this.renderer = sheet.renderer;else if (Renderer) this.renderer = new Renderer(); } + /** + * Get or set a style property. + */ - return _extends$m({ - keys: keys$7, - values: values, - up: up, - down: down, - between: between, - only: only, - width: width - }, other); -} -function createMixins(breakpoints, spacing, mixins) { - var _toolbar; + var _proto = BaseStyleRule.prototype; - return _extends$m({ - gutters: function gutters() { - var styles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - console.warn(['Material-UI: theme.mixins.gutters() is deprecated.', 'You can use the source of the mixin directly:', "\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n [theme.breakpoints.up('sm')]: {\n paddingLeft: theme.spacing(3),\n paddingRight: theme.spacing(3),\n },\n "].join('\n')); - return _extends$m({ - paddingLeft: spacing(2), - paddingRight: spacing(2) - }, styles, _defineProperty$h({}, breakpoints.up('sm'), _extends$m({ - paddingLeft: spacing(3), - paddingRight: spacing(3) - }, styles[breakpoints.up('sm')]))); - }, - toolbar: (_toolbar = { - minHeight: 56 - }, _defineProperty$h(_toolbar, "".concat(breakpoints.up('xs'), " and (orientation: landscape)"), { - minHeight: 48 - }), _defineProperty$h(_toolbar, breakpoints.up('sm'), { - minHeight: 64 - }), _toolbar) - }, mixins); -} - -var common = { - black: '#000', - white: '#fff' -}; -var common$1 = common; - -var grey = { - 50: '#fafafa', - 100: '#f5f5f5', - 200: '#eeeeee', - 300: '#e0e0e0', - 400: '#bdbdbd', - 500: '#9e9e9e', - 600: '#757575', - 700: '#616161', - 800: '#424242', - 900: '#212121', - A100: '#d5d5d5', - A200: '#aaaaaa', - A400: '#303030', - A700: '#616161' -}; -var grey$1 = grey; - -var indigo = { - 50: '#e8eaf6', - 100: '#c5cae9', - 200: '#9fa8da', - 300: '#7986cb', - 400: '#5c6bc0', - 500: '#3f51b5', - 600: '#3949ab', - 700: '#303f9f', - 800: '#283593', - 900: '#1a237e', - A100: '#8c9eff', - A200: '#536dfe', - A400: '#3d5afe', - A700: '#304ffe' -}; -var indigo$1 = indigo; - -var pink = { - 50: '#fce4ec', - 100: '#f8bbd0', - 200: '#f48fb1', - 300: '#f06292', - 400: '#ec407a', - 500: '#e91e63', - 600: '#d81b60', - 700: '#c2185b', - 800: '#ad1457', - 900: '#880e4f', - A100: '#ff80ab', - A200: '#ff4081', - A400: '#f50057', - A700: '#c51162' -}; -var pink$1 = pink; - -var red = { - 50: '#ffebee', - 100: '#ffcdd2', - 200: '#ef9a9a', - 300: '#e57373', - 400: '#ef5350', - 500: '#f44336', - 600: '#e53935', - 700: '#d32f2f', - 800: '#c62828', - 900: '#b71c1c', - A100: '#ff8a80', - A200: '#ff5252', - A400: '#ff1744', - A700: '#d50000' -}; -var red$1 = red; - -var orange = { - 50: '#fff3e0', - 100: '#ffe0b2', - 200: '#ffcc80', - 300: '#ffb74d', - 400: '#ffa726', - 500: '#ff9800', - 600: '#fb8c00', - 700: '#f57c00', - 800: '#ef6c00', - 900: '#e65100', - A100: '#ffd180', - A200: '#ffab40', - A400: '#ff9100', - A700: '#ff6d00' -}; -var orange$1 = orange; - -var blue = { - 50: '#e3f2fd', - 100: '#bbdefb', - 200: '#90caf9', - 300: '#64b5f6', - 400: '#42a5f5', - 500: '#2196f3', - 600: '#1e88e5', - 700: '#1976d2', - 800: '#1565c0', - 900: '#0d47a1', - A100: '#82b1ff', - A200: '#448aff', - A400: '#2979ff', - A700: '#2962ff' -}; -var blue$1 = blue; - -var green = { - 50: '#e8f5e9', - 100: '#c8e6c9', - 200: '#a5d6a7', - 300: '#81c784', - 400: '#66bb6a', - 500: '#4caf50', - 600: '#43a047', - 700: '#388e3c', - 800: '#2e7d32', - 900: '#1b5e20', - A100: '#b9f6ca', - A200: '#69f0ae', - A400: '#00e676', - A700: '#00c853' -}; -var green$1 = green; - -var light = { - // The colors used to style the text. - text: { - // The most important text. - primary: 'rgba(0, 0, 0, 0.87)', - // Secondary text. - secondary: 'rgba(0, 0, 0, 0.54)', - // Disabled text have even lower visual prominence. - disabled: 'rgba(0, 0, 0, 0.38)', - // Text hints. - hint: 'rgba(0, 0, 0, 0.38)' - }, - // The color used to divide different elements. - divider: 'rgba(0, 0, 0, 0.12)', - // The background colors used to style the surfaces. - // Consistency between these values is important. - background: { - paper: common$1.white, - default: grey$1[50] - }, - // The colors used to style the action elements. - action: { - // The color of an active action like an icon button. - active: 'rgba(0, 0, 0, 0.54)', - // The color of an hovered action. - hover: 'rgba(0, 0, 0, 0.04)', - hoverOpacity: 0.04, - // The color of a selected action. - selected: 'rgba(0, 0, 0, 0.08)', - selectedOpacity: 0.08, - // The color of a disabled action. - disabled: 'rgba(0, 0, 0, 0.26)', - // The background color of a disabled action. - disabledBackground: 'rgba(0, 0, 0, 0.12)', - disabledOpacity: 0.38, - focus: 'rgba(0, 0, 0, 0.12)', - focusOpacity: 0.12, - activatedOpacity: 0.12 - } -}; -var dark = { - text: { - primary: common$1.white, - secondary: 'rgba(255, 255, 255, 0.7)', - disabled: 'rgba(255, 255, 255, 0.5)', - hint: 'rgba(255, 255, 255, 0.5)', - icon: 'rgba(255, 255, 255, 0.5)' - }, - divider: 'rgba(255, 255, 255, 0.12)', - background: { - paper: grey$1[800], - default: '#303030' - }, - action: { - active: common$1.white, - hover: 'rgba(255, 255, 255, 0.08)', - hoverOpacity: 0.08, - selected: 'rgba(255, 255, 255, 0.16)', - selectedOpacity: 0.16, - disabled: 'rgba(255, 255, 255, 0.3)', - disabledBackground: 'rgba(255, 255, 255, 0.12)', - disabledOpacity: 0.38, - focus: 'rgba(255, 255, 255, 0.12)', - focusOpacity: 0.12, - activatedOpacity: 0.24 - } -}; - -function addLightOrDark(intent, direction, shade, tonalOffset) { - var tonalOffsetLight = tonalOffset.light || tonalOffset; - var tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5; - - if (!intent[direction]) { - if (intent.hasOwnProperty(shade)) { - intent[direction] = intent[shade]; - } else if (direction === 'light') { - intent.light = lighten$1(intent.main, tonalOffsetLight); - } else if (direction === 'dark') { - intent.dark = darken$1(intent.main, tonalOffsetDark); - } - } -} - -function createPalette(palette) { - var _palette$primary = palette.primary, - primary = _palette$primary === void 0 ? { - light: indigo$1[300], - main: indigo$1[500], - dark: indigo$1[700] - } : _palette$primary, - _palette$secondary = palette.secondary, - secondary = _palette$secondary === void 0 ? { - light: pink$1.A200, - main: pink$1.A400, - dark: pink$1.A700 - } : _palette$secondary, - _palette$error = palette.error, - error = _palette$error === void 0 ? { - light: red$1[300], - main: red$1[500], - dark: red$1[700] - } : _palette$error, - _palette$warning = palette.warning, - warning = _palette$warning === void 0 ? { - light: orange$1[300], - main: orange$1[500], - dark: orange$1[700] - } : _palette$warning, - _palette$info = palette.info, - info = _palette$info === void 0 ? { - light: blue$1[300], - main: blue$1[500], - dark: blue$1[700] - } : _palette$info, - _palette$success = palette.success, - success = _palette$success === void 0 ? { - light: green$1[300], - main: green$1[500], - dark: green$1[700] - } : _palette$success, - _palette$type = palette.type, - type = _palette$type === void 0 ? 'light' : _palette$type, - _palette$contrastThre = palette.contrastThreshold, - contrastThreshold = _palette$contrastThre === void 0 ? 3 : _palette$contrastThre, - _palette$tonalOffset = palette.tonalOffset, - tonalOffset = _palette$tonalOffset === void 0 ? 0.2 : _palette$tonalOffset, - other = _objectWithoutProperties$a(palette, ["primary", "secondary", "error", "warning", "info", "success", "type", "contrastThreshold", "tonalOffset"]); // Use the same logic as - // Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59 - // and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54 - - - function getContrastText(background) { - var contrastText = getContrastRatio$1(background, dark.text.primary) >= contrastThreshold ? dark.text.primary : light.text.primary; + _proto.prop = function prop(name, value, options) { + // It's a getter. + if (value === undefined) return this.style[name]; // Don't do anything if the value has not changed. - if (process.env.NODE_ENV !== 'production') { - var contrast = getContrastRatio$1(background, contrastText); + var force = options ? options.force : false; + if (!force && this.style[name] === value) return this; + var newValue = value; - if (contrast < 3) { - console.error(["Material-UI: The contrast ratio of ".concat(contrast, ":1 for ").concat(contrastText, " on ").concat(background), 'falls below the WCAG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n')); - } + if (!options || options.process !== false) { + newValue = this.options.jss.plugins.onChangeValue(value, name, this); } - return contrastText; - } - - var augmentColor = function augmentColor(color) { - var mainShade = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 500; - var lightShade = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 300; - var darkShade = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 700; - color = _extends$m({}, color); + var isEmpty = newValue == null || newValue === false; + var isDefined = name in this.style; // Value is empty and wasn't defined before. - if (!color.main && color[mainShade]) { - color.main = color[mainShade]; - } + if (isEmpty && !isDefined && !force) return this; // We are going to remove this value. - if (!color.main) { - throw new Error(process.env.NODE_ENV !== "production" ? "Material-UI: The color provided to augmentColor(color) is invalid.\nThe color object needs to have a `main` property or a `".concat(mainShade, "` property.") : formatMuiErrorMessage(4, mainShade)); - } + var remove = isEmpty && isDefined; + if (remove) delete this.style[name];else this.style[name] = newValue; // Renderable is defined if StyleSheet option `link` is true. - if (typeof color.main !== 'string') { - throw new Error(process.env.NODE_ENV !== "production" ? "Material-UI: The color provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `".concat(JSON.stringify(color.main), "` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport {\xA0green } from \"@material-ui/core/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });") : formatMuiErrorMessage(5, JSON.stringify(color.main))); + if (this.renderable && this.renderer) { + if (remove) this.renderer.removeProperty(this.renderable, name);else this.renderer.setProperty(this.renderable, name, newValue); + return this; } - addLightOrDark(color, 'light', lightShade, tonalOffset); - addLightOrDark(color, 'dark', darkShade, tonalOffset); + var sheet = this.options.sheet; - if (!color.contrastText) { - color.contrastText = getContrastText(color.main); + if (sheet && sheet.attached) { + process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Rule is not linked. Missing sheet option "link: true".') : void 0; } - return color; - }; - - var types = { - dark: dark, - light: light + return this; }; - if (process.env.NODE_ENV !== 'production') { - if (!types[type]) { - console.error("Material-UI: The palette type `".concat(type, "` is not supported.")); - } - } + return BaseStyleRule; +}(); +var StyleRule = +/*#__PURE__*/ +function (_BaseStyleRule) { + _inheritsLoose(StyleRule, _BaseStyleRule); - var paletteOutput = deepmerge(_extends$m({ - // A collection of common colors. - common: common$1, - // The palette type, can be light or dark. - type: type, - // The colors used to represent primary interface elements for a user. - primary: augmentColor(primary), - // The colors used to represent secondary interface elements for a user. - secondary: augmentColor(secondary, 'A400', 'A200', 'A700'), - // The colors used to represent interface elements that the user should be made aware of. - error: augmentColor(error), - // The colors used to represent potentially dangerous actions or important messages. - warning: augmentColor(warning), - // The colors used to present information to the user that is neutral and not necessarily important. - info: augmentColor(info), - // The colors used to indicate the successful completion of an action that user triggered. - success: augmentColor(success), - // The grey colors. - grey: grey$1, - // Used by `getContrastText()` to maximize the contrast between - // the background and the text. - contrastThreshold: contrastThreshold, - // Takes a background color and returns the text color that maximizes the contrast. - getContrastText: getContrastText, - // Generate a rich color object. - augmentColor: augmentColor, - // Used by the functions below to shift a color's luminance by approximately - // two indexes within its tonal palette. - // E.g., shift from Red 500 to Red 300 or Red 700. - tonalOffset: tonalOffset - }, types[type]), other); - return paletteOutput; -} - -function round$1(value) { - return Math.round(value * 1e5) / 1e5; -} - -var warnedOnce$3 = false; - -function roundWithDeprecationWarning(value) { - if (process.env.NODE_ENV !== 'production') { - if (!warnedOnce$3) { - console.warn(['Material-UI: The `theme.typography.round` helper is deprecated.', 'Head to https://material-ui.com/r/migration-v4/#theme for a migration path.'].join('\n')); - warnedOnce$3 = true; - } - } - - return round$1(value); -} - -var caseAllCaps = { - textTransform: 'uppercase' -}; -var defaultFontFamily = '"Roboto", "Helvetica", "Arial", sans-serif'; -/** - * @see @link{https://material.io/design/typography/the-type-system.html} - * @see @link{https://material.io/design/typography/understanding-typography.html} - */ + function StyleRule(key, style, options) { + var _this; -function createTypography(palette, typography) { - var _ref = typeof typography === 'function' ? typography(palette) : typography, - _ref$fontFamily = _ref.fontFamily, - fontFamily = _ref$fontFamily === void 0 ? defaultFontFamily : _ref$fontFamily, - _ref$fontSize = _ref.fontSize, - fontSize = _ref$fontSize === void 0 ? 14 : _ref$fontSize, - _ref$fontWeightLight = _ref.fontWeightLight, - fontWeightLight = _ref$fontWeightLight === void 0 ? 300 : _ref$fontWeightLight, - _ref$fontWeightRegula = _ref.fontWeightRegular, - fontWeightRegular = _ref$fontWeightRegula === void 0 ? 400 : _ref$fontWeightRegula, - _ref$fontWeightMedium = _ref.fontWeightMedium, - fontWeightMedium = _ref$fontWeightMedium === void 0 ? 500 : _ref$fontWeightMedium, - _ref$fontWeightBold = _ref.fontWeightBold, - fontWeightBold = _ref$fontWeightBold === void 0 ? 700 : _ref$fontWeightBold, - _ref$htmlFontSize = _ref.htmlFontSize, - htmlFontSize = _ref$htmlFontSize === void 0 ? 16 : _ref$htmlFontSize, - allVariants = _ref.allVariants, - pxToRem2 = _ref.pxToRem, - other = _objectWithoutProperties$a(_ref, ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"]); + _this = _BaseStyleRule.call(this, key, style, options) || this; + _this.selectorText = void 0; + _this.id = void 0; + _this.renderable = void 0; + var selector = options.selector, + scoped = options.scoped, + sheet = options.sheet, + generateId = options.generateId; - if (process.env.NODE_ENV !== 'production') { - if (typeof fontSize !== 'number') { - console.error('Material-UI: `fontSize` is required to be a number.'); + if (selector) { + _this.selectorText = selector; + } else if (scoped !== false) { + _this.id = generateId(_assertThisInitialized$9(_assertThisInitialized$9(_this)), sheet); + _this.selectorText = "." + escape(_this.id); } - if (typeof htmlFontSize !== 'number') { - console.error('Material-UI: `htmlFontSize` is required to be a number.'); - } + return _this; } + /** + * Set selector string. + * Attention: use this with caution. Most browsers didn't implement + * selectorText setter, so this may result in rerendering of entire Style Sheet. + */ - var coef = fontSize / 14; - - var pxToRem = pxToRem2 || function (size) { - return "".concat(size / htmlFontSize * coef, "rem"); - }; - - var buildVariant = function buildVariant(fontWeight, size, lineHeight, letterSpacing, casing) { - return _extends$m({ - fontFamily: fontFamily, - fontWeight: fontWeight, - fontSize: pxToRem(size), - // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/ - lineHeight: lineHeight - }, fontFamily === defaultFontFamily ? { - letterSpacing: "".concat(round$1(letterSpacing / size), "em") - } : {}, casing, allVariants); - }; - - var variants = { - h1: buildVariant(fontWeightLight, 96, 1.167, -1.5), - h2: buildVariant(fontWeightLight, 60, 1.2, -0.5), - h3: buildVariant(fontWeightRegular, 48, 1.167, 0), - h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25), - h5: buildVariant(fontWeightRegular, 24, 1.334, 0), - h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15), - subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15), - subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1), - body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15), - body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15), - button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps), - caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4), - overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps) - }; - return deepmerge(_extends$m({ - htmlFontSize: htmlFontSize, - pxToRem: pxToRem, - round: roundWithDeprecationWarning, - // TODO v5: remove - fontFamily: fontFamily, - fontSize: fontSize, - fontWeightLight: fontWeightLight, - fontWeightRegular: fontWeightRegular, - fontWeightMedium: fontWeightMedium, - fontWeightBold: fontWeightBold - }, variants), other, { - clone: false // No need to clone deep - - }); -} -var shadowKeyUmbraOpacity = 0.2; -var shadowKeyPenumbraOpacity = 0.14; -var shadowAmbientShadowOpacity = 0.12; + var _proto2 = StyleRule.prototype; -function createShadow() { - return ["".concat(arguments.length <= 0 ? undefined : arguments[0], "px ").concat(arguments.length <= 1 ? undefined : arguments[1], "px ").concat(arguments.length <= 2 ? undefined : arguments[2], "px ").concat(arguments.length <= 3 ? undefined : arguments[3], "px rgba(0,0,0,").concat(shadowKeyUmbraOpacity, ")"), "".concat(arguments.length <= 4 ? undefined : arguments[4], "px ").concat(arguments.length <= 5 ? undefined : arguments[5], "px ").concat(arguments.length <= 6 ? undefined : arguments[6], "px ").concat(arguments.length <= 7 ? undefined : arguments[7], "px rgba(0,0,0,").concat(shadowKeyPenumbraOpacity, ")"), "".concat(arguments.length <= 8 ? undefined : arguments[8], "px ").concat(arguments.length <= 9 ? undefined : arguments[9], "px ").concat(arguments.length <= 10 ? undefined : arguments[10], "px ").concat(arguments.length <= 11 ? undefined : arguments[11], "px rgba(0,0,0,").concat(shadowAmbientShadowOpacity, ")")].join(','); -} // Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss + /** + * Apply rule to an element inline. + */ + _proto2.applyTo = function applyTo(renderable) { + var renderer = this.renderer; + if (renderer) { + var json = this.toJSON(); -var shadows$1 = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)]; -var shadows$2 = shadows$1; + for (var prop in json) { + renderer.setProperty(renderable, prop, json[prop]); + } + } -var shape = { - borderRadius: 4 -}; -var shape$1 = shape; + return this; + } + /** + * Returns JSON representation of the rule. + * Fallbacks are not supported. + * Useful for inline styles. + */ + ; -var responsivePropType = process.env.NODE_ENV !== 'production' ? PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.array]) : {}; -var responsivePropType$1 = responsivePropType; + _proto2.toJSON = function toJSON() { + var json = {}; -function _arrayLikeToArray(arr, len) { - if (len == null || len > arr.length) len = arr.length; + for (var prop in this.style) { + var value = this.style[prop]; + if (typeof value !== 'object') json[prop] = value;else if (Array.isArray(value)) json[prop] = toCssValue(value); + } - for (var i = 0, arr2 = new Array(len); i < len; i++) { - arr2[i] = arr[i]; + return json; } + /** + * Generates a CSS string. + */ + ; - return arr2; -} - -function _arrayWithoutHoles$5(arr) { - if (Array.isArray(arr)) return _arrayLikeToArray(arr); -} - -function _iterableToArray$5(iter) { - if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); -} + _proto2.toString = function toString(options) { + var sheet = this.options.sheet; + var link = sheet ? sheet.options.link : false; + var opts = link ? _extends$l({}, options, { + allowEmpty: true + }) : options; + return toCss(this.selectorText, this.style, opts); + }; -function _unsupportedIterableToArray(o, minLen) { - if (!o) return; - if (typeof o === "string") return _arrayLikeToArray(o, minLen); - var n = Object.prototype.toString.call(o).slice(8, -1); - if (n === "Object" && o.constructor) n = o.constructor.name; - if (n === "Map" || n === "Set") return Array.from(o); - if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); -} + _createClass$9(StyleRule, [{ + key: "selector", + set: function set(selector) { + if (selector === this.selectorText) return; + this.selectorText = selector; + var renderer = this.renderer, + renderable = this.renderable; + if (!renderable || !renderer) return; + var hasChanged = renderer.setSelector(renderable, selector); // If selector setter is not implemented, rerender the rule. -function _nonIterableSpread$5() { - throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); -} + if (!hasChanged) { + renderer.replaceRule(renderable, this); + } + } + /** + * Get selector string. + */ + , + get: function get() { + return this.selectorText; + } + }]); -function _toConsumableArray$5(arr) { - return _arrayWithoutHoles$5(arr) || _iterableToArray$5(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread$5(); -} + return StyleRule; +}(BaseStyleRule); +var pluginStyleRule = { + onCreateRule: function onCreateRule(name, style, options) { + if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') { + return null; + } -function merge(acc, item) { - if (!item) { - return acc; + return new StyleRule(name, style, options); } +}; - return deepmerge(acc, item, { - clone: false // No need to clone deep, it's way faster. +var defaultToStringOptions = { + indent: 1, + children: true +}; +var atRegExp = /@([\w-]+)/; +/** + * Conditional rule for @media, @supports + */ - }); -} +var ConditionalRule = +/*#__PURE__*/ +function () { + function ConditionalRule(key, styles, options) { + this.type = 'conditional'; + this.at = void 0; + this.key = void 0; + this.query = void 0; + this.rules = void 0; + this.options = void 0; + this.isProcessed = false; + this.renderable = void 0; + this.key = key; + var atMatch = key.match(atRegExp); + this.at = atMatch ? atMatch[1] : 'unknown'; // Key might contain a unique suffix in case the `name` passed by user was duplicate. -// For instance with the first breakpoint xs: [xs, sm[. + this.query = options.name || "@" + this.at; + this.options = options; + this.rules = new RuleList(_extends$l({}, options, { + parent: this + })); -var values$1 = { - xs: 0, - sm: 600, - md: 960, - lg: 1280, - xl: 1920 -}; -var defaultBreakpoints = { - // Sorted ASC by size. That's important. - // It can't be configured as it's used statically for propTypes. - keys: ['xs', 'sm', 'md', 'lg', 'xl'], - up: function up(key) { - return "@media (min-width:".concat(values$1[key], "px)"); - } -}; -function handleBreakpoints(props, propValue, styleFromPropValue) { - if (process.env.NODE_ENV !== 'production') { - if (!props.theme) { - console.error('Material-UI: You are calling a style function without a theme value.'); + for (var name in styles) { + this.rules.add(name, styles[name]); } - } - if (Array.isArray(propValue)) { - var themeBreakpoints = props.theme.breakpoints || defaultBreakpoints; - return propValue.reduce(function (acc, item, index) { - acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]); - return acc; - }, {}); + this.rules.process(); } + /** + * Get a rule. + */ - if (_typeof$c(propValue) === 'object') { - var _themeBreakpoints = props.theme.breakpoints || defaultBreakpoints; - - return Object.keys(propValue).reduce(function (acc, breakpoint) { - acc[_themeBreakpoints.up(breakpoint)] = styleFromPropValue(propValue[breakpoint]); - return acc; - }, {}); - } - var output = styleFromPropValue(propValue); - return output; -} + var _proto = ConditionalRule.prototype; -function getPath$1(obj, path) { - if (!path || typeof path !== 'string') { - return null; + _proto.getRule = function getRule(name) { + return this.rules.get(name); } + /** + * Get index of a rule. + */ + ; - return path.split('.').reduce(function (acc, item) { - return acc && acc[item] ? acc[item] : null; - }, obj); -} + _proto.indexOf = function indexOf(rule) { + return this.rules.indexOf(rule); + } + /** + * Create and register rule, run plugins. + */ + ; -function style$1(options) { - var prop = options.prop, - _options$cssProperty = options.cssProperty, - cssProperty = _options$cssProperty === void 0 ? options.prop : _options$cssProperty, - themeKey = options.themeKey, - transform = options.transform; + _proto.addRule = function addRule(name, style, options) { + var rule = this.rules.add(name, style, options); + if (!rule) return null; + this.options.jss.plugins.onProcessRule(rule); + return rule; + } + /** + * Generates a CSS string. + */ + ; - var fn = function fn(props) { - if (props[prop] == null) { - return null; + _proto.toString = function toString(options) { + if (options === void 0) { + options = defaultToStringOptions; } - var propValue = props[prop]; - var theme = props.theme; - var themeMapping = getPath$1(theme, themeKey) || {}; - - var styleFromPropValue = function styleFromPropValue(propValueFinal) { - var value; - - if (typeof themeMapping === 'function') { - value = themeMapping(propValueFinal); - } else if (Array.isArray(themeMapping)) { - value = themeMapping[propValueFinal] || propValueFinal; - } else { - value = getPath$1(themeMapping, propValueFinal) || propValueFinal; - - if (transform) { - value = transform(value); - } - } - - if (cssProperty === false) { - return value; - } + if (options.indent == null) options.indent = defaultToStringOptions.indent; + if (options.children == null) options.children = defaultToStringOptions.children; - return _defineProperty$h({}, cssProperty, value); - }; + if (options.children === false) { + return this.query + " {}"; + } - return handleBreakpoints(props, propValue, styleFromPropValue); + var children = this.rules.toString(options); + return children ? this.query + " {\n" + children + "\n}" : ''; }; - fn.propTypes = process.env.NODE_ENV !== 'production' ? _defineProperty$h({}, prop, responsivePropType$1) : {}; - fn.filterProps = [prop]; - return fn; -} - -function compose() { - for (var _len = arguments.length, styles = new Array(_len), _key = 0; _key < _len; _key++) { - styles[_key] = arguments[_key]; + return ConditionalRule; +}(); +var keyRegExp = /@media|@supports\s+/; +var pluginConditionalRule = { + onCreateRule: function onCreateRule(key, styles, options) { + return keyRegExp.test(key) ? new ConditionalRule(key, styles, options) : null; } +}; - var fn = function fn(props) { - return styles.reduce(function (acc, style) { - var output = style(props); +var defaultToStringOptions$1 = { + indent: 1, + children: true +}; +var nameRegExp = /@keyframes\s+([\w-]+)/; +/** + * Rule for @keyframes + */ - if (output) { - return merge(acc, output); - } +var KeyframesRule = +/*#__PURE__*/ +function () { + function KeyframesRule(key, frames, options) { + this.type = 'keyframes'; + this.at = '@keyframes'; + this.key = void 0; + this.name = void 0; + this.id = void 0; + this.rules = void 0; + this.options = void 0; + this.isProcessed = false; + this.renderable = void 0; + var nameMatch = key.match(nameRegExp); - return acc; - }, {}); - }; // Alternative approach that doesn't yield any performance gain. - // const handlers = styles.reduce((acc, style) => { - // style.filterProps.forEach(prop => { - // acc[prop] = style; - // }); - // return acc; - // }, {}); - // const fn = props => { - // return Object.keys(props).reduce((acc, prop) => { - // if (handlers[prop]) { - // return merge(acc, handlers[prop](props)); - // } - // return acc; - // }, {}); - // }; + if (nameMatch && nameMatch[1]) { + this.name = nameMatch[1]; + } else { + this.name = 'noname'; + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Bad keyframes name " + key) : void 0; + } + this.key = this.type + "-" + this.name; + this.options = options; + var scoped = options.scoped, + sheet = options.sheet, + generateId = options.generateId; + this.id = scoped === false ? this.name : escape(generateId(this, sheet)); + this.rules = new RuleList(_extends$l({}, options, { + parent: this + })); - fn.propTypes = process.env.NODE_ENV !== 'production' ? styles.reduce(function (acc, style) { - return _extends$m(acc, style.propTypes); - }, {}) : {}; - fn.filterProps = styles.reduce(function (acc, style) { - return acc.concat(style.filterProps); - }, []); - return fn; -} + for (var name in frames) { + this.rules.add(name, frames[name], _extends$l({}, options, { + parent: this + })); + } -function getBorder(value) { - if (typeof value !== 'number') { - return value; + this.rules.process(); } + /** + * Generates a CSS string. + */ - return "".concat(value, "px solid"); -} -var border = style$1({ - prop: 'border', - themeKey: 'borders', - transform: getBorder -}); -var borderTop = style$1({ - prop: 'borderTop', - themeKey: 'borders', - transform: getBorder -}); -var borderRight = style$1({ - prop: 'borderRight', - themeKey: 'borders', - transform: getBorder -}); -var borderBottom = style$1({ - prop: 'borderBottom', - themeKey: 'borders', - transform: getBorder -}); -var borderLeft = style$1({ - prop: 'borderLeft', - themeKey: 'borders', - transform: getBorder -}); -var borderColor = style$1({ - prop: 'borderColor', - themeKey: 'palette' -}); -var borderRadius = style$1({ - prop: 'borderRadius', - themeKey: 'shape' -}); -var borders = compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderRadius); -var borders$1 = borders; + var _proto = KeyframesRule.prototype; -function omit$1(input, fields) { - var output = {}; - Object.keys(input).forEach(function (prop) { - if (fields.indexOf(prop) === -1) { - output[prop] = input[prop]; + _proto.toString = function toString(options) { + if (options === void 0) { + options = defaultToStringOptions$1; } - }); - return output; -} - -var warnedOnce$2 = false; -function styleFunctionSx(styleFunction) { - var newStyleFunction = function newStyleFunction(props) { - var output = styleFunction(props); - - if (props.css) { - return _extends$m({}, merge(output, styleFunction(_extends$m({ - theme: props.theme - }, props.css))), omit$1(props.css, [styleFunction.filterProps])); - } + if (options.indent == null) options.indent = defaultToStringOptions$1.indent; + if (options.children == null) options.children = defaultToStringOptions$1.children; - if (props.sx) { - return _extends$m({}, merge(output, styleFunction(_extends$m({ - theme: props.theme - }, props.sx))), omit$1(props.sx, [styleFunction.filterProps])); + if (options.children === false) { + return this.at + " " + this.id + " {}"; } - return output; + var children = this.rules.toString(options); + if (children) children = "\n" + children + "\n"; + return this.at + " " + this.id + " {" + children + "}"; }; - newStyleFunction.propTypes = process.env.NODE_ENV !== 'production' ? _extends$m({}, styleFunction.propTypes, { - css: chainPropTypes(PropTypes.object, function (props) { - if (!warnedOnce$2 && props.css !== undefined) { - warnedOnce$2 = true; - return new Error('Material-UI: The `css` prop is deprecated, please use the `sx` prop instead.'); - } - - return null; - }), - sx: PropTypes.object - }) : {}; - newStyleFunction.filterProps = ['css', 'sx'].concat(_toConsumableArray$5(styleFunction.filterProps)); - return newStyleFunction; -} + return KeyframesRule; +}(); +var keyRegExp$1 = /@keyframes\s+/; +var refRegExp$1 = /\$([\w-]+)/g; -var displayPrint = style$1({ - prop: 'displayPrint', - cssProperty: false, - transform: function transform(value) { - return { - '@media print': { - display: value +var findReferencedKeyframe = function findReferencedKeyframe(val, keyframes) { + if (typeof val === 'string') { + return val.replace(refRegExp$1, function (match, name) { + if (name in keyframes) { + return keyframes[name]; } - }; - } -}); -var displayRaw = style$1({ - prop: 'display' -}); -var overflow = style$1({ - prop: 'overflow' -}); -var textOverflow = style$1({ - prop: 'textOverflow' -}); -var visibility = style$1({ - prop: 'visibility' -}); -var whiteSpace = style$1({ - prop: 'whiteSpace' -}); -var display = compose(displayPrint, displayRaw, overflow, textOverflow, visibility, whiteSpace); - -var flexBasis = style$1({ - prop: 'flexBasis' -}); -var flexDirection = style$1({ - prop: 'flexDirection' -}); -var flexWrap = style$1({ - prop: 'flexWrap' -}); -var justifyContent = style$1({ - prop: 'justifyContent' -}); -var alignItems = style$1({ - prop: 'alignItems' -}); -var alignContent = style$1({ - prop: 'alignContent' -}); -var order = style$1({ - prop: 'order' -}); -var flex = style$1({ - prop: 'flex' -}); -var flexGrow = style$1({ - prop: 'flexGrow' -}); -var flexShrink = style$1({ - prop: 'flexShrink' -}); -var alignSelf = style$1({ - prop: 'alignSelf' -}); -var justifyItems = style$1({ - prop: 'justifyItems' -}); -var justifySelf = style$1({ - prop: 'justifySelf' -}); -var flexbox = compose(flexBasis, flexDirection, flexWrap, justifyContent, alignItems, alignContent, order, flex, flexGrow, flexShrink, alignSelf, justifyItems, justifySelf); -var flexbox$1 = flexbox; - -var gridGap = style$1({ - prop: 'gridGap' -}); -var gridColumnGap = style$1({ - prop: 'gridColumnGap' -}); -var gridRowGap = style$1({ - prop: 'gridRowGap' -}); -var gridColumn = style$1({ - prop: 'gridColumn' -}); -var gridRow = style$1({ - prop: 'gridRow' -}); -var gridAutoFlow = style$1({ - prop: 'gridAutoFlow' -}); -var gridAutoColumns = style$1({ - prop: 'gridAutoColumns' -}); -var gridAutoRows = style$1({ - prop: 'gridAutoRows' -}); -var gridTemplateColumns = style$1({ - prop: 'gridTemplateColumns' -}); -var gridTemplateRows = style$1({ - prop: 'gridTemplateRows' -}); -var gridTemplateAreas = style$1({ - prop: 'gridTemplateAreas' -}); -var gridArea = style$1({ - prop: 'gridArea' -}); -var grid = compose(gridGap, gridColumnGap, gridRowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea); -var grid$1 = grid; -var color = style$1({ - prop: 'color', - themeKey: 'palette' -}); -var bgcolor = style$1({ - prop: 'bgcolor', - cssProperty: 'backgroundColor', - themeKey: 'palette' -}); -var palette = compose(color, bgcolor); -var palette$1 = palette; - -var position = style$1({ - prop: 'position' -}); -var zIndex$2 = style$1({ - prop: 'zIndex', - themeKey: 'zIndex' -}); -var top = style$1({ - prop: 'top' -}); -var right = style$1({ - prop: 'right' -}); -var bottom = style$1({ - prop: 'bottom' -}); -var left = style$1({ - prop: 'left' -}); -var positions = compose(position, zIndex$2, top, right, bottom, left); + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Referenced keyframes rule \"" + name + "\" is not defined.") : void 0; + return match; + }); + } -var boxShadow = style$1({ - prop: 'boxShadow', - themeKey: 'shadows' -}); -var shadows = boxShadow; + return val; +}; +/** + * Replace the reference for a animation name. + */ -function transform$1(value) { - return value <= 1 ? "".concat(value * 100, "%") : value; -} -var width = style$1({ - prop: 'width', - transform: transform$1 -}); -var maxWidth = style$1({ - prop: 'maxWidth', - transform: transform$1 -}); -var minWidth = style$1({ - prop: 'minWidth', - transform: transform$1 -}); -var height = style$1({ - prop: 'height', - transform: transform$1 -}); -var maxHeight = style$1({ - prop: 'maxHeight', - transform: transform$1 -}); -var minHeight = style$1({ - prop: 'minHeight', - transform: transform$1 -}); -style$1({ - prop: 'size', - cssProperty: 'width', - transform: transform$1 -}); -style$1({ - prop: 'size', - cssProperty: 'height', - transform: transform$1 -}); -var boxSizing = style$1({ - prop: 'boxSizing' -}); -var sizing = compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing); -var sizing$1 = sizing; +var replaceRef = function replaceRef(style, prop, keyframes) { + var value = style[prop]; + var refKeyframe = findReferencedKeyframe(value, keyframes); -function _arrayWithHoles(arr) { - if (Array.isArray(arr)) return arr; -} + if (refKeyframe !== value) { + style[prop] = refKeyframe; + } +}; -function _iterableToArrayLimit(arr, i) { - var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; +var plugin = { + onCreateRule: function onCreateRule(key, frames, options) { + return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null; + }, + // Animation name ref replacer. + onProcessStyle: function onProcessStyle(style, rule, sheet) { + if (rule.type !== 'style' || !sheet) return style; + if ('animation-name' in style) replaceRef(style, 'animation-name', sheet.keyframes); + if ('animation' in style) replaceRef(style, 'animation', sheet.keyframes); + return style; + }, + onChangeValue: function onChangeValue(val, prop, rule) { + var sheet = rule.options.sheet; - if (_i == null) return; - var _arr = []; - var _n = true; - var _d = false; + if (!sheet) { + return val; + } - var _s, _e; + switch (prop) { + case 'animation': + return findReferencedKeyframe(val, sheet.keyframes); - try { - for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { - _arr.push(_s.value); + case 'animation-name': + return findReferencedKeyframe(val, sheet.keyframes); - if (i && _arr.length === i) break; - } - } catch (err) { - _d = true; - _e = err; - } finally { - try { - if (!_n && _i["return"] != null) _i["return"](); - } finally { - if (_d) throw _e; + default: + return val; } } +}; - return _arr; -} - -function _nonIterableRest() { - throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); -} +var KeyframeRule = +/*#__PURE__*/ +function (_BaseStyleRule) { + _inheritsLoose(KeyframeRule, _BaseStyleRule); -function _slicedToArray(arr, i) { - return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); -} + function KeyframeRule() { + var _this; -function memoize$1(fn) { - var cache = {}; - return function (arg) { - if (cache[arg] === undefined) { - cache[arg] = fn(arg); + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; } - return cache[arg]; - }; -} - -var properties$3 = { - m: 'margin', - p: 'padding' -}; -var directions = { - t: 'Top', - r: 'Right', - b: 'Bottom', - l: 'Left', - x: ['Left', 'Right'], - y: ['Top', 'Bottom'] -}; -var aliases = { - marginX: 'mx', - marginY: 'my', - paddingX: 'px', - paddingY: 'py' -}; // memoize() impact: -// From 300,000 ops/sec -// To 350,000 ops/sec - -var getCssProperties = memoize$1(function (prop) { - // It's not a shorthand notation. - if (prop.length > 2) { - if (aliases[prop]) { - prop = aliases[prop]; - } else { - return [prop]; - } + _this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this; + _this.renderable = void 0; + return _this; } - var _prop$split = prop.split(''), - _prop$split2 = _slicedToArray(_prop$split, 2), - a = _prop$split2[0], - b = _prop$split2[1]; + var _proto = KeyframeRule.prototype; - var property = properties$3[a]; - var direction = directions[b] || ''; - return Array.isArray(direction) ? direction.map(function (dir) { - return property + dir; - }) : [property + direction]; -}); -var spacingKeys = ['m', 'mt', 'mr', 'mb', 'ml', 'mx', 'my', 'p', 'pt', 'pr', 'pb', 'pl', 'px', 'py', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'paddingX', 'paddingY']; -function createUnarySpacing(theme) { - var themeSpacing = theme.spacing || 8; + /** + * Generates a CSS string. + */ + _proto.toString = function toString(options) { + var sheet = this.options.sheet; + var link = sheet ? sheet.options.link : false; + var opts = link ? _extends$l({}, options, { + allowEmpty: true + }) : options; + return toCss(this.key, this.style, opts); + }; - if (typeof themeSpacing === 'number') { - return function (abs) { - if (process.env.NODE_ENV !== 'production') { - if (typeof abs !== 'number') { - console.error("Material-UI: Expected spacing argument to be a number, got ".concat(abs, ".")); - } - } + return KeyframeRule; +}(BaseStyleRule); +var pluginKeyframeRule = { + onCreateRule: function onCreateRule(key, style, options) { + if (options.parent && options.parent.type === 'keyframes') { + return new KeyframeRule(key, style, options); + } - return themeSpacing * abs; - }; + return null; } +}; - if (Array.isArray(themeSpacing)) { - return function (abs) { - if (process.env.NODE_ENV !== 'production') { - if (abs > themeSpacing.length - 1) { - console.error(["Material-UI: The value provided (".concat(abs, ") overflows."), "The supported values are: ".concat(JSON.stringify(themeSpacing), "."), "".concat(abs, " > ").concat(themeSpacing.length - 1, ", you need to add the missing values.")].join('\n')); - } - } - - return themeSpacing[abs]; - }; +var FontFaceRule = +/*#__PURE__*/ +function () { + function FontFaceRule(key, style, options) { + this.type = 'font-face'; + this.at = '@font-face'; + this.key = void 0; + this.style = void 0; + this.options = void 0; + this.isProcessed = false; + this.renderable = void 0; + this.key = key; + this.style = style; + this.options = options; } + /** + * Generates a CSS string. + */ - if (typeof themeSpacing === 'function') { - return themeSpacing; - } - if (process.env.NODE_ENV !== 'production') { - console.error(["Material-UI: The `theme.spacing` value (".concat(themeSpacing, ") is invalid."), 'It should be a number, an array or a function.'].join('\n')); - } + var _proto = FontFaceRule.prototype; - return function () { - return undefined; - }; -} + _proto.toString = function toString(options) { + if (Array.isArray(this.style)) { + var str = ''; -function getValue$1(transformer, propValue) { - if (typeof propValue === 'string' || propValue == null) { - return propValue; - } + for (var index = 0; index < this.style.length; index++) { + str += toCss(this.at, this.style[index]); + if (this.style[index + 1]) str += '\n'; + } - var abs = Math.abs(propValue); - var transformed = transformer(abs); + return str; + } - if (propValue >= 0) { - return transformed; - } + return toCss(this.at, this.style, options); + }; - if (typeof transformed === 'number') { - return -transformed; + return FontFaceRule; +}(); +var keyRegExp$2 = /@font-face/; +var pluginFontFaceRule = { + onCreateRule: function onCreateRule(key, style, options) { + return keyRegExp$2.test(key) ? new FontFaceRule(key, style, options) : null; } +}; - return "-".concat(transformed); -} - -function getStyleFromPropValue(cssProperties, transformer) { - return function (propValue) { - return cssProperties.reduce(function (acc, cssProperty) { - acc[cssProperty] = getValue$1(transformer, propValue); - return acc; - }, {}); - }; -} - -function spacing(props) { - var theme = props.theme; - var transformer = createUnarySpacing(theme); - return Object.keys(props).map(function (prop) { - // Using a hash computation over an array iteration could be faster, but with only 28 items, - // it's doesn't worth the bundle size. - if (spacingKeys.indexOf(prop) === -1) { - return null; - } +var ViewportRule = +/*#__PURE__*/ +function () { + function ViewportRule(key, style, options) { + this.type = 'viewport'; + this.at = '@viewport'; + this.key = void 0; + this.style = void 0; + this.options = void 0; + this.isProcessed = false; + this.renderable = void 0; + this.key = key; + this.style = style; + this.options = options; + } + /** + * Generates a CSS string. + */ - var cssProperties = getCssProperties(prop); - var styleFromPropValue = getStyleFromPropValue(cssProperties, transformer); - var propValue = props[prop]; - return handleBreakpoints(props, propValue, styleFromPropValue); - }).reduce(merge, {}); -} -spacing.propTypes = process.env.NODE_ENV !== 'production' ? spacingKeys.reduce(function (obj, key) { - obj[key] = responsivePropType$1; - return obj; -}, {}) : {}; -spacing.filterProps = spacingKeys; + var _proto = ViewportRule.prototype; -var fontFamily = style$1({ - prop: 'fontFamily', - themeKey: 'typography' -}); -var fontSize = style$1({ - prop: 'fontSize', - themeKey: 'typography' -}); -var fontStyle = style$1({ - prop: 'fontStyle', - themeKey: 'typography' -}); -var fontWeight = style$1({ - prop: 'fontWeight', - themeKey: 'typography' -}); -var letterSpacing = style$1({ - prop: 'letterSpacing' -}); -var lineHeight = style$1({ - prop: 'lineHeight' -}); -var textAlign = style$1({ - prop: 'textAlign' -}); -var typography = compose(fontFamily, fontSize, fontStyle, fontWeight, letterSpacing, lineHeight, textAlign); -var typography$1 = typography; + _proto.toString = function toString(options) { + return toCss(this.key, this.style, options); + }; -var warnOnce; -function createSpacing() { - var spacingInput = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 8; + return ViewportRule; +}(); +var pluginViewportRule = { + onCreateRule: function onCreateRule(key, style, options) { + return key === '@viewport' || key === '@-ms-viewport' ? new ViewportRule(key, style, options) : null; + } +}; - // Already transformed. - if (spacingInput.mui) { - return spacingInput; - } // Material Design layouts are visually balanced. Most measurements align to an 8dp grid applied, which aligns both spacing and the overall layout. - // Smaller components, such as icons and type, can align to a 4dp grid. - // https://material.io/design/layout/understanding-layout.html#usage +var SimpleRule = +/*#__PURE__*/ +function () { + function SimpleRule(key, value, options) { + this.type = 'simple'; + this.key = void 0; + this.value = void 0; + this.options = void 0; + this.isProcessed = false; + this.renderable = void 0; + this.key = key; + this.value = value; + this.options = options; + } + /** + * Generates a CSS string. + */ + // eslint-disable-next-line no-unused-vars - var transform = createUnarySpacing({ - spacing: spacingInput - }); + var _proto = SimpleRule.prototype; - var spacing = function spacing() { - for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } + _proto.toString = function toString(options) { + if (Array.isArray(this.value)) { + var str = ''; - if (process.env.NODE_ENV !== 'production') { - if (!(args.length <= 4)) { - console.error("Material-UI: Too many arguments provided, expected between 0 and 4, got ".concat(args.length)); + for (var index = 0; index < this.value.length; index++) { + str += this.key + " " + this.value[index] + ";"; + if (this.value[index + 1]) str += '\n'; } - } - if (args.length === 0) { - return transform(1); + return str; } - if (args.length === 1) { - return transform(args[0]); - } + return this.key + " " + this.value + ";"; + }; - return args.map(function (argument) { - if (typeof argument === 'string') { - return argument; - } + return SimpleRule; +}(); +var keysMap = { + '@charset': true, + '@import': true, + '@namespace': true +}; +var pluginSimpleRule = { + onCreateRule: function onCreateRule(key, value, options) { + return key in keysMap ? new SimpleRule(key, value, options) : null; + } +}; - var output = transform(argument); - return typeof output === 'number' ? "".concat(output, "px") : output; - }).join(' '); - }; // Backward compatibility, to remove in v5. +var plugins$1 = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule]; +var defaultUpdateOptions = { + process: true +}; +var forceUpdateOptions = { + force: true, + process: true + /** + * Contains rules objects and allows adding/removing etc. + * Is used for e.g. by `StyleSheet` or `ConditionalRule`. + */ - Object.defineProperty(spacing, 'unit', { - get: function get() { - if (process.env.NODE_ENV !== 'production') { - if (!warnOnce || process.env.NODE_ENV === 'test') { - console.error(['Material-UI: theme.spacing.unit usage has been deprecated.', 'It will be removed in v5.', 'You can replace `theme.spacing.unit * y` with `theme.spacing(y)`.', '', 'You can use the `https://github.com/mui-org/material-ui/tree/master/packages/material-ui-codemod/README.md#theme-spacing-api` migration helper to make the process smoother.'].join('\n')); - } +}; - warnOnce = true; - } +var RuleList = +/*#__PURE__*/ +function () { + // Rules registry for access by .get() method. + // It contains the same rule registered by name and by selector. + // Original styles object. + // Used to ensure correct rules order. + function RuleList(options) { + this.map = {}; + this.raw = {}; + this.index = []; + this.counter = 0; + this.options = void 0; + this.classes = void 0; + this.keyframes = void 0; + this.options = options; + this.classes = options.classes; + this.keyframes = options.keyframes; + } + /** + * Create and register rule. + * + * Will not render after Style Sheet was rendered the first time. + */ - return spacingInput; - } - }); - spacing.mui = true; - return spacing; -} - -// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves -// to learn the context in which each easing should be used. -var easing = { - // This is the most common easing curve. - easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)', - // Objects enter the screen at full velocity from off-screen and - // slowly decelerate to a resting point. - easeOut: 'cubic-bezier(0.0, 0, 0.2, 1)', - // Objects leave the screen at full velocity. They do not decelerate when off-screen. - easeIn: 'cubic-bezier(0.4, 0, 1, 1)', - // The sharp curve is used by objects that may return to the screen at any time. - sharp: 'cubic-bezier(0.4, 0, 0.6, 1)' -}; // Follow https://material.io/guidelines/motion/duration-easing.html#duration-easing-common-durations -// to learn when use what timing - -var duration = { - shortest: 150, - shorter: 200, - short: 250, - // most basic recommended timing - standard: 300, - // this is to be used in complex animations - complex: 375, - // recommended when something is entering screen - enteringScreen: 225, - // recommended when something is leaving screen - leavingScreen: 195 -}; - -function formatMs(milliseconds) { - return "".concat(Math.round(milliseconds), "ms"); -} -/** - * @param {string|Array} props - * @param {object} param - * @param {string} param.prop - * @param {number} param.duration - * @param {string} param.easing - * @param {number} param.delay - */ - - -var transitions = { - easing: easing, - duration: duration, - create: function create() { - var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ['all']; - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - var _options$duration = options.duration, - durationOption = _options$duration === void 0 ? duration.standard : _options$duration, - _options$easing = options.easing, - easingOption = _options$easing === void 0 ? easing.easeInOut : _options$easing, - _options$delay = options.delay, - delay = _options$delay === void 0 ? 0 : _options$delay, - other = _objectWithoutProperties$a(options, ["duration", "easing", "delay"]); + var _proto = RuleList.prototype; - if (process.env.NODE_ENV !== 'production') { - var isString = function isString(value) { - return typeof value === 'string'; - }; + _proto.add = function add(name, decl, ruleOptions) { + var _this$options = this.options, + parent = _this$options.parent, + sheet = _this$options.sheet, + jss = _this$options.jss, + Renderer = _this$options.Renderer, + generateId = _this$options.generateId, + scoped = _this$options.scoped; - var isNumber = function isNumber(value) { - return !isNaN(parseFloat(value)); - }; + var options = _extends$l({ + classes: this.classes, + parent: parent, + sheet: sheet, + jss: jss, + Renderer: Renderer, + generateId: generateId, + scoped: scoped, + name: name, + keyframes: this.keyframes, + selector: undefined + }, ruleOptions); // When user uses .createStyleSheet(), duplicate names are not possible, but + // `sheet.addRule()` opens the door for any duplicate rule name. When this happens + // we need to make the key unique within this RuleList instance scope. - if (!isString(props) && !Array.isArray(props)) { - console.error('Material-UI: Argument "props" must be a string or Array.'); - } - if (!isNumber(durationOption) && !isString(durationOption)) { - console.error("Material-UI: Argument \"duration\" must be a number or a string but found ".concat(durationOption, ".")); - } + var key = name; - if (!isString(easingOption)) { - console.error('Material-UI: Argument "easing" must be a string.'); - } + if (name in this.raw) { + key = name + "-d" + this.counter++; + } // We need to save the original decl before creating the rule + // because cache plugin needs to use it as a key to return a cached rule. - if (!isNumber(delay) && !isString(delay)) { - console.error('Material-UI: Argument "delay" must be a number or a string.'); - } - if (Object.keys(other).length !== 0) { - console.error("Material-UI: Unrecognized argument(s) [".concat(Object.keys(other).join(','), "].")); - } - } + this.raw[key] = decl; - return (Array.isArray(props) ? props : [props]).map(function (animatedProp) { - return "".concat(animatedProp, " ").concat(typeof durationOption === 'string' ? durationOption : formatMs(durationOption), " ").concat(easingOption, " ").concat(typeof delay === 'string' ? delay : formatMs(delay)); - }).join(','); - }, - getAutoHeightDuration: function getAutoHeightDuration(height) { - if (!height) { - return 0; + if (key in this.classes) { + // E.g. rules inside of @media container + options.selector = "." + escape(this.classes[key]); } - var constant = height / 36; // https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10 - - return Math.round((4 + 15 * Math.pow(constant, 0.25) + constant / 5) * 10); + var rule = createRule(key, decl, options); + if (!rule) return null; + this.register(rule); + var index = options.index === undefined ? this.index.length : options.index; + this.index.splice(index, 0, rule); + return rule; } -}; - -// We need to centralize the zIndex definitions as they work -// like global values in the browser. -var zIndex = { - mobileStepper: 1000, - speedDial: 1050, - appBar: 1100, - drawer: 1200, - modal: 1300, - snackbar: 1400, - tooltip: 1500 -}; -var zIndex$1 = zIndex; - -function createTheme() { - var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - - var _options$breakpoints = options.breakpoints, - breakpointsInput = _options$breakpoints === void 0 ? {} : _options$breakpoints, - _options$mixins = options.mixins, - mixinsInput = _options$mixins === void 0 ? {} : _options$mixins, - _options$palette = options.palette, - paletteInput = _options$palette === void 0 ? {} : _options$palette, - spacingInput = options.spacing, - _options$typography = options.typography, - typographyInput = _options$typography === void 0 ? {} : _options$typography, - other = _objectWithoutProperties$a(options, ["breakpoints", "mixins", "palette", "spacing", "typography"]); - - var palette = createPalette(paletteInput); - var breakpoints = createBreakpoints(breakpointsInput); - var spacing = createSpacing(spacingInput); - var muiTheme = deepmerge({ - breakpoints: breakpoints, - direction: 'ltr', - mixins: createMixins(breakpoints, spacing, mixinsInput), - overrides: {}, - // Inject custom styles - palette: palette, - props: {}, - // Provide default props - shadows: shadows$2, - typography: createTypography(palette, typographyInput), - spacing: spacing, - shape: shape$1, - transitions: transitions, - zIndex: zIndex$1 - }, other); + /** + * Get a rule. + */ + ; - for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; + _proto.get = function get(name) { + return this.map[name]; } + /** + * Delete a rule. + */ + ; - muiTheme = args.reduce(function (acc, argument) { - return deepmerge(acc, argument); - }, muiTheme); - - if (process.env.NODE_ENV !== 'production') { - var pseudoClasses = ['checked', 'disabled', 'error', 'focused', 'focusVisible', 'required', 'expanded', 'selected']; - - var traverse = function traverse(node, parentKey) { - var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; - var key; // eslint-disable-next-line guard-for-in, no-restricted-syntax - - for (key in node) { - var child = node[key]; - - if (depth === 1) { - if (key.indexOf('Mui') === 0 && child) { - traverse(child, key, depth + 1); - } - } else if (pseudoClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) { - if (process.env.NODE_ENV !== 'production') { - console.error(["Material-UI: The `".concat(parentKey, "` component increases ") + "the CSS specificity of the `".concat(key, "` internal state."), 'You can not override it like this: ', JSON.stringify(node, null, 2), '', 'Instead, you need to use the $ruleName syntax:', JSON.stringify({ - root: _defineProperty$h({}, "&$".concat(key), child) - }, null, 2), '', 'https://material-ui.com/r/pseudo-classes-guide'].join('\n')); - } // Remove the style to prevent global conflicts. + _proto.remove = function remove(rule) { + this.unregister(rule); + delete this.raw[rule.key]; + this.index.splice(this.index.indexOf(rule), 1); + } + /** + * Get index of a rule. + */ + ; + _proto.indexOf = function indexOf(rule) { + return this.index.indexOf(rule); + } + /** + * Run `onProcessRule()` plugins on every rule. + */ + ; - node[key] = {}; - } - } - }; + _proto.process = function process() { + var plugins = this.options.jss.plugins; // We need to clone array because if we modify the index somewhere else during a loop + // we end up with very hard-to-track-down side effects. - traverse(muiTheme.overrides); + this.index.slice(0).forEach(plugins.onProcessRule, plugins); } + /** + * Register a rule in `.map`, `.classes` and `.keyframes` maps. + */ + ; - return muiTheme; -} + _proto.register = function register(rule) { + this.map[rule.key] = rule; -var warnedOnce$1 = false; -function createMuiTheme$1() { - if (process.env.NODE_ENV !== 'production') { - if (!warnedOnce$1) { - warnedOnce$1 = true; - console.error(['Material-UI: the createMuiTheme function was renamed to createTheme.', '', "You should use `import { createTheme } from '@material-ui/core/styles'`"].join('\n')); + if (rule instanceof StyleRule) { + this.map[rule.selector] = rule; + if (rule.id) this.classes[rule.key] = rule.id; + } else if (rule instanceof KeyframesRule && this.keyframes) { + this.keyframes[rule.name] = rule.id; } } + /** + * Unregister a rule. + */ + ; - return createTheme.apply(void 0, arguments); -} + _proto.unregister = function unregister(rule) { + delete this.map[rule.key]; -function createMuiStrictModeTheme(options) { - for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; + if (rule instanceof StyleRule) { + delete this.map[rule.selector]; + delete this.classes[rule.key]; + } else if (rule instanceof KeyframesRule) { + delete this.keyframes[rule.name]; + } } + /** + * Update the function values with a new data. + */ + ; - return createTheme.apply(void 0, [deepmerge({ - unstable_strictMode: true - }, options)].concat(args)); -} - -var hasSymbol = typeof Symbol === 'function' && Symbol.for; -var nested = hasSymbol ? Symbol.for('mui.nested') : '__THEME_NESTED__'; - -/** - * This is the list of the style rule name we use as drop in replacement for the built-in - * pseudo classes (:checked, :disabled, :focused, etc.). - * - * Why do they exist in the first place? - * These classes are used at a specificity of 2. - * It allows them to override previously definied styles as well as - * being untouched by simple user overrides. - */ + _proto.update = function update() { + var name; + var data; + var options; -var pseudoClasses = ['checked', 'disabled', 'error', 'focused', 'focusVisible', 'required', 'expanded', 'selected']; // Returns a function which generates unique class names based on counters. -// When new generator function is created, rule counter is reset. -// We need to reset the rule counter for SSR for each request. -// -// It's inspired by -// https://github.com/cssinjs/jss/blob/4e6a05dd3f7b6572fdd3ab216861d9e446c20331/src/utils/createGenerateClassName.js + if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') { + name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index] -function createGenerateClassName() { - var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - var _options$disableGloba = options.disableGlobal, - disableGlobal = _options$disableGloba === void 0 ? false : _options$disableGloba, - _options$productionPr = options.productionPrefix, - productionPrefix = _options$productionPr === void 0 ? 'jss' : _options$productionPr, - _options$seed = options.seed, - seed = _options$seed === void 0 ? '' : _options$seed; - var seedPrefix = seed === '' ? '' : "".concat(seed, "-"); - var ruleCounter = 0; + data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index] - var getNextCounterId = function getNextCounterId() { - ruleCounter += 1; + options = arguments.length <= 2 ? undefined : arguments[2]; + } else { + data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index] - if (process.env.NODE_ENV !== 'production') { - if (ruleCounter >= 1e10) { - console.warn(['Material-UI: You might have a memory leak.', 'The ruleCounter is not supposed to grow that much.'].join('')); - } + options = arguments.length <= 1 ? undefined : arguments[1]; + name = null; } - return ruleCounter; - }; - - return function (rule, styleSheet) { - var name = styleSheet.options.name; // Is a global static MUI style? - - if (name && name.indexOf('Mui') === 0 && !styleSheet.options.link && !disableGlobal) { - // We can use a shorthand class name, we never use the keys to style the components. - if (pseudoClasses.indexOf(rule.key) !== -1) { - return "Mui-".concat(rule.key); - } - - var prefix = "".concat(seedPrefix).concat(name, "-").concat(rule.key); - - if (!styleSheet.options.theme[nested] || seed !== '') { - return prefix; + if (name) { + this.updateOne(this.map[name], data, options); + } else { + for (var index = 0; index < this.index.length; index++) { + this.updateOne(this.index[index], data, options); } - - return "".concat(prefix, "-").concat(getNextCounterId()); } + } + /** + * Execute plugins, update rule props. + */ + ; - if (process.env.NODE_ENV === 'production') { - return "".concat(seedPrefix).concat(productionPrefix).concat(getNextCounterId()); + _proto.updateOne = function updateOne(rule, data, options) { + if (options === void 0) { + options = defaultUpdateOptions; } - var suffix = "".concat(rule.key, "-").concat(getNextCounterId()); // Help with debuggability. + var _this$options2 = this.options, + plugins = _this$options2.jss.plugins, + sheet = _this$options2.sheet; // It is a rules container like for e.g. ConditionalRule. - if (styleSheet.options.classNamePrefix) { - return "".concat(seedPrefix).concat(styleSheet.options.classNamePrefix, "-").concat(suffix); + if (rule.rules instanceof RuleList) { + rule.rules.update(data, options); + return; } - return "".concat(seedPrefix).concat(suffix); - }; -} + var styleRule = rule; + var style = styleRule.style; + plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook. -function createStyles$1(styles) { - return styles; -} + if (options.process && style && style !== styleRule.style) { + // We need to run the plugins in case new `style` relies on syntax plugins. + plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props. -/* eslint-disable no-restricted-syntax */ -function getThemeProps(params) { - var theme = params.theme, - name = params.name, - props = params.props; + for (var prop in styleRule.style) { + var nextValue = styleRule.style[prop]; + var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule. + // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here. - if (!theme || !theme.props || !theme.props[name]) { - return props; - } // Resolve default props, code borrow from React source. - // https://github.com/facebook/react/blob/15a8f031838a553e41c0b66eb1bcf1da8448104d/packages/react/src/ReactElement.js#L221 + if (nextValue !== prevValue) { + styleRule.prop(prop, nextValue, forceUpdateOptions); + } + } // Remove props. - var defaultProps = theme.props[name]; - var propName; + for (var _prop in style) { + var _nextValue = styleRule.style[_prop]; + var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule. + // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here. - for (propName in defaultProps) { - if (props[propName] === undefined) { - props[propName] = defaultProps[propName]; + if (_nextValue == null && _nextValue !== _prevValue) { + styleRule.prop(_prop, null, forceUpdateOptions); + } + } } } + /** + * Convert rules to a CSS string. + */ + ; - return props; -} + _proto.toString = function toString(options) { + var str = ''; + var sheet = this.options.sheet; + var link = sheet ? sheet.options.link : false; -var _typeof$b = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; + for (var index = 0; index < this.index.length; index++) { + var rule = this.index[index]; + var css = rule.toString(options); // No need to render an empty rule. -var isBrowser$1 = (typeof window === "undefined" ? "undefined" : _typeof$b(window)) === "object" && (typeof document === "undefined" ? "undefined" : _typeof$b(document)) === 'object' && document.nodeType === 9; + if (!css && !link) continue; + if (str) str += '\n'; + str += css; + } -function _defineProperties$9(target, props) { - for (var i = 0; i < props.length; i++) { - var descriptor = props[i]; - descriptor.enumerable = descriptor.enumerable || false; - descriptor.configurable = true; - if ("value" in descriptor) descriptor.writable = true; - Object.defineProperty(target, descriptor.key, descriptor); - } -} + return str; + }; -function _createClass$9(Constructor, protoProps, staticProps) { - if (protoProps) _defineProperties$9(Constructor.prototype, protoProps); - if (staticProps) _defineProperties$9(Constructor, staticProps); - return Constructor; -} + return RuleList; +}(); -function _assertThisInitialized$9(self) { - if (self === void 0) { - throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); - } +var StyleSheet = +/*#__PURE__*/ +function () { + function StyleSheet(styles, options) { + this.options = void 0; + this.deployed = void 0; + this.attached = void 0; + this.rules = void 0; + this.renderer = void 0; + this.classes = void 0; + this.keyframes = void 0; + this.queue = void 0; + this.attached = false; + this.deployed = false; + this.classes = {}; + this.keyframes = {}; + this.options = _extends$l({}, options, { + sheet: this, + parent: this, + classes: this.classes, + keyframes: this.keyframes + }); - return self; -} + if (options.Renderer) { + this.renderer = new options.Renderer(this); + } -var plainObjectConstrurctor = {}.constructor; -function cloneStyle(style) { - if (style == null || typeof style !== 'object') return style; - if (Array.isArray(style)) return style.map(cloneStyle); - if (style.constructor !== plainObjectConstrurctor) return style; - var newStyle = {}; + this.rules = new RuleList(this.options); - for (var name in style) { - newStyle[name] = cloneStyle(style[name]); + for (var name in styles) { + this.rules.add(name, styles[name]); + } + + this.rules.process(); } + /** + * Attach renderable to the render tree. + */ - return newStyle; -} -/** - * Create a rule instance. - */ + var _proto = StyleSheet.prototype; -function createRule(name, decl, options) { - if (name === void 0) { - name = 'unnamed'; + _proto.attach = function attach() { + if (this.attached) return this; + if (this.renderer) this.renderer.attach(); + this.attached = true; // Order is important, because we can't use insertRule API if style element is not attached. + + if (!this.deployed) this.deploy(); + return this; } + /** + * Remove renderable from render tree. + */ + ; - var jss = options.jss; - var declCopy = cloneStyle(decl); - var rule = jss.plugins.onCreateRule(name, declCopy, options); - if (rule) return rule; // It is an at-rule and it has no instance. - - if (name[0] === '@') { - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Unknown rule " + name) : void 0; - } - - return null; -} - -var join = function join(value, by) { - var result = ''; - - for (var i = 0; i < value.length; i++) { - // Remove !important from the value, it will be readded later. - if (value[i] === '!important') break; - if (result) result += by; - result += value[i]; - } - - return result; -}; - -/** - * Converts array values to string. - * - * `margin: [['5px', '10px']]` > `margin: 5px 10px;` - * `border: ['1px', '2px']` > `border: 1px, 2px;` - * `margin: [['5px', '10px'], '!important']` > `margin: 5px 10px !important;` - * `color: ['red', !important]` > `color: red !important;` - */ -var toCssValue = function toCssValue(value, ignoreImportant) { - if (ignoreImportant === void 0) { - ignoreImportant = false; + _proto.detach = function detach() { + if (!this.attached) return this; + if (this.renderer) this.renderer.detach(); + this.attached = false; + return this; } + /** + * Add a rule to the current stylesheet. + * Will insert a rule also after the stylesheet has been rendered first time. + */ + ; - if (!Array.isArray(value)) return value; - var cssValue = ''; // Support space separated values via `[['5px', '10px']]`. - - if (Array.isArray(value[0])) { - for (var i = 0; i < value.length; i++) { - if (value[i] === '!important') break; - if (cssValue) cssValue += ', '; - cssValue += join(value[i], ' '); - } - } else cssValue = join(value, ', '); // Add !important, because it was ignored. - - - if (!ignoreImportant && value[value.length - 1] === '!important') { - cssValue += ' !important'; - } + _proto.addRule = function addRule(name, decl, options) { + var queue = this.queue; // Plugins can create rules. + // In order to preserve the right order, we need to queue all `.addRule` calls, + // which happen after the first `rules.add()` call. - return cssValue; -}; + if (this.attached && !queue) this.queue = []; + var rule = this.rules.add(name, decl, options); + if (!rule) return null; + this.options.jss.plugins.onProcessRule(rule); -/** - * Indent a string. - * http://jsperf.com/array-join-vs-for - */ -function indentStr(str, indent) { - var result = ''; + if (this.attached) { + if (!this.deployed) return rule; // Don't insert rule directly if there is no stringified version yet. + // It will be inserted all together when .attach is called. - for (var index = 0; index < indent; index++) { - result += ' '; - } + if (queue) queue.push(rule);else { + this.insertRule(rule); - return result + str; -} -/** - * Converts a Rule to CSS string. - */ + if (this.queue) { + this.queue.forEach(this.insertRule, this); + this.queue = undefined; + } + } + return rule; + } // We can't add rules to a detached style node. + // We will redeploy the sheet once user will attach it. -function toCss(selector, style, options) { - if (options === void 0) { - options = {}; + this.deployed = false; + return rule; } + /** + * Insert rule into the StyleSheet + */ + ; - var result = ''; - if (!style) return result; - var _options = options, - _options$indent = _options.indent, - indent = _options$indent === void 0 ? 0 : _options$indent; - var fallbacks = style.fallbacks; - if (selector) indent++; // Apply fallbacks first. - - if (fallbacks) { - // Array syntax {fallbacks: [{prop: value}]} - if (Array.isArray(fallbacks)) { - for (var index = 0; index < fallbacks.length; index++) { - var fallback = fallbacks[index]; - - for (var prop in fallback) { - var value = fallback[prop]; - - if (value != null) { - if (result) result += '\n'; - result += indentStr(prop + ": " + toCssValue(value) + ";", indent); - } - } - } - } else { - // Object syntax {fallbacks: {prop: value}} - for (var _prop in fallbacks) { - var _value = fallbacks[_prop]; - - if (_value != null) { - if (result) result += '\n'; - result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent); - } - } + _proto.insertRule = function insertRule(rule) { + if (this.renderer) { + this.renderer.insertRule(rule); } } + /** + * Create and add rules. + * Will render also after Style Sheet was rendered the first time. + */ + ; - for (var _prop2 in style) { - var _value2 = style[_prop2]; + _proto.addRules = function addRules(styles, options) { + var added = []; - if (_value2 != null && _prop2 !== 'fallbacks') { - if (result) result += '\n'; - result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent); + for (var name in styles) { + var rule = this.addRule(name, styles[name], options); + if (rule) added.push(rule); } - } // Allow empty style in this case, because properties will be added dynamically. - - - if (!result && !options.allowEmpty) return result; // When rule is being stringified before selector was defined. - if (!selector) return result; - indent--; - if (result) result = "\n" + result + "\n"; - return indentStr(selector + " {" + result, indent) + indentStr('}', indent); -} - -var escapeRegex = /([[\].#*$><+~=|^:(),"'`\s])/g; -var nativeEscape = typeof CSS !== 'undefined' && CSS.escape; -var escape = (function (str) { - return nativeEscape ? nativeEscape(str) : str.replace(escapeRegex, '\\$1'); -}); - -var BaseStyleRule = -/*#__PURE__*/ -function () { - function BaseStyleRule(key, style, options) { - this.type = 'style'; - this.key = void 0; - this.isProcessed = false; - this.style = void 0; - this.renderer = void 0; - this.renderable = void 0; - this.options = void 0; - var sheet = options.sheet, - Renderer = options.Renderer; - this.key = key; - this.options = options; - this.style = style; - if (sheet) this.renderer = sheet.renderer;else if (Renderer) this.renderer = new Renderer(); + return added; } /** - * Get or set a style property. + * Get a rule by name. */ + ; + _proto.getRule = function getRule(name) { + return this.rules.get(name); + } + /** + * Delete a rule by name. + * Returns `true`: if rule has been deleted from the DOM. + */ + ; - var _proto = BaseStyleRule.prototype; + _proto.deleteRule = function deleteRule(name) { + var rule = typeof name === 'object' ? name : this.rules.get(name); - _proto.prop = function prop(name, value, options) { - // It's a getter. - if (value === undefined) return this.style[name]; // Don't do anything if the value has not changed. + if (!rule || // Style sheet was created without link: true and attached, in this case we + // won't be able to remove the CSS rule from the DOM. + this.attached && !rule.renderable) { + return false; + } - var force = options ? options.force : false; - if (!force && this.style[name] === value) return this; - var newValue = value; + this.rules.remove(rule); - if (!options || options.process !== false) { - newValue = this.options.jss.plugins.onChangeValue(value, name, this); + if (this.attached && rule.renderable && this.renderer) { + return this.renderer.deleteRule(rule.renderable); } - var isEmpty = newValue == null || newValue === false; - var isDefined = name in this.style; // Value is empty and wasn't defined before. + return true; + } + /** + * Get index of a rule. + */ + ; - if (isEmpty && !isDefined && !force) return this; // We are going to remove this value. + _proto.indexOf = function indexOf(rule) { + return this.rules.indexOf(rule); + } + /** + * Deploy pure CSS string to a renderable. + */ + ; - var remove = isEmpty && isDefined; - if (remove) delete this.style[name];else this.style[name] = newValue; // Renderable is defined if StyleSheet option `link` is true. + _proto.deploy = function deploy() { + if (this.renderer) this.renderer.deploy(); + this.deployed = true; + return this; + } + /** + * Update the function values with a new data. + */ + ; - if (this.renderable && this.renderer) { - if (remove) this.renderer.removeProperty(this.renderable, name);else this.renderer.setProperty(this.renderable, name, newValue); - return this; - } + _proto.update = function update() { + var _this$rules; - var sheet = this.options.sheet; + (_this$rules = this.rules).update.apply(_this$rules, arguments); - if (sheet && sheet.attached) { - process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Rule is not linked. Missing sheet option "link: true".') : void 0; - } + return this; + } + /** + * Updates a single rule. + */ + ; + _proto.updateOne = function updateOne(rule, data, options) { + this.rules.updateOne(rule, data, options); return this; + } + /** + * Convert rules to a CSS string. + */ + ; + + _proto.toString = function toString(options) { + return this.rules.toString(options); }; - return BaseStyleRule; + return StyleSheet; }(); -var StyleRule = -/*#__PURE__*/ -function (_BaseStyleRule) { - _inheritsLoose(StyleRule, _BaseStyleRule); - function StyleRule(key, style, options) { - var _this; +var PluginsRegistry = +/*#__PURE__*/ +function () { + function PluginsRegistry() { + this.plugins = { + internal: [], + external: [] + }; + this.registry = void 0; + } - _this = _BaseStyleRule.call(this, key, style, options) || this; - _this.selectorText = void 0; - _this.id = void 0; - _this.renderable = void 0; - var selector = options.selector, - scoped = options.scoped, - sheet = options.sheet, - generateId = options.generateId; + var _proto = PluginsRegistry.prototype; - if (selector) { - _this.selectorText = selector; - } else if (scoped !== false) { - _this.id = generateId(_assertThisInitialized$9(_assertThisInitialized$9(_this)), sheet); - _this.selectorText = "." + escape(_this.id); + /** + * Call `onCreateRule` hooks and return an object if returned by a hook. + */ + _proto.onCreateRule = function onCreateRule(name, decl, options) { + for (var i = 0; i < this.registry.onCreateRule.length; i++) { + var rule = this.registry.onCreateRule[i](name, decl, options); + if (rule) return rule; } - return _this; + return null; } /** - * Set selector string. - * Attention: use this with caution. Most browsers didn't implement - * selectorText setter, so this may result in rerendering of entire Style Sheet. + * Call `onProcessRule` hooks. */ + ; + _proto.onProcessRule = function onProcessRule(rule) { + if (rule.isProcessed) return; + var sheet = rule.options.sheet; - var _proto2 = StyleRule.prototype; + for (var i = 0; i < this.registry.onProcessRule.length; i++) { + this.registry.onProcessRule[i](rule, sheet); + } + if (rule.style) this.onProcessStyle(rule.style, rule, sheet); + rule.isProcessed = true; + } /** - * Apply rule to an element inline. + * Call `onProcessStyle` hooks. */ - _proto2.applyTo = function applyTo(renderable) { - var renderer = this.renderer; + ; - if (renderer) { - var json = this.toJSON(); + _proto.onProcessStyle = function onProcessStyle(style, rule, sheet) { + for (var i = 0; i < this.registry.onProcessStyle.length; i++) { + // $FlowFixMe[prop-missing] + rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet); + } + } + /** + * Call `onProcessSheet` hooks. + */ + ; - for (var prop in json) { - renderer.setProperty(renderable, prop, json[prop]); - } + _proto.onProcessSheet = function onProcessSheet(sheet) { + for (var i = 0; i < this.registry.onProcessSheet.length; i++) { + this.registry.onProcessSheet[i](sheet); } + } + /** + * Call `onUpdate` hooks. + */ + ; - return this; + _proto.onUpdate = function onUpdate(data, rule, sheet, options) { + for (var i = 0; i < this.registry.onUpdate.length; i++) { + this.registry.onUpdate[i](data, rule, sheet, options); + } } /** - * Returns JSON representation of the rule. - * Fallbacks are not supported. - * Useful for inline styles. + * Call `onChangeValue` hooks. */ ; - _proto2.toJSON = function toJSON() { - var json = {}; + _proto.onChangeValue = function onChangeValue(value, prop, rule) { + var processedValue = value; - for (var prop in this.style) { - var value = this.style[prop]; - if (typeof value !== 'object') json[prop] = value;else if (Array.isArray(value)) json[prop] = toCssValue(value); + for (var i = 0; i < this.registry.onChangeValue.length; i++) { + processedValue = this.registry.onChangeValue[i](processedValue, prop, rule); } - return json; + return processedValue; } /** - * Generates a CSS string. + * Register a plugin. */ ; - _proto2.toString = function toString(options) { - var sheet = this.options.sheet; - var link = sheet ? sheet.options.link : false; - var opts = link ? _extends$m({}, options, { - allowEmpty: true - }) : options; - return toCss(this.selectorText, this.style, opts); - }; + _proto.use = function use(newPlugin, options) { + if (options === void 0) { + options = { + queue: 'external' + }; + } - _createClass$9(StyleRule, [{ - key: "selector", - set: function set(selector) { - if (selector === this.selectorText) return; - this.selectorText = selector; - var renderer = this.renderer, - renderable = this.renderable; - if (!renderable || !renderer) return; - var hasChanged = renderer.setSelector(renderable, selector); // If selector setter is not implemented, rerender the rule. + var plugins = this.plugins[options.queue]; // Avoids applying same plugin twice, at least based on ref. - if (!hasChanged) { - renderer.replaceRule(renderable, this); - } - } - /** - * Get selector string. - */ - , - get: function get() { - return this.selectorText; + if (plugins.indexOf(newPlugin) !== -1) { + return; } - }]); - return StyleRule; -}(BaseStyleRule); -var pluginStyleRule = { - onCreateRule: function onCreateRule(name, style, options) { - if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') { - return null; - } + plugins.push(newPlugin); + this.registry = [].concat(this.plugins.external, this.plugins.internal).reduce(function (registry, plugin) { + for (var name in plugin) { + if (name in registry) { + registry[name].push(plugin[name]); + } else { + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Unknown hook \"" + name + "\".") : void 0; + } + } - return new StyleRule(name, style, options); - } -}; + return registry; + }, { + onCreateRule: [], + onProcessRule: [], + onProcessStyle: [], + onProcessSheet: [], + onChangeValue: [], + onUpdate: [] + }); + }; + + return PluginsRegistry; +}(); -var defaultToStringOptions = { - indent: 1, - children: true -}; -var atRegExp = /@([\w-]+)/; /** - * Conditional rule for @media, @supports + * Sheets registry to access them all at one place. */ - -var ConditionalRule = +var SheetsRegistry = /*#__PURE__*/ function () { - function ConditionalRule(key, styles, options) { - this.type = 'conditional'; - this.at = void 0; - this.key = void 0; - this.query = void 0; - this.rules = void 0; - this.options = void 0; - this.isProcessed = false; - this.renderable = void 0; - this.key = key; - var atMatch = key.match(atRegExp); - this.at = atMatch ? atMatch[1] : 'unknown'; // Key might contain a unique suffix in case the `name` passed by user was duplicate. - - this.query = options.name || "@" + this.at; - this.options = options; - this.rules = new RuleList(_extends$m({}, options, { - parent: this - })); + function SheetsRegistry() { + this.registry = []; + } - for (var name in styles) { - this.rules.add(name, styles[name]); - } + var _proto = SheetsRegistry.prototype; - this.rules.process(); - } /** - * Get a rule. + * Register a Style Sheet. */ + _proto.add = function add(sheet) { + var registry = this.registry; + var index = sheet.options.index; + if (registry.indexOf(sheet) !== -1) return; + if (registry.length === 0 || index >= this.index) { + registry.push(sheet); + return; + } // Find a position. - var _proto = ConditionalRule.prototype; - _proto.getRule = function getRule(name) { - return this.rules.get(name); + for (var i = 0; i < registry.length; i++) { + if (registry[i].options.index > index) { + registry.splice(i, 0, sheet); + return; + } + } } /** - * Get index of a rule. + * Reset the registry. */ ; - _proto.indexOf = function indexOf(rule) { - return this.rules.indexOf(rule); + _proto.reset = function reset() { + this.registry = []; } /** - * Create and register rule, run plugins. + * Remove a Style Sheet. */ ; - _proto.addRule = function addRule(name, style, options) { - var rule = this.rules.add(name, style, options); - if (!rule) return null; - this.options.jss.plugins.onProcessRule(rule); - return rule; + _proto.remove = function remove(sheet) { + var index = this.registry.indexOf(sheet); + this.registry.splice(index, 1); } /** - * Generates a CSS string. + * Convert all attached sheets to a CSS string. */ ; - _proto.toString = function toString(options) { - if (options === void 0) { - options = defaultToStringOptions; - } + _proto.toString = function toString(_temp) { + var _ref = _temp === void 0 ? {} : _temp, + attached = _ref.attached, + options = _objectWithoutPropertiesLoose$b(_ref, ["attached"]); - if (options.indent == null) options.indent = defaultToStringOptions.indent; - if (options.children == null) options.children = defaultToStringOptions.children; + var css = ''; - if (options.children === false) { - return this.query + " {}"; + for (var i = 0; i < this.registry.length; i++) { + var sheet = this.registry[i]; + + if (attached != null && sheet.attached !== attached) { + continue; + } + + if (css) css += '\n'; + css += sheet.toString(options); } - var children = this.rules.toString(options); - return children ? this.query + " {\n" + children + "\n}" : ''; + return css; }; - return ConditionalRule; + _createClass$9(SheetsRegistry, [{ + key: "index", + + /** + * Current highest index number. + */ + get: function get() { + return this.registry.length === 0 ? 0 : this.registry[this.registry.length - 1].options.index; + } + }]); + + return SheetsRegistry; }(); -var keyRegExp = /@media|@supports\s+/; -var pluginConditionalRule = { - onCreateRule: function onCreateRule(key, styles, options) { - return keyRegExp.test(key) ? new ConditionalRule(key, styles, options) : null; - } -}; -var defaultToStringOptions$1 = { - indent: 1, - children: true -}; -var nameRegExp = /@keyframes\s+([\w-]+)/; /** - * Rule for @keyframes + * This is a global sheets registry. Only DomRenderer will add sheets to it. + * On the server one should use an own SheetsRegistry instance and add the + * sheets to it, because you need to make sure to create a new registry for + * each request in order to not leak sheets across requests. */ -var KeyframesRule = -/*#__PURE__*/ -function () { - function KeyframesRule(key, frames, options) { - this.type = 'keyframes'; - this.at = '@keyframes'; - this.key = void 0; - this.name = void 0; - this.id = void 0; - this.rules = void 0; - this.options = void 0; - this.isProcessed = false; - this.renderable = void 0; - var nameMatch = key.match(nameRegExp); +var registry$1 = new SheetsRegistry(); - if (nameMatch && nameMatch[1]) { - this.name = nameMatch[1]; - } else { - this.name = 'noname'; - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Bad keyframes name " + key) : void 0; - } +/* eslint-disable */ - this.key = this.type + "-" + this.name; - this.options = options; - var scoped = options.scoped, - sheet = options.sheet, - generateId = options.generateId; - this.id = scoped === false ? this.name : escape(generateId(this, sheet)); - this.rules = new RuleList(_extends$m({}, options, { - parent: this - })); +/** + * Now that `globalThis` is available on most platforms + * (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis#browser_compatibility) + * we check for `globalThis` first. `globalThis` is necessary for jss + * to run in Agoric's secure version of JavaScript (SES). Under SES, + * `globalThis` exists, but `window`, `self`, and `Function('return + * this')()` are all undefined for security reasons. + * + * https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 + */ +var globalThis$1 = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' && window.Math === Math ? window : typeof self !== 'undefined' && self.Math === Math ? self : Function('return this')(); - for (var name in frames) { - this.rules.add(name, frames[name], _extends$m({}, options, { - parent: this - })); - } +var ns = '2f1acc6c3a606b082e5eef5e54414ffb'; +if (globalThis$1[ns] == null) globalThis$1[ns] = 0; // Bundle may contain multiple JSS versions at the same time. In order to identify +// the current version with just one short number and use it for classes generation +// we use a counter. Also it is more accurate, because user can manually reevaluate +// the module. - this.rules.process(); - } - /** - * Generates a CSS string. - */ +var moduleId = globalThis$1[ns]++; +var maxRules = 1e10; - var _proto = KeyframesRule.prototype; +/** + * Returns a function which generates unique class names based on counters. + * When new generator function is created, rule counter is reseted. + * We need to reset the rule counter for SSR for each request. + */ +var createGenerateId = function createGenerateId(options) { + if (options === void 0) { + options = {}; + } - _proto.toString = function toString(options) { - if (options === void 0) { - options = defaultToStringOptions$1; - } + var ruleCounter = 0; - if (options.indent == null) options.indent = defaultToStringOptions$1.indent; - if (options.children == null) options.children = defaultToStringOptions$1.children; + var generateId = function generateId(rule, sheet) { + ruleCounter += 1; - if (options.children === false) { - return this.at + " " + this.id + " {}"; + if (ruleCounter > maxRules) { + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] You might have a memory leak. Rule counter is at " + ruleCounter + ".") : void 0; } - var children = this.rules.toString(options); - if (children) children = "\n" + children + "\n"; - return this.at + " " + this.id + " {" + children + "}"; - }; + var jssId = ''; + var prefix = ''; - return KeyframesRule; -}(); -var keyRegExp$1 = /@keyframes\s+/; -var refRegExp$1 = /\$([\w-]+)/g; + if (sheet) { + if (sheet.options.classNamePrefix) { + prefix = sheet.options.classNamePrefix; + } -var findReferencedKeyframe = function findReferencedKeyframe(val, keyframes) { - if (typeof val === 'string') { - return val.replace(refRegExp$1, function (match, name) { - if (name in keyframes) { - return keyframes[name]; + if (sheet.options.jss.id != null) { + jssId = String(sheet.options.jss.id); } + } - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Referenced keyframes rule \"" + name + "\" is not defined.") : void 0; - return match; - }); - } + if (options.minify) { + // Using "c" because a number can't be the first char in a class name. + return "" + (prefix || 'c') + moduleId + jssId + ruleCounter; + } - return val; + return prefix + rule.key + "-" + moduleId + (jssId ? "-" + jssId : '') + "-" + ruleCounter; + }; + + return generateId; }; + /** - * Replace the reference for a animation name. + * Cache the value from the first time a function is called. */ +var memoize = function memoize(fn) { + var value; + return function () { + if (!value) value = fn(); + return value; + }; +}; +/** + * Get a style property value. + */ +var getPropertyValue = function getPropertyValue(cssRule, prop) { + try { + // Support CSSTOM. + if (cssRule.attributeStyleMap) { + return cssRule.attributeStyleMap.get(prop); + } -var replaceRef = function replaceRef(style, prop, keyframes) { - var value = style[prop]; - var refKeyframe = findReferencedKeyframe(value, keyframes); - - if (refKeyframe !== value) { - style[prop] = refKeyframe; + return cssRule.style.getPropertyValue(prop); + } catch (err) { + // IE may throw if property is unknown. + return ''; } }; -var plugin = { - onCreateRule: function onCreateRule(key, frames, options) { - return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null; - }, - // Animation name ref replacer. - onProcessStyle: function onProcessStyle(style, rule, sheet) { - if (rule.type !== 'style' || !sheet) return style; - if ('animation-name' in style) replaceRef(style, 'animation-name', sheet.keyframes); - if ('animation' in style) replaceRef(style, 'animation', sheet.keyframes); - return style; - }, - onChangeValue: function onChangeValue(val, prop, rule) { - var sheet = rule.options.sheet; +/** + * Set a style property. + */ +var setProperty = function setProperty(cssRule, prop, value) { + try { + var cssValue = value; - if (!sheet) { - return val; - } + if (Array.isArray(value)) { + cssValue = toCssValue(value, true); - switch (prop) { - case 'animation': - return findReferencedKeyframe(val, sheet.keyframes); + if (value[value.length - 1] === '!important') { + cssRule.style.setProperty(prop, cssValue, 'important'); + return true; + } + } // Support CSSTOM. - case 'animation-name': - return findReferencedKeyframe(val, sheet.keyframes); - default: - return val; + if (cssRule.attributeStyleMap) { + cssRule.attributeStyleMap.set(prop, cssValue); + } else { + cssRule.style.setProperty(prop, cssValue); } + } catch (err) { + // IE may throw if property is unknown. + return false; } + + return true; }; -var KeyframeRule = -/*#__PURE__*/ -function (_BaseStyleRule) { - _inheritsLoose(KeyframeRule, _BaseStyleRule); +/** + * Remove a style property. + */ +var removeProperty = function removeProperty(cssRule, prop) { + try { + // Support CSSTOM. + if (cssRule.attributeStyleMap) { + cssRule.attributeStyleMap.delete(prop); + } else { + cssRule.style.removeProperty(prop); + } + } catch (err) { + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] DOMException \"" + err.message + "\" was thrown. Tried to remove property \"" + prop + "\".") : void 0; + } +}; - function KeyframeRule() { - var _this; +/** + * Set the selector. + */ +var setSelector = function setSelector(cssRule, selectorText) { + cssRule.selectorText = selectorText; // Return false if setter was not successful. + // Currently works in chrome only. - for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } + return cssRule.selectorText === selectorText; +}; +/** + * Gets the `head` element upon the first call and caches it. + * We assume it can't be null. + */ - _this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this; - _this.renderable = void 0; - return _this; - } - var _proto = KeyframeRule.prototype; +var getHead = memoize(function () { + return document.querySelector('head'); +}); +/** + * Find attached sheet with an index higher than the passed one. + */ - /** - * Generates a CSS string. - */ - _proto.toString = function toString(options) { - var sheet = this.options.sheet; - var link = sheet ? sheet.options.link : false; - var opts = link ? _extends$m({}, options, { - allowEmpty: true - }) : options; - return toCss(this.key, this.style, opts); - }; +function findHigherSheet(registry, options) { + for (var i = 0; i < registry.length; i++) { + var sheet = registry[i]; - return KeyframeRule; -}(BaseStyleRule); -var pluginKeyframeRule = { - onCreateRule: function onCreateRule(key, style, options) { - if (options.parent && options.parent.type === 'keyframes') { - return new KeyframeRule(key, style, options); + if (sheet.attached && sheet.options.index > options.index && sheet.options.insertionPoint === options.insertionPoint) { + return sheet; } - - return null; } -}; -var FontFaceRule = -/*#__PURE__*/ -function () { - function FontFaceRule(key, style, options) { - this.type = 'font-face'; - this.at = '@font-face'; - this.key = void 0; - this.style = void 0; - this.options = void 0; - this.isProcessed = false; - this.renderable = void 0; - this.key = key; - this.style = style; - this.options = options; - } - /** - * Generates a CSS string. - */ + return null; +} +/** + * Find attached sheet with the highest index. + */ - var _proto = FontFaceRule.prototype; +function findHighestSheet(registry, options) { + for (var i = registry.length - 1; i >= 0; i--) { + var sheet = registry[i]; - _proto.toString = function toString(options) { - if (Array.isArray(this.style)) { - var str = ''; + if (sheet.attached && sheet.options.insertionPoint === options.insertionPoint) { + return sheet; + } + } - for (var index = 0; index < this.style.length; index++) { - str += toCss(this.at, this.style[index]); - if (this.style[index + 1]) str += '\n'; - } + return null; +} +/** + * Find a comment with "jss" inside. + */ - return str; - } - return toCss(this.at, this.style, options); - }; +function findCommentNode(text) { + var head = getHead(); - return FontFaceRule; -}(); -var keyRegExp$2 = /@font-face/; -var pluginFontFaceRule = { - onCreateRule: function onCreateRule(key, style, options) { - return keyRegExp$2.test(key) ? new FontFaceRule(key, style, options) : null; - } -}; + for (var i = 0; i < head.childNodes.length; i++) { + var node = head.childNodes[i]; -var ViewportRule = -/*#__PURE__*/ -function () { - function ViewportRule(key, style, options) { - this.type = 'viewport'; - this.at = '@viewport'; - this.key = void 0; - this.style = void 0; - this.options = void 0; - this.isProcessed = false; - this.renderable = void 0; - this.key = key; - this.style = style; - this.options = options; + if (node.nodeType === 8 && node.nodeValue.trim() === text) { + return node; + } } - /** - * Generates a CSS string. - */ + return null; +} - var _proto = ViewportRule.prototype; +/** + * Find a node before which we can insert the sheet. + */ +function findPrevNode(options) { + var registry$1$1 = registry$1.registry; - _proto.toString = function toString(options) { - return toCss(this.key, this.style, options); - }; + if (registry$1$1.length > 0) { + // Try to insert before the next higher sheet. + var sheet = findHigherSheet(registry$1$1, options); - return ViewportRule; -}(); -var pluginViewportRule = { - onCreateRule: function onCreateRule(key, style, options) { - return key === '@viewport' || key === '@-ms-viewport' ? new ViewportRule(key, style, options) : null; - } -}; + if (sheet && sheet.renderer) { + return { + parent: sheet.renderer.element.parentNode, + node: sheet.renderer.element + }; + } // Otherwise insert after the last attached. -var SimpleRule = -/*#__PURE__*/ -function () { - function SimpleRule(key, value, options) { - this.type = 'simple'; - this.key = void 0; - this.value = void 0; - this.options = void 0; - this.isProcessed = false; - this.renderable = void 0; - this.key = key; - this.value = value; - this.options = options; - } - /** - * Generates a CSS string. - */ - // eslint-disable-next-line no-unused-vars + sheet = findHighestSheet(registry$1$1, options); + + if (sheet && sheet.renderer) { + return { + parent: sheet.renderer.element.parentNode, + node: sheet.renderer.element.nextSibling + }; + } + } // Try to find a comment placeholder if registry is empty. - var _proto = SimpleRule.prototype; - _proto.toString = function toString(options) { - if (Array.isArray(this.value)) { - var str = ''; + var insertionPoint = options.insertionPoint; - for (var index = 0; index < this.value.length; index++) { - str += this.key + " " + this.value[index] + ";"; - if (this.value[index + 1]) str += '\n'; - } + if (insertionPoint && typeof insertionPoint === 'string') { + var comment = findCommentNode(insertionPoint); - return str; - } + if (comment) { + return { + parent: comment.parentNode, + node: comment.nextSibling + }; + } // If user specifies an insertion point and it can't be found in the document - + // bad specificity issues may appear. - return this.key + " " + this.value + ";"; - }; - return SimpleRule; -}(); -var keysMap = { - '@charset': true, - '@import': true, - '@namespace': true -}; -var pluginSimpleRule = { - onCreateRule: function onCreateRule(key, value, options) { - return key in keysMap ? new SimpleRule(key, value, options) : null; + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Insertion point \"" + insertionPoint + "\" not found.") : void 0; } -}; -var plugins$1 = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule]; + return false; +} +/** + * Insert style element into the DOM. + */ -var defaultUpdateOptions = { - process: true -}; -var forceUpdateOptions = { - force: true, - process: true - /** - * Contains rules objects and allows adding/removing etc. - * Is used for e.g. by `StyleSheet` or `ConditionalRule`. - */ -}; +function insertStyle(style, options) { + var insertionPoint = options.insertionPoint; + var nextNode = findPrevNode(options); -var RuleList = -/*#__PURE__*/ -function () { - // Rules registry for access by .get() method. - // It contains the same rule registered by name and by selector. - // Original styles object. - // Used to ensure correct rules order. - function RuleList(options) { - this.map = {}; - this.raw = {}; - this.index = []; - this.counter = 0; - this.options = void 0; - this.classes = void 0; - this.keyframes = void 0; - this.options = options; - this.classes = options.classes; - this.keyframes = options.keyframes; + if (nextNode !== false && nextNode.parent) { + nextNode.parent.insertBefore(style, nextNode.node); + return; + } // Works with iframes and any node types. + + + if (insertionPoint && typeof insertionPoint.nodeType === 'number') { + // https://stackoverflow.com/questions/41328728/force-casting-in-flow + var insertionPointElement = insertionPoint; + var parentNode = insertionPointElement.parentNode; + if (parentNode) parentNode.insertBefore(style, insertionPointElement.nextSibling);else process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Insertion point is not in the DOM.') : void 0; + return; } - /** - * Create and register rule. - * - * Will not render after Style Sheet was rendered the first time. - */ + getHead().appendChild(style); +} +/** + * Read jss nonce setting from the page if the user has set it. + */ - var _proto = RuleList.prototype; - _proto.add = function add(name, decl, ruleOptions) { - var _this$options = this.options, - parent = _this$options.parent, - sheet = _this$options.sheet, - jss = _this$options.jss, - Renderer = _this$options.Renderer, - generateId = _this$options.generateId, - scoped = _this$options.scoped; +var getNonce = memoize(function () { + var node = document.querySelector('meta[property="csp-nonce"]'); + return node ? node.getAttribute('content') : null; +}); - var options = _extends$m({ - classes: this.classes, - parent: parent, - sheet: sheet, - jss: jss, - Renderer: Renderer, - generateId: generateId, - scoped: scoped, - name: name, - keyframes: this.keyframes, - selector: undefined - }, ruleOptions); // When user uses .createStyleSheet(), duplicate names are not possible, but - // `sheet.addRule()` opens the door for any duplicate rule name. When this happens - // we need to make the key unique within this RuleList instance scope. +var _insertRule = function insertRule(container, rule, index) { + try { + if ('insertRule' in container) { + var c = container; + c.insertRule(rule, index); + } // Keyframes rule. + else if ('appendRule' in container) { + var _c = container; + _c.appendRule(rule); + } + } catch (err) { + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] " + err.message) : void 0; + return false; + } - var key = name; + return container.cssRules[index]; +}; - if (name in this.raw) { - key = name + "-d" + this.counter++; - } // We need to save the original decl before creating the rule - // because cache plugin needs to use it as a key to return a cached rule. +var getValidRuleInsertionIndex = function getValidRuleInsertionIndex(container, index) { + var maxIndex = container.cssRules.length; // In case previous insertion fails, passed index might be wrong + if (index === undefined || index > maxIndex) { + // eslint-disable-next-line no-param-reassign + return maxIndex; + } - this.raw[key] = decl; + return index; +}; - if (key in this.classes) { - // E.g. rules inside of @media container - options.selector = "." + escape(this.classes[key]); - } +var createStyle = function createStyle() { + var el = document.createElement('style'); // Without it, IE will have a broken source order specificity if we + // insert rules after we insert the style tag. + // It seems to kick-off the source order specificity algorithm. - var rule = createRule(key, decl, options); - if (!rule) return null; - this.register(rule); - var index = options.index === undefined ? this.index.length : options.index; - this.index.splice(index, 0, rule); - return rule; - } - /** - * Get a rule. - */ - ; + el.textContent = '\n'; + return el; +}; - _proto.get = function get(name) { - return this.map[name]; - } - /** - * Delete a rule. - */ - ; +var DomRenderer = +/*#__PURE__*/ +function () { + // HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696 + // Will be empty if link: true option is not set, because + // it is only for use together with insertRule API. + function DomRenderer(sheet) { + this.getPropertyValue = getPropertyValue; + this.setProperty = setProperty; + this.removeProperty = removeProperty; + this.setSelector = setSelector; + this.element = void 0; + this.sheet = void 0; + this.hasInsertedRules = false; + this.cssRules = []; + // There is no sheet when the renderer is used from a standalone StyleRule. + if (sheet) registry$1.add(sheet); + this.sheet = sheet; - _proto.remove = function remove(rule) { - this.unregister(rule); - delete this.raw[rule.key]; - this.index.splice(this.index.indexOf(rule), 1); + var _ref = this.sheet ? this.sheet.options : {}, + media = _ref.media, + meta = _ref.meta, + element = _ref.element; + + this.element = element || createStyle(); + this.element.setAttribute('data-jss', ''); + if (media) this.element.setAttribute('media', media); + if (meta) this.element.setAttribute('data-meta', meta); + var nonce = getNonce(); + if (nonce) this.element.setAttribute('nonce', nonce); } /** - * Get index of a rule. + * Insert style element into render tree. */ - ; - _proto.indexOf = function indexOf(rule) { - return this.index.indexOf(rule); + + var _proto = DomRenderer.prototype; + + _proto.attach = function attach() { + // In the case the element node is external and it is already in the DOM. + if (this.element.parentNode || !this.sheet) return; + insertStyle(this.element, this.sheet.options); // When rules are inserted using `insertRule` API, after `sheet.detach().attach()` + // most browsers create a new CSSStyleSheet, except of all IEs. + + var deployed = Boolean(this.sheet && this.sheet.deployed); + + if (this.hasInsertedRules && deployed) { + this.hasInsertedRules = false; + this.deploy(); + } } /** - * Run `onProcessRule()` plugins on every rule. + * Remove style element from render tree. */ ; - _proto.process = function process() { - var plugins = this.options.jss.plugins; // We need to clone array because if we modify the index somewhere else during a loop - // we end up with very hard-to-track-down side effects. + _proto.detach = function detach() { + if (!this.sheet) return; + var parentNode = this.element.parentNode; + if (parentNode) parentNode.removeChild(this.element); // In the most browsers, rules inserted using insertRule() API will be lost when style element is removed. + // Though IE will keep them and we need a consistent behavior. - this.index.slice(0).forEach(plugins.onProcessRule, plugins); + if (this.sheet.options.link) { + this.cssRules = []; + this.element.textContent = '\n'; + } } /** - * Register a rule in `.map`, `.classes` and `.keyframes` maps. + * Inject CSS string into element. */ ; - _proto.register = function register(rule) { - this.map[rule.key] = rule; + _proto.deploy = function deploy() { + var sheet = this.sheet; + if (!sheet) return; - if (rule instanceof StyleRule) { - this.map[rule.selector] = rule; - if (rule.id) this.classes[rule.key] = rule.id; - } else if (rule instanceof KeyframesRule && this.keyframes) { - this.keyframes[rule.name] = rule.id; + if (sheet.options.link) { + this.insertRules(sheet.rules); + return; } + + this.element.textContent = "\n" + sheet.toString() + "\n"; } /** - * Unregister a rule. + * Insert RuleList into an element. */ ; - _proto.unregister = function unregister(rule) { - delete this.map[rule.key]; - - if (rule instanceof StyleRule) { - delete this.map[rule.selector]; - delete this.classes[rule.key]; - } else if (rule instanceof KeyframesRule) { - delete this.keyframes[rule.name]; + _proto.insertRules = function insertRules(rules, nativeParent) { + for (var i = 0; i < rules.index.length; i++) { + this.insertRule(rules.index[i], i, nativeParent); } } /** - * Update the function values with a new data. + * Insert a rule into element. */ ; - _proto.update = function update() { - var name; - var data; - var options; - - if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') { - name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index] + _proto.insertRule = function insertRule(rule, index, nativeParent) { + if (nativeParent === void 0) { + nativeParent = this.element.sheet; + } - data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index] + if (rule.rules) { + var parent = rule; + var latestNativeParent = nativeParent; - options = arguments.length <= 2 ? undefined : arguments[2]; - } else { - data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index] + if (rule.type === 'conditional' || rule.type === 'keyframes') { + var _insertionIndex = getValidRuleInsertionIndex(nativeParent, index); // We need to render the container without children first. - options = arguments.length <= 1 ? undefined : arguments[1]; - name = null; - } - if (name) { - this.updateOne(this.map[name], data, options); - } else { - for (var index = 0; index < this.index.length; index++) { - this.updateOne(this.index[index], data, options); - } - } - } - /** - * Execute plugins, update rule props. - */ - ; + latestNativeParent = _insertRule(nativeParent, parent.toString({ + children: false + }), _insertionIndex); - _proto.updateOne = function updateOne(rule, data, options) { - if (options === void 0) { - options = defaultUpdateOptions; - } + if (latestNativeParent === false) { + return false; + } - var _this$options2 = this.options, - plugins = _this$options2.jss.plugins, - sheet = _this$options2.sheet; // It is a rules container like for e.g. ConditionalRule. + this.refCssRule(rule, _insertionIndex, latestNativeParent); + } - if (rule.rules instanceof RuleList) { - rule.rules.update(data, options); - return; + this.insertRules(parent.rules, latestNativeParent); + return latestNativeParent; } - var styleRule = rule; - var style = styleRule.style; - plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook. - - if (options.process && style && style !== styleRule.style) { - // We need to run the plugins in case new `style` relies on syntax plugins. - plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props. + var ruleStr = rule.toString(); + if (!ruleStr) return false; + var insertionIndex = getValidRuleInsertionIndex(nativeParent, index); - for (var prop in styleRule.style) { - var nextValue = styleRule.style[prop]; - var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule. - // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here. + var nativeRule = _insertRule(nativeParent, ruleStr, insertionIndex); - if (nextValue !== prevValue) { - styleRule.prop(prop, nextValue, forceUpdateOptions); - } - } // Remove props. + if (nativeRule === false) { + return false; + } + this.hasInsertedRules = true; + this.refCssRule(rule, insertionIndex, nativeRule); + return nativeRule; + }; - for (var _prop in style) { - var _nextValue = styleRule.style[_prop]; - var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule. - // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here. + _proto.refCssRule = function refCssRule(rule, index, cssRule) { + rule.renderable = cssRule; // We only want to reference the top level rules, deleteRule API doesn't support removing nested rules + // like rules inside media queries or keyframes - if (_nextValue == null && _nextValue !== _prevValue) { - styleRule.prop(_prop, null, forceUpdateOptions); - } - } + if (rule.options.parent instanceof StyleSheet) { + this.cssRules[index] = cssRule; } } /** - * Convert rules to a CSS string. + * Delete a rule. */ ; - _proto.toString = function toString(options) { - var str = ''; - var sheet = this.options.sheet; - var link = sheet ? sheet.options.link : false; + _proto.deleteRule = function deleteRule(cssRule) { + var sheet = this.element.sheet; + var index = this.indexOf(cssRule); + if (index === -1) return false; + sheet.deleteRule(index); + this.cssRules.splice(index, 1); + return true; + } + /** + * Get index of a CSS Rule. + */ + ; - for (var index = 0; index < this.index.length; index++) { - var rule = this.index[index]; - var css = rule.toString(options); // No need to render an empty rule. + _proto.indexOf = function indexOf(cssRule) { + return this.cssRules.indexOf(cssRule); + } + /** + * Generate a new CSS rule and replace the existing one. + * + * Only used for some old browsers because they can't set a selector. + */ + ; - if (!css && !link) continue; - if (str) str += '\n'; - str += css; - } + _proto.replaceRule = function replaceRule(cssRule, rule) { + var index = this.indexOf(cssRule); + if (index === -1) return false; + this.element.sheet.deleteRule(index); + this.cssRules.splice(index, 1); + return this.insertRule(rule, index); + } + /** + * Get all rules elements. + */ + ; - return str; + _proto.getRules = function getRules() { + return this.element.sheet.cssRules; }; - return RuleList; + return DomRenderer; }(); -var StyleSheet = +var instanceCounter = 0; + +var Jss = /*#__PURE__*/ function () { - function StyleSheet(styles, options) { - this.options = void 0; - this.deployed = void 0; - this.attached = void 0; - this.rules = void 0; - this.renderer = void 0; - this.classes = void 0; - this.keyframes = void 0; - this.queue = void 0; - this.attached = false; - this.deployed = false; - this.classes = {}; - this.keyframes = {}; - this.options = _extends$m({}, options, { - sheet: this, - parent: this, - classes: this.classes, - keyframes: this.keyframes + function Jss(options) { + this.id = instanceCounter++; + this.version = "10.7.1"; + this.plugins = new PluginsRegistry(); + this.options = { + id: { + minify: false + }, + createGenerateId: createGenerateId, + Renderer: isBrowser ? DomRenderer : null, + plugins: [] + }; + this.generateId = createGenerateId({ + minify: false }); - if (options.Renderer) { - this.renderer = new options.Renderer(this); + for (var i = 0; i < plugins$1.length; i++) { + this.plugins.use(plugins$1[i], { + queue: 'internal' + }); } - this.rules = new RuleList(this.options); + this.setup(options); + } + /** + * Prepares various options, applies plugins. + * Should not be used twice on the same instance, because there is no plugins + * deduplication logic. + */ - for (var name in styles) { - this.rules.add(name, styles[name]); + + var _proto = Jss.prototype; + + _proto.setup = function setup(options) { + if (options === void 0) { + options = {}; } - this.rules.process(); + if (options.createGenerateId) { + this.options.createGenerateId = options.createGenerateId; + } + + if (options.id) { + this.options.id = _extends$l({}, this.options.id, options.id); + } + + if (options.createGenerateId || options.id) { + this.generateId = this.options.createGenerateId(this.options.id); + } + + if (options.insertionPoint != null) this.options.insertionPoint = options.insertionPoint; + + if ('Renderer' in options) { + this.options.Renderer = options.Renderer; + } // eslint-disable-next-line prefer-spread + + + if (options.plugins) this.use.apply(this, options.plugins); + return this; } /** - * Attach renderable to the render tree. + * Create a Style Sheet. */ + ; + _proto.createStyleSheet = function createStyleSheet(styles, options) { + if (options === void 0) { + options = {}; + } - var _proto = StyleSheet.prototype; + var _options = options, + index = _options.index; - _proto.attach = function attach() { - if (this.attached) return this; - if (this.renderer) this.renderer.attach(); - this.attached = true; // Order is important, because we can't use insertRule API if style element is not attached. + if (typeof index !== 'number') { + index = registry$1.index === 0 ? 0 : registry$1.index + 1; + } - if (!this.deployed) this.deploy(); - return this; + var sheet = new StyleSheet(styles, _extends$l({}, options, { + jss: this, + generateId: options.generateId || this.generateId, + insertionPoint: this.options.insertionPoint, + Renderer: this.options.Renderer, + index: index + })); + this.plugins.onProcessSheet(sheet); + return sheet; } /** - * Remove renderable from render tree. + * Detach the Style Sheet and remove it from the registry. */ ; - _proto.detach = function detach() { - if (!this.attached) return this; - if (this.renderer) this.renderer.detach(); - this.attached = false; + _proto.removeStyleSheet = function removeStyleSheet(sheet) { + sheet.detach(); + registry$1.remove(sheet); return this; } /** - * Add a rule to the current stylesheet. - * Will insert a rule also after the stylesheet has been rendered first time. + * Create a rule without a Style Sheet. + * [Deprecated] will be removed in the next major version. */ ; - _proto.addRule = function addRule(name, decl, options) { - var queue = this.queue; // Plugins can create rules. - // In order to preserve the right order, we need to queue all `.addRule` calls, - // which happen after the first `rules.add()` call. + _proto.createRule = function createRule$1(name, style, options) { + if (style === void 0) { + style = {}; + } - if (this.attached && !queue) this.queue = []; - var rule = this.rules.add(name, decl, options); - if (!rule) return null; - this.options.jss.plugins.onProcessRule(rule); + if (options === void 0) { + options = {}; + } - if (this.attached) { - if (!this.deployed) return rule; // Don't insert rule directly if there is no stringified version yet. - // It will be inserted all together when .attach is called. + // Enable rule without name for inline styles. + if (typeof name === 'object') { + // $FlowFixMe[incompatible-call] + return this.createRule(undefined, name, style); + } // $FlowFixMe[incompatible-type] - if (queue) queue.push(rule);else { - this.insertRule(rule); - if (this.queue) { - this.queue.forEach(this.insertRule, this); - this.queue = undefined; - } - } - return rule; - } // We can't add rules to a detached style node. - // We will redeploy the sheet once user will attach it. + var ruleOptions = _extends$l({}, options, { + name: name, + jss: this, + Renderer: this.options.Renderer + }); + + if (!ruleOptions.generateId) ruleOptions.generateId = this.generateId; + if (!ruleOptions.classes) ruleOptions.classes = {}; + if (!ruleOptions.keyframes) ruleOptions.keyframes = {}; + var rule = createRule(name, style, ruleOptions); - this.deployed = false; + if (rule) this.plugins.onProcessRule(rule); return rule; } /** - * Insert rule into the StyleSheet + * Register plugin. Passed function will be invoked with a rule instance. */ ; - _proto.insertRule = function insertRule(rule) { - if (this.renderer) { - this.renderer.insertRule(rule); + _proto.use = function use() { + var _this = this; + + for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) { + plugins[_key] = arguments[_key]; } - } - /** - * Create and add rules. - * Will render also after Style Sheet was rendered the first time. - */ - ; - _proto.addRules = function addRules(styles, options) { - var added = []; + plugins.forEach(function (plugin) { + _this.plugins.use(plugin); + }); + return this; + }; - for (var name in styles) { - var rule = this.addRule(name, styles[name], options); - if (rule) added.push(rule); - } + return Jss; +}(); - return added; - } - /** - * Get a rule by name. - */ - ; +/** + * Extracts a styles object with only props that contain function values. + */ +function getDynamicStyles(styles) { + var to = null; - _proto.getRule = function getRule(name) { - return this.rules.get(name); - } - /** - * Delete a rule by name. - * Returns `true`: if rule has been deleted from the DOM. - */ - ; + for (var key in styles) { + var value = styles[key]; + var type = typeof value; - _proto.deleteRule = function deleteRule(name) { - var rule = typeof name === 'object' ? name : this.rules.get(name); + if (type === 'function') { + if (!to) to = {}; + to[key] = value; + } else if (type === 'object' && value !== null && !Array.isArray(value)) { + var extracted = getDynamicStyles(value); - if (!rule || // Style sheet was created without link: true and attached, in this case we - // won't be able to remove the CSS rule from the DOM. - this.attached && !rule.renderable) { - return false; + if (extracted) { + if (!to) to = {}; + to[key] = extracted; + } } + } - this.rules.remove(rule); + return to; +} - if (this.attached && rule.renderable && this.renderer) { - return this.renderer.deleteRule(rule.renderable); - } +/** + * A better abstraction over CSS. + * + * @copyright Oleg Isonen (Slobodskoi) / Isonen 2014-present + * @website https://github.com/cssinjs/jss + * @license MIT + */ - return true; - } - /** - * Get index of a rule. - */ - ; +/** + * Export a constant indicating if this browser has CSSTOM support. + * https://developers.google.com/web/updates/2018/03/cssom + */ +var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS; +/** + * Creates a new instance of Jss. + */ - _proto.indexOf = function indexOf(rule) { - return this.rules.indexOf(rule); - } - /** - * Deploy pure CSS string to a renderable. - */ - ; +var create$1 = function create(options) { + return new Jss(options); +}; +/** + * A global Jss instance. + */ - _proto.deploy = function deploy() { - if (this.renderer) this.renderer.deploy(); - this.deployed = true; - return this; - } - /** - * Update the function values with a new data. - */ - ; +create$1(); - _proto.update = function update() { - var _this$rules; +var now = Date.now(); +var fnValuesNs = "fnValues" + now; +var fnRuleNs = "fnStyle" + ++now; - (_this$rules = this.rules).update.apply(_this$rules, arguments); +var functionPlugin = function functionPlugin() { + return { + onCreateRule: function onCreateRule(name, decl, options) { + if (typeof decl !== 'function') return null; + var rule = createRule(name, {}, options); + rule[fnRuleNs] = decl; + return rule; + }, + onProcessStyle: function onProcessStyle(style, rule) { + // We need to extract function values from the declaration, so that we can keep core unaware of them. + // We need to do that only once. + // We don't need to extract functions on each style update, since this can happen only once. + // We don't support function values inside of function rules. + if (fnValuesNs in rule || fnRuleNs in rule) return style; + var fnValues = {}; - return this; - } - /** - * Updates a single rule. - */ - ; + for (var prop in style) { + var value = style[prop]; + if (typeof value !== 'function') continue; + delete style[prop]; + fnValues[prop] = value; + } // $FlowFixMe[prop-missing] - _proto.updateOne = function updateOne(rule, data, options) { - this.rules.updateOne(rule, data, options); - return this; - } - /** - * Convert rules to a CSS string. - */ - ; - _proto.toString = function toString(options) { - return this.rules.toString(options); - }; + rule[fnValuesNs] = fnValues; + return style; + }, + onUpdate: function onUpdate(data, rule, sheet, options) { + var styleRule = rule; // $FlowFixMe[prop-missing] - return StyleSheet; -}(); + var fnRule = styleRule[fnRuleNs]; // If we have a style function, the entire rule is dynamic and style object + // will be returned from that function. -var PluginsRegistry = -/*#__PURE__*/ -function () { - function PluginsRegistry() { - this.plugins = { - internal: [], - external: [] - }; - this.registry = void 0; - } + if (fnRule) { + // Empty object will remove all currently defined props + // in case function rule returns a falsy value. + styleRule.style = fnRule(data) || {}; - var _proto = PluginsRegistry.prototype; + if (process.env.NODE_ENV === 'development') { + for (var prop in styleRule.style) { + if (typeof styleRule.style[prop] === 'function') { + process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Function values inside function rules are not supported.') : void 0; + break; + } + } + } + } // $FlowFixMe[prop-missing] - /** - * Call `onCreateRule` hooks and return an object if returned by a hook. - */ - _proto.onCreateRule = function onCreateRule(name, decl, options) { - for (var i = 0; i < this.registry.onCreateRule.length; i++) { - var rule = this.registry.onCreateRule[i](name, decl, options); - if (rule) return rule; + + var fnValues = styleRule[fnValuesNs]; // If we have a fn values map, it is a rule with function values. + + if (fnValues) { + for (var _prop in fnValues) { + styleRule.prop(_prop, fnValues[_prop](data), options); + } + } } + }; +}; - return null; - } - /** - * Call `onProcessRule` hooks. - */ - ; +var functions = functionPlugin; - _proto.onProcessRule = function onProcessRule(rule) { - if (rule.isProcessed) return; - var sheet = rule.options.sheet; +var at = '@global'; +var atPrefix = '@global '; - for (var i = 0; i < this.registry.onProcessRule.length; i++) { - this.registry.onProcessRule[i](rule, sheet); +var GlobalContainerRule = +/*#__PURE__*/ +function () { + function GlobalContainerRule(key, styles, options) { + this.type = 'global'; + this.at = at; + this.rules = void 0; + this.options = void 0; + this.key = void 0; + this.isProcessed = false; + this.key = key; + this.options = options; + this.rules = new RuleList(_extends$l({}, options, { + parent: this + })); + + for (var selector in styles) { + this.rules.add(selector, styles[selector]); } - if (rule.style) this.onProcessStyle(rule.style, rule, sheet); - rule.isProcessed = true; + this.rules.process(); } /** - * Call `onProcessStyle` hooks. + * Get a rule. */ - ; - _proto.onProcessStyle = function onProcessStyle(style, rule, sheet) { - for (var i = 0; i < this.registry.onProcessStyle.length; i++) { - // $FlowFixMe[prop-missing] - rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet); - } - } - /** - * Call `onProcessSheet` hooks. - */ - ; - _proto.onProcessSheet = function onProcessSheet(sheet) { - for (var i = 0; i < this.registry.onProcessSheet.length; i++) { - this.registry.onProcessSheet[i](sheet); - } + var _proto = GlobalContainerRule.prototype; + + _proto.getRule = function getRule(name) { + return this.rules.get(name); } /** - * Call `onUpdate` hooks. + * Create and register rule, run plugins. */ ; - _proto.onUpdate = function onUpdate(data, rule, sheet, options) { - for (var i = 0; i < this.registry.onUpdate.length; i++) { - this.registry.onUpdate[i](data, rule, sheet, options); - } + _proto.addRule = function addRule(name, style, options) { + var rule = this.rules.add(name, style, options); + if (rule) this.options.jss.plugins.onProcessRule(rule); + return rule; } /** - * Call `onChangeValue` hooks. + * Get index of a rule. */ ; - _proto.onChangeValue = function onChangeValue(value, prop, rule) { - var processedValue = value; - - for (var i = 0; i < this.registry.onChangeValue.length; i++) { - processedValue = this.registry.onChangeValue[i](processedValue, prop, rule); - } - - return processedValue; + _proto.indexOf = function indexOf(rule) { + return this.rules.indexOf(rule); } /** - * Register a plugin. + * Generates a CSS string. */ ; - _proto.use = function use(newPlugin, options) { - if (options === void 0) { - options = { - queue: 'external' - }; - } - - var plugins = this.plugins[options.queue]; // Avoids applying same plugin twice, at least based on ref. - - if (plugins.indexOf(newPlugin) !== -1) { - return; - } - - plugins.push(newPlugin); - this.registry = [].concat(this.plugins.external, this.plugins.internal).reduce(function (registry, plugin) { - for (var name in plugin) { - if (name in registry) { - registry[name].push(plugin[name]); - } else { - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Unknown hook \"" + name + "\".") : void 0; - } - } - - return registry; - }, { - onCreateRule: [], - onProcessRule: [], - onProcessStyle: [], - onProcessSheet: [], - onChangeValue: [], - onUpdate: [] - }); + _proto.toString = function toString() { + return this.rules.toString(); }; - return PluginsRegistry; + return GlobalContainerRule; }(); -/** - * Sheets registry to access them all at one place. - */ -var SheetsRegistry = +var GlobalPrefixedRule = /*#__PURE__*/ function () { - function SheetsRegistry() { - this.registry = []; + function GlobalPrefixedRule(key, style, options) { + this.type = 'global'; + this.at = at; + this.options = void 0; + this.rule = void 0; + this.isProcessed = false; + this.key = void 0; + this.key = key; + this.options = options; + var selector = key.substr(atPrefix.length); + this.rule = options.jss.createRule(selector, style, _extends$l({}, options, { + parent: this + })); } - var _proto = SheetsRegistry.prototype; + var _proto2 = GlobalPrefixedRule.prototype; - /** - * Register a Style Sheet. - */ - _proto.add = function add(sheet) { - var registry = this.registry; - var index = sheet.options.index; - if (registry.indexOf(sheet) !== -1) return; + _proto2.toString = function toString(options) { + return this.rule ? this.rule.toString(options) : ''; + }; - if (registry.length === 0 || index >= this.index) { - registry.push(sheet); - return; - } // Find a position. + return GlobalPrefixedRule; +}(); +var separatorRegExp$1 = /\s*,\s*/g; - for (var i = 0; i < registry.length; i++) { - if (registry[i].options.index > index) { - registry.splice(i, 0, sheet); - return; - } - } - } - /** - * Reset the registry. - */ - ; +function addScope(selector, scope) { + var parts = selector.split(separatorRegExp$1); + var scoped = ''; - _proto.reset = function reset() { - this.registry = []; + for (var i = 0; i < parts.length; i++) { + scoped += scope + " " + parts[i].trim(); + if (parts[i + 1]) scoped += ', '; } - /** - * Remove a Style Sheet. - */ - ; - _proto.remove = function remove(sheet) { - var index = this.registry.indexOf(sheet); - this.registry.splice(index, 1); + return scoped; +} + +function handleNestedGlobalContainerRule(rule, sheet) { + var options = rule.options, + style = rule.style; + var rules = style ? style[at] : null; + if (!rules) return; + + for (var name in rules) { + sheet.addRule(name, rules[name], _extends$l({}, options, { + selector: addScope(name, rule.selector) + })); } - /** - * Convert all attached sheets to a CSS string. - */ - ; - _proto.toString = function toString(_temp) { - var _ref = _temp === void 0 ? {} : _temp, - attached = _ref.attached, - options = _objectWithoutPropertiesLoose$b(_ref, ["attached"]); + delete style[at]; +} - var css = ''; +function handlePrefixedGlobalRule(rule, sheet) { + var options = rule.options, + style = rule.style; - for (var i = 0; i < this.registry.length; i++) { - var sheet = this.registry[i]; + for (var prop in style) { + if (prop[0] !== '@' || prop.substr(0, at.length) !== at) continue; + var selector = addScope(prop.substr(at.length), rule.selector); + sheet.addRule(selector, style[prop], _extends$l({}, options, { + selector: selector + })); + delete style[prop]; + } +} +/** + * Convert nested rules to separate, remove them from original styles. + * + * @param {Rule} rule + * @api public + */ - if (attached != null && sheet.attached !== attached) { - continue; - } - if (css) css += '\n'; - css += sheet.toString(options); +function jssGlobal() { + function onCreateRule(name, styles, options) { + if (!name) return null; + + if (name === at) { + return new GlobalContainerRule(name, styles, options); } - return css; - }; + if (name[0] === '@' && name.substr(0, atPrefix.length) === atPrefix) { + return new GlobalPrefixedRule(name, styles, options); + } - _createClass$9(SheetsRegistry, [{ - key: "index", + var parent = options.parent; - /** - * Current highest index number. - */ - get: function get() { - return this.registry.length === 0 ? 0 : this.registry[this.registry.length - 1].options.index; + if (parent) { + if (parent.type === 'global' || parent.options.parent && parent.options.parent.type === 'global') { + options.scoped = false; + } } - }]); - return SheetsRegistry; -}(); + if (options.scoped === false) { + options.selector = name; + } -/** - * This is a global sheets registry. Only DomRenderer will add sheets to it. - * On the server one should use an own SheetsRegistry instance and add the - * sheets to it, because you need to make sure to create a new registry for - * each request in order to not leak sheets across requests. - */ + return null; + } -var registry$1 = new SheetsRegistry(); + function onProcessRule(rule, sheet) { + if (rule.type !== 'style' || !sheet) return; + handleNestedGlobalContainerRule(rule, sheet); + handlePrefixedGlobalRule(rule, sheet); + } -/* eslint-disable */ + return { + onCreateRule: onCreateRule, + onProcessRule: onProcessRule + }; +} +var separatorRegExp = /\s*,\s*/g; +var parentRegExp = /&/g; +var refRegExp = /\$([\w-]+)/g; /** - * Now that `globalThis` is available on most platforms - * (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis#browser_compatibility) - * we check for `globalThis` first. `globalThis` is necessary for jss - * to run in Agoric's secure version of JavaScript (SES). Under SES, - * `globalThis` exists, but `window`, `self`, and `Function('return - * this')()` are all undefined for security reasons. + * Convert nested rules to separate, remove them from original styles. * - * https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 + * @param {Rule} rule + * @api public */ -var globalThis$1 = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' && window.Math === Math ? window : typeof self !== 'undefined' && self.Math === Math ? self : Function('return this')(); - -var ns = '2f1acc6c3a606b082e5eef5e54414ffb'; -if (globalThis$1[ns] == null) globalThis$1[ns] = 0; // Bundle may contain multiple JSS versions at the same time. In order to identify -// the current version with just one short number and use it for classes generation -// we use a counter. Also it is more accurate, because user can manually reevaluate -// the module. -var moduleId = globalThis$1[ns]++; +function jssNested() { + // Get a function to be used for $ref replacement. + function getReplaceRef(container, sheet) { + return function (match, key) { + var rule = container.getRule(key) || sheet && sheet.getRule(key); -var maxRules = 1e10; + if (rule) { + rule = rule; + return rule.selector; + } -/** - * Returns a function which generates unique class names based on counters. - * When new generator function is created, rule counter is reseted. - * We need to reset the rule counter for SSR for each request. - */ -var createGenerateId = function createGenerateId(options) { - if (options === void 0) { - options = {}; + process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Could not find the referenced rule \"" + key + "\" in \"" + (container.options.meta || container.toString()) + "\".") : void 0; + return key; + }; } - var ruleCounter = 0; - - var generateId = function generateId(rule, sheet) { - ruleCounter += 1; - - if (ruleCounter > maxRules) { - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] You might have a memory leak. Rule counter is at " + ruleCounter + ".") : void 0; - } + function replaceParentRefs(nestedProp, parentProp) { + var parentSelectors = parentProp.split(separatorRegExp); + var nestedSelectors = nestedProp.split(separatorRegExp); + var result = ''; - var jssId = ''; - var prefix = ''; + for (var i = 0; i < parentSelectors.length; i++) { + var parent = parentSelectors[i]; - if (sheet) { - if (sheet.options.classNamePrefix) { - prefix = sheet.options.classNamePrefix; - } + for (var j = 0; j < nestedSelectors.length; j++) { + var nested = nestedSelectors[j]; + if (result) result += ', '; // Replace all & by the parent or prefix & with the parent. - if (sheet.options.jss.id != null) { - jssId = String(sheet.options.jss.id); + result += nested.indexOf('&') !== -1 ? nested.replace(parentRegExp, parent) : parent + " " + nested; } } - if (options.minify) { - // Using "c" because a number can't be the first char in a class name. - return "" + (prefix || 'c') + moduleId + jssId + ruleCounter; - } - - return prefix + rule.key + "-" + moduleId + (jssId ? "-" + jssId : '') + "-" + ruleCounter; - }; - - return generateId; -}; - -/** - * Cache the value from the first time a function is called. - */ -var memoize = function memoize(fn) { - var value; - return function () { - if (!value) value = fn(); - return value; - }; -}; - -/** - * Get a style property value. - */ -var getPropertyValue = function getPropertyValue(cssRule, prop) { - try { - // Support CSSTOM. - if (cssRule.attributeStyleMap) { - return cssRule.attributeStyleMap.get(prop); - } - - return cssRule.style.getPropertyValue(prop); - } catch (err) { - // IE may throw if property is unknown. - return ''; + return result; } -}; -/** - * Set a style property. - */ -var setProperty = function setProperty(cssRule, prop, value) { - try { - var cssValue = value; - - if (Array.isArray(value)) { - cssValue = toCssValue(value, true); - - if (value[value.length - 1] === '!important') { - cssRule.style.setProperty(prop, cssValue, 'important'); - return true; - } - } // Support CSSTOM. + function getOptions(rule, container, prevOptions) { + // Options has been already created, now we only increase index. + if (prevOptions) return _extends$l({}, prevOptions, { + index: prevOptions.index + 1 // $FlowFixMe[prop-missing] + }); + var nestingLevel = rule.options.nestingLevel; + nestingLevel = nestingLevel === undefined ? 1 : nestingLevel + 1; - if (cssRule.attributeStyleMap) { - cssRule.attributeStyleMap.set(prop, cssValue); - } else { - cssRule.style.setProperty(prop, cssValue); - } - } catch (err) { - // IE may throw if property is unknown. - return false; - } + var options = _extends$l({}, rule.options, { + nestingLevel: nestingLevel, + index: container.indexOf(rule) + 1 // We don't need the parent name to be set options for chlid. - return true; -}; + }); -/** - * Remove a style property. - */ -var removeProperty = function removeProperty(cssRule, prop) { - try { - // Support CSSTOM. - if (cssRule.attributeStyleMap) { - cssRule.attributeStyleMap.delete(prop); - } else { - cssRule.style.removeProperty(prop); - } - } catch (err) { - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] DOMException \"" + err.message + "\" was thrown. Tried to remove property \"" + prop + "\".") : void 0; + delete options.name; + return options; } -}; -/** - * Set the selector. - */ -var setSelector = function setSelector(cssRule, selectorText) { - cssRule.selectorText = selectorText; // Return false if setter was not successful. - // Currently works in chrome only. + function onProcessStyle(style, rule, sheet) { + if (rule.type !== 'style') return style; + var styleRule = rule; + var container = styleRule.options.parent; + var options; + var replaceRef; - return cssRule.selectorText === selectorText; -}; -/** - * Gets the `head` element upon the first call and caches it. - * We assume it can't be null. - */ + for (var prop in style) { + var isNested = prop.indexOf('&') !== -1; + var isNestedConditional = prop[0] === '@'; + if (!isNested && !isNestedConditional) continue; + options = getOptions(styleRule, container, options); + if (isNested) { + var selector = replaceParentRefs(prop, styleRule.selector); // Lazily create the ref replacer function just once for + // all nested rules within the sheet. -var getHead = memoize(function () { - return document.querySelector('head'); -}); -/** - * Find attached sheet with an index higher than the passed one. - */ + if (!replaceRef) replaceRef = getReplaceRef(container, sheet); // Replace all $refs. -function findHigherSheet(registry, options) { - for (var i = 0; i < registry.length; i++) { - var sheet = registry[i]; + selector = selector.replace(refRegExp, replaceRef); + container.addRule(selector, style[prop], _extends$l({}, options, { + selector: selector + })); + } else if (isNestedConditional) { + // Place conditional right after the parent rule to ensure right ordering. + container.addRule(prop, {}, options) // Flow expects more options but they aren't required + // And flow doesn't know this will always be a StyleRule which has the addRule method + // $FlowFixMe[incompatible-use] + // $FlowFixMe[prop-missing] + .addRule(styleRule.key, style[prop], { + selector: styleRule.selector + }); + } - if (sheet.attached && sheet.options.index > options.index && sheet.options.insertionPoint === options.insertionPoint) { - return sheet; + delete style[prop]; } - } - - return null; -} -/** - * Find attached sheet with the highest index. - */ - - -function findHighestSheet(registry, options) { - for (var i = registry.length - 1; i >= 0; i--) { - var sheet = registry[i]; - if (sheet.attached && sheet.options.insertionPoint === options.insertionPoint) { - return sheet; - } + return style; } - return null; + return { + onProcessStyle: onProcessStyle + }; } -/** - * Find a comment with "jss" inside. - */ +/* eslint-disable no-var, prefer-template */ +var uppercasePattern = /[A-Z]/g; +var msPattern = /^ms-/; +var cache$2 = {}; -function findCommentNode(text) { - var head = getHead(); - - for (var i = 0; i < head.childNodes.length; i++) { - var node = head.childNodes[i]; +function toHyphenLower(match) { + return '-' + match.toLowerCase() +} - if (node.nodeType === 8 && node.nodeValue.trim() === text) { - return node; - } +function hyphenateStyleName(name) { + if (cache$2.hasOwnProperty(name)) { + return cache$2[name] } - return null; + var hName = name.replace(uppercasePattern, toHyphenLower); + return (cache$2[name] = msPattern.test(hName) ? '-' + hName : hName) } /** - * Find a node before which we can insert the sheet. + * Convert camel cased property names to dash separated. + * + * @param {Object} style + * @return {Object} */ -function findPrevNode(options) { - var registry$1$1 = registry$1.registry; - - if (registry$1$1.length > 0) { - // Try to insert before the next higher sheet. - var sheet = findHigherSheet(registry$1$1, options); - - if (sheet && sheet.renderer) { - return { - parent: sheet.renderer.element.parentNode, - node: sheet.renderer.element - }; - } // Otherwise insert after the last attached. - - - sheet = findHighestSheet(registry$1$1, options); - - if (sheet && sheet.renderer) { - return { - parent: sheet.renderer.element.parentNode, - node: sheet.renderer.element.nextSibling - }; - } - } // Try to find a comment placeholder if registry is empty. - - - var insertionPoint = options.insertionPoint; - - if (insertionPoint && typeof insertionPoint === 'string') { - var comment = findCommentNode(insertionPoint); - - if (comment) { - return { - parent: comment.parentNode, - node: comment.nextSibling - }; - } // If user specifies an insertion point and it can't be found in the document - - // bad specificity issues may appear. +function convertCase(style) { + var converted = {}; - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Insertion point \"" + insertionPoint + "\" not found.") : void 0; + for (var prop in style) { + var key = prop.indexOf('--') === 0 ? prop : hyphenateStyleName(prop); + converted[key] = style[prop]; } - return false; -} -/** - * Insert style element into the DOM. - */ - - -function insertStyle(style, options) { - var insertionPoint = options.insertionPoint; - var nextNode = findPrevNode(options); - - if (nextNode !== false && nextNode.parent) { - nextNode.parent.insertBefore(style, nextNode.node); - return; - } // Works with iframes and any node types. - - - if (insertionPoint && typeof insertionPoint.nodeType === 'number') { - // https://stackoverflow.com/questions/41328728/force-casting-in-flow - var insertionPointElement = insertionPoint; - var parentNode = insertionPointElement.parentNode; - if (parentNode) parentNode.insertBefore(style, insertionPointElement.nextSibling);else process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Insertion point is not in the DOM.') : void 0; - return; + if (style.fallbacks) { + if (Array.isArray(style.fallbacks)) converted.fallbacks = style.fallbacks.map(convertCase);else converted.fallbacks = convertCase(style.fallbacks); } - getHead().appendChild(style); + return converted; } /** - * Read jss nonce setting from the page if the user has set it. + * Allow camel cased property names by converting them back to dasherized. + * + * @param {Rule} rule */ -var getNonce = memoize(function () { - var node = document.querySelector('meta[property="csp-nonce"]'); - return node ? node.getAttribute('content') : null; -}); - -var _insertRule = function insertRule(container, rule, index) { - try { - if ('insertRule' in container) { - var c = container; - c.insertRule(rule, index); - } // Keyframes rule. - else if ('appendRule' in container) { - var _c = container; - - _c.appendRule(rule); +function camelCase() { + function onProcessStyle(style) { + if (Array.isArray(style)) { + // Handle rules like @font-face, which can have multiple styles in an array + for (var index = 0; index < style.length; index++) { + style[index] = convertCase(style[index]); } - } catch (err) { - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] " + err.message) : void 0; - return false; - } - - return container.cssRules[index]; -}; - -var getValidRuleInsertionIndex = function getValidRuleInsertionIndex(container, index) { - var maxIndex = container.cssRules.length; // In case previous insertion fails, passed index might be wrong - - if (index === undefined || index > maxIndex) { - // eslint-disable-next-line no-param-reassign - return maxIndex; - } - - return index; -}; - -var createStyle = function createStyle() { - var el = document.createElement('style'); // Without it, IE will have a broken source order specificity if we - // insert rules after we insert the style tag. - // It seems to kick-off the source order specificity algorithm. - - el.textContent = '\n'; - return el; -}; - -var DomRenderer = -/*#__PURE__*/ -function () { - // HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696 - // Will be empty if link: true option is not set, because - // it is only for use together with insertRule API. - function DomRenderer(sheet) { - this.getPropertyValue = getPropertyValue; - this.setProperty = setProperty; - this.removeProperty = removeProperty; - this.setSelector = setSelector; - this.element = void 0; - this.sheet = void 0; - this.hasInsertedRules = false; - this.cssRules = []; - // There is no sheet when the renderer is used from a standalone StyleRule. - if (sheet) registry$1.add(sheet); - this.sheet = sheet; - - var _ref = this.sheet ? this.sheet.options : {}, - media = _ref.media, - meta = _ref.meta, - element = _ref.element; - - this.element = element || createStyle(); - this.element.setAttribute('data-jss', ''); - if (media) this.element.setAttribute('media', media); - if (meta) this.element.setAttribute('data-meta', meta); - var nonce = getNonce(); - if (nonce) this.element.setAttribute('nonce', nonce); - } - /** - * Insert style element into render tree. - */ - - - var _proto = DomRenderer.prototype; - - _proto.attach = function attach() { - // In the case the element node is external and it is already in the DOM. - if (this.element.parentNode || !this.sheet) return; - insertStyle(this.element, this.sheet.options); // When rules are inserted using `insertRule` API, after `sheet.detach().attach()` - // most browsers create a new CSSStyleSheet, except of all IEs. - - var deployed = Boolean(this.sheet && this.sheet.deployed); - - if (this.hasInsertedRules && deployed) { - this.hasInsertedRules = false; - this.deploy(); - } - } - /** - * Remove style element from render tree. - */ - ; - - _proto.detach = function detach() { - if (!this.sheet) return; - var parentNode = this.element.parentNode; - if (parentNode) parentNode.removeChild(this.element); // In the most browsers, rules inserted using insertRule() API will be lost when style element is removed. - // Though IE will keep them and we need a consistent behavior. - - if (this.sheet.options.link) { - this.cssRules = []; - this.element.textContent = '\n'; - } - } - /** - * Inject CSS string into element. - */ - ; - - _proto.deploy = function deploy() { - var sheet = this.sheet; - if (!sheet) return; - if (sheet.options.link) { - this.insertRules(sheet.rules); - return; + return style; } - this.element.textContent = "\n" + sheet.toString() + "\n"; - } - /** - * Insert RuleList into an element. - */ - ; - - _proto.insertRules = function insertRules(rules, nativeParent) { - for (var i = 0; i < rules.index.length; i++) { - this.insertRule(rules.index[i], i, nativeParent); - } + return convertCase(style); } - /** - * Insert a rule into element. - */ - ; - _proto.insertRule = function insertRule(rule, index, nativeParent) { - if (nativeParent === void 0) { - nativeParent = this.element.sheet; + function onChangeValue(value, prop, rule) { + if (prop.indexOf('--') === 0) { + return value; } - if (rule.rules) { - var parent = rule; - var latestNativeParent = nativeParent; - - if (rule.type === 'conditional' || rule.type === 'keyframes') { - var _insertionIndex = getValidRuleInsertionIndex(nativeParent, index); // We need to render the container without children first. - + var hyphenatedProp = hyphenateStyleName(prop); // There was no camel case in place - latestNativeParent = _insertRule(nativeParent, parent.toString({ - children: false - }), _insertionIndex); + if (prop === hyphenatedProp) return value; + rule.prop(hyphenatedProp, value); // Core will ignore that property value we set the proper one above. - if (latestNativeParent === false) { - return false; - } + return null; + } - this.refCssRule(rule, _insertionIndex, latestNativeParent); - } + return { + onProcessStyle: onProcessStyle, + onChangeValue: onChangeValue + }; +} - this.insertRules(parent.rules, latestNativeParent); - return latestNativeParent; - } +var px = hasCSSTOMSupport && CSS ? CSS.px : 'px'; +var ms = hasCSSTOMSupport && CSS ? CSS.ms : 'ms'; +var percent = hasCSSTOMSupport && CSS ? CSS.percent : '%'; +/** + * Generated jss-plugin-default-unit CSS property units + * + * @type object + */ - var ruleStr = rule.toString(); - if (!ruleStr) return false; - var insertionIndex = getValidRuleInsertionIndex(nativeParent, index); - - var nativeRule = _insertRule(nativeParent, ruleStr, insertionIndex); - - if (nativeRule === false) { - return false; - } - - this.hasInsertedRules = true; - this.refCssRule(rule, insertionIndex, nativeRule); - return nativeRule; - }; - - _proto.refCssRule = function refCssRule(rule, index, cssRule) { - rule.renderable = cssRule; // We only want to reference the top level rules, deleteRule API doesn't support removing nested rules - // like rules inside media queries or keyframes - - if (rule.options.parent instanceof StyleSheet) { - this.cssRules[index] = cssRule; - } - } - /** - * Delete a rule. - */ - ; - - _proto.deleteRule = function deleteRule(cssRule) { - var sheet = this.element.sheet; - var index = this.indexOf(cssRule); - if (index === -1) return false; - sheet.deleteRule(index); - this.cssRules.splice(index, 1); - return true; - } - /** - * Get index of a CSS Rule. - */ - ; - - _proto.indexOf = function indexOf(cssRule) { - return this.cssRules.indexOf(cssRule); - } - /** - * Generate a new CSS rule and replace the existing one. - * - * Only used for some old browsers because they can't set a selector. - */ - ; - - _proto.replaceRule = function replaceRule(cssRule, rule) { - var index = this.indexOf(cssRule); - if (index === -1) return false; - this.element.sheet.deleteRule(index); - this.cssRules.splice(index, 1); - return this.insertRule(rule, index); - } - /** - * Get all rules elements. - */ - ; - - _proto.getRules = function getRules() { - return this.element.sheet.cssRules; - }; - - return DomRenderer; -}(); - -var instanceCounter = 0; - -var Jss = -/*#__PURE__*/ -function () { - function Jss(options) { - this.id = instanceCounter++; - this.version = "10.7.1"; - this.plugins = new PluginsRegistry(); - this.options = { - id: { - minify: false - }, - createGenerateId: createGenerateId, - Renderer: isBrowser$1 ? DomRenderer : null, - plugins: [] - }; - this.generateId = createGenerateId({ - minify: false - }); - - for (var i = 0; i < plugins$1.length; i++) { - this.plugins.use(plugins$1[i], { - queue: 'internal' - }); - } - - this.setup(options); - } - /** - * Prepares various options, applies plugins. - * Should not be used twice on the same instance, because there is no plugins - * deduplication logic. - */ - - - var _proto = Jss.prototype; - - _proto.setup = function setup(options) { - if (options === void 0) { - options = {}; - } - - if (options.createGenerateId) { - this.options.createGenerateId = options.createGenerateId; - } - - if (options.id) { - this.options.id = _extends$m({}, this.options.id, options.id); - } - - if (options.createGenerateId || options.id) { - this.generateId = this.options.createGenerateId(this.options.id); - } - - if (options.insertionPoint != null) this.options.insertionPoint = options.insertionPoint; - - if ('Renderer' in options) { - this.options.Renderer = options.Renderer; - } // eslint-disable-next-line prefer-spread - - - if (options.plugins) this.use.apply(this, options.plugins); - return this; - } - /** - * Create a Style Sheet. - */ - ; - - _proto.createStyleSheet = function createStyleSheet(styles, options) { - if (options === void 0) { - options = {}; - } - - var _options = options, - index = _options.index; - - if (typeof index !== 'number') { - index = registry$1.index === 0 ? 0 : registry$1.index + 1; - } - - var sheet = new StyleSheet(styles, _extends$m({}, options, { - jss: this, - generateId: options.generateId || this.generateId, - insertionPoint: this.options.insertionPoint, - Renderer: this.options.Renderer, - index: index - })); - this.plugins.onProcessSheet(sheet); - return sheet; - } - /** - * Detach the Style Sheet and remove it from the registry. - */ - ; - - _proto.removeStyleSheet = function removeStyleSheet(sheet) { - sheet.detach(); - registry$1.remove(sheet); - return this; - } - /** - * Create a rule without a Style Sheet. - * [Deprecated] will be removed in the next major version. - */ - ; - - _proto.createRule = function createRule$1(name, style, options) { - if (style === void 0) { - style = {}; - } - - if (options === void 0) { - options = {}; - } - - // Enable rule without name for inline styles. - if (typeof name === 'object') { - // $FlowFixMe[incompatible-call] - return this.createRule(undefined, name, style); - } // $FlowFixMe[incompatible-type] - - - var ruleOptions = _extends$m({}, options, { - name: name, - jss: this, - Renderer: this.options.Renderer - }); - - if (!ruleOptions.generateId) ruleOptions.generateId = this.generateId; - if (!ruleOptions.classes) ruleOptions.classes = {}; - if (!ruleOptions.keyframes) ruleOptions.keyframes = {}; - - var rule = createRule(name, style, ruleOptions); - - if (rule) this.plugins.onProcessRule(rule); - return rule; - } - /** - * Register plugin. Passed function will be invoked with a rule instance. - */ - ; - - _proto.use = function use() { - var _this = this; - - for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) { - plugins[_key] = arguments[_key]; - } - - plugins.forEach(function (plugin) { - _this.plugins.use(plugin); - }); - return this; - }; - - return Jss; -}(); - -/** - * Extracts a styles object with only props that contain function values. - */ -function getDynamicStyles(styles) { - var to = null; - - for (var key in styles) { - var value = styles[key]; - var type = typeof value; - - if (type === 'function') { - if (!to) to = {}; - to[key] = value; - } else if (type === 'object' && value !== null && !Array.isArray(value)) { - var extracted = getDynamicStyles(value); - - if (extracted) { - if (!to) to = {}; - to[key] = extracted; - } - } - } - - return to; -} - -/** - * A better abstraction over CSS. - * - * @copyright Oleg Isonen (Slobodskoi) / Isonen 2014-present - * @website https://github.com/cssinjs/jss - * @license MIT - */ - -/** - * Export a constant indicating if this browser has CSSTOM support. - * https://developers.google.com/web/updates/2018/03/cssom - */ -var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS; -/** - * Creates a new instance of Jss. - */ - -var create$1 = function create(options) { - return new Jss(options); -}; -/** - * A global Jss instance. - */ - -create$1(); - -var now = Date.now(); -var fnValuesNs = "fnValues" + now; -var fnRuleNs = "fnStyle" + ++now; - -var functionPlugin = function functionPlugin() { - return { - onCreateRule: function onCreateRule(name, decl, options) { - if (typeof decl !== 'function') return null; - var rule = createRule(name, {}, options); - rule[fnRuleNs] = decl; - return rule; - }, - onProcessStyle: function onProcessStyle(style, rule) { - // We need to extract function values from the declaration, so that we can keep core unaware of them. - // We need to do that only once. - // We don't need to extract functions on each style update, since this can happen only once. - // We don't support function values inside of function rules. - if (fnValuesNs in rule || fnRuleNs in rule) return style; - var fnValues = {}; - - for (var prop in style) { - var value = style[prop]; - if (typeof value !== 'function') continue; - delete style[prop]; - fnValues[prop] = value; - } // $FlowFixMe[prop-missing] - - - rule[fnValuesNs] = fnValues; - return style; - }, - onUpdate: function onUpdate(data, rule, sheet, options) { - var styleRule = rule; // $FlowFixMe[prop-missing] - - var fnRule = styleRule[fnRuleNs]; // If we have a style function, the entire rule is dynamic and style object - // will be returned from that function. - - if (fnRule) { - // Empty object will remove all currently defined props - // in case function rule returns a falsy value. - styleRule.style = fnRule(data) || {}; - - if (process.env.NODE_ENV === 'development') { - for (var prop in styleRule.style) { - if (typeof styleRule.style[prop] === 'function') { - process.env.NODE_ENV !== "production" ? warning$3(false, '[JSS] Function values inside function rules are not supported.') : void 0; - break; - } - } - } - } // $FlowFixMe[prop-missing] - - - var fnValues = styleRule[fnValuesNs]; // If we have a fn values map, it is a rule with function values. - - if (fnValues) { - for (var _prop in fnValues) { - styleRule.prop(_prop, fnValues[_prop](data), options); - } - } - } - }; -}; - -var functions = functionPlugin; - -var at = '@global'; -var atPrefix = '@global '; - -var GlobalContainerRule = -/*#__PURE__*/ -function () { - function GlobalContainerRule(key, styles, options) { - this.type = 'global'; - this.at = at; - this.rules = void 0; - this.options = void 0; - this.key = void 0; - this.isProcessed = false; - this.key = key; - this.options = options; - this.rules = new RuleList(_extends$m({}, options, { - parent: this - })); - - for (var selector in styles) { - this.rules.add(selector, styles[selector]); - } - - this.rules.process(); - } - /** - * Get a rule. - */ - - - var _proto = GlobalContainerRule.prototype; - - _proto.getRule = function getRule(name) { - return this.rules.get(name); - } - /** - * Create and register rule, run plugins. - */ - ; - - _proto.addRule = function addRule(name, style, options) { - var rule = this.rules.add(name, style, options); - if (rule) this.options.jss.plugins.onProcessRule(rule); - return rule; - } - /** - * Get index of a rule. - */ - ; - - _proto.indexOf = function indexOf(rule) { - return this.rules.indexOf(rule); - } - /** - * Generates a CSS string. - */ - ; - - _proto.toString = function toString() { - return this.rules.toString(); - }; - - return GlobalContainerRule; -}(); - -var GlobalPrefixedRule = -/*#__PURE__*/ -function () { - function GlobalPrefixedRule(key, style, options) { - this.type = 'global'; - this.at = at; - this.options = void 0; - this.rule = void 0; - this.isProcessed = false; - this.key = void 0; - this.key = key; - this.options = options; - var selector = key.substr(atPrefix.length); - this.rule = options.jss.createRule(selector, style, _extends$m({}, options, { - parent: this - })); - } - - var _proto2 = GlobalPrefixedRule.prototype; - - _proto2.toString = function toString(options) { - return this.rule ? this.rule.toString(options) : ''; - }; - - return GlobalPrefixedRule; -}(); - -var separatorRegExp$1 = /\s*,\s*/g; - -function addScope(selector, scope) { - var parts = selector.split(separatorRegExp$1); - var scoped = ''; - - for (var i = 0; i < parts.length; i++) { - scoped += scope + " " + parts[i].trim(); - if (parts[i + 1]) scoped += ', '; - } - - return scoped; -} - -function handleNestedGlobalContainerRule(rule, sheet) { - var options = rule.options, - style = rule.style; - var rules = style ? style[at] : null; - if (!rules) return; - - for (var name in rules) { - sheet.addRule(name, rules[name], _extends$m({}, options, { - selector: addScope(name, rule.selector) - })); - } - - delete style[at]; -} - -function handlePrefixedGlobalRule(rule, sheet) { - var options = rule.options, - style = rule.style; - - for (var prop in style) { - if (prop[0] !== '@' || prop.substr(0, at.length) !== at) continue; - var selector = addScope(prop.substr(at.length), rule.selector); - sheet.addRule(selector, style[prop], _extends$m({}, options, { - selector: selector - })); - delete style[prop]; - } -} -/** - * Convert nested rules to separate, remove them from original styles. - * - * @param {Rule} rule - * @api public - */ - - -function jssGlobal() { - function onCreateRule(name, styles, options) { - if (!name) return null; - - if (name === at) { - return new GlobalContainerRule(name, styles, options); - } - - if (name[0] === '@' && name.substr(0, atPrefix.length) === atPrefix) { - return new GlobalPrefixedRule(name, styles, options); - } - - var parent = options.parent; - - if (parent) { - if (parent.type === 'global' || parent.options.parent && parent.options.parent.type === 'global') { - options.scoped = false; - } - } - - if (options.scoped === false) { - options.selector = name; - } - - return null; - } - - function onProcessRule(rule, sheet) { - if (rule.type !== 'style' || !sheet) return; - handleNestedGlobalContainerRule(rule, sheet); - handlePrefixedGlobalRule(rule, sheet); - } - - return { - onCreateRule: onCreateRule, - onProcessRule: onProcessRule - }; -} - -var separatorRegExp = /\s*,\s*/g; -var parentRegExp = /&/g; -var refRegExp = /\$([\w-]+)/g; -/** - * Convert nested rules to separate, remove them from original styles. - * - * @param {Rule} rule - * @api public - */ - -function jssNested() { - // Get a function to be used for $ref replacement. - function getReplaceRef(container, sheet) { - return function (match, key) { - var rule = container.getRule(key) || sheet && sheet.getRule(key); - - if (rule) { - rule = rule; - return rule.selector; - } - - process.env.NODE_ENV !== "production" ? warning$3(false, "[JSS] Could not find the referenced rule \"" + key + "\" in \"" + (container.options.meta || container.toString()) + "\".") : void 0; - return key; - }; - } - - function replaceParentRefs(nestedProp, parentProp) { - var parentSelectors = parentProp.split(separatorRegExp); - var nestedSelectors = nestedProp.split(separatorRegExp); - var result = ''; - - for (var i = 0; i < parentSelectors.length; i++) { - var parent = parentSelectors[i]; - - for (var j = 0; j < nestedSelectors.length; j++) { - var nested = nestedSelectors[j]; - if (result) result += ', '; // Replace all & by the parent or prefix & with the parent. - - result += nested.indexOf('&') !== -1 ? nested.replace(parentRegExp, parent) : parent + " " + nested; - } - } - - return result; - } - - function getOptions(rule, container, prevOptions) { - // Options has been already created, now we only increase index. - if (prevOptions) return _extends$m({}, prevOptions, { - index: prevOptions.index + 1 // $FlowFixMe[prop-missing] - - }); - var nestingLevel = rule.options.nestingLevel; - nestingLevel = nestingLevel === undefined ? 1 : nestingLevel + 1; - - var options = _extends$m({}, rule.options, { - nestingLevel: nestingLevel, - index: container.indexOf(rule) + 1 // We don't need the parent name to be set options for chlid. - - }); - - delete options.name; - return options; - } - - function onProcessStyle(style, rule, sheet) { - if (rule.type !== 'style') return style; - var styleRule = rule; - var container = styleRule.options.parent; - var options; - var replaceRef; - - for (var prop in style) { - var isNested = prop.indexOf('&') !== -1; - var isNestedConditional = prop[0] === '@'; - if (!isNested && !isNestedConditional) continue; - options = getOptions(styleRule, container, options); - - if (isNested) { - var selector = replaceParentRefs(prop, styleRule.selector); // Lazily create the ref replacer function just once for - // all nested rules within the sheet. - - if (!replaceRef) replaceRef = getReplaceRef(container, sheet); // Replace all $refs. - - selector = selector.replace(refRegExp, replaceRef); - container.addRule(selector, style[prop], _extends$m({}, options, { - selector: selector - })); - } else if (isNestedConditional) { - // Place conditional right after the parent rule to ensure right ordering. - container.addRule(prop, {}, options) // Flow expects more options but they aren't required - // And flow doesn't know this will always be a StyleRule which has the addRule method - // $FlowFixMe[incompatible-use] - // $FlowFixMe[prop-missing] - .addRule(styleRule.key, style[prop], { - selector: styleRule.selector - }); - } - - delete style[prop]; - } - - return style; - } - - return { - onProcessStyle: onProcessStyle - }; -} - -/* eslint-disable no-var, prefer-template */ -var uppercasePattern = /[A-Z]/g; -var msPattern = /^ms-/; -var cache$2 = {}; - -function toHyphenLower(match) { - return '-' + match.toLowerCase() -} - -function hyphenateStyleName(name) { - if (cache$2.hasOwnProperty(name)) { - return cache$2[name] - } - - var hName = name.replace(uppercasePattern, toHyphenLower); - return (cache$2[name] = msPattern.test(hName) ? '-' + hName : hName) -} - -/** - * Convert camel cased property names to dash separated. - * - * @param {Object} style - * @return {Object} - */ - -function convertCase(style) { - var converted = {}; - - for (var prop in style) { - var key = prop.indexOf('--') === 0 ? prop : hyphenateStyleName(prop); - converted[key] = style[prop]; - } - - if (style.fallbacks) { - if (Array.isArray(style.fallbacks)) converted.fallbacks = style.fallbacks.map(convertCase);else converted.fallbacks = convertCase(style.fallbacks); - } - - return converted; -} -/** - * Allow camel cased property names by converting them back to dasherized. - * - * @param {Rule} rule - */ - - -function camelCase() { - function onProcessStyle(style) { - if (Array.isArray(style)) { - // Handle rules like @font-face, which can have multiple styles in an array - for (var index = 0; index < style.length; index++) { - style[index] = convertCase(style[index]); - } - - return style; - } - - return convertCase(style); - } - - function onChangeValue(value, prop, rule) { - if (prop.indexOf('--') === 0) { - return value; - } - - var hyphenatedProp = hyphenateStyleName(prop); // There was no camel case in place - - if (prop === hyphenatedProp) return value; - rule.prop(hyphenatedProp, value); // Core will ignore that property value we set the proper one above. - - return null; - } - - return { - onProcessStyle: onProcessStyle, - onChangeValue: onChangeValue - }; -} - -var px = hasCSSTOMSupport && CSS ? CSS.px : 'px'; -var ms = hasCSSTOMSupport && CSS ? CSS.ms : 'ms'; -var percent = hasCSSTOMSupport && CSS ? CSS.percent : '%'; -/** - * Generated jss-plugin-default-unit CSS property units - * - * @type object - */ - -var defaultUnits = { - // Animation properties - 'animation-delay': ms, - 'animation-duration': ms, - // Background properties - 'background-position': px, - 'background-position-x': px, - 'background-position-y': px, - 'background-size': px, - // Border Properties - border: px, - 'border-bottom': px, - 'border-bottom-left-radius': px, - 'border-bottom-right-radius': px, - 'border-bottom-width': px, - 'border-left': px, - 'border-left-width': px, - 'border-radius': px, - 'border-right': px, - 'border-right-width': px, - 'border-top': px, - 'border-top-left-radius': px, - 'border-top-right-radius': px, - 'border-top-width': px, - 'border-width': px, - 'border-block': px, - 'border-block-end': px, - 'border-block-end-width': px, - 'border-block-start': px, - 'border-block-start-width': px, - 'border-block-width': px, - 'border-inline': px, - 'border-inline-end': px, - 'border-inline-end-width': px, - 'border-inline-start': px, - 'border-inline-start-width': px, - 'border-inline-width': px, - 'border-start-start-radius': px, - 'border-start-end-radius': px, - 'border-end-start-radius': px, - 'border-end-end-radius': px, - // Margin properties - margin: px, - 'margin-bottom': px, - 'margin-left': px, - 'margin-right': px, - 'margin-top': px, - 'margin-block': px, - 'margin-block-end': px, - 'margin-block-start': px, - 'margin-inline': px, - 'margin-inline-end': px, - 'margin-inline-start': px, - // Padding properties - padding: px, - 'padding-bottom': px, - 'padding-left': px, - 'padding-right': px, - 'padding-top': px, - 'padding-block': px, - 'padding-block-end': px, - 'padding-block-start': px, - 'padding-inline': px, - 'padding-inline-end': px, - 'padding-inline-start': px, - // Mask properties - 'mask-position-x': px, - 'mask-position-y': px, - 'mask-size': px, - // Width and height properties - height: px, - width: px, - 'min-height': px, - 'max-height': px, - 'min-width': px, - 'max-width': px, - // Position properties - bottom: px, - left: px, - top: px, - right: px, - inset: px, - 'inset-block': px, - 'inset-block-end': px, - 'inset-block-start': px, - 'inset-inline': px, - 'inset-inline-end': px, - 'inset-inline-start': px, - // Shadow properties - 'box-shadow': px, - 'text-shadow': px, - // Column properties - 'column-gap': px, - 'column-rule': px, - 'column-rule-width': px, - 'column-width': px, - // Font and text properties - 'font-size': px, - 'font-size-delta': px, - 'letter-spacing': px, - 'text-decoration-thickness': px, - 'text-indent': px, - 'text-stroke': px, - 'text-stroke-width': px, - 'word-spacing': px, - // Motion properties - motion: px, - 'motion-offset': px, - // Outline properties - outline: px, - 'outline-offset': px, - 'outline-width': px, - // Perspective properties - perspective: px, - 'perspective-origin-x': percent, - 'perspective-origin-y': percent, - // Transform properties - 'transform-origin': percent, - 'transform-origin-x': percent, - 'transform-origin-y': percent, - 'transform-origin-z': percent, - // Transition properties - 'transition-delay': ms, - 'transition-duration': ms, - // Alignment properties - 'vertical-align': px, - 'flex-basis': px, - // Some random properties - 'shape-margin': px, - size: px, - gap: px, - // Grid properties - grid: px, - 'grid-gap': px, - 'row-gap': px, - 'grid-row-gap': px, - 'grid-column-gap': px, - 'grid-template-rows': px, - 'grid-template-columns': px, - 'grid-auto-rows': px, - 'grid-auto-columns': px, - // Not existing properties. - // Used to avoid issues with jss-plugin-expand integration. - 'box-shadow-x': px, - 'box-shadow-y': px, - 'box-shadow-blur': px, - 'box-shadow-spread': px, - 'font-line-height': px, - 'text-shadow-x': px, - 'text-shadow-y': px, - 'text-shadow-blur': px -}; - -/** - * Clones the object and adds a camel cased property version. - */ -function addCamelCasedVersion(obj) { - var regExp = /(-[a-z])/g; - - var replace = function replace(str) { - return str[1].toUpperCase(); - }; - - var newObj = {}; - - for (var _key in obj) { - newObj[_key] = obj[_key]; - newObj[_key.replace(regExp, replace)] = obj[_key]; - } - - return newObj; -} - -var units = addCamelCasedVersion(defaultUnits); -/** - * Recursive deep style passing function - */ - -function iterate(prop, value, options) { - if (value == null) return value; - - if (Array.isArray(value)) { - for (var i = 0; i < value.length; i++) { - value[i] = iterate(prop, value[i], options); - } - } else if (typeof value === 'object') { - if (prop === 'fallbacks') { - for (var innerProp in value) { - value[innerProp] = iterate(innerProp, value[innerProp], options); - } - } else { - for (var _innerProp in value) { - value[_innerProp] = iterate(prop + "-" + _innerProp, value[_innerProp], options); - } - } // eslint-disable-next-line no-restricted-globals - - } else if (typeof value === 'number' && isNaN(value) === false) { - var unit = options[prop] || units[prop]; // Add the unit if available, except for the special case of 0px. - - if (unit && !(value === 0 && unit === px)) { - return typeof unit === 'function' ? unit(value).toString() : "" + value + unit; - } - - return value.toString(); - } - - return value; -} -/** - * Add unit to numeric values. - */ - - -function defaultUnit(options) { - if (options === void 0) { - options = {}; - } - - var camelCasedOptions = addCamelCasedVersion(options); - - function onProcessStyle(style, rule) { - if (rule.type !== 'style') return style; - - for (var prop in style) { - style[prop] = iterate(prop, style[prop], camelCasedOptions); - } - - return style; - } - - function onChangeValue(value, prop) { - return iterate(prop, value, camelCasedOptions); - } - - return { - onProcessStyle: onProcessStyle, - onChangeValue: onChangeValue - }; -} - -// Export javascript style and css style vendor prefixes. -var js = ''; -var css = ''; -var vendor = ''; -var browser = ''; -var isTouch = isBrowser$1 && 'ontouchstart' in document.documentElement; // We should not do anything if required serverside. - -if (isBrowser$1) { - // Order matters. We need to check Webkit the last one because - // other vendors use to add Webkit prefixes to some properties - var jsCssMap = { - Moz: '-moz-', - ms: '-ms-', - O: '-o-', - Webkit: '-webkit-' - }; - - var _document$createEleme = document.createElement('p'), - style = _document$createEleme.style; - - var testProp = 'Transform'; - - for (var key in jsCssMap) { - if (key + testProp in style) { - js = key; - css = jsCssMap[key]; - break; - } - } // Correctly detect the Edge browser. - - - if (js === 'Webkit' && 'msHyphens' in style) { - js = 'ms'; - css = jsCssMap.ms; - browser = 'edge'; - } // Correctly detect the Safari browser. - - - if (js === 'Webkit' && '-apple-trailing-word' in style) { - vendor = 'apple'; - } -} -/** - * Vendor prefix string for the current browser. - * - * @type {{js: String, css: String, vendor: String, browser: String}} - * @api public - */ - - -var prefix = { - js: js, - css: css, - vendor: vendor, - browser: browser, - isTouch: isTouch -}; - -/** - * Test if a keyframe at-rule should be prefixed or not - * - * @param {String} vendor prefix string for the current browser. - * @return {String} - * @api public - */ - -function supportedKeyframes(key) { - // Keyframes is already prefixed. e.g. key = '@-webkit-keyframes a' - if (key[1] === '-') return key; // No need to prefix IE/Edge. Older browsers will ignore unsupported rules. - // https://caniuse.com/#search=keyframes - - if (prefix.js === 'ms') return key; - return "@" + prefix.css + "keyframes" + key.substr(10); -} - -// https://caniuse.com/#search=appearance - -var appearence = { - noPrefill: ['appearance'], - supportedProperty: function supportedProperty(prop) { - if (prop !== 'appearance') return false; - if (prefix.js === 'ms') return "-webkit-" + prop; - return prefix.css + prop; - } -}; - -// https://caniuse.com/#search=color-adjust - -var colorAdjust = { - noPrefill: ['color-adjust'], - supportedProperty: function supportedProperty(prop) { - if (prop !== 'color-adjust') return false; - if (prefix.js === 'Webkit') return prefix.css + "print-" + prop; - return prop; - } -}; - -var regExp = /[-\s]+(.)?/g; -/** - * Replaces the letter with the capital letter - * - * @param {String} match - * @param {String} c - * @return {String} - * @api private - */ - -function toUpper(match, c) { - return c ? c.toUpperCase() : ''; -} -/** - * Convert dash separated strings to camel-cased. - * - * @param {String} str - * @return {String} - * @api private - */ - - -function camelize(str) { - return str.replace(regExp, toUpper); -} - -/** - * Convert dash separated strings to pascal cased. - * - * @param {String} str - * @return {String} - * @api private - */ - -function pascalize(str) { - return camelize("-" + str); -} - -// but we can use a longhand property instead. -// https://caniuse.com/#search=mask - -var mask = { - noPrefill: ['mask'], - supportedProperty: function supportedProperty(prop, style) { - if (!/^mask/.test(prop)) return false; - - if (prefix.js === 'Webkit') { - var longhand = 'mask-image'; - - if (camelize(longhand) in style) { - return prop; - } - - if (prefix.js + pascalize(longhand) in style) { - return prefix.css + prop; - } - } - - return prop; - } -}; - -// https://caniuse.com/#search=text-orientation - -var textOrientation = { - noPrefill: ['text-orientation'], - supportedProperty: function supportedProperty(prop) { - if (prop !== 'text-orientation') return false; - - if (prefix.vendor === 'apple' && !prefix.isTouch) { - return prefix.css + prop; - } - - return prop; - } -}; - -// https://caniuse.com/#search=transform - -var transform = { - noPrefill: ['transform'], - supportedProperty: function supportedProperty(prop, style, options) { - if (prop !== 'transform') return false; - - if (options.transform) { - return prop; - } - - return prefix.css + prop; - } -}; - -// https://caniuse.com/#search=transition - -var transition = { - noPrefill: ['transition'], - supportedProperty: function supportedProperty(prop, style, options) { - if (prop !== 'transition') return false; - - if (options.transition) { - return prop; - } - - return prefix.css + prop; - } -}; - -// https://caniuse.com/#search=writing-mode - -var writingMode = { - noPrefill: ['writing-mode'], - supportedProperty: function supportedProperty(prop) { - if (prop !== 'writing-mode') return false; - - if (prefix.js === 'Webkit' || prefix.js === 'ms' && prefix.browser !== 'edge') { - return prefix.css + prop; - } - - return prop; - } -}; - -// https://caniuse.com/#search=user-select - -var userSelect = { - noPrefill: ['user-select'], - supportedProperty: function supportedProperty(prop) { - if (prop !== 'user-select') return false; - - if (prefix.js === 'Moz' || prefix.js === 'ms' || prefix.vendor === 'apple') { - return prefix.css + prop; - } - - return prop; - } -}; - -// https://caniuse.com/#search=multicolumn -// https://github.com/postcss/autoprefixer/issues/491 -// https://github.com/postcss/autoprefixer/issues/177 - -var breakPropsOld = { - supportedProperty: function supportedProperty(prop, style) { - if (!/^break-/.test(prop)) return false; - - if (prefix.js === 'Webkit') { - var jsProp = "WebkitColumn" + pascalize(prop); - return jsProp in style ? prefix.css + "column-" + prop : false; - } - - if (prefix.js === 'Moz') { - var _jsProp = "page" + pascalize(prop); - - return _jsProp in style ? "page-" + prop : false; - } - - return false; - } -}; - -// See https://github.com/postcss/autoprefixer/issues/324. - -var inlineLogicalOld = { - supportedProperty: function supportedProperty(prop, style) { - if (!/^(border|margin|padding)-inline/.test(prop)) return false; - if (prefix.js === 'Moz') return prop; - var newProp = prop.replace('-inline', ''); - return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false; - } -}; - -// Camelization is required because we can't test using. -// CSS syntax for e.g. in FF. - -var unprefixed = { - supportedProperty: function supportedProperty(prop, style) { - return camelize(prop) in style ? prop : false; - } -}; - -var prefixed = { - supportedProperty: function supportedProperty(prop, style) { - var pascalized = pascalize(prop); // Return custom CSS variable without prefixing. - - if (prop[0] === '-') return prop; // Return already prefixed value without prefixing. - - if (prop[0] === '-' && prop[1] === '-') return prop; - if (prefix.js + pascalized in style) return prefix.css + prop; // Try webkit fallback. - - if (prefix.js !== 'Webkit' && "Webkit" + pascalized in style) return "-webkit-" + prop; - return false; - } -}; - -// https://caniuse.com/#search=scroll-snap - -var scrollSnap = { - supportedProperty: function supportedProperty(prop) { - if (prop.substring(0, 11) !== 'scroll-snap') return false; - - if (prefix.js === 'ms') { - return "" + prefix.css + prop; - } - - return prop; - } -}; - -// https://caniuse.com/#search=overscroll-behavior - -var overscrollBehavior = { - supportedProperty: function supportedProperty(prop) { - if (prop !== 'overscroll-behavior') return false; - - if (prefix.js === 'ms') { - return prefix.css + "scroll-chaining"; - } - - return prop; - } -}; - -var propMap = { - 'flex-grow': 'flex-positive', - 'flex-shrink': 'flex-negative', - 'flex-basis': 'flex-preferred-size', - 'justify-content': 'flex-pack', - order: 'flex-order', - 'align-items': 'flex-align', - 'align-content': 'flex-line-pack' // 'align-self' is handled by 'align-self' plugin. - -}; // Support old flex spec from 2012. - -var flex2012 = { - supportedProperty: function supportedProperty(prop, style) { - var newProp = propMap[prop]; - if (!newProp) return false; - return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false; - } -}; - -var propMap$1 = { - flex: 'box-flex', - 'flex-grow': 'box-flex', - 'flex-direction': ['box-orient', 'box-direction'], - order: 'box-ordinal-group', - 'align-items': 'box-align', - 'flex-flow': ['box-orient', 'box-direction'], - 'justify-content': 'box-pack' -}; -var propKeys = Object.keys(propMap$1); - -var prefixCss = function prefixCss(p) { - return prefix.css + p; -}; // Support old flex spec from 2009. - - -var flex2009 = { - supportedProperty: function supportedProperty(prop, style, _ref) { - var multiple = _ref.multiple; - - if (propKeys.indexOf(prop) > -1) { - var newProp = propMap$1[prop]; - - if (!Array.isArray(newProp)) { - return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false; - } - - if (!multiple) return false; - - for (var i = 0; i < newProp.length; i++) { - if (!(prefix.js + pascalize(newProp[0]) in style)) { - return false; - } - } - - return newProp.map(prefixCss); - } - - return false; - } -}; - -// plugins = [ -// ...plugins, -// breakPropsOld, -// inlineLogicalOld, -// unprefixed, -// prefixed, -// scrollSnap, -// flex2012, -// flex2009 -// ] -// Plugins without 'noPrefill' value, going last. -// 'flex-*' plugins should be at the bottom. -// 'flex2009' going after 'flex2012'. -// 'prefixed' going after 'unprefixed' - -var plugins = [appearence, colorAdjust, mask, textOrientation, transform, transition, writingMode, userSelect, breakPropsOld, inlineLogicalOld, unprefixed, prefixed, scrollSnap, overscrollBehavior, flex2012, flex2009]; -var propertyDetectors = plugins.filter(function (p) { - return p.supportedProperty; -}).map(function (p) { - return p.supportedProperty; -}); -var noPrefill = plugins.filter(function (p) { - return p.noPrefill; -}).reduce(function (a, p) { - a.push.apply(a, _toConsumableArray$5(p.noPrefill)); - return a; -}, []); - -var el; -var cache$1 = {}; - -if (isBrowser$1) { - el = document.createElement('p'); // We test every property on vendor prefix requirement. - // Once tested, result is cached. It gives us up to 70% perf boost. - // http://jsperf.com/element-style-object-access-vs-plain-object - // - // Prefill cache with known css properties to reduce amount of - // properties we need to feature test at runtime. - // http://davidwalsh.name/vendor-prefix - - var computed = window.getComputedStyle(document.documentElement, ''); - - for (var key$1 in computed) { - // eslint-disable-next-line no-restricted-globals - if (!isNaN(key$1)) cache$1[computed[key$1]] = computed[key$1]; - } // Properties that cannot be correctly detected using the - // cache prefill method. - - - noPrefill.forEach(function (x) { - return delete cache$1[x]; - }); -} -/** - * Test if a property is supported, returns supported property with vendor - * prefix if required. Returns `false` if not supported. - * - * @param {String} prop dash separated - * @param {Object} [options] - * @return {String|Boolean} - * @api public - */ - - -function supportedProperty(prop, options) { - if (options === void 0) { - options = {}; - } - - // For server-side rendering. - if (!el) return prop; // Remove cache for benchmark tests or return property from the cache. - - if (process.env.NODE_ENV !== 'benchmark' && cache$1[prop] != null) { - return cache$1[prop]; - } // Check if 'transition' or 'transform' natively supported in browser. - - - if (prop === 'transition' || prop === 'transform') { - options[prop] = prop in el.style; - } // Find a plugin for current prefix property. - - - for (var i = 0; i < propertyDetectors.length; i++) { - cache$1[prop] = propertyDetectors[i](prop, el.style, options); // Break loop, if value found. - - if (cache$1[prop]) break; - } // Reset styles for current property. - // Firefox can even throw an error for invalid properties, e.g., "0". - - - try { - el.style[prop] = ''; - } catch (err) { - return false; - } - - return cache$1[prop]; -} - -var cache$1$1 = {}; -var transitionProperties = { - transition: 1, - 'transition-property': 1, - '-webkit-transition': 1, - '-webkit-transition-property': 1 -}; -var transPropsRegExp = /(^\s*[\w-]+)|, (\s*[\w-]+)(?![^()]*\))/g; -var el$1; -/** - * Returns prefixed value transition/transform if needed. - * - * @param {String} match - * @param {String} p1 - * @param {String} p2 - * @return {String} - * @api private - */ - -function prefixTransitionCallback(match, p1, p2) { - if (p1 === 'var') return 'var'; - if (p1 === 'all') return 'all'; - if (p2 === 'all') return ', all'; - var prefixedValue = p1 ? supportedProperty(p1) : ", " + supportedProperty(p2); - if (!prefixedValue) return p1 || p2; - return prefixedValue; -} - -if (isBrowser$1) el$1 = document.createElement('p'); -/** - * Returns prefixed value if needed. Returns `false` if value is not supported. - * - * @param {String} property - * @param {String} value - * @return {String|Boolean} - * @api public - */ - -function supportedValue(property, value) { - // For server-side rendering. - var prefixedValue = value; - if (!el$1 || property === 'content') return value; // It is a string or a number as a string like '1'. - // We want only prefixable values here. - // eslint-disable-next-line no-restricted-globals - - if (typeof prefixedValue !== 'string' || !isNaN(parseInt(prefixedValue, 10))) { - return prefixedValue; - } // Create cache key for current value. - - - var cacheKey = property + prefixedValue; // Remove cache for benchmark tests or return value from cache. - - if (process.env.NODE_ENV !== 'benchmark' && cache$1$1[cacheKey] != null) { - return cache$1$1[cacheKey]; - } // IE can even throw an error in some cases, for e.g. style.content = 'bar'. - - - try { - // Test value as it is. - el$1.style[property] = prefixedValue; - } catch (err) { - // Return false if value not supported. - cache$1$1[cacheKey] = false; - return false; - } // If 'transition' or 'transition-property' property. - - - if (transitionProperties[property]) { - prefixedValue = prefixedValue.replace(transPropsRegExp, prefixTransitionCallback); - } else if (el$1.style[property] === '') { - // Value with a vendor prefix. - prefixedValue = prefix.css + prefixedValue; // Hardcode test to convert "flex" to "-ms-flexbox" for IE10. - - if (prefixedValue === '-ms-flex') el$1.style[property] = '-ms-flexbox'; // Test prefixed value. - - el$1.style[property] = prefixedValue; // Return false if value not supported. - - if (el$1.style[property] === '') { - cache$1$1[cacheKey] = false; - return false; - } - } // Reset styles for current property. - - - el$1.style[property] = ''; // Write current value to cache. - - cache$1$1[cacheKey] = prefixedValue; - return cache$1$1[cacheKey]; -} - -/** - * Add vendor prefix to a property name when needed. - * - * @api public - */ - -function jssVendorPrefixer() { - function onProcessRule(rule) { - if (rule.type === 'keyframes') { - var atRule = rule; - atRule.at = supportedKeyframes(atRule.at); - } - } - - function prefixStyle(style) { - for (var prop in style) { - var value = style[prop]; - - if (prop === 'fallbacks' && Array.isArray(value)) { - style[prop] = value.map(prefixStyle); - continue; - } - - var changeProp = false; - var supportedProp = supportedProperty(prop); - if (supportedProp && supportedProp !== prop) changeProp = true; - var changeValue = false; - var supportedValue$1 = supportedValue(supportedProp, toCssValue(value)); - if (supportedValue$1 && supportedValue$1 !== value) changeValue = true; - - if (changeProp || changeValue) { - if (changeProp) delete style[prop]; - style[supportedProp || prop] = supportedValue$1 || value; - } - } - - return style; - } - - function onProcessStyle(style, rule) { - if (rule.type !== 'style') return style; - return prefixStyle(style); - } - - function onChangeValue(value, prop) { - return supportedValue(prop, toCssValue(value)) || value; - } - - return { - onProcessRule: onProcessRule, - onProcessStyle: onProcessStyle, - onChangeValue: onChangeValue - }; -} - -/** - * Sort props by length. - */ -function jssPropsSort() { - var sort = function sort(prop0, prop1) { - if (prop0.length === prop1.length) { - return prop0 > prop1 ? 1 : -1; - } - - return prop0.length - prop1.length; - }; - - return { - onProcessStyle: function onProcessStyle(style, rule) { - if (rule.type !== 'style') return style; - var newStyle = {}; - var props = Object.keys(style).sort(sort); - - for (var i = 0; i < props.length; i++) { - newStyle[props[i]] = style[props[i]]; - } - - return newStyle; - } - }; -} - -function jssPreset() { - return { - plugins: [functions(), jssGlobal(), jssNested(), camelCase(), defaultUnit(), // Disable the vendor prefixer server-side, it does nothing. - // This way, we can get a performance boost. - // In the documentation, we are using `autoprefixer` to solve this problem. - typeof window === 'undefined' ? null : jssVendorPrefixer(), jssPropsSort()] - }; -} - -function mergeClasses() { - var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - var baseClasses = options.baseClasses, - newClasses = options.newClasses, - Component = options.Component; - - if (!newClasses) { - return baseClasses; - } - - var nextClasses = _extends$m({}, baseClasses); - - if (process.env.NODE_ENV !== 'production') { - if (typeof newClasses === 'string') { - console.error(["Material-UI: The value `".concat(newClasses, "` ") + "provided to the classes prop of ".concat(getDisplayName(Component), " is incorrect."), 'You might want to use the className prop instead.'].join('\n')); - return baseClasses; - } - } - - Object.keys(newClasses).forEach(function (key) { - if (process.env.NODE_ENV !== 'production') { - if (!baseClasses[key] && newClasses[key]) { - console.error(["Material-UI: The key `".concat(key, "` ") + "provided to the classes prop is not implemented in ".concat(getDisplayName(Component), "."), "You can only override one of the following: ".concat(Object.keys(baseClasses).join(','), ".")].join('\n')); - } - - if (newClasses[key] && typeof newClasses[key] !== 'string') { - console.error(["Material-UI: The key `".concat(key, "` ") + "provided to the classes prop is not valid for ".concat(getDisplayName(Component), "."), "You need to provide a non empty string instead of: ".concat(newClasses[key], ".")].join('\n')); - } - } - - if (newClasses[key]) { - nextClasses[key] = "".concat(baseClasses[key], " ").concat(newClasses[key]); - } - }); - return nextClasses; -} - -// Used https://github.com/thinkloop/multi-key-cache as inspiration -var multiKeyStore = { - set: function set(cache, key1, key2, value) { - var subCache = cache.get(key1); - - if (!subCache) { - subCache = new Map(); - cache.set(key1, subCache); - } - - subCache.set(key2, value); - }, - get: function get(cache, key1, key2) { - var subCache = cache.get(key1); - return subCache ? subCache.get(key2) : undefined; - }, - delete: function _delete(cache, key1, key2) { - var subCache = cache.get(key1); - subCache.delete(key2); - } -}; -var multiKeyStore$1 = multiKeyStore; - -var ThemeContext = React__default['default'].createContext(null); - -if (process.env.NODE_ENV !== 'production') { - ThemeContext.displayName = 'ThemeContext'; -} - -var ThemeContext$1 = ThemeContext; - -function useTheme$1() { - var theme = React__default['default'].useContext(ThemeContext$1); - - if (process.env.NODE_ENV !== 'production') { - // eslint-disable-next-line react-hooks/rules-of-hooks - React__default['default'].useDebugValue(theme); - } - - return theme; -} - -var jss = create$1(jssPreset()); // Use a singleton or the provided one by the context. -// -// The counter-based approach doesn't tolerate any mistake. -// It's much safer to use the same counter everywhere. - -var generateClassName = createGenerateClassName(); // Exported for test purposes - -var sheetsManager = new Map(); -var defaultOptions = { - disableGeneration: false, - generateClassName: generateClassName, - jss: jss, - sheetsCache: null, - sheetsManager: sheetsManager, - sheetsRegistry: null -}; -var StylesContext = React__default['default'].createContext(defaultOptions); - -if (process.env.NODE_ENV !== 'production') { - StylesContext.displayName = 'StylesContext'; -} - -var injectFirstNode; -function StylesProvider(props) { - var children = props.children, - _props$injectFirst = props.injectFirst, - injectFirst = _props$injectFirst === void 0 ? false : _props$injectFirst, - _props$disableGenerat = props.disableGeneration, - disableGeneration = _props$disableGenerat === void 0 ? false : _props$disableGenerat, - localOptions = _objectWithoutProperties$a(props, ["children", "injectFirst", "disableGeneration"]); - - var outerOptions = React__default['default'].useContext(StylesContext); - - var context = _extends$m({}, outerOptions, { - disableGeneration: disableGeneration - }, localOptions); - - if (process.env.NODE_ENV !== 'production') { - if (typeof window === 'undefined' && !context.sheetsManager) { - console.error('Material-UI: You need to use the ServerStyleSheets API when rendering on the server.'); - } - } - - if (process.env.NODE_ENV !== 'production') { - if (context.jss.options.insertionPoint && injectFirst) { - console.error('Material-UI: You cannot use a custom insertionPoint and at the same time.'); - } - } - - if (process.env.NODE_ENV !== 'production') { - if (injectFirst && localOptions.jss) { - console.error('Material-UI: You cannot use the jss and injectFirst props at the same time.'); - } - } - - if (!context.jss.options.insertionPoint && injectFirst && typeof window !== 'undefined') { - if (!injectFirstNode) { - var head = document.head; - injectFirstNode = document.createComment('mui-inject-first'); - head.insertBefore(injectFirstNode, head.firstChild); - } - - context.jss = create$1({ - plugins: jssPreset().plugins, - insertionPoint: injectFirstNode - }); - } - - return /*#__PURE__*/React__default['default'].createElement(StylesContext.Provider, { - value: context - }, children); -} -process.env.NODE_ENV !== "production" ? StylesProvider.propTypes = { - /** - * Your component tree. - */ - children: PropTypes.node.isRequired, - - /** - * You can disable the generation of the styles with this option. - * It can be useful when traversing the React tree outside of the HTML - * rendering step on the server. - * Let's say you are using react-apollo to extract all - * the queries made by the interface server-side - you can significantly speed up the traversal with this prop. - */ - disableGeneration: PropTypes.bool, - - /** - * JSS's class name generator. - */ - generateClassName: PropTypes.func, - - /** - * By default, the styles are injected last in the element of the page. - * As a result, they gain more specificity than any other style sheet. - * If you want to override Material-UI's styles, set this prop. - */ - injectFirst: PropTypes.bool, - - /** - * JSS's instance. - */ - jss: PropTypes.object, - - /** - * @ignore - */ - serverGenerateClassName: PropTypes.func, - - /** - * @ignore - * - * Beta feature. - * - * Cache for the sheets. - */ - sheetsCache: PropTypes.object, - - /** - * @ignore - * - * The sheetsManager is used to deduplicate style sheet injection in the page. - * It's deduplicating using the (theme, styles) couple. - * On the server, you should provide a new instance for each request. - */ - sheetsManager: PropTypes.object, - - /** - * @ignore - * - * Collect the sheets. - */ - sheetsRegistry: PropTypes.object -} : void 0; - -if (process.env.NODE_ENV !== 'production') { - process.env.NODE_ENV !== "production" ? StylesProvider.propTypes = exactProp(StylesProvider.propTypes) : void 0; -} - -/* eslint-disable import/prefer-default-export */ -// Global index counter to preserve source order. -// We create the style sheet during the creation of the component, -// children are handled after the parents, so the order of style elements would be parent->child. -// It is a problem though when a parent passes a className -// which needs to override any child's styles. -// StyleSheet of the child has a higher specificity, because of the source order. -// So our solution is to render sheets them in the reverse order child->sheet, so -// that parent has a higher specificity. -var indexCounter = -1e9; -function increment() { - indexCounter += 1; - - if (process.env.NODE_ENV !== 'production') { - if (indexCounter >= 0) { - console.warn(['Material-UI: You might have a memory leak.', 'The indexCounter is not supposed to grow that much.'].join('\n')); - } - } - - return indexCounter; -} - -// We use the same empty object to ref count the styles that don't need a theme object. -var noopTheme = {}; -var noopTheme$1 = noopTheme; - -function getStylesCreator(stylesOrCreator) { - var themingEnabled = typeof stylesOrCreator === 'function'; - - if (process.env.NODE_ENV !== 'production') { - if (_typeof$c(stylesOrCreator) !== 'object' && !themingEnabled) { - console.error(['Material-UI: The `styles` argument provided is invalid.', 'You need to provide a function generating the styles or a styles object.'].join('\n')); - } - } - - return { - create: function create(theme, name) { - var styles; - - try { - styles = themingEnabled ? stylesOrCreator(theme) : stylesOrCreator; - } catch (err) { - if (process.env.NODE_ENV !== 'production') { - if (themingEnabled === true && theme === noopTheme$1) { - // TODO: prepend error message/name instead - console.error(['Material-UI: The `styles` argument provided is invalid.', 'You are providing a function without a theme in the context.', 'One of the parent elements needs to use a ThemeProvider.'].join('\n')); - } - } - - throw err; - } - - if (!name || !theme.overrides || !theme.overrides[name]) { - return styles; - } - - var overrides = theme.overrides[name]; - - var stylesWithOverrides = _extends$m({}, styles); - - Object.keys(overrides).forEach(function (key) { - if (process.env.NODE_ENV !== 'production') { - if (!stylesWithOverrides[key]) { - console.warn(['Material-UI: You are trying to override a style that does not exist.', "Fix the `".concat(key, "` key of `theme.overrides.").concat(name, "`.")].join('\n')); - } - } - - stylesWithOverrides[key] = deepmerge(stylesWithOverrides[key], overrides[key]); - }); - return stylesWithOverrides; - }, - options: {} - }; -} - -function getClasses(_ref, classes, Component) { - var state = _ref.state, - stylesOptions = _ref.stylesOptions; - - if (stylesOptions.disableGeneration) { - return classes || {}; - } - - if (!state.cacheClasses) { - state.cacheClasses = { - // Cache for the finalized classes value. - value: null, - // Cache for the last used classes prop pointer. - lastProp: null, - // Cache for the last used rendered classes pointer. - lastJSS: {} - }; - } // Tracks if either the rendered classes or classes prop has changed, - // requiring the generation of a new finalized classes object. - - - var generate = false; - - if (state.classes !== state.cacheClasses.lastJSS) { - state.cacheClasses.lastJSS = state.classes; - generate = true; - } - - if (classes !== state.cacheClasses.lastProp) { - state.cacheClasses.lastProp = classes; - generate = true; - } - - if (generate) { - state.cacheClasses.value = mergeClasses({ - baseClasses: state.cacheClasses.lastJSS, - newClasses: classes, - Component: Component - }); - } - - return state.cacheClasses.value; -} - -function attach(_ref2, props) { - var state = _ref2.state, - theme = _ref2.theme, - stylesOptions = _ref2.stylesOptions, - stylesCreator = _ref2.stylesCreator, - name = _ref2.name; - - if (stylesOptions.disableGeneration) { - return; - } - - var sheetManager = multiKeyStore$1.get(stylesOptions.sheetsManager, stylesCreator, theme); - - if (!sheetManager) { - sheetManager = { - refs: 0, - staticSheet: null, - dynamicStyles: null - }; - multiKeyStore$1.set(stylesOptions.sheetsManager, stylesCreator, theme, sheetManager); - } - - var options = _extends$m({}, stylesCreator.options, stylesOptions, { - theme: theme, - flip: typeof stylesOptions.flip === 'boolean' ? stylesOptions.flip : theme.direction === 'rtl' - }); - - options.generateId = options.serverGenerateClassName || options.generateClassName; - var sheetsRegistry = stylesOptions.sheetsRegistry; - - if (sheetManager.refs === 0) { - var staticSheet; - - if (stylesOptions.sheetsCache) { - staticSheet = multiKeyStore$1.get(stylesOptions.sheetsCache, stylesCreator, theme); - } - - var styles = stylesCreator.create(theme, name); - - if (!staticSheet) { - staticSheet = stylesOptions.jss.createStyleSheet(styles, _extends$m({ - link: false - }, options)); - staticSheet.attach(); - - if (stylesOptions.sheetsCache) { - multiKeyStore$1.set(stylesOptions.sheetsCache, stylesCreator, theme, staticSheet); - } - } - - if (sheetsRegistry) { - sheetsRegistry.add(staticSheet); - } - - sheetManager.staticSheet = staticSheet; - sheetManager.dynamicStyles = getDynamicStyles(styles); - } - - if (sheetManager.dynamicStyles) { - var dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, _extends$m({ - link: true - }, options)); - dynamicSheet.update(props); - dynamicSheet.attach(); - state.dynamicSheet = dynamicSheet; - state.classes = mergeClasses({ - baseClasses: sheetManager.staticSheet.classes, - newClasses: dynamicSheet.classes - }); - - if (sheetsRegistry) { - sheetsRegistry.add(dynamicSheet); - } - } else { - state.classes = sheetManager.staticSheet.classes; - } - - sheetManager.refs += 1; -} - -function update$2(_ref3, props) { - var state = _ref3.state; - - if (state.dynamicSheet) { - state.dynamicSheet.update(props); - } -} - -function detach(_ref4) { - var state = _ref4.state, - theme = _ref4.theme, - stylesOptions = _ref4.stylesOptions, - stylesCreator = _ref4.stylesCreator; - - if (stylesOptions.disableGeneration) { - return; - } - - var sheetManager = multiKeyStore$1.get(stylesOptions.sheetsManager, stylesCreator, theme); - sheetManager.refs -= 1; - var sheetsRegistry = stylesOptions.sheetsRegistry; - - if (sheetManager.refs === 0) { - multiKeyStore$1.delete(stylesOptions.sheetsManager, stylesCreator, theme); - stylesOptions.jss.removeStyleSheet(sheetManager.staticSheet); - - if (sheetsRegistry) { - sheetsRegistry.remove(sheetManager.staticSheet); - } - } - - if (state.dynamicSheet) { - stylesOptions.jss.removeStyleSheet(state.dynamicSheet); - - if (sheetsRegistry) { - sheetsRegistry.remove(state.dynamicSheet); - } - } -} - -function useSynchronousEffect(func, values) { - var key = React__default['default'].useRef([]); - var output; // Store "generation" key. Just returns a new object every time - - var currentKey = React__default['default'].useMemo(function () { - return {}; - }, values); // eslint-disable-line react-hooks/exhaustive-deps - // "the first render", or "memo dropped the value" - - if (key.current !== currentKey) { - key.current = currentKey; - output = func(); - } - - React__default['default'].useEffect(function () { - return function () { - if (output) { - output(); - } - }; - }, [currentKey] // eslint-disable-line react-hooks/exhaustive-deps - ); -} - -function makeStyles$1(stylesOrCreator) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - var name = options.name, - classNamePrefixOption = options.classNamePrefix, - Component = options.Component, - _options$defaultTheme = options.defaultTheme, - defaultTheme = _options$defaultTheme === void 0 ? noopTheme$1 : _options$defaultTheme, - stylesOptions2 = _objectWithoutProperties$a(options, ["name", "classNamePrefix", "Component", "defaultTheme"]); - - var stylesCreator = getStylesCreator(stylesOrCreator); - var classNamePrefix = name || classNamePrefixOption || 'makeStyles'; - stylesCreator.options = { - index: increment(), - name: name, - meta: classNamePrefix, - classNamePrefix: classNamePrefix - }; - - var useStyles = function useStyles() { - var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - var theme = useTheme$1() || defaultTheme; - - var stylesOptions = _extends$m({}, React__default['default'].useContext(StylesContext), stylesOptions2); - - var instance = React__default['default'].useRef(); - var shouldUpdate = React__default['default'].useRef(); - useSynchronousEffect(function () { - var current = { - name: name, - state: {}, - stylesCreator: stylesCreator, - stylesOptions: stylesOptions, - theme: theme - }; - attach(current, props); - shouldUpdate.current = false; - instance.current = current; - return function () { - detach(current); - }; - }, [theme, stylesCreator]); - React__default['default'].useEffect(function () { - if (shouldUpdate.current) { - update$2(instance.current, props); - } - - shouldUpdate.current = true; - }); - var classes = getClasses(instance.current, props.classes, Component); - - if (process.env.NODE_ENV !== 'production') { - // eslint-disable-next-line react-hooks/rules-of-hooks - React__default['default'].useDebugValue(classes); - } - - return classes; - }; - - return useStyles; -} - -function _classCallCheck$9(instance, Constructor) { - if (!(instance instanceof Constructor)) { - throw new TypeError("Cannot call a class as a function"); - } -} - -function toVal(mix) { - var k, y, str=''; - - if (typeof mix === 'string' || typeof mix === 'number') { - str += mix; - } else if (typeof mix === 'object') { - if (Array.isArray(mix)) { - for (k=0; k < mix.length; k++) { - if (mix[k]) { - if (y = toVal(mix[k])) { - str && (str += ' '); - str += y; - } - } - } - } else { - for (k in mix) { - if (mix[k]) { - str && (str += ' '); - str += k; - } - } - } - } - - return str; -} - -function clsx () { - var i=0, tmp, x, str=''; - while (i < arguments.length) { - if (tmp = arguments[i++]) { - if (x = toVal(tmp)) { - str && (str += ' '); - str += x; - } - } - } - return str; -} - -function omit(input, fields) { - var output = {}; - Object.keys(input).forEach(function (prop) { - if (fields.indexOf(prop) === -1) { - output[prop] = input[prop]; - } - }); - return output; -} // styled-components's API removes the mapping between components and styles. -// Using components as a low-level styling construct can be simpler. - - -function styled$2(Component) { - var componentCreator = function componentCreator(style) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - var name = options.name, - stylesOptions = _objectWithoutProperties$a(options, ["name"]); - - if (process.env.NODE_ENV !== 'production' && Component === undefined) { - throw new Error(['You are calling styled(Component)(style) with an undefined component.', 'You may have forgotten to import it.'].join('\n')); - } - - var classNamePrefix = name; - - if (process.env.NODE_ENV !== 'production') { - if (!name) { - // Provide a better DX outside production. - var displayName = getDisplayName(Component); - - if (displayName !== undefined) { - classNamePrefix = displayName; - } - } - } - - var stylesOrCreator = typeof style === 'function' ? function (theme) { - return { - root: function root(props) { - return style(_extends$m({ - theme: theme - }, props)); - } - }; - } : { - root: style - }; - var useStyles = makeStyles$1(stylesOrCreator, _extends$m({ - Component: Component, - name: name || Component.displayName, - classNamePrefix: classNamePrefix - }, stylesOptions)); - var filterProps; - var propTypes = {}; - - if (style.filterProps) { - filterProps = style.filterProps; - delete style.filterProps; - } - /* eslint-disable react/forbid-foreign-prop-types */ - - - if (style.propTypes) { - propTypes = style.propTypes; - delete style.propTypes; - } - /* eslint-enable react/forbid-foreign-prop-types */ - - - var StyledComponent = /*#__PURE__*/React__default['default'].forwardRef(function StyledComponent(props, ref) { - var children = props.children, - classNameProp = props.className, - clone = props.clone, - ComponentProp = props.component, - other = _objectWithoutProperties$a(props, ["children", "className", "clone", "component"]); - - var classes = useStyles(props); - var className = clsx(classes.root, classNameProp); - var spread = other; - - if (filterProps) { - spread = omit(spread, filterProps); - } - - if (clone) { - return /*#__PURE__*/React__default['default'].cloneElement(children, _extends$m({ - className: clsx(children.props.className, className) - }, spread)); - } - - if (typeof children === 'function') { - return children(_extends$m({ - className: className - }, spread)); - } - - var FinalComponent = ComponentProp || Component; - return /*#__PURE__*/React__default['default'].createElement(FinalComponent, _extends$m({ - ref: ref, - className: className - }, spread), children); - }); - process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = _extends$m({ - /** - * A render function or node. - */ - children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]), - - /** - * @ignore - */ - className: PropTypes.string, - - /** - * If `true`, the component will recycle it's children HTML element. - * It's using `React.cloneElement` internally. - * - * This prop will be deprecated and removed in v5 - */ - clone: chainPropTypes(PropTypes.bool, function (props) { - if (props.clone && props.component) { - return new Error('You can not use the clone and component prop at the same time.'); - } - - return null; - }), - - /** - * The component used for the root node. - * Either a string to use a HTML element or a component. - */ - component: PropTypes - /* @typescript-to-proptypes-ignore */ - .elementType - }, propTypes) : void 0; - - if (process.env.NODE_ENV !== 'production') { - StyledComponent.displayName = "Styled(".concat(classNamePrefix, ")"); - } - - hoistNonReactStatics_cjs(StyledComponent, Component); - return StyledComponent; - }; - - return componentCreator; -} - -function mergeOuterLocalTheme(outerTheme, localTheme) { - if (typeof localTheme === 'function') { - var mergedTheme = localTheme(outerTheme); - - if (process.env.NODE_ENV !== 'production') { - if (!mergedTheme) { - console.error(['Material-UI: You should return an object from your theme function, i.e.', ' ({})} />'].join('\n')); - } - } - - return mergedTheme; - } - - return _extends$m({}, outerTheme, localTheme); -} -/** - * This component takes a `theme` prop. - * It makes the `theme` available down the React tree thanks to React context. - * This component should preferably be used at **the root of your component tree**. - */ - - -function ThemeProvider(props) { - var children = props.children, - localTheme = props.theme; - var outerTheme = useTheme$1(); - - if (process.env.NODE_ENV !== 'production') { - if (outerTheme === null && typeof localTheme === 'function') { - console.error(['Material-UI: You are providing a theme function prop to the ThemeProvider component:', ' outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\n')); - } - } - - var theme = React__default['default'].useMemo(function () { - var output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme); - - if (output != null) { - output[nested] = outerTheme !== null; - } - - return output; - }, [localTheme, outerTheme]); - return /*#__PURE__*/React__default['default'].createElement(ThemeContext$1.Provider, { - value: theme - }, children); -} - -process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = { - /** - * Your component tree. - */ - children: PropTypes.node.isRequired, - - /** - * A theme object. You can provide a function to extend the outer theme. - */ - theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired -} : void 0; - -if (process.env.NODE_ENV !== 'production') { - process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0; -} - -// It does not modify the component passed to it; -// instead, it returns a new component, with a `classes` property. - -var withStyles$1 = function withStyles(stylesOrCreator) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - return function (Component) { - var defaultTheme = options.defaultTheme, - _options$withTheme = options.withTheme, - withTheme = _options$withTheme === void 0 ? false : _options$withTheme, - name = options.name, - stylesOptions = _objectWithoutProperties$a(options, ["defaultTheme", "withTheme", "name"]); - - if (process.env.NODE_ENV !== 'production') { - if (Component === undefined) { - throw new Error(['You are calling withStyles(styles)(Component) with an undefined component.', 'You may have forgotten to import it.'].join('\n')); - } - } - - var classNamePrefix = name; - - if (process.env.NODE_ENV !== 'production') { - if (!name) { - // Provide a better DX outside production. - var displayName = getDisplayName(Component); - - if (displayName !== undefined) { - classNamePrefix = displayName; - } - } - } - - var useStyles = makeStyles$1(stylesOrCreator, _extends$m({ - defaultTheme: defaultTheme, - Component: Component, - name: name || Component.displayName, - classNamePrefix: classNamePrefix - }, stylesOptions)); - var WithStyles = /*#__PURE__*/React__default['default'].forwardRef(function WithStyles(props, ref) { - props.classes; - var innerRef = props.innerRef, - other = _objectWithoutProperties$a(props, ["classes", "innerRef"]); // The wrapper receives only user supplied props, which could be a subset of - // the actual props Component might receive due to merging with defaultProps. - // So copying it here would give us the same result in the wrapper as well. - - - var classes = useStyles(_extends$m({}, Component.defaultProps, props)); - var theme; - var more = other; - - if (typeof name === 'string' || withTheme) { - // name and withTheme are invariant in the outer scope - // eslint-disable-next-line react-hooks/rules-of-hooks - theme = useTheme$1() || defaultTheme; - - if (name) { - more = getThemeProps({ - theme: theme, - name: name, - props: other - }); - } // Provide the theme to the wrapped component. - // So we don't have to use the `withTheme()` Higher-order Component. - - - if (withTheme && !more.theme) { - more.theme = theme; - } - } - - return /*#__PURE__*/React__default['default'].createElement(Component, _extends$m({ - ref: innerRef || ref, - classes: classes - }, more)); - }); - process.env.NODE_ENV !== "production" ? WithStyles.propTypes = { - /** - * Override or extend the styles applied to the component. - */ - classes: PropTypes.object, - - /** - * Use that prop to pass a ref to the decorated component. - * @deprecated - */ - innerRef: chainPropTypes(PropTypes.oneOfType([PropTypes.func, PropTypes.object]), function (props) { - if (props.innerRef == null) { - return null; - } - - return null; // return new Error( - // 'Material-UI: The `innerRef` prop is deprecated and will be removed in v5. ' + - // 'Refs are now automatically forwarded to the inner component.', - // ); - }) - } : void 0; - - if (process.env.NODE_ENV !== 'production') { - WithStyles.displayName = "WithStyles(".concat(getDisplayName(Component), ")"); - } - - hoistNonReactStatics_cjs(WithStyles, Component); - - if (process.env.NODE_ENV !== 'production') { - // Exposed for test purposes. - WithStyles.Naked = Component; - WithStyles.options = options; - WithStyles.useStyles = useStyles; - } - - return WithStyles; - }; -}; - -var withStylesWithoutDefault = withStyles$1; - -// To remove in v5 - -function createStyles(styles) { - // warning( - // warnOnce, - // [ - // 'Material-UI: createStyles from @material-ui/core/styles is deprecated.', - // 'Please use @material-ui/styles/createStyles', - // ].join('\n'), - // ); - // warnOnce = true; - return createStyles$1(styles); -} - -var defaultTheme$1 = createTheme(); -var defaultTheme$2 = defaultTheme$1; - -function makeStyles(stylesOrCreator) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - return makeStyles$1(stylesOrCreator, _extends$m({ - defaultTheme: defaultTheme$2 - }, options)); -} - -var styled = function styled(Component) { - var componentCreator = styled$2(Component); - return function (style, options) { - return componentCreator(style, _extends$m({ - defaultTheme: defaultTheme$2 - }, options)); - }; -}; - -var styled$1 = styled; - -function useTheme() { - var theme = useTheme$1() || defaultTheme$2; - - if (process.env.NODE_ENV !== 'production') { - // eslint-disable-next-line react-hooks/rules-of-hooks - React__default['default'].useDebugValue(theme); - } - - return theme; -} - -function withStyles(stylesOrCreator, options) { - return withStylesWithoutDefault(stylesOrCreator, _extends$m({ - defaultTheme: defaultTheme$2 - }, options)); -} - -var __assign$Z = (undefined && undefined.__assign) || function () { - __assign$Z = Object.assign || function(t) { - for (var s, i = 1, n = arguments.length; i < n; i++) { - s = arguments[i]; - for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) - t[p] = s[p]; - } - return t; - }; - return __assign$Z.apply(this, arguments); -}; -var __rest$W = (undefined && undefined.__rest) || function (s, e) { - var t = {}; - for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) - t[p] = s[p]; - if (s != null && typeof Object.getOwnPropertySymbols === "function") - for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { - if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) - t[p[i]] = s[p[i]]; - } - return t; -}; -var useStyles$J = makeStyles(function (theme) { return ({ - link: { - textDecoration: 'none', - color: theme.palette.primary.main, - }, -}); }, { name: 'RaLink' }); -var Link = function (props) { - var to = props.to, children = props.children; props.classes; var className = props.className, rest = __rest$W(props, ["to", "children", "classes", "className"]); - var classes = useStyles$J(props); - return (React__namespace.createElement(Link$2, __assign$Z({ to: to, className: classnames(classes.link, className) }, rest), children)); -}; -Link.propTypes = { - className: PropTypes.string, - children: PropTypes.node, - to: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), -}; -var Link$1 = Link; - -var defaultTheme = { - palette: { - secondary: { - light: '#6ec6ff', - main: '#2196f3', - dark: '#0069c0', - contrastText: '#fff', - }, - }, - typography: { - h6: { - fontWeight: 400, - }, - }, - sidebar: { - width: 240, - closedWidth: 55, - }, - overrides: { - MuiFilledInput: { - root: { - backgroundColor: 'rgba(0, 0, 0, 0.04)', - '&$disabled': { - backgroundColor: 'rgba(0, 0, 0, 0.04)', - }, - }, - }, - MuiButtonBase: { - root: { - '&:hover:active::after': { - // recreate a static ripple color - // use the currentColor to make it work both for outlined and contained buttons - // but to dim the background without dimming the text, - // put another element on top with a limited opacity - content: '""', - display: 'block', - width: '100%', - height: '100%', - position: 'absolute', - top: 0, - right: 0, - backgroundColor: 'currentColor', - opacity: 0.3, - borderRadius: 'inherit', - }, - }, - }, - }, - props: { - MuiButtonBase: { - // disable ripple for perf reasons - disableRipple: true, - }, - }, -}; - -// It should to be noted that this function isn't equivalent to `text-transform: capitalize`. -// -// A strict capitalization should uppercase the first letter of each word a the sentence. -// We only handle the first word. -function capitalize(string) { - if (typeof string !== 'string') { - throw new Error(process.env.NODE_ENV !== "production" ? "Material-UI: capitalize(string) expects a string argument." : formatMuiErrorMessage(7)); - } - - return string.charAt(0).toUpperCase() + string.slice(1); -} - -/** - * Safe chained function - * - * Will only create a new function if needed, - * otherwise will pass back existing functions or null. - * - * @param {function} functions to chain - * @returns {function|null} - */ -function createChainedFunction() { - for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) { - funcs[_key] = arguments[_key]; - } - - return funcs.reduce(function (acc, func) { - if (func == null) { - return acc; - } - - if (process.env.NODE_ENV !== 'production') { - if (typeof func !== 'function') { - console.error('Material-UI: Invalid Argument Type, must only provide functions, undefined, or null.'); - } - } - - return function chainedFunction() { - for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { - args[_key2] = arguments[_key2]; - } - - acc.apply(this, args); - func.apply(this, args); - }; - }, function () {}); -} - -var styles$1a = function styles(theme) { - return { - /* Styles applied to the root element. */ - root: { - userSelect: 'none', - width: '1em', - height: '1em', - display: 'inline-block', - fill: 'currentColor', - flexShrink: 0, - fontSize: theme.typography.pxToRem(24), - transition: theme.transitions.create('fill', { - duration: theme.transitions.duration.shorter - }) - }, - - /* Styles applied to the root element if `color="primary"`. */ - colorPrimary: { - color: theme.palette.primary.main - }, - - /* Styles applied to the root element if `color="secondary"`. */ - colorSecondary: { - color: theme.palette.secondary.main - }, - - /* Styles applied to the root element if `color="action"`. */ - colorAction: { - color: theme.palette.action.active - }, - - /* Styles applied to the root element if `color="error"`. */ - colorError: { - color: theme.palette.error.main - }, - - /* Styles applied to the root element if `color="disabled"`. */ - colorDisabled: { - color: theme.palette.action.disabled - }, - - /* Styles applied to the root element if `fontSize="inherit"`. */ - fontSizeInherit: { - fontSize: 'inherit' - }, - - /* Styles applied to the root element if `fontSize="small"`. */ - fontSizeSmall: { - fontSize: theme.typography.pxToRem(20) - }, - - /* Styles applied to the root element if `fontSize="large"`. */ - fontSizeLarge: { - fontSize: theme.typography.pxToRem(35) - } - }; -}; -var SvgIcon = /*#__PURE__*/React__namespace.forwardRef(function SvgIcon(props, ref) { - var children = props.children, - classes = props.classes, - className = props.className, - _props$color = props.color, - color = _props$color === void 0 ? 'inherit' : _props$color, - _props$component = props.component, - Component = _props$component === void 0 ? 'svg' : _props$component, - _props$fontSize = props.fontSize, - fontSize = _props$fontSize === void 0 ? 'medium' : _props$fontSize, - htmlColor = props.htmlColor, - titleAccess = props.titleAccess, - _props$viewBox = props.viewBox, - viewBox = _props$viewBox === void 0 ? '0 0 24 24' : _props$viewBox, - other = _objectWithoutProperties$a(props, ["children", "classes", "className", "color", "component", "fontSize", "htmlColor", "titleAccess", "viewBox"]); - - return /*#__PURE__*/React__namespace.createElement(Component, _extends$m({ - className: clsx(classes.root, className, color !== 'inherit' && classes["color".concat(capitalize(color))], fontSize !== 'default' && fontSize !== 'medium' && classes["fontSize".concat(capitalize(fontSize))]), - focusable: "false", - viewBox: viewBox, - color: htmlColor, - "aria-hidden": titleAccess ? undefined : true, - role: titleAccess ? 'img' : undefined, - ref: ref - }, other), children, titleAccess ? /*#__PURE__*/React__namespace.createElement("title", null, titleAccess) : null); -}); -process.env.NODE_ENV !== "production" ? SvgIcon.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | - // ---------------------------------------------------------------------- - - /** - * Node passed into the SVG element. - */ - children: PropTypes.node, - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object, - - /** - * @ignore - */ - className: PropTypes.string, - - /** - * The color of the component. It supports those theme colors that make sense for this component. - * You can use the `htmlColor` prop to apply a color attribute to the SVG element. - */ - color: PropTypes.oneOf(['action', 'disabled', 'error', 'inherit', 'primary', 'secondary']), - - /** - * The component used for the root node. - * Either a string to use a HTML element or a component. - */ - component: PropTypes - /* @typescript-to-proptypes-ignore */ - .elementType, - - /** - * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size. - */ - fontSize: chainPropTypes(PropTypes.oneOf(['default', 'inherit', 'large', 'medium', 'small']), function (props) { - var fontSize = props.fontSize; - - if (fontSize === 'default') { - throw new Error('Material-UI: `fontSize="default"` is deprecated. Use `fontSize="medium"` instead.'); - } - - return null; - }), - - /** - * Applies a color attribute to the SVG element. - */ - htmlColor: PropTypes.string, - - /** - * The shape-rendering attribute. The behavior of the different options is described on the - * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering). - * If you are having issues with blurry icons you should investigate this property. - */ - shapeRendering: PropTypes.string, - - /** - * Provides a human-readable title for the element that contains it. - * https://www.w3.org/TR/SVG-access/#Equivalent - */ - titleAccess: PropTypes.string, - - /** - * Allows you to redefine what the coordinates without units mean inside an SVG element. - * For example, if the SVG element is 500 (width) by 200 (height), - * and you pass viewBox="0 0 50 20", - * this means that the coordinates inside the SVG will go from the top left corner (0,0) - * to bottom right (50,20) and each unit will be worth 10px. - */ - viewBox: PropTypes.string -} : void 0; -SvgIcon.muiName = 'SvgIcon'; -var SvgIcon$1 = withStyles(styles$1a, { - name: 'MuiSvgIcon' -})(SvgIcon); - -/** - * Private module reserved for @material-ui/x packages. - */ - -function createSvgIcon$1(path, displayName) { - var Component = function Component(props, ref) { - return /*#__PURE__*/React__default['default'].createElement(SvgIcon$1, _extends$m({ - ref: ref - }, props), path); - }; - - if (process.env.NODE_ENV !== 'production') { - // Need to set `displayName` on the inner component for React.memo. - // React prior to 16.14 ignores `displayName` on the wrapper. - Component.displayName = "".concat(displayName, "Icon"); - } - - Component.muiName = SvgIcon$1.muiName; - return /*#__PURE__*/React__default['default'].memo( /*#__PURE__*/React__default['default'].forwardRef(Component)); -} - -// Corresponds to 10 frames at 60 Hz. -// A few bytes payload overhead when lodash/debounce is ~3 kB and debounce ~300 B. -function debounce$2(func) { - var wait = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 166; - var timeout; - - function debounced() { - for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } - - // eslint-disable-next-line consistent-this - var that = this; - - var later = function later() { - func.apply(that, args); - }; - - clearTimeout(timeout); - timeout = setTimeout(later, wait); - } - - debounced.clear = function () { - clearTimeout(timeout); - }; - - return debounced; -} - -function deprecatedPropType(validator, reason) { - if (process.env.NODE_ENV === 'production') { - return function () { - return null; - }; - } - - return function (props, propName, componentName, location, propFullName) { - var componentNameSafe = componentName || '<>'; - var propFullNameSafe = propFullName || propName; - - if (typeof props[propName] !== 'undefined') { - return new Error("The ".concat(location, " `").concat(propFullNameSafe, "` of ") + "`".concat(componentNameSafe, "` is deprecated. ").concat(reason)); - } - - return null; - }; -} - -function isMuiElement(element, muiNames) { - return /*#__PURE__*/React__namespace.isValidElement(element) && muiNames.indexOf(element.type.muiName) !== -1; -} - -function ownerDocument(node) { - return node && node.ownerDocument || document; -} - -function ownerWindow(node) { - var doc = ownerDocument(node); - return doc.defaultView || window; -} - -function requirePropFactory(componentNameInError) { - if (process.env.NODE_ENV === 'production') { - return function () { - return null; - }; - } - - var requireProp = function requireProp(requiredProp) { - return function (props, propName, componentName, location, propFullName) { - var propFullNameSafe = propFullName || propName; - - if (typeof props[propName] !== 'undefined' && !props[requiredProp]) { - return new Error("The prop `".concat(propFullNameSafe, "` of ") + "`".concat(componentNameInError, "` must be used on `").concat(requiredProp, "`.")); - } - - return null; - }; - }; - - return requireProp; -} - -// TODO v5: consider to make it private -function setRef(ref, value) { - if (typeof ref === 'function') { - ref(value); - } else if (ref) { - ref.current = value; - } -} - -function unsupportedProp(props, propName, componentName, location, propFullName) { - if (process.env.NODE_ENV === 'production') { - return null; - } - - var propFullNameSafe = propFullName || propName; - - if (typeof props[propName] !== 'undefined') { - return new Error("The prop `".concat(propFullNameSafe, "` is not supported. Please remove it.")); - } - - return null; -} - -/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */ -function useControlled(_ref) { - var controlled = _ref.controlled, - defaultProp = _ref.default, - name = _ref.name, - _ref$state = _ref.state, - state = _ref$state === void 0 ? 'value' : _ref$state; - - var _React$useRef = React__namespace.useRef(controlled !== undefined), - isControlled = _React$useRef.current; - - var _React$useState = React__namespace.useState(defaultProp), - valueState = _React$useState[0], - setValue = _React$useState[1]; - - var value = isControlled ? controlled : valueState; - - if (process.env.NODE_ENV !== 'production') { - React__namespace.useEffect(function () { - if (isControlled !== (controlled !== undefined)) { - console.error(["Material-UI: A component is changing the ".concat(isControlled ? '' : 'un', "controlled ").concat(state, " state of ").concat(name, " to be ").concat(isControlled ? 'un' : '', "controlled."), 'Elements should not switch from uncontrolled to controlled (or vice versa).', "Decide between using a controlled or uncontrolled ".concat(name, " ") + 'element for the lifetime of the component.', "The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.", 'More info: https://fb.me/react-controlled-components'].join('\n')); - } - }, [controlled]); - - var _React$useRef2 = React__namespace.useRef(defaultProp), - defaultValue = _React$useRef2.current; - - React__namespace.useEffect(function () { - if (!isControlled && defaultValue !== defaultProp) { - console.error(["Material-UI: A component is changing the default ".concat(state, " state of an uncontrolled ").concat(name, " after being initialized. ") + "To suppress this warning opt to use a controlled ".concat(name, ".")].join('\n')); - } - }, [JSON.stringify(defaultProp)]); - } - - var setValueIfUncontrolled = React__namespace.useCallback(function (newValue) { - if (!isControlled) { - setValue(newValue); - } - }, []); - return [value, setValueIfUncontrolled]; -} - -var useEnhancedEffect$7 = typeof window !== 'undefined' ? React__namespace.useLayoutEffect : React__namespace.useEffect; -/** - * https://github.com/facebook/react/issues/14099#issuecomment-440013892 - * - * @param {function} fn - */ - -function useEventCallback(fn) { - var ref = React__namespace.useRef(fn); - useEnhancedEffect$7(function () { - ref.current = fn; - }); - return React__namespace.useCallback(function () { - return (ref.current).apply(void 0, arguments); - }, []); -} - -function useForkRef(refA, refB) { - /** - * This will create a new function if the ref props change and are defined. - * This means react will call the old forkRef with `null` and the new forkRef - * with the ref. Cleanup naturally emerges from this behavior - */ - return React__namespace.useMemo(function () { - if (refA == null && refB == null) { - return null; - } - - return function (refValue) { - setRef(refA, refValue); - setRef(refB, refValue); - }; - }, [refA, refB]); -} - -/** - * Private module reserved for @material-ui/x packages. - */ - -function useId(idOverride) { - var _React$useState = React__namespace.useState(idOverride), - defaultId = _React$useState[0], - setDefaultId = _React$useState[1]; - - var id = idOverride || defaultId; - React__namespace.useEffect(function () { - if (defaultId == null) { - // Fallback to this default id when possible. - // Use the random value for client-side rendering only. - // We can't use it server-side. - setDefaultId("mui-".concat(Math.round(Math.random() * 1e5))); - } - }, [defaultId]); - return id; -} - -// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js -var hadKeyboardEvent = true; -var hadFocusVisibleRecently = false; -var hadFocusVisibleRecentlyTimeout = null; -var inputTypesWhitelist = { - text: true, - search: true, - url: true, - tel: true, - email: true, - password: true, - number: true, - date: true, - month: true, - week: true, - time: true, - datetime: true, - 'datetime-local': true -}; -/** - * Computes whether the given element should automatically trigger the - * `focus-visible` class being added, i.e. whether it should always match - * `:focus-visible` when focused. - * @param {Element} node - * @return {boolean} - */ - -function focusTriggersKeyboardModality(node) { - var type = node.type, - tagName = node.tagName; - - if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) { - return true; - } - - if (tagName === 'TEXTAREA' && !node.readOnly) { - return true; - } - - if (node.isContentEditable) { - return true; - } - - return false; -} -/** - * Keep track of our keyboard modality state with `hadKeyboardEvent`. - * If the most recent user interaction was via the keyboard; - * and the key press did not include a meta, alt/option, or control key; - * then the modality is keyboard. Otherwise, the modality is not keyboard. - * @param {KeyboardEvent} event - */ - - -function handleKeyDown(event) { - if (event.metaKey || event.altKey || event.ctrlKey) { - return; - } - - hadKeyboardEvent = true; -} -/** - * If at any point a user clicks with a pointing device, ensure that we change - * the modality away from keyboard. - * This avoids the situation where a user presses a key on an already focused - * element, and then clicks on a different element, focusing it with a - * pointing device, while we still think we're in keyboard modality. - */ - - -function handlePointerDown() { - hadKeyboardEvent = false; -} - -function handleVisibilityChange() { - if (this.visibilityState === 'hidden') { - // If the tab becomes active again, the browser will handle calling focus - // on the element (Safari actually calls it twice). - // If this tab change caused a blur on an element with focus-visible, - // re-apply the class when the user switches back to the tab. - if (hadFocusVisibleRecently) { - hadKeyboardEvent = true; - } - } -} - -function prepare(doc) { - doc.addEventListener('keydown', handleKeyDown, true); - doc.addEventListener('mousedown', handlePointerDown, true); - doc.addEventListener('pointerdown', handlePointerDown, true); - doc.addEventListener('touchstart', handlePointerDown, true); - doc.addEventListener('visibilitychange', handleVisibilityChange, true); -} - -function isFocusVisible(event) { - var target = event.target; - - try { - return target.matches(':focus-visible'); - } catch (error) {} // browsers not implementing :focus-visible will throw a SyntaxError - // we use our own heuristic for those browsers - // rethrow might be better if it's not the expected error but do we really - // want to crash if focus-visible malfunctioned? - // no need for validFocusTarget check. the user does that by attaching it to - // focusable events only - - - return hadKeyboardEvent || focusTriggersKeyboardModality(target); -} -/** - * Should be called if a blur event is fired on a focus-visible element - */ - - -function handleBlurVisible() { - // To detect a tab/window switch, we look for a blur event followed - // rapidly by a visibility change. - // If we don't see a visibility change within 100ms, it's probably a - // regular focus change. - hadFocusVisibleRecently = true; - window.clearTimeout(hadFocusVisibleRecentlyTimeout); - hadFocusVisibleRecentlyTimeout = window.setTimeout(function () { - hadFocusVisibleRecently = false; - }, 100); -} - -function useIsFocusVisible() { - var ref = React__namespace.useCallback(function (instance) { - var node = ReactDOM__namespace.findDOMNode(instance); - - if (node != null) { - prepare(node.ownerDocument); - } - }, []); - - if (process.env.NODE_ENV !== 'production') { - // eslint-disable-next-line react-hooks/rules-of-hooks - React__namespace.useDebugValue(isFocusVisible); - } - - return { - isFocusVisible: isFocusVisible, - onBlurVisible: handleBlurVisible, - ref: ref - }; -} - -var utils = /*#__PURE__*/Object.freeze({ - __proto__: null, - capitalize: capitalize, - createChainedFunction: createChainedFunction, - createSvgIcon: createSvgIcon$1, - debounce: debounce$2, - deprecatedPropType: deprecatedPropType, - isMuiElement: isMuiElement, - ownerDocument: ownerDocument, - ownerWindow: ownerWindow, - requirePropFactory: requirePropFactory, - setRef: setRef, - unsupportedProp: unsupportedProp, - useControlled: useControlled, - useEventCallback: useEventCallback, - useForkRef: useForkRef, - unstable_useId: useId, - useIsFocusVisible: useIsFocusVisible -}); - -function _toArray(arr) { - return _arrayWithHoles(arr) || _iterableToArray$5(arr) || _unsupportedIterableToArray(arr) || _nonIterableRest(); -} - -var config = { - disabled: false -}; - -var timeoutsShape = process.env.NODE_ENV !== 'production' ? PropTypes.oneOfType([PropTypes.number, PropTypes.shape({ - enter: PropTypes.number, - exit: PropTypes.number, - appear: PropTypes.number -}).isRequired]) : null; -process.env.NODE_ENV !== 'production' ? PropTypes.oneOfType([PropTypes.string, PropTypes.shape({ - enter: PropTypes.string, - exit: PropTypes.string, - active: PropTypes.string -}), PropTypes.shape({ - enter: PropTypes.string, - enterDone: PropTypes.string, - enterActive: PropTypes.string, - exit: PropTypes.string, - exitDone: PropTypes.string, - exitActive: PropTypes.string -})]) : null; - -var TransitionGroupContext = React__default['default'].createContext(null); - -var UNMOUNTED = 'unmounted'; -var EXITED = 'exited'; -var ENTERING = 'entering'; -var ENTERED = 'entered'; -var EXITING = 'exiting'; -/** - * The Transition component lets you describe a transition from one component - * state to another _over time_ with a simple declarative API. Most commonly - * it's used to animate the mounting and unmounting of a component, but can also - * be used to describe in-place transition states as well. - * - * --- - * - * **Note**: `Transition` is a platform-agnostic base component. If you're using - * transitions in CSS, you'll probably want to use - * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition) - * instead. It inherits all the features of `Transition`, but contains - * additional features necessary to play nice with CSS transitions (hence the - * name of the component). - * - * --- - * - * By default the `Transition` component does not alter the behavior of the - * component it renders, it only tracks "enter" and "exit" states for the - * components. It's up to you to give meaning and effect to those states. For - * example we can add styles to a component when it enters or exits: - * - * ```jsx - * import { Transition } from 'react-transition-group'; - * - * const duration = 300; - * - * const defaultStyle = { - * transition: `opacity ${duration}ms ease-in-out`, - * opacity: 0, - * } - * - * const transitionStyles = { - * entering: { opacity: 1 }, - * entered: { opacity: 1 }, - * exiting: { opacity: 0 }, - * exited: { opacity: 0 }, - * }; - * - * const Fade = ({ in: inProp }) => ( - * - * {state => ( - *
- * I'm a fade Transition! - *
- * )} - * - * ); - * ``` - * - * There are 4 main states a Transition can be in: - * - `'entering'` - * - `'entered'` - * - `'exiting'` - * - `'exited'` - * - * Transition state is toggled via the `in` prop. When `true` the component - * begins the "Enter" stage. During this stage, the component will shift from - * its current transition state, to `'entering'` for the duration of the - * transition and then to the `'entered'` stage once it's complete. Let's take - * the following example (we'll use the - * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook): - * - * ```jsx - * function App() { - * const [inProp, setInProp] = useState(false); - * return ( - *
- * - * {state => ( - * // ... - * )} - * - * - *
- * ); - * } - * ``` - * - * When the button is clicked the component will shift to the `'entering'` state - * and stay there for 500ms (the value of `timeout`) before it finally switches - * to `'entered'`. - * - * When `in` is `false` the same thing happens except the state moves from - * `'exiting'` to `'exited'`. - */ - -var Transition = /*#__PURE__*/function (_React$Component) { - _inheritsLoose(Transition, _React$Component); - - function Transition(props, context) { - var _this; - - _this = _React$Component.call(this, props, context) || this; - var parentGroup = context; // In the context of a TransitionGroup all enters are really appears - - var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear; - var initialStatus; - _this.appearStatus = null; - - if (props.in) { - if (appear) { - initialStatus = EXITED; - _this.appearStatus = ENTERING; - } else { - initialStatus = ENTERED; - } - } else { - if (props.unmountOnExit || props.mountOnEnter) { - initialStatus = UNMOUNTED; - } else { - initialStatus = EXITED; - } - } - - _this.state = { - status: initialStatus - }; - _this.nextCallback = null; - return _this; - } - - Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) { - var nextIn = _ref.in; - - if (nextIn && prevState.status === UNMOUNTED) { - return { - status: EXITED - }; - } - - return null; - } // getSnapshotBeforeUpdate(prevProps) { - // let nextStatus = null - // if (prevProps !== this.props) { - // const { status } = this.state - // if (this.props.in) { - // if (status !== ENTERING && status !== ENTERED) { - // nextStatus = ENTERING - // } - // } else { - // if (status === ENTERING || status === ENTERED) { - // nextStatus = EXITING - // } - // } - // } - // return { nextStatus } - // } - ; - - var _proto = Transition.prototype; - - _proto.componentDidMount = function componentDidMount() { - this.updateStatus(true, this.appearStatus); - }; - - _proto.componentDidUpdate = function componentDidUpdate(prevProps) { - var nextStatus = null; - - if (prevProps !== this.props) { - var status = this.state.status; - - if (this.props.in) { - if (status !== ENTERING && status !== ENTERED) { - nextStatus = ENTERING; - } - } else { - if (status === ENTERING || status === ENTERED) { - nextStatus = EXITING; - } - } - } - - this.updateStatus(false, nextStatus); - }; - - _proto.componentWillUnmount = function componentWillUnmount() { - this.cancelNextCallback(); - }; - - _proto.getTimeouts = function getTimeouts() { - var timeout = this.props.timeout; - var exit, enter, appear; - exit = enter = appear = timeout; - - if (timeout != null && typeof timeout !== 'number') { - exit = timeout.exit; - enter = timeout.enter; // TODO: remove fallback for next major - - appear = timeout.appear !== undefined ? timeout.appear : enter; - } - - return { - exit: exit, - enter: enter, - appear: appear - }; - }; - - _proto.updateStatus = function updateStatus(mounting, nextStatus) { - if (mounting === void 0) { - mounting = false; - } - - if (nextStatus !== null) { - // nextStatus will always be ENTERING or EXITING. - this.cancelNextCallback(); - - if (nextStatus === ENTERING) { - this.performEnter(mounting); - } else { - this.performExit(); - } - } else if (this.props.unmountOnExit && this.state.status === EXITED) { - this.setState({ - status: UNMOUNTED - }); - } - }; - - _proto.performEnter = function performEnter(mounting) { - var _this2 = this; - - var enter = this.props.enter; - var appearing = this.context ? this.context.isMounting : mounting; - - var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM__default['default'].findDOMNode(this), appearing], - maybeNode = _ref2[0], - maybeAppearing = _ref2[1]; - - var timeouts = this.getTimeouts(); - var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED - // if we are mounting and running this it means appear _must_ be set - - if (!mounting && !enter || config.disabled) { - this.safeSetState({ - status: ENTERED - }, function () { - _this2.props.onEntered(maybeNode); - }); - return; - } - - this.props.onEnter(maybeNode, maybeAppearing); - this.safeSetState({ - status: ENTERING - }, function () { - _this2.props.onEntering(maybeNode, maybeAppearing); - - _this2.onTransitionEnd(enterTimeout, function () { - _this2.safeSetState({ - status: ENTERED - }, function () { - _this2.props.onEntered(maybeNode, maybeAppearing); - }); - }); - }); - }; - - _proto.performExit = function performExit() { - var _this3 = this; - - var exit = this.props.exit; - var timeouts = this.getTimeouts(); - var maybeNode = this.props.nodeRef ? undefined : ReactDOM__default['default'].findDOMNode(this); // no exit animation skip right to EXITED - - if (!exit || config.disabled) { - this.safeSetState({ - status: EXITED - }, function () { - _this3.props.onExited(maybeNode); - }); - return; - } - - this.props.onExit(maybeNode); - this.safeSetState({ - status: EXITING - }, function () { - _this3.props.onExiting(maybeNode); - - _this3.onTransitionEnd(timeouts.exit, function () { - _this3.safeSetState({ - status: EXITED - }, function () { - _this3.props.onExited(maybeNode); - }); - }); - }); - }; - - _proto.cancelNextCallback = function cancelNextCallback() { - if (this.nextCallback !== null) { - this.nextCallback.cancel(); - this.nextCallback = null; - } - }; - - _proto.safeSetState = function safeSetState(nextState, callback) { - // This shouldn't be necessary, but there are weird race conditions with - // setState callbacks and unmounting in testing, so always make sure that - // we can cancel any pending setState callbacks after we unmount. - callback = this.setNextCallback(callback); - this.setState(nextState, callback); - }; - - _proto.setNextCallback = function setNextCallback(callback) { - var _this4 = this; - - var active = true; - - this.nextCallback = function (event) { - if (active) { - active = false; - _this4.nextCallback = null; - callback(event); - } - }; - - this.nextCallback.cancel = function () { - active = false; - }; - - return this.nextCallback; - }; - - _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) { - this.setNextCallback(handler); - var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM__default['default'].findDOMNode(this); - var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener; - - if (!node || doesNotHaveTimeoutOrListener) { - setTimeout(this.nextCallback, 0); - return; - } - - if (this.props.addEndListener) { - var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback], - maybeNode = _ref3[0], - maybeNextCallback = _ref3[1]; - - this.props.addEndListener(maybeNode, maybeNextCallback); - } - - if (timeout != null) { - setTimeout(this.nextCallback, timeout); - } - }; - - _proto.render = function render() { - var status = this.state.status; - - if (status === UNMOUNTED) { - return null; - } - - var _this$props = this.props, - children = _this$props.children; - _this$props.in; - _this$props.mountOnEnter; - _this$props.unmountOnExit; - _this$props.appear; - _this$props.enter; - _this$props.exit; - _this$props.timeout; - _this$props.addEndListener; - _this$props.onEnter; - _this$props.onEntering; - _this$props.onEntered; - _this$props.onExit; - _this$props.onExiting; - _this$props.onExited; - _this$props.nodeRef; - var childProps = _objectWithoutPropertiesLoose$b(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]); - - return ( - /*#__PURE__*/ - // allows for nested Transitions - React__default['default'].createElement(TransitionGroupContext.Provider, { - value: null - }, typeof children === 'function' ? children(status, childProps) : React__default['default'].cloneElement(React__default['default'].Children.only(children), childProps)) - ); - }; - - return Transition; -}(React__default['default'].Component); - -Transition.contextType = TransitionGroupContext; -Transition.propTypes = process.env.NODE_ENV !== "production" ? { - /** - * A React reference to DOM element that need to transition: - * https://stackoverflow.com/a/51127130/4671932 - * - * - When `nodeRef` prop is used, `node` is not passed to callback functions - * (e.g. `onEnter`) because user already has direct access to the node. - * - When changing `key` prop of `Transition` in a `TransitionGroup` a new - * `nodeRef` need to be provided to `Transition` with changed `key` prop - * (see - * [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)). - */ - nodeRef: PropTypes.shape({ - current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) { - var value = propValue[key]; - return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret); - } - }), - - /** - * A `function` child can be used instead of a React element. This function is - * called with the current transition status (`'entering'`, `'entered'`, - * `'exiting'`, `'exited'`), which can be used to apply context - * specific props to a component. - * - * ```jsx - * - * {state => ( - * - * )} - * - * ``` - */ - children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired, - - /** - * Show the component; triggers the enter or exit states - */ - in: PropTypes.bool, - - /** - * By default the child component is mounted immediately along with - * the parent `Transition` component. If you want to "lazy mount" the component on the - * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay - * mounted, even on "exited", unless you also specify `unmountOnExit`. - */ - mountOnEnter: PropTypes.bool, - - /** - * By default the child component stays mounted after it reaches the `'exited'` state. - * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting. - */ - unmountOnExit: PropTypes.bool, - - /** - * By default the child component does not perform the enter transition when - * it first mounts, regardless of the value of `in`. If you want this - * behavior, set both `appear` and `in` to `true`. - * - * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop - * > only adds an additional enter transition. However, in the - * > `` component that first enter transition does result in - * > additional `.appear-*` classes, that way you can choose to style it - * > differently. - */ - appear: PropTypes.bool, - - /** - * Enable or disable enter transitions. - */ - enter: PropTypes.bool, - - /** - * Enable or disable exit transitions. - */ - exit: PropTypes.bool, - - /** - * The duration of the transition, in milliseconds. - * Required unless `addEndListener` is provided. - * - * You may specify a single timeout for all transitions: - * - * ```jsx - * timeout={500} - * ``` - * - * or individually: - * - * ```jsx - * timeout={{ - * appear: 500, - * enter: 300, - * exit: 500, - * }} - * ``` - * - * - `appear` defaults to the value of `enter` - * - `enter` defaults to `0` - * - `exit` defaults to `0` - * - * @type {number | { enter?: number, exit?: number, appear?: number }} - */ - timeout: function timeout(props) { - var pt = timeoutsShape; - if (!props.addEndListener) pt = pt.isRequired; - - for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; - } - - return pt.apply(void 0, [props].concat(args)); - }, - - /** - * Add a custom transition end trigger. Called with the transitioning - * DOM node and a `done` callback. Allows for more fine grained transition end - * logic. Timeouts are still used as a fallback if provided. - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * ```jsx - * addEndListener={(node, done) => { - * // use the css transitionend event to mark the finish of a transition - * node.addEventListener('transitionend', done, false); - * }} - * ``` - */ - addEndListener: PropTypes.func, - - /** - * Callback fired before the "entering" status is applied. An extra parameter - * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * @type Function(node: HtmlElement, isAppearing: bool) -> void - */ - onEnter: PropTypes.func, - - /** - * Callback fired after the "entering" status is applied. An extra parameter - * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * @type Function(node: HtmlElement, isAppearing: bool) - */ - onEntering: PropTypes.func, - - /** - * Callback fired after the "entered" status is applied. An extra parameter - * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * @type Function(node: HtmlElement, isAppearing: bool) -> void - */ - onEntered: PropTypes.func, - - /** - * Callback fired before the "exiting" status is applied. - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * @type Function(node: HtmlElement) -> void - */ - onExit: PropTypes.func, - - /** - * Callback fired after the "exiting" status is applied. - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed. - * - * @type Function(node: HtmlElement) -> void - */ - onExiting: PropTypes.func, - - /** - * Callback fired after the "exited" status is applied. - * - * **Note**: when `nodeRef` prop is passed, `node` is not passed - * - * @type Function(node: HtmlElement) -> void - */ - onExited: PropTypes.func -} : {}; // Name the function so it is clearer in the documentation - -function noop$2() {} - -Transition.defaultProps = { - in: false, - mountOnEnter: false, - unmountOnExit: false, - appear: false, - enter: true, - exit: true, - onEnter: noop$2, - onEntering: noop$2, - onEntered: noop$2, - onExit: noop$2, - onExiting: noop$2, - onExited: noop$2 -}; -Transition.UNMOUNTED = UNMOUNTED; -Transition.EXITED = EXITED; -Transition.ENTERING = ENTERING; -Transition.ENTERED = ENTERED; -Transition.EXITING = EXITING; -var Transition$1 = Transition; - -/** - * Given `this.props.children`, return an object mapping key to child. - * - * @param {*} children `this.props.children` - * @return {object} Mapping of key to child - */ - -function getChildMapping(children, mapFn) { - var mapper = function mapper(child) { - return mapFn && React$v.isValidElement(child) ? mapFn(child) : child; - }; - - var result = Object.create(null); - if (children) React$v.Children.map(children, function (c) { - return c; - }).forEach(function (child) { - // run the map function here instead so that the key is the computed one - result[child.key] = mapper(child); - }); - return result; -} -/** - * When you're adding or removing children some may be added or removed in the - * same render pass. We want to show *both* since we want to simultaneously - * animate elements in and out. This function takes a previous set of keys - * and a new set of keys and merges them with its best guess of the correct - * ordering. In the future we may expose some of the utilities in - * ReactMultiChild to make this easy, but for now React itself does not - * directly have this concept of the union of prevChildren and nextChildren - * so we implement it here. - * - * @param {object} prev prev children as returned from - * `ReactTransitionChildMapping.getChildMapping()`. - * @param {object} next next children as returned from - * `ReactTransitionChildMapping.getChildMapping()`. - * @return {object} a key set that contains all keys in `prev` and all keys - * in `next` in a reasonable order. - */ - -function mergeChildMappings(prev, next) { - prev = prev || {}; - next = next || {}; - - function getValueForKey(key) { - return key in next ? next[key] : prev[key]; - } // For each key of `next`, the list of keys to insert before that key in - // the combined list - - - var nextKeysPending = Object.create(null); - var pendingKeys = []; - - for (var prevKey in prev) { - if (prevKey in next) { - if (pendingKeys.length) { - nextKeysPending[prevKey] = pendingKeys; - pendingKeys = []; - } - } else { - pendingKeys.push(prevKey); - } - } - - var i; - var childMapping = {}; - - for (var nextKey in next) { - if (nextKeysPending[nextKey]) { - for (i = 0; i < nextKeysPending[nextKey].length; i++) { - var pendingNextKey = nextKeysPending[nextKey][i]; - childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey); - } - } - - childMapping[nextKey] = getValueForKey(nextKey); - } // Finally, add the keys which didn't appear before any key in `next` - - - for (i = 0; i < pendingKeys.length; i++) { - childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]); - } - - return childMapping; -} - -function getProp(child, prop, props) { - return props[prop] != null ? props[prop] : child.props[prop]; -} - -function getInitialChildMapping(props, onExited) { - return getChildMapping(props.children, function (child) { - return React$v.cloneElement(child, { - onExited: onExited.bind(null, child), - in: true, - appear: getProp(child, 'appear', props), - enter: getProp(child, 'enter', props), - exit: getProp(child, 'exit', props) - }); - }); -} -function getNextChildMapping(nextProps, prevChildMapping, onExited) { - var nextChildMapping = getChildMapping(nextProps.children); - var children = mergeChildMappings(prevChildMapping, nextChildMapping); - Object.keys(children).forEach(function (key) { - var child = children[key]; - if (!React$v.isValidElement(child)) return; - var hasPrev = (key in prevChildMapping); - var hasNext = (key in nextChildMapping); - var prevChild = prevChildMapping[key]; - var isLeaving = React$v.isValidElement(prevChild) && !prevChild.props.in; // item is new (entering) - - if (hasNext && (!hasPrev || isLeaving)) { - // console.log('entering', key) - children[key] = React$v.cloneElement(child, { - onExited: onExited.bind(null, child), - in: true, - exit: getProp(child, 'exit', nextProps), - enter: getProp(child, 'enter', nextProps) - }); - } else if (!hasNext && hasPrev && !isLeaving) { - // item is old (exiting) - // console.log('leaving', key) - children[key] = React$v.cloneElement(child, { - in: false - }); - } else if (hasNext && hasPrev && React$v.isValidElement(prevChild)) { - // item hasn't changed transition states - // copy over the last transition props; - // console.log('unchanged', key) - children[key] = React$v.cloneElement(child, { - onExited: onExited.bind(null, child), - in: prevChild.props.in, - exit: getProp(child, 'exit', nextProps), - enter: getProp(child, 'enter', nextProps) - }); - } - }); - return children; -} - -var values = Object.values || function (obj) { - return Object.keys(obj).map(function (k) { - return obj[k]; - }); -}; - -var defaultProps = { - component: 'div', - childFactory: function childFactory(child) { - return child; - } -}; -/** - * The `` component manages a set of transition components - * (`` and ``) in a list. Like with the transition - * components, `` is a state machine for managing the mounting - * and unmounting of components over time. - * - * Consider the example below. As items are removed or added to the TodoList the - * `in` prop is toggled automatically by the ``. - * - * Note that `` does not define any animation behavior! - * Exactly _how_ a list item animates is up to the individual transition - * component. This means you can mix and match animations across different list - * items. - */ - -var TransitionGroup = /*#__PURE__*/function (_React$Component) { - _inheritsLoose(TransitionGroup, _React$Component); - - function TransitionGroup(props, context) { - var _this; - - _this = _React$Component.call(this, props, context) || this; - - var handleExited = _this.handleExited.bind(_assertThisInitialized$9(_this)); // Initial children should all be entering, dependent on appear - - - _this.state = { - contextValue: { - isMounting: true - }, - handleExited: handleExited, - firstRender: true - }; - return _this; - } - - var _proto = TransitionGroup.prototype; - - _proto.componentDidMount = function componentDidMount() { - this.mounted = true; - this.setState({ - contextValue: { - isMounting: false - } - }); - }; - - _proto.componentWillUnmount = function componentWillUnmount() { - this.mounted = false; - }; - - TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) { - var prevChildMapping = _ref.children, - handleExited = _ref.handleExited, - firstRender = _ref.firstRender; - return { - children: firstRender ? getInitialChildMapping(nextProps, handleExited) : getNextChildMapping(nextProps, prevChildMapping, handleExited), - firstRender: false - }; - } // node is `undefined` when user provided `nodeRef` prop - ; - - _proto.handleExited = function handleExited(child, node) { - var currentChildMapping = getChildMapping(this.props.children); - if (child.key in currentChildMapping) return; - - if (child.props.onExited) { - child.props.onExited(node); - } - - if (this.mounted) { - this.setState(function (state) { - var children = _extends$m({}, state.children); - - delete children[child.key]; - return { - children: children - }; - }); - } - }; - - _proto.render = function render() { - var _this$props = this.props, - Component = _this$props.component, - childFactory = _this$props.childFactory, - props = _objectWithoutPropertiesLoose$b(_this$props, ["component", "childFactory"]); - - var contextValue = this.state.contextValue; - var children = values(this.state.children).map(childFactory); - delete props.appear; - delete props.enter; - delete props.exit; - - if (Component === null) { - return /*#__PURE__*/React__default['default'].createElement(TransitionGroupContext.Provider, { - value: contextValue - }, children); - } - - return /*#__PURE__*/React__default['default'].createElement(TransitionGroupContext.Provider, { - value: contextValue - }, /*#__PURE__*/React__default['default'].createElement(Component, props, children)); - }; - - return TransitionGroup; -}(React__default['default'].Component); - -TransitionGroup.propTypes = process.env.NODE_ENV !== "production" ? { - /** - * `` renders a `
` by default. You can change this - * behavior by providing a `component` prop. - * If you use React v16+ and would like to avoid a wrapping `
` element - * you can pass in `component={null}`. This is useful if the wrapping div - * borks your css styles. - */ - component: PropTypes.any, - - /** - * A set of `` components, that are toggled `in` and out as they - * leave. the `` will inject specific transition props, so - * remember to spread them through if you are wrapping the `` as - * with our `` example. - * - * While this component is meant for multiple `Transition` or `CSSTransition` - * children, sometimes you may want to have a single transition child with - * content that you want to be transitioned out and in when you change it - * (e.g. routes, images etc.) In that case you can change the `key` prop of - * the transition child as you change its content, this will cause - * `TransitionGroup` to transition the child out and back in. - */ - children: PropTypes.node, - - /** - * A convenience prop that enables or disables appear animations - * for all children. Note that specifying this will override any defaults set - * on individual children Transitions. - */ - appear: PropTypes.bool, - - /** - * A convenience prop that enables or disables enter animations - * for all children. Note that specifying this will override any defaults set - * on individual children Transitions. - */ - enter: PropTypes.bool, - - /** - * A convenience prop that enables or disables exit animations - * for all children. Note that specifying this will override any defaults set - * on individual children Transitions. - */ - exit: PropTypes.bool, - - /** - * You may need to apply reactive updates to a child as it is exiting. - * This is generally done by using `cloneElement` however in the case of an exiting - * child the element has already been removed and not accessible to the consumer. - * - * If you do need to update a child as it leaves you can provide a `childFactory` - * to wrap every child, even the ones that are leaving. - * - * @type Function(child: ReactElement) -> ReactElement - */ - childFactory: PropTypes.func -} : {}; -TransitionGroup.defaultProps = defaultProps; -var TransitionGroup$1 = TransitionGroup; - -var reflow = function reflow(node) { - return node.scrollTop; -}; -function getTransitionProps(props, options) { - var timeout = props.timeout, - _props$style = props.style, - style = _props$style === void 0 ? {} : _props$style; - return { - duration: style.transitionDuration || typeof timeout === 'number' ? timeout : timeout[options.mode] || 0, - delay: style.transitionDelay - }; -} - -var styles$19 = function styles(theme) { - return { - /* Styles applied to the root element. */ - root: { - height: 0, - overflow: 'hidden', - transition: theme.transitions.create('height') - }, - - /* Styles applied to the root element when the transition has entered. */ - entered: { - height: 'auto', - overflow: 'visible' - }, - - /* Styles applied to the root element when the transition has exited and `collapsedSize` != 0px. */ - hidden: { - visibility: 'hidden' - }, - - /* Styles applied to the outer wrapper element. */ - wrapper: { - // Hack to get children with a negative margin to not falsify the height computation. - display: 'flex' - }, - - /* Styles applied to the inner wrapper element. */ - wrapperInner: { - width: '100%' - } - }; -}; -/** - * The Collapse transition is used by the - * [Vertical Stepper](/components/steppers/#vertical-stepper) StepContent component. - * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. - */ - -var Collapse = /*#__PURE__*/React__namespace.forwardRef(function Collapse(props, ref) { - var children = props.children, - classes = props.classes, - className = props.className, - collapsedHeight = props.collapsedHeight, - _props$collapsedSize = props.collapsedSize, - collapsedSizeProp = _props$collapsedSize === void 0 ? '0px' : _props$collapsedSize, - _props$component = props.component, - Component = _props$component === void 0 ? 'div' : _props$component, - _props$disableStrictM = props.disableStrictModeCompat, - disableStrictModeCompat = _props$disableStrictM === void 0 ? false : _props$disableStrictM, - inProp = props.in, - onEnter = props.onEnter, - onEntered = props.onEntered, - onEntering = props.onEntering, - onExit = props.onExit, - onExited = props.onExited, - onExiting = props.onExiting, - style = props.style, - _props$timeout = props.timeout, - timeout = _props$timeout === void 0 ? duration.standard : _props$timeout, - _props$TransitionComp = props.TransitionComponent, - TransitionComponent = _props$TransitionComp === void 0 ? Transition$1 : _props$TransitionComp, - other = _objectWithoutProperties$a(props, ["children", "classes", "className", "collapsedHeight", "collapsedSize", "component", "disableStrictModeCompat", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]); - - var theme = useTheme(); - var timer = React__namespace.useRef(); - var wrapperRef = React__namespace.useRef(null); - var autoTransitionDuration = React__namespace.useRef(); - var collapsedSize = typeof (collapsedHeight || collapsedSizeProp) === 'number' ? "".concat(collapsedHeight || collapsedSizeProp, "px") : collapsedHeight || collapsedSizeProp; - React__namespace.useEffect(function () { - return function () { - clearTimeout(timer.current); - }; - }, []); - var enableStrictModeCompat = theme.unstable_strictMode && !disableStrictModeCompat; - var nodeRef = React__namespace.useRef(null); - var handleRef = useForkRef(ref, enableStrictModeCompat ? nodeRef : undefined); - - var normalizedTransitionCallback = function normalizedTransitionCallback(callback) { - return function (nodeOrAppearing, maybeAppearing) { - if (callback) { - var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing], - _ref2 = _slicedToArray(_ref, 2), - node = _ref2[0], - isAppearing = _ref2[1]; // onEnterXxx and onExitXxx callbacks have a different arguments.length value. - - - if (isAppearing === undefined) { - callback(node); - } else { - callback(node, isAppearing); - } - } - }; - }; - - var handleEnter = normalizedTransitionCallback(function (node, isAppearing) { - node.style.height = collapsedSize; - - if (onEnter) { - onEnter(node, isAppearing); - } - }); - var handleEntering = normalizedTransitionCallback(function (node, isAppearing) { - var wrapperHeight = wrapperRef.current ? wrapperRef.current.clientHeight : 0; - - var _getTransitionProps = getTransitionProps({ - style: style, - timeout: timeout - }, { - mode: 'enter' - }), - transitionDuration = _getTransitionProps.duration; - - if (timeout === 'auto') { - var duration2 = theme.transitions.getAutoHeightDuration(wrapperHeight); - node.style.transitionDuration = "".concat(duration2, "ms"); - autoTransitionDuration.current = duration2; - } else { - node.style.transitionDuration = typeof transitionDuration === 'string' ? transitionDuration : "".concat(transitionDuration, "ms"); - } - - node.style.height = "".concat(wrapperHeight, "px"); - - if (onEntering) { - onEntering(node, isAppearing); - } - }); - var handleEntered = normalizedTransitionCallback(function (node, isAppearing) { - node.style.height = 'auto'; - - if (onEntered) { - onEntered(node, isAppearing); - } - }); - var handleExit = normalizedTransitionCallback(function (node) { - var wrapperHeight = wrapperRef.current ? wrapperRef.current.clientHeight : 0; - node.style.height = "".concat(wrapperHeight, "px"); - - if (onExit) { - onExit(node); - } - }); - var handleExited = normalizedTransitionCallback(onExited); - var handleExiting = normalizedTransitionCallback(function (node) { - var wrapperHeight = wrapperRef.current ? wrapperRef.current.clientHeight : 0; - - var _getTransitionProps2 = getTransitionProps({ - style: style, - timeout: timeout - }, { - mode: 'exit' - }), - transitionDuration = _getTransitionProps2.duration; - - if (timeout === 'auto') { - var duration2 = theme.transitions.getAutoHeightDuration(wrapperHeight); - node.style.transitionDuration = "".concat(duration2, "ms"); - autoTransitionDuration.current = duration2; - } else { - node.style.transitionDuration = typeof transitionDuration === 'string' ? transitionDuration : "".concat(transitionDuration, "ms"); - } - - node.style.height = collapsedSize; - - if (onExiting) { - onExiting(node); - } - }); - - var addEndListener = function addEndListener(nodeOrNext, maybeNext) { - var next = enableStrictModeCompat ? nodeOrNext : maybeNext; - - if (timeout === 'auto') { - timer.current = setTimeout(next, autoTransitionDuration.current || 0); - } - }; - - return /*#__PURE__*/React__namespace.createElement(TransitionComponent, _extends$m({ - in: inProp, - onEnter: handleEnter, - onEntered: handleEntered, - onEntering: handleEntering, - onExit: handleExit, - onExited: handleExited, - onExiting: handleExiting, - addEndListener: addEndListener, - nodeRef: enableStrictModeCompat ? nodeRef : undefined, - timeout: timeout === 'auto' ? null : timeout - }, other), function (state, childProps) { - return /*#__PURE__*/React__namespace.createElement(Component, _extends$m({ - className: clsx(classes.root, classes.container, className, { - 'entered': classes.entered, - 'exited': !inProp && collapsedSize === '0px' && classes.hidden - }[state]), - style: _extends$m({ - minHeight: collapsedSize - }, style), - ref: handleRef - }, childProps), /*#__PURE__*/React__namespace.createElement("div", { - className: classes.wrapper, - ref: wrapperRef - }, /*#__PURE__*/React__namespace.createElement("div", { - className: classes.wrapperInner - }, children))); - }); -}); -process.env.NODE_ENV !== "production" ? Collapse.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | - // ---------------------------------------------------------------------- - - /** - * The content node to be collapsed. - */ - children: PropTypes.node, - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: chainPropTypes(PropTypes.object, function (props) { - if (props.classes && props.classes.container) { - throw new Error(['Material-UI: the classes.container key is deprecated.', 'Use `classes.root` instead', 'The name of the pseudo-class was changed for consistency.'].join('\n')); - } - - return null; - }), - - /** - * @ignore - */ - className: PropTypes.string, - - /** - * The height of the container when collapsed. - * @deprecated The prop was renamed to support the addition of horizontal orientation, use `collapsedSize` instead. - */ - collapsedHeight: deprecatedPropType(PropTypes.oneOfType([PropTypes.number, PropTypes.string]), 'The prop was renamed to support the vertical orientation, use `collapsedSize` instead'), - - /** - * The height of the container when collapsed. - */ - collapsedSize: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - - /** - * The component used for the root node. - * Either a string to use a HTML element or a component. - */ - component: PropTypes - /* @typescript-to-proptypes-ignore */ - .elementType, - - /** - * Enable this prop if you encounter 'Function components cannot be given refs', - * use `unstable_createStrictModeTheme`, - * and can't forward the ref in the passed `Component`. - */ - disableStrictModeCompat: PropTypes.bool, - - /** - * If `true`, the component will transition in. - */ - in: PropTypes.bool, - - /** - * @ignore - */ - onEnter: PropTypes.func, - - /** - * @ignore - */ - onEntered: PropTypes.func, - - /** - * @ignore - */ - onEntering: PropTypes.func, - - /** - * @ignore - */ - onExit: PropTypes.func, - - /** - * @ignore - */ - onExited: PropTypes.func, - - /** - * @ignore - */ - onExiting: PropTypes.func, - - /** - * @ignore - */ - style: PropTypes.object, - - /** - * The duration for the transition, in milliseconds. - * You may specify a single timeout for all transitions, or individually with an object. - * - * Set to 'auto' to automatically calculate transition time based on height. - */ - timeout: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.shape({ - appear: PropTypes.number, - enter: PropTypes.number, - exit: PropTypes.number - })]) -} : void 0; -Collapse.muiSupportAuto = true; -var Collapse$1 = withStyles(styles$19, { - name: 'MuiCollapse' -})(Collapse); - -var styles$18 = function styles(theme) { - var elevations = {}; - theme.shadows.forEach(function (shadow, index) { - elevations["elevation".concat(index)] = { - boxShadow: shadow - }; - }); - return _extends$m({ - /* Styles applied to the root element. */ - root: { - backgroundColor: theme.palette.background.paper, - color: theme.palette.text.primary, - transition: theme.transitions.create('box-shadow') - }, - - /* Styles applied to the root element if `square={false}`. */ - rounded: { - borderRadius: theme.shape.borderRadius - }, - - /* Styles applied to the root element if `variant="outlined"`. */ - outlined: { - border: "1px solid ".concat(theme.palette.divider) - } - }, elevations); -}; -var Paper = /*#__PURE__*/React__namespace.forwardRef(function Paper(props, ref) { - var classes = props.classes, - className = props.className, - _props$component = props.component, - Component = _props$component === void 0 ? 'div' : _props$component, - _props$square = props.square, - square = _props$square === void 0 ? false : _props$square, - _props$elevation = props.elevation, - elevation = _props$elevation === void 0 ? 1 : _props$elevation, - _props$variant = props.variant, - variant = _props$variant === void 0 ? 'elevation' : _props$variant, - other = _objectWithoutProperties$a(props, ["classes", "className", "component", "square", "elevation", "variant"]); - - return /*#__PURE__*/React__namespace.createElement(Component, _extends$m({ - className: clsx(classes.root, className, variant === 'outlined' ? classes.outlined : classes["elevation".concat(elevation)], !square && classes.rounded), - ref: ref - }, other)); -}); -process.env.NODE_ENV !== "production" ? Paper.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | - // ---------------------------------------------------------------------- - - /** - * The content of the component. - */ - children: PropTypes.node, - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object, - - /** - * @ignore - */ - className: PropTypes.string, - - /** - * The component used for the root node. - * Either a string to use a HTML element or a component. - */ - component: PropTypes - /* @typescript-to-proptypes-ignore */ - .elementType, - - /** - * Shadow depth, corresponds to `dp` in the spec. - * It accepts values between 0 and 24 inclusive. - */ - elevation: chainPropTypes(PropTypes.number, function (props) { - var classes = props.classes, - elevation = props.elevation; // in case `withStyles` fails to inject we don't need this warning - - if (classes === undefined) { - return null; - } - - if (elevation != null && classes["elevation".concat(elevation)] === undefined) { - return new Error("Material-UI: This elevation `".concat(elevation, "` is not implemented.")); - } - - return null; - }), - - /** - * If `true`, rounded corners are disabled. - */ - square: PropTypes.bool, - - /** - * The variant to use. - */ - variant: PropTypes.oneOf(['elevation', 'outlined']) -} : void 0; -var Paper$1 = withStyles(styles$18, { - name: 'MuiPaper' -})(Paper); - -/** - * @ignore - internal component. - * @type {React.Context<{} | {expanded: boolean, disabled: boolean, toggle: () => void}>} - */ - -var AccordionContext = React__namespace.createContext({}); - -if (process.env.NODE_ENV !== 'production') { - AccordionContext.displayName = 'AccordionContext'; -} - -var AccordionContext$1 = AccordionContext; - -var styles$17 = function styles(theme) { - var transition = { - duration: theme.transitions.duration.shortest - }; - return { - /* Styles applied to the root element. */ - root: { - position: 'relative', - transition: theme.transitions.create(['margin'], transition), - '&:before': { - position: 'absolute', - left: 0, - top: -1, - right: 0, - height: 1, - content: '""', - opacity: 1, - backgroundColor: theme.palette.divider, - transition: theme.transitions.create(['opacity', 'background-color'], transition) - }, - '&:first-child': { - '&:before': { - display: 'none' - } - }, - '&$expanded': { - margin: '16px 0', - '&:first-child': { - marginTop: 0 - }, - '&:last-child': { - marginBottom: 0 - }, - '&:before': { - opacity: 0 - } - }, - '&$expanded + &': { - '&:before': { - display: 'none' - } - }, - '&$disabled': { - backgroundColor: theme.palette.action.disabledBackground - } - }, - - /* Styles applied to the root element if `square={false}`. */ - rounded: { - borderRadius: 0, - '&:first-child': { - borderTopLeftRadius: theme.shape.borderRadius, - borderTopRightRadius: theme.shape.borderRadius - }, - '&:last-child': { - borderBottomLeftRadius: theme.shape.borderRadius, - borderBottomRightRadius: theme.shape.borderRadius, - // Fix a rendering issue on Edge - '@supports (-ms-ime-align: auto)': { - borderBottomLeftRadius: 0, - borderBottomRightRadius: 0 - } - } - }, - - /* Styles applied to the root element if `expanded={true}`. */ - expanded: {}, - - /* Styles applied to the root element if `disabled={true}`. */ - disabled: {} - }; -}; -var Accordion = /*#__PURE__*/React__namespace.forwardRef(function Accordion(props, ref) { - var childrenProp = props.children, - classes = props.classes, - className = props.className, - _props$defaultExpande = props.defaultExpanded, - defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande, - _props$disabled = props.disabled, - disabled = _props$disabled === void 0 ? false : _props$disabled, - expandedProp = props.expanded, - onChange = props.onChange, - _props$square = props.square, - square = _props$square === void 0 ? false : _props$square, - _props$TransitionComp = props.TransitionComponent, - TransitionComponent = _props$TransitionComp === void 0 ? Collapse$1 : _props$TransitionComp, - TransitionProps = props.TransitionProps, - other = _objectWithoutProperties$a(props, ["children", "classes", "className", "defaultExpanded", "disabled", "expanded", "onChange", "square", "TransitionComponent", "TransitionProps"]); - - var _useControlled = useControlled({ - controlled: expandedProp, - default: defaultExpanded, - name: 'Accordion', - state: 'expanded' - }), - _useControlled2 = _slicedToArray(_useControlled, 2), - expanded = _useControlled2[0], - setExpandedState = _useControlled2[1]; - - var handleChange = React__namespace.useCallback(function (event) { - setExpandedState(!expanded); - - if (onChange) { - onChange(event, !expanded); - } - }, [expanded, onChange, setExpandedState]); - - var _React$Children$toArr = React__namespace.Children.toArray(childrenProp), - _React$Children$toArr2 = _toArray(_React$Children$toArr), - summary = _React$Children$toArr2[0], - children = _React$Children$toArr2.slice(1); - - var contextValue = React__namespace.useMemo(function () { - return { - expanded: expanded, - disabled: disabled, - toggle: handleChange - }; - }, [expanded, disabled, handleChange]); - return /*#__PURE__*/React__namespace.createElement(Paper$1, _extends$m({ - className: clsx(classes.root, className, expanded && classes.expanded, disabled && classes.disabled, !square && classes.rounded), - ref: ref, - square: square - }, other), /*#__PURE__*/React__namespace.createElement(AccordionContext$1.Provider, { - value: contextValue - }, summary), /*#__PURE__*/React__namespace.createElement(TransitionComponent, _extends$m({ - in: expanded, - timeout: "auto" - }, TransitionProps), /*#__PURE__*/React__namespace.createElement("div", { - "aria-labelledby": summary.props.id, - id: summary.props['aria-controls'], - role: "region" - }, children))); -}); -process.env.NODE_ENV !== "production" ? Accordion.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | - // ---------------------------------------------------------------------- - - /** - * The content of the accordion. - */ - children: chainPropTypes(PropTypes.node.isRequired, function (props) { - var summary = React__namespace.Children.toArray(props.children)[0]; - - if (reactIs$1.exports.isFragment(summary)) { - return new Error("Material-UI: The Accordion doesn't accept a Fragment as a child. " + 'Consider providing an array instead.'); - } - - if (! /*#__PURE__*/React__namespace.isValidElement(summary)) { - return new Error('Material-UI: Expected the first child of Accordion to be a valid element.'); - } - - return null; - }), - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object, - - /** - * @ignore - */ - className: PropTypes.string, - - /** - * If `true`, expands the accordion by default. - */ - defaultExpanded: PropTypes.bool, - - /** - * If `true`, the accordion will be displayed in a disabled state. - */ - disabled: PropTypes.bool, - - /** - * If `true`, expands the accordion, otherwise collapse it. - * Setting this prop enables control over the accordion. - */ - expanded: PropTypes.bool, - - /** - * Callback fired when the expand/collapse state is changed. - * - * @param {object} event The event source of the callback. - * @param {boolean} expanded The `expanded` state of the accordion. - */ - onChange: PropTypes.func, - - /** - * If `true`, rounded corners are disabled. - */ - square: PropTypes.bool, - - /** - * The component used for the collapse effect. - * [Follow this guide](/components/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. - */ - TransitionComponent: PropTypes.elementType, - - /** - * Props applied to the [`Transition`](http://reactcommunity.org/react-transition-group/transition#Transition-props) element. - */ - TransitionProps: PropTypes.object -} : void 0; -var Accordion$1 = withStyles(styles$17, { - name: 'MuiAccordion' -})(Accordion); - -var styles$16 = function styles(theme) { - return { - /* Styles applied to the root element. */ - root: { - display: 'flex', - padding: theme.spacing(1, 2, 2) - } - }; -}; -var AccordionDetails = /*#__PURE__*/React__namespace.forwardRef(function AccordionDetails(props, ref) { - var classes = props.classes, - className = props.className, - other = _objectWithoutProperties$a(props, ["classes", "className"]); - - return /*#__PURE__*/React__namespace.createElement("div", _extends$m({ - className: clsx(classes.root, className), - ref: ref - }, other)); -}); -process.env.NODE_ENV !== "production" ? AccordionDetails.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | - // ---------------------------------------------------------------------- - - /** - * The content of the accordion details. - */ - children: PropTypes.node, - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object, - - /** - * @ignore - */ - className: PropTypes.string -} : void 0; -var AccordionDetails$1 = withStyles(styles$16, { - name: 'MuiAccordionDetails' -})(AccordionDetails); - -var useEnhancedEffect$6 = typeof window === 'undefined' ? React__namespace.useEffect : React__namespace.useLayoutEffect; -/** - * @ignore - internal component. - */ - -function Ripple(props) { - var classes = props.classes, - _props$pulsate = props.pulsate, - pulsate = _props$pulsate === void 0 ? false : _props$pulsate, - rippleX = props.rippleX, - rippleY = props.rippleY, - rippleSize = props.rippleSize, - inProp = props.in, - _props$onExited = props.onExited, - onExited = _props$onExited === void 0 ? function () {} : _props$onExited, - timeout = props.timeout; - - var _React$useState = React__namespace.useState(false), - leaving = _React$useState[0], - setLeaving = _React$useState[1]; - - var rippleClassName = clsx(classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate); - var rippleStyles = { - width: rippleSize, - height: rippleSize, - top: -(rippleSize / 2) + rippleY, - left: -(rippleSize / 2) + rippleX - }; - var childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate); - var handleExited = useEventCallback(onExited); // Ripple is used for user feedback (e.g. click or press) so we want to apply styles with the highest priority - - useEnhancedEffect$6(function () { - if (!inProp) { - // react-transition-group#onExit - setLeaving(true); // react-transition-group#onExited - - var timeoutId = setTimeout(handleExited, timeout); - return function () { - clearTimeout(timeoutId); - }; - } - - return undefined; - }, [handleExited, inProp, timeout]); - return /*#__PURE__*/React__namespace.createElement("span", { - className: rippleClassName, - style: rippleStyles - }, /*#__PURE__*/React__namespace.createElement("span", { - className: childClassName - })); -} - -process.env.NODE_ENV !== "production" ? Ripple.propTypes = { - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object.isRequired, - - /** - * @ignore - injected from TransitionGroup - */ - in: PropTypes.bool, - - /** - * @ignore - injected from TransitionGroup - */ - onExited: PropTypes.func, - - /** - * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element. - */ - pulsate: PropTypes.bool, - - /** - * Diameter of the ripple. - */ - rippleSize: PropTypes.number, - - /** - * Horizontal position of the ripple center. - */ - rippleX: PropTypes.number, - - /** - * Vertical position of the ripple center. - */ - rippleY: PropTypes.number, - - /** - * exit delay - */ - timeout: PropTypes.number.isRequired -} : void 0; - -var DURATION = 550; -var DELAY_RIPPLE = 80; -var styles$15 = function styles(theme) { - return { - /* Styles applied to the root element. */ - root: { - overflow: 'hidden', - pointerEvents: 'none', - position: 'absolute', - zIndex: 0, - top: 0, - right: 0, - bottom: 0, - left: 0, - borderRadius: 'inherit' - }, - - /* Styles applied to the internal `Ripple` components `ripple` class. */ - ripple: { - opacity: 0, - position: 'absolute' - }, - - /* Styles applied to the internal `Ripple` components `rippleVisible` class. */ - rippleVisible: { - opacity: 0.3, - transform: 'scale(1)', - animation: "$enter ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) - }, - - /* Styles applied to the internal `Ripple` components `ripplePulsate` class. */ - ripplePulsate: { - animationDuration: "".concat(theme.transitions.duration.shorter, "ms") - }, - - /* Styles applied to the internal `Ripple` components `child` class. */ - child: { - opacity: 1, - display: 'block', - width: '100%', - height: '100%', - borderRadius: '50%', - backgroundColor: 'currentColor' - }, - - /* Styles applied to the internal `Ripple` components `childLeaving` class. */ - childLeaving: { - opacity: 0, - animation: "$exit ".concat(DURATION, "ms ").concat(theme.transitions.easing.easeInOut) - }, - - /* Styles applied to the internal `Ripple` components `childPulsate` class. */ - childPulsate: { - position: 'absolute', - left: 0, - top: 0, - animation: "$pulsate 2500ms ".concat(theme.transitions.easing.easeInOut, " 200ms infinite") - }, - '@keyframes enter': { - '0%': { - transform: 'scale(0)', - opacity: 0.1 - }, - '100%': { - transform: 'scale(1)', - opacity: 0.3 - } - }, - '@keyframes exit': { - '0%': { - opacity: 1 - }, - '100%': { - opacity: 0 - } - }, - '@keyframes pulsate': { - '0%': { - transform: 'scale(1)' - }, - '50%': { - transform: 'scale(0.92)' - }, - '100%': { - transform: 'scale(1)' - } - } - }; -}; -/** - * @ignore - internal component. - * - * TODO v5: Make private - */ - -var TouchRipple = /*#__PURE__*/React__namespace.forwardRef(function TouchRipple(props, ref) { - var _props$center = props.center, - centerProp = _props$center === void 0 ? false : _props$center, - classes = props.classes, - className = props.className, - other = _objectWithoutProperties$a(props, ["center", "classes", "className"]); - - var _React$useState = React__namespace.useState([]), - ripples = _React$useState[0], - setRipples = _React$useState[1]; - - var nextKey = React__namespace.useRef(0); - var rippleCallback = React__namespace.useRef(null); - React__namespace.useEffect(function () { - if (rippleCallback.current) { - rippleCallback.current(); - rippleCallback.current = null; - } - }, [ripples]); // Used to filter out mouse emulated events on mobile. - - var ignoringMouseDown = React__namespace.useRef(false); // We use a timer in order to only show the ripples for touch "click" like events. - // We don't want to display the ripple for touch scroll events. - - var startTimer = React__namespace.useRef(null); // This is the hook called once the previous timeout is ready. - - var startTimerCommit = React__namespace.useRef(null); - var container = React__namespace.useRef(null); - React__namespace.useEffect(function () { - return function () { - clearTimeout(startTimer.current); - }; - }, []); - var startCommit = React__namespace.useCallback(function (params) { - var pulsate = params.pulsate, - rippleX = params.rippleX, - rippleY = params.rippleY, - rippleSize = params.rippleSize, - cb = params.cb; - setRipples(function (oldRipples) { - return [].concat(_toConsumableArray$5(oldRipples), [/*#__PURE__*/React__namespace.createElement(Ripple, { - key: nextKey.current, - classes: classes, - timeout: DURATION, - pulsate: pulsate, - rippleX: rippleX, - rippleY: rippleY, - rippleSize: rippleSize - })]); - }); - nextKey.current += 1; - rippleCallback.current = cb; - }, [classes]); - var start = React__namespace.useCallback(function () { - var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - var cb = arguments.length > 2 ? arguments[2] : undefined; - var _options$pulsate = options.pulsate, - pulsate = _options$pulsate === void 0 ? false : _options$pulsate, - _options$center = options.center, - center = _options$center === void 0 ? centerProp || options.pulsate : _options$center, - _options$fakeElement = options.fakeElement, - fakeElement = _options$fakeElement === void 0 ? false : _options$fakeElement; - - if (event.type === 'mousedown' && ignoringMouseDown.current) { - ignoringMouseDown.current = false; - return; - } - - if (event.type === 'touchstart') { - ignoringMouseDown.current = true; - } - - var element = fakeElement ? null : container.current; - var rect = element ? element.getBoundingClientRect() : { - width: 0, - height: 0, - left: 0, - top: 0 - }; // Get the size of the ripple - - var rippleX; - var rippleY; - var rippleSize; - - if (center || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) { - rippleX = Math.round(rect.width / 2); - rippleY = Math.round(rect.height / 2); - } else { - var _ref = event.touches ? event.touches[0] : event, - clientX = _ref.clientX, - clientY = _ref.clientY; - - rippleX = Math.round(clientX - rect.left); - rippleY = Math.round(clientY - rect.top); - } - - if (center) { - rippleSize = Math.sqrt((2 * Math.pow(rect.width, 2) + Math.pow(rect.height, 2)) / 3); // For some reason the animation is broken on Mobile Chrome if the size if even. - - if (rippleSize % 2 === 0) { - rippleSize += 1; - } - } else { - var sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2; - var sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2; - rippleSize = Math.sqrt(Math.pow(sizeX, 2) + Math.pow(sizeY, 2)); - } // Touche devices - - - if (event.touches) { - // check that this isn't another touchstart due to multitouch - // otherwise we will only clear a single timer when unmounting while two - // are running - if (startTimerCommit.current === null) { - // Prepare the ripple effect. - startTimerCommit.current = function () { - startCommit({ - pulsate: pulsate, - rippleX: rippleX, - rippleY: rippleY, - rippleSize: rippleSize, - cb: cb - }); - }; // Delay the execution of the ripple effect. - - - startTimer.current = setTimeout(function () { - if (startTimerCommit.current) { - startTimerCommit.current(); - startTimerCommit.current = null; - } - }, DELAY_RIPPLE); // We have to make a tradeoff with this value. - } - } else { - startCommit({ - pulsate: pulsate, - rippleX: rippleX, - rippleY: rippleY, - rippleSize: rippleSize, - cb: cb - }); - } - }, [centerProp, startCommit]); - var pulsate = React__namespace.useCallback(function () { - start({}, { - pulsate: true - }); - }, [start]); - var stop = React__namespace.useCallback(function (event, cb) { - clearTimeout(startTimer.current); // The touch interaction occurs too quickly. - // We still want to show ripple effect. - - if (event.type === 'touchend' && startTimerCommit.current) { - event.persist(); - startTimerCommit.current(); - startTimerCommit.current = null; - startTimer.current = setTimeout(function () { - stop(event, cb); - }); - return; - } - - startTimerCommit.current = null; - setRipples(function (oldRipples) { - if (oldRipples.length > 0) { - return oldRipples.slice(1); - } - - return oldRipples; - }); - rippleCallback.current = cb; - }, []); - React__namespace.useImperativeHandle(ref, function () { - return { - pulsate: pulsate, - start: start, - stop: stop - }; - }, [pulsate, start, stop]); - return /*#__PURE__*/React__namespace.createElement("span", _extends$m({ - className: clsx(classes.root, className), - ref: container - }, other), /*#__PURE__*/React__namespace.createElement(TransitionGroup$1, { - component: null, - exit: true - }, ripples)); -}); -process.env.NODE_ENV !== "production" ? TouchRipple.propTypes = { - /** - * If `true`, the ripple starts at the center of the component - * rather than at the point of interaction. - */ - center: PropTypes.bool, - - /** - * Override or extend the styles applied to the component. - * See [CSS API](#css) below for more details. - */ - classes: PropTypes.object.isRequired, - - /** - * @ignore - */ - className: PropTypes.string -} : void 0; -var TouchRipple$1 = withStyles(styles$15, { - flip: false, - name: 'MuiTouchRipple' -})( /*#__PURE__*/React__namespace.memo(TouchRipple)); - -var styles$14 = { - /* Styles applied to the root element. */ - root: { - display: 'inline-flex', - alignItems: 'center', - justifyContent: 'center', - position: 'relative', - WebkitTapHighlightColor: 'transparent', - backgroundColor: 'transparent', - // Reset default value - // We disable the focus ring for mouse, touch and keyboard users. - outline: 0, - border: 0, - margin: 0, - // Remove the margin in Safari - borderRadius: 0, - padding: 0, - // Remove the padding in Firefox - cursor: 'pointer', - userSelect: 'none', - verticalAlign: 'middle', - '-moz-appearance': 'none', - // Reset - '-webkit-appearance': 'none', - // Reset - textDecoration: 'none', - // So we take precedent over the style of a native element. - color: 'inherit', - '&::-moz-focus-inner': { - borderStyle: 'none' // Remove Firefox dotted outline. - - }, - '&$disabled': { - pointerEvents: 'none', - // Disable link interactions - cursor: 'default' - }, - '@media print': { - colorAdjust: 'exact' - } - }, - - /* Pseudo-class applied to the root element if `disabled={true}`. */ - disabled: {}, - - /* Pseudo-class applied to the root element if keyboard focused. */ - focusVisible: {} -}; -/** - * `ButtonBase` contains as few styles as possible. - * It aims to be a simple building block for creating a button. - * It contains a load of style reset and some focus/ripple logic. - */ - -var ButtonBase = /*#__PURE__*/React__namespace.forwardRef(function ButtonBase(props, ref) { - var action = props.action, - buttonRefProp = props.buttonRef, - _props$centerRipple = props.centerRipple, - centerRipple = _props$centerRipple === void 0 ? false : _props$centerRipple, - children = props.children, - classes = props.classes, - className = props.className, - _props$component = props.component, - component = _props$component === void 0 ? 'button' : _props$component, - _props$disabled = props.disabled, - disabled = _props$disabled === void 0 ? false : _props$disabled, - _props$disableRipple = props.disableRipple, - disableRipple = _props$disableRipple === void 0 ? false : _props$disableRipple, - _props$disableTouchRi = props.disableTouchRipple, - disableTouchRipple = _props$disableTouchRi === void 0 ? false : _props$disableTouchRi, - _props$focusRipple = props.focusRipple, - focusRipple = _props$focusRipple === void 0 ? false : _props$focusRipple, - focusVisibleClassName = props.focusVisibleClassName, - onBlur = props.onBlur, - onClick = props.onClick, - onFocus = props.onFocus, - onFocusVisible = props.onFocusVisible, - onKeyDown = props.onKeyDown, - onKeyUp = props.onKeyUp, - onMouseDown = props.onMouseDown, - onMouseLeave = props.onMouseLeave, - onMouseUp = props.onMouseUp, - onTouchEnd = props.onTouchEnd, - onTouchMove = props.onTouchMove, - onTouchStart = props.onTouchStart, - onDragLeave = props.onDragLeave, - _props$tabIndex = props.tabIndex, - tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex, - TouchRippleProps = props.TouchRippleProps, - _props$type = props.type, - type = _props$type === void 0 ? 'button' : _props$type, - other = _objectWithoutProperties$a(props, ["action", "buttonRef", "centerRipple", "children", "classes", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "onBlur", "onClick", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "onDragLeave", "tabIndex", "TouchRippleProps", "type"]); - - var buttonRef = React__namespace.useRef(null); - - function getButtonNode() { - // #StrictMode ready - return ReactDOM__namespace.findDOMNode(buttonRef.current); - } - - var rippleRef = React__namespace.useRef(null); - - var _React$useState = React__namespace.useState(false), - focusVisible = _React$useState[0], - setFocusVisible = _React$useState[1]; - - if (disabled && focusVisible) { - setFocusVisible(false); - } - - var _useIsFocusVisible = useIsFocusVisible(), - isFocusVisible = _useIsFocusVisible.isFocusVisible, - onBlurVisible = _useIsFocusVisible.onBlurVisible, - focusVisibleRef = _useIsFocusVisible.ref; - - React__namespace.useImperativeHandle(action, function () { - return { - focusVisible: function focusVisible() { - setFocusVisible(true); - buttonRef.current.focus(); - } - }; - }, []); - React__namespace.useEffect(function () { - if (focusVisible && focusRipple && !disableRipple) { - rippleRef.current.pulsate(); - } - }, [disableRipple, focusRipple, focusVisible]); - - function useRippleHandler(rippleAction, eventCallback) { - var skipRippleAction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : disableTouchRipple; - return useEventCallback(function (event) { - if (eventCallback) { - eventCallback(event); - } - - var ignore = skipRippleAction; - - if (!ignore && rippleRef.current) { - rippleRef.current[rippleAction](event); - } - - return true; - }); - } - - var handleMouseDown = useRippleHandler('start', onMouseDown); - var handleDragLeave = useRippleHandler('stop', onDragLeave); - var handleMouseUp = useRippleHandler('stop', onMouseUp); - var handleMouseLeave = useRippleHandler('stop', function (event) { - if (focusVisible) { - event.preventDefault(); - } - - if (onMouseLeave) { - onMouseLeave(event); - } - }); - var handleTouchStart = useRippleHandler('start', onTouchStart); - var handleTouchEnd = useRippleHandler('stop', onTouchEnd); - var handleTouchMove = useRippleHandler('stop', onTouchMove); - var handleBlur = useRippleHandler('stop', function (event) { - if (focusVisible) { - onBlurVisible(event); - setFocusVisible(false); - } - - if (onBlur) { - onBlur(event); - } - }, false); - var handleFocus = useEventCallback(function (event) { - // Fix for https://github.com/facebook/react/issues/7769 - if (!buttonRef.current) { - buttonRef.current = event.currentTarget; - } - - if (isFocusVisible(event)) { - setFocusVisible(true); - - if (onFocusVisible) { - onFocusVisible(event); - } - } - - if (onFocus) { - onFocus(event); - } - }); - - var isNonNativeButton = function isNonNativeButton() { - var button = getButtonNode(); - return component && component !== 'button' && !(button.tagName === 'A' && button.href); - }; - /** - * IE 11 shim for https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/repeat - */ - - - var keydownRef = React__namespace.useRef(false); - var handleKeyDown = useEventCallback(function (event) { - // Check if key is already down to avoid repeats being counted as multiple activations - if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === ' ') { - keydownRef.current = true; - event.persist(); - rippleRef.current.stop(event, function () { - rippleRef.current.start(event); - }); - } - - if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') { - event.preventDefault(); - } - - if (onKeyDown) { - onKeyDown(event); - } // Keyboard accessibility for non interactive elements - - - if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter' && !disabled) { - event.preventDefault(); - - if (onClick) { - onClick(event); - } - } - }); - var handleKeyUp = useEventCallback(function (event) { - // calling preventDefault in keyUp on a