Socket
Socket
Sign inDemoInstall

@mui/styles

Package Overview
Dependencies
Maintainers
10
Versions
142
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mui/styles - npm Package Compare versions

Comparing version 6.0.0-alpha.7 to 6.0.0-alpha.8

5

getStylesCreator/getStylesCreator.js

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import { deepmerge } from '@mui/utils';

@@ -31,3 +30,5 @@ import propsToClassKey from '../propsToClassKey';

const variants = theme.components[name].variants || [];
const stylesWithOverrides = _extends({}, styles);
const stylesWithOverrides = {
...styles
};
Object.keys(overrides).forEach(key => {

@@ -34,0 +35,0 @@ if (process.env.NODE_ENV !== 'production') {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
/* eslint-disable no-restricted-syntax */

@@ -12,3 +11,5 @@ export default function getThemeProps(params) {

}
const output = _extends({}, props);
const output = {
...props
};

@@ -15,0 +16,0 @@ // Resolve default props, code borrow from React source.

2

index.js
/**
* @mui/styles v6.0.0-alpha.7
* @mui/styles v6.0.0-alpha.8
*

@@ -4,0 +4,0 @@ * @license MIT

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

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import _extends from "@babel/runtime/helpers/esm/extends";
const _excluded = ["name", "classNamePrefix", "Component", "defaultTheme"];
import * as React from 'react';

@@ -70,6 +67,8 @@ import { getDynamicStyles } from 'jss';

}
const options = _extends({}, stylesCreator.options, stylesOptions, {
const options = {
...stylesCreator.options,
...stylesOptions,
theme,
flip: typeof stylesOptions.flip === 'boolean' ? stylesOptions.flip : theme.direction === 'rtl'
});
};
options.generateId = options.serverGenerateClassName || options.generateClassName;

@@ -84,5 +83,6 @@ const sheetsRegistry = stylesOptions.sheetsRegistry;

if (!staticSheet) {
staticSheet = stylesOptions.jss.createStyleSheet(styles, _extends({
link: false
}, options));
staticSheet = stylesOptions.jss.createStyleSheet(styles, {
link: false,
...options
});
staticSheet.attach();

@@ -100,5 +100,6 @@ if (stylesOptions.sheetsCache) {

if (sheetManager.dynamicStyles) {
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, _extends({
link: true
}, options));
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, {
link: true,
...options
});
dynamicSheet.update(props);

@@ -173,10 +174,10 @@ dynamicSheet.attach();

const {
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = noopTheme
} = options,
stylesOptions2 = _objectWithoutPropertiesLoose(options, _excluded);
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = noopTheme,
...stylesOptions2
} = options;
const stylesCreator = getStylesCreator(stylesOrCreator);

@@ -192,3 +193,6 @@ const classNamePrefix = name || classNamePrefixOption || 'makeStyles';

const theme = useTheme() || defaultTheme;
const stylesOptions = _extends({}, React.useContext(StylesContext), stylesOptions2);
const stylesOptions = {
...React.useContext(StylesContext),
...stylesOptions2
};
const instance = React.useRef();

@@ -195,0 +199,0 @@ const shouldUpdate = React.useRef();

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import { getDisplayName } from '@mui/utils';

@@ -12,3 +11,5 @@ export default function mergeClasses(options = {}) {

}
const nextClasses = _extends({}, baseClasses);
const nextClasses = {
...baseClasses
};
if (process.env.NODE_ENV !== 'production') {

@@ -15,0 +16,0 @@ if (typeof newClasses === 'string') {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import { deepmerge } from '@mui/utils';

@@ -31,3 +30,5 @@ import propsToClassKey from '../propsToClassKey';

const variants = theme.components[name].variants || [];
const stylesWithOverrides = _extends({}, styles);
const stylesWithOverrides = {
...styles
};
Object.keys(overrides).forEach(key => {

@@ -34,0 +35,0 @@ if (process.env.NODE_ENV !== 'production') {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
/* eslint-disable no-restricted-syntax */

@@ -12,3 +11,5 @@ export default function getThemeProps(params) {

}
const output = _extends({}, props);
const output = {
...props
};

@@ -15,0 +16,0 @@ // Resolve default props, code borrow from React source.

/**
* @mui/styles v6.0.0-alpha.7
* @mui/styles v6.0.0-alpha.8
*

@@ -4,0 +4,0 @@ * @license MIT

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

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import _extends from "@babel/runtime/helpers/esm/extends";
const _excluded = ["name", "classNamePrefix", "Component", "defaultTheme"];
import * as React from 'react';

@@ -70,6 +67,8 @@ import { getDynamicStyles } from 'jss';

}
const options = _extends({}, stylesCreator.options, stylesOptions, {
const options = {
...stylesCreator.options,
...stylesOptions,
theme,
flip: typeof stylesOptions.flip === 'boolean' ? stylesOptions.flip : theme.direction === 'rtl'
});
};
options.generateId = options.serverGenerateClassName || options.generateClassName;

@@ -84,5 +83,6 @@ const sheetsRegistry = stylesOptions.sheetsRegistry;

if (!staticSheet) {
staticSheet = stylesOptions.jss.createStyleSheet(styles, _extends({
link: false
}, options));
staticSheet = stylesOptions.jss.createStyleSheet(styles, {
link: false,
...options
});
staticSheet.attach();

@@ -100,5 +100,6 @@ if (stylesOptions.sheetsCache) {

if (sheetManager.dynamicStyles) {
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, _extends({
link: true
}, options));
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, {
link: true,
...options
});
dynamicSheet.update(props);

@@ -173,10 +174,10 @@ dynamicSheet.attach();

const {
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = noopTheme
} = options,
stylesOptions2 = _objectWithoutPropertiesLoose(options, _excluded);
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = noopTheme,
...stylesOptions2
} = options;
const stylesCreator = getStylesCreator(stylesOrCreator);

@@ -192,3 +193,6 @@ const classNamePrefix = name || classNamePrefixOption || 'makeStyles';

const theme = useTheme() || defaultTheme;
const stylesOptions = _extends({}, React.useContext(StylesContext), stylesOptions2);
const stylesOptions = {
...React.useContext(StylesContext),
...stylesOptions2
};
const instance = React.useRef();

@@ -195,0 +199,0 @@ const shouldUpdate = React.useRef();

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import { getDisplayName } from '@mui/utils';

@@ -12,3 +11,5 @@ export default function mergeClasses(options = {}) {

}
const nextClasses = _extends({}, baseClasses);
const nextClasses = {
...baseClasses
};
if (process.env.NODE_ENV !== 'production') {

@@ -15,0 +16,0 @@ if (typeof newClasses === 'string') {

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

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["variant"];
import { unstable_capitalize as capitalize } from '@mui/utils';

@@ -15,5 +13,5 @@ function isEmpty(string) {

const {
variant
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded);
variant,
...other
} = props;
let classKey = variant || '';

@@ -20,0 +18,0 @@ Object.keys(other).sort().forEach(key => {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';

@@ -18,9 +17,9 @@ import { SheetsRegistry } from 'jss';

const generateClassName = createGenerateClassName();
return /*#__PURE__*/_jsx(StylesProvider, _extends({
return /*#__PURE__*/_jsx(StylesProvider, {
sheetsManager: sheetsManager,
serverGenerateClassName: generateClassName,
sheetsRegistry: this.sheetsRegistry
}, this.options, {
sheetsRegistry: this.sheetsRegistry,
...this.options,
children: children
}));
});
}

@@ -31,3 +30,3 @@ toString() {

getStyleElement(props) {
return /*#__PURE__*/React.createElement('style', _extends({
return /*#__PURE__*/React.createElement('style', {
id: 'jss-server-side',

@@ -37,5 +36,6 @@ key: 'jss-server-side',

__html: this.toString()
}
}, props));
},
...props
});
}
}

@@ -1,5 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["name"],
_excluded2 = ["children", "className", "clone", "component"];
import * as React from 'react';

@@ -27,5 +23,5 @@ import clsx from 'clsx';

const {
name
} = options,
stylesOptions = _objectWithoutPropertiesLoose(options, _excluded);
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production' && Component === undefined) {

@@ -45,13 +41,15 @@ throw new Error(['You are calling styled(Component)(style) with an undefined component.', 'You may have forgotten to import it.'].join('\n'));

const stylesOrCreator = typeof style === 'function' ? theme => ({
root: props => style(_extends({
theme
}, props))
root: props => style({
theme,
...props
})
}) : {
root: style
};
const useStyles = makeStyles(stylesOrCreator, _extends({
const useStyles = makeStyles(stylesOrCreator, {
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
let filterProps;

@@ -73,8 +71,8 @@ let propTypes = {};

const {
children,
className: classNameProp,
clone,
component: ComponentProp
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded2);
children,
className: classNameProp,
clone,
component: ComponentProp,
...other
} = props;
const classes = useStyles(props);

@@ -87,20 +85,22 @@ const className = clsx(classes.root, classNameProp);

if (clone) {
return /*#__PURE__*/React.cloneElement(children, _extends({
className: clsx(children.props.className, className)
}, spread));
return /*#__PURE__*/React.cloneElement(children, {
className: clsx(children.props.className, className),
...spread
});
}
if (typeof children === 'function') {
return children(_extends({
className
}, spread));
return children({
className,
...spread
});
}
const FinalComponent = ComponentProp || Component;
return /*#__PURE__*/_jsx(FinalComponent, _extends({
return /*#__PURE__*/_jsx(FinalComponent, {
ref: ref,
className: className
}, spread, {
className: className,
...spread,
children: children
}));
});
});
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = _extends({
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = {
/**

@@ -130,4 +130,5 @@ * A render function or node.

*/
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType
}, propTypes) : void 0;
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
...propTypes
} : void 0;
if (process.env.NODE_ENV !== 'production') {

@@ -134,0 +135,0 @@ StyledComponent.displayName = `Styled(${classNamePrefix})`;

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

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["children", "injectFirst", "disableGeneration"];
import * as React from 'react';

@@ -38,7 +35,7 @@ import PropTypes from 'prop-types';

const {
children,
injectFirst = false,
disableGeneration = false
} = props,
localOptions = _objectWithoutPropertiesLoose(props, _excluded);
children,
injectFirst = false,
disableGeneration = false,
...localOptions
} = props;
const outerOptions = React.useContext(StylesContext);

@@ -52,3 +49,6 @@ const {

sheetsRegistry
} = _extends({}, outerOptions, localOptions);
} = {
...outerOptions,
...localOptions
};
if (process.env.NODE_ENV !== 'production') {

@@ -55,0 +55,0 @@ if (injectFirst && localOptions.jss) {

@@ -1,5 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["defaultTheme", "withTheme", "name"],
_excluded2 = ["classes"];
import * as React from 'react';

@@ -19,7 +15,7 @@ import PropTypes from 'prop-types';

const {
defaultTheme,
withTheme = false,
name
} = options,
stylesOptions = _objectWithoutPropertiesLoose(options, _excluded);
defaultTheme,
withTheme = false,
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production') {

@@ -40,14 +36,21 @@ if (Component === undefined) {

}
const useStyles = makeStyles(stylesOrCreator, _extends({
const useStyles = makeStyles(stylesOrCreator, {
defaultTheme,
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
const WithStyles = /*#__PURE__*/React.forwardRef(function WithStyles(props, ref) {
const other = _objectWithoutPropertiesLoose(props, _excluded2);
const {
classes: classesProp,
...other
} = props;
// 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.
const classes = useStyles(_extends({}, Component.defaultProps, props));
const classes = useStyles({
...Component.defaultProps,
...props
});
let theme;

@@ -73,6 +76,7 @@ let more = other;

}
return /*#__PURE__*/_jsx(Component, _extends({
return /*#__PURE__*/_jsx(Component, {
ref: ref,
classes: classes
}, more));
classes: classes,
...more
});
});

@@ -79,0 +83,0 @@ process.env.NODE_ENV !== "production" ? WithStyles.propTypes = {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';

@@ -19,6 +18,7 @@ import hoistNonReactStatics from 'hoist-non-react-statics';

const theme = useTheme() || defaultTheme;
return /*#__PURE__*/_jsx(Component, _extends({
return /*#__PURE__*/_jsx(Component, {
theme: theme,
ref: ref
}, props));
ref: ref,
...props
});
});

@@ -25,0 +25,0 @@ if (process.env.NODE_ENV !== 'production') {

@@ -8,3 +8,2 @@ "use strict";

exports.default = getStylesCreator;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _utils = require("@mui/utils");

@@ -39,3 +38,5 @@ var _propsToClassKey = _interopRequireDefault(require("../propsToClassKey"));

const variants = theme.components[name].variants || [];
const stylesWithOverrides = (0, _extends2.default)({}, styles);
const stylesWithOverrides = {
...styles
};
Object.keys(overrides).forEach(key => {

@@ -42,0 +43,0 @@ if (process.env.NODE_ENV !== 'production') {

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {

@@ -8,3 +7,2 @@ value: true

exports.default = getThemeProps;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
/* eslint-disable no-restricted-syntax */

@@ -20,3 +18,5 @@ function getThemeProps(params) {

}
const output = (0, _extends2.default)({}, props);
const output = {
...props
};

@@ -23,0 +23,0 @@ // Resolve default props, code borrow from React source.

/**
* @mui/styles v6.0.0-alpha.7
* @mui/styles v6.0.0-alpha.8
*

@@ -4,0 +4,0 @@ * @license MIT

@@ -8,4 +8,2 @@ "use strict";

exports.default = makeStyles;
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));

@@ -20,3 +18,2 @@ var _jss = require("jss");

var _noopTheme = _interopRequireDefault(require("../getStylesCreator/noopTheme"));
const _excluded = ["name", "classNamePrefix", "Component", "defaultTheme"];
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }

@@ -81,6 +78,8 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

}
const options = (0, _extends2.default)({}, stylesCreator.options, stylesOptions, {
const options = {
...stylesCreator.options,
...stylesOptions,
theme,
flip: typeof stylesOptions.flip === 'boolean' ? stylesOptions.flip : theme.direction === 'rtl'
});
};
options.generateId = options.serverGenerateClassName || options.generateClassName;

@@ -95,5 +94,6 @@ const sheetsRegistry = stylesOptions.sheetsRegistry;

if (!staticSheet) {
staticSheet = stylesOptions.jss.createStyleSheet(styles, (0, _extends2.default)({
link: false
}, options));
staticSheet = stylesOptions.jss.createStyleSheet(styles, {
link: false,
...options
});
staticSheet.attach();

@@ -111,5 +111,6 @@ if (stylesOptions.sheetsCache) {

if (sheetManager.dynamicStyles) {
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, (0, _extends2.default)({
link: true
}, options));
const dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, {
link: true,
...options
});
dynamicSheet.update(props);

@@ -184,10 +185,10 @@ dynamicSheet.attach();

const {
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = _noopTheme.default
} = options,
stylesOptions2 = (0, _objectWithoutPropertiesLoose2.default)(options, _excluded);
// alias for classNamePrefix, if provided will listen to theme (required for theme.components[name].styleOverrides)
name,
// Help with debuggability.
classNamePrefix: classNamePrefixOption,
Component,
defaultTheme = _noopTheme.default,
...stylesOptions2
} = options;
const stylesCreator = (0, _getStylesCreator.default)(stylesOrCreator);

@@ -203,3 +204,6 @@ const classNamePrefix = name || classNamePrefixOption || 'makeStyles';

const theme = (0, _useTheme.default)() || defaultTheme;
const stylesOptions = (0, _extends2.default)({}, React.useContext(_StylesProvider.StylesContext), stylesOptions2);
const stylesOptions = {
...React.useContext(_StylesProvider.StylesContext),
...stylesOptions2
};
const instance = React.useRef();

@@ -206,0 +210,0 @@ const shouldUpdate = React.useRef();

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {

@@ -8,3 +7,2 @@ value: true

exports.default = mergeClasses;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _utils = require("@mui/utils");

@@ -20,3 +18,5 @@ function mergeClasses(options = {}) {

}
const nextClasses = (0, _extends2.default)({}, baseClasses);
const nextClasses = {
...baseClasses
};
if (process.env.NODE_ENV !== 'production') {

@@ -23,0 +23,0 @@ if (typeof newClasses === 'string') {

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {

@@ -8,5 +7,3 @@ value: true

exports.default = propsToClassKey;
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var _utils = require("@mui/utils");
const _excluded = ["variant"];
function isEmpty(string) {

@@ -23,5 +20,5 @@ return string.length === 0;

const {
variant
} = props,
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
variant,
...other
} = props;
let classKey = variant || '';

@@ -28,0 +25,0 @@ Object.keys(other).sort().forEach(key => {

@@ -8,3 +8,2 @@ "use strict";

exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));

@@ -28,9 +27,9 @@ var _jss = require("jss");

const generateClassName = (0, _createGenerateClassName.default)();
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_StylesProvider.default, (0, _extends2.default)({
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_StylesProvider.default, {
sheetsManager: sheetsManager,
serverGenerateClassName: generateClassName,
sheetsRegistry: this.sheetsRegistry
}, this.options, {
sheetsRegistry: this.sheetsRegistry,
...this.options,
children: children
}));
});
}

@@ -41,3 +40,3 @@ toString() {

getStyleElement(props) {
return /*#__PURE__*/React.createElement('style', (0, _extends2.default)({
return /*#__PURE__*/React.createElement('style', {
id: 'jss-server-side',

@@ -47,6 +46,7 @@ key: 'jss-server-side',

__html: this.toString()
}
}, props));
},
...props
});
}
}
exports.default = ServerStyleSheets;

@@ -8,4 +8,2 @@ "use strict";

exports.default = styled;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));

@@ -18,4 +16,2 @@ var _clsx = _interopRequireDefault(require("clsx"));

var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["name"],
_excluded2 = ["children", "className", "clone", "component"];
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }

@@ -38,5 +34,5 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

const {
name
} = options,
stylesOptions = (0, _objectWithoutPropertiesLoose2.default)(options, _excluded);
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production' && Component === undefined) {

@@ -56,13 +52,15 @@ throw new Error(['You are calling styled(Component)(style) with an undefined component.', 'You may have forgotten to import it.'].join('\n'));

const stylesOrCreator = typeof style === 'function' ? theme => ({
root: props => style((0, _extends2.default)({
theme
}, props))
root: props => style({
theme,
...props
})
}) : {
root: style
};
const useStyles = (0, _makeStyles.default)(stylesOrCreator, (0, _extends2.default)({
const useStyles = (0, _makeStyles.default)(stylesOrCreator, {
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
let filterProps;

@@ -84,8 +82,8 @@ let propTypes = {};

const {
children,
className: classNameProp,
clone,
component: ComponentProp
} = props,
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded2);
children,
className: classNameProp,
clone,
component: ComponentProp,
...other
} = props;
const classes = useStyles(props);

@@ -98,20 +96,22 @@ const className = (0, _clsx.default)(classes.root, classNameProp);

if (clone) {
return /*#__PURE__*/React.cloneElement(children, (0, _extends2.default)({
className: (0, _clsx.default)(children.props.className, className)
}, spread));
return /*#__PURE__*/React.cloneElement(children, {
className: (0, _clsx.default)(children.props.className, className),
...spread
});
}
if (typeof children === 'function') {
return children((0, _extends2.default)({
className
}, spread));
return children({
className,
...spread
});
}
const FinalComponent = ComponentProp || Component;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(FinalComponent, (0, _extends2.default)({
return /*#__PURE__*/(0, _jsxRuntime.jsx)(FinalComponent, {
ref: ref,
className: className
}, spread, {
className: className,
...spread,
children: children
}));
});
});
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = (0, _extends2.default)({
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = {
/**

@@ -141,4 +141,5 @@ * A render function or node.

*/
component: _propTypes.default /* @typescript-to-proptypes-ignore */.elementType
}, propTypes) : void 0;
component: _propTypes.default /* @typescript-to-proptypes-ignore */.elementType,
...propTypes
} : void 0;
if (process.env.NODE_ENV !== 'production') {

@@ -145,0 +146,0 @@ StyledComponent.displayName = `Styled(${classNamePrefix})`;

@@ -10,4 +10,2 @@ "use strict";

exports.sheetsManager = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));

@@ -20,5 +18,5 @@ var _propTypes = _interopRequireDefault(require("prop-types"));

var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["children", "injectFirst", "disableGeneration"]; // Default JSS instance.
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
// Default JSS instance.
const defaultJSS = (0, _jss.create)((0, _jssPreset.default)());

@@ -49,7 +47,7 @@

const {
children,
injectFirst = false,
disableGeneration = false
} = props,
localOptions = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
children,
injectFirst = false,
disableGeneration = false,
...localOptions
} = props;
const outerOptions = React.useContext(StylesContext);

@@ -63,3 +61,6 @@ const {

sheetsRegistry
} = (0, _extends2.default)({}, outerOptions, localOptions);
} = {
...outerOptions,
...localOptions
};
if (process.env.NODE_ENV !== 'production') {

@@ -66,0 +67,0 @@ if (injectFirst && localOptions.jss) {

@@ -8,4 +8,2 @@ "use strict";

exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));

@@ -19,15 +17,14 @@ var _propTypes = _interopRequireDefault(require("prop-types"));

var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["defaultTheme", "withTheme", "name"],
_excluded2 = ["classes"]; // Link a style sheet with a component.
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
// Link a style sheet with a component.
// It does not modify the component passed to it;
// instead, it returns a new component, with a `classes` property.
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const withStyles = (stylesOrCreator, options = {}) => Component => {
const {
defaultTheme,
withTheme = false,
name
} = options,
stylesOptions = (0, _objectWithoutPropertiesLoose2.default)(options, _excluded);
defaultTheme,
withTheme = false,
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production') {

@@ -48,14 +45,21 @@ if (Component === undefined) {

}
const useStyles = (0, _makeStyles.default)(stylesOrCreator, (0, _extends2.default)({
const useStyles = (0, _makeStyles.default)(stylesOrCreator, {
defaultTheme,
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
const WithStyles = /*#__PURE__*/React.forwardRef(function WithStyles(props, ref) {
const other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded2);
const {
classes: classesProp,
...other
} = props;
// 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.
const classes = useStyles((0, _extends2.default)({}, Component.defaultProps, props));
const classes = useStyles({
...Component.defaultProps,
...props
});
let theme;

@@ -81,6 +85,7 @@ let more = other;

}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, (0, _extends2.default)({
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
ref: ref,
classes: classes
}, more));
classes: classes,
...more
});
});

@@ -87,0 +92,0 @@ process.env.NODE_ENV !== "production" ? WithStyles.propTypes = {

@@ -9,3 +9,2 @@ "use strict";

exports.withThemeCreator = withThemeCreator;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));

@@ -30,6 +29,7 @@ var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));

const theme = (0, _useTheme.default)() || defaultTheme;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, (0, _extends2.default)({
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
theme: theme,
ref: ref
}, props));
ref: ref,
...props
});
});

@@ -36,0 +36,0 @@ if (process.env.NODE_ENV !== 'production') {

{
"name": "@mui/styles",
"version": "6.0.0-alpha.7",
"version": "6.0.0-alpha.8",
"private": false,

@@ -43,5 +43,5 @@ "author": "MUI Team",

"prop-types": "^15.8.1",
"@mui/utils": "^6.0.0-alpha.6",
"@mui/private-theming": "^6.0.0-alpha.8",
"@mui/types": "^7.2.14",
"@mui/private-theming": "^6.0.0-alpha.6"
"@mui/utils": "^6.0.0-alpha.8"
},

@@ -48,0 +48,0 @@ "peerDependencies": {

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

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["variant"];
import { unstable_capitalize as capitalize } from '@mui/utils';

@@ -15,5 +13,5 @@ function isEmpty(string) {

const {
variant
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded);
variant,
...other
} = props;
let classKey = variant || '';

@@ -20,0 +18,0 @@ Object.keys(other).sort().forEach(key => {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';

@@ -18,9 +17,9 @@ import { SheetsRegistry } from 'jss';

const generateClassName = createGenerateClassName();
return /*#__PURE__*/_jsx(StylesProvider, _extends({
return /*#__PURE__*/_jsx(StylesProvider, {
sheetsManager: sheetsManager,
serverGenerateClassName: generateClassName,
sheetsRegistry: this.sheetsRegistry
}, this.options, {
sheetsRegistry: this.sheetsRegistry,
...this.options,
children: children
}));
});
}

@@ -31,3 +30,3 @@ toString() {

getStyleElement(props) {
return /*#__PURE__*/React.createElement('style', _extends({
return /*#__PURE__*/React.createElement('style', {
id: 'jss-server-side',

@@ -37,5 +36,6 @@ key: 'jss-server-side',

__html: this.toString()
}
}, props));
},
...props
});
}
}

@@ -1,5 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["name"],
_excluded2 = ["children", "className", "clone", "component"];
import * as React from 'react';

@@ -27,5 +23,5 @@ import clsx from 'clsx';

const {
name
} = options,
stylesOptions = _objectWithoutPropertiesLoose(options, _excluded);
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production' && Component === undefined) {

@@ -45,13 +41,15 @@ throw new Error(['You are calling styled(Component)(style) with an undefined component.', 'You may have forgotten to import it.'].join('\n'));

const stylesOrCreator = typeof style === 'function' ? theme => ({
root: props => style(_extends({
theme
}, props))
root: props => style({
theme,
...props
})
}) : {
root: style
};
const useStyles = makeStyles(stylesOrCreator, _extends({
const useStyles = makeStyles(stylesOrCreator, {
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
let filterProps;

@@ -73,8 +71,8 @@ let propTypes = {};

const {
children,
className: classNameProp,
clone,
component: ComponentProp
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded2);
children,
className: classNameProp,
clone,
component: ComponentProp,
...other
} = props;
const classes = useStyles(props);

@@ -87,20 +85,22 @@ const className = clsx(classes.root, classNameProp);

if (clone) {
return /*#__PURE__*/React.cloneElement(children, _extends({
className: clsx(children.props.className, className)
}, spread));
return /*#__PURE__*/React.cloneElement(children, {
className: clsx(children.props.className, className),
...spread
});
}
if (typeof children === 'function') {
return children(_extends({
className
}, spread));
return children({
className,
...spread
});
}
const FinalComponent = ComponentProp || Component;
return /*#__PURE__*/_jsx(FinalComponent, _extends({
return /*#__PURE__*/_jsx(FinalComponent, {
ref: ref,
className: className
}, spread, {
className: className,
...spread,
children: children
}));
});
});
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = _extends({
process.env.NODE_ENV !== "production" ? StyledComponent.propTypes = {
/**

@@ -130,4 +130,5 @@ * A render function or node.

*/
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType
}, propTypes) : void 0;
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
...propTypes
} : void 0;
if (process.env.NODE_ENV !== 'production') {

@@ -134,0 +135,0 @@ StyledComponent.displayName = `Styled(${classNamePrefix})`;

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

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["children", "injectFirst", "disableGeneration"];
import * as React from 'react';

@@ -38,7 +35,7 @@ import PropTypes from 'prop-types';

const {
children,
injectFirst = false,
disableGeneration = false
} = props,
localOptions = _objectWithoutPropertiesLoose(props, _excluded);
children,
injectFirst = false,
disableGeneration = false,
...localOptions
} = props;
const outerOptions = React.useContext(StylesContext);

@@ -52,3 +49,6 @@ const {

sheetsRegistry
} = _extends({}, outerOptions, localOptions);
} = {
...outerOptions,
...localOptions
};
if (process.env.NODE_ENV !== 'production') {

@@ -55,0 +55,0 @@ if (injectFirst && localOptions.jss) {

@@ -1,5 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["defaultTheme", "withTheme", "name"],
_excluded2 = ["classes"];
import * as React from 'react';

@@ -19,7 +15,7 @@ import PropTypes from 'prop-types';

const {
defaultTheme,
withTheme = false,
name
} = options,
stylesOptions = _objectWithoutPropertiesLoose(options, _excluded);
defaultTheme,
withTheme = false,
name,
...stylesOptions
} = options;
if (process.env.NODE_ENV !== 'production') {

@@ -40,14 +36,21 @@ if (Component === undefined) {

}
const useStyles = makeStyles(stylesOrCreator, _extends({
const useStyles = makeStyles(stylesOrCreator, {
defaultTheme,
Component,
name: name || Component.displayName,
classNamePrefix
}, stylesOptions));
classNamePrefix,
...stylesOptions
});
const WithStyles = /*#__PURE__*/React.forwardRef(function WithStyles(props, ref) {
const other = _objectWithoutPropertiesLoose(props, _excluded2);
const {
classes: classesProp,
...other
} = props;
// 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.
const classes = useStyles(_extends({}, Component.defaultProps, props));
const classes = useStyles({
...Component.defaultProps,
...props
});
let theme;

@@ -73,6 +76,7 @@ let more = other;

}
return /*#__PURE__*/_jsx(Component, _extends({
return /*#__PURE__*/_jsx(Component, {
ref: ref,
classes: classes
}, more));
classes: classes,
...more
});
});

@@ -79,0 +83,0 @@ process.env.NODE_ENV !== "production" ? WithStyles.propTypes = {

@@ -1,2 +0,1 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';

@@ -19,6 +18,7 @@ import hoistNonReactStatics from 'hoist-non-react-statics';

const theme = useTheme() || defaultTheme;
return /*#__PURE__*/_jsx(Component, _extends({
return /*#__PURE__*/_jsx(Component, {
theme: theme,
ref: ref
}, props));
ref: ref,
...props
});
});

@@ -25,0 +25,0 @@ if (process.env.NODE_ENV !== 'production') {

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc