@material-ui/unstyled - npm Package Compare versions

Comparing version 5.0.0-alpha.20 to 5.0.0-alpha.21

BadgeUnstyled/BadgeUnstyled.js

@@ -10,3 +10,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-const useBadgeClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -18,8 +18,7 @@ variant,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: clsx(badgeUnstyledClasses['root'], classes['root']),
     badge: clsx(badgeUnstyledClasses['badge'], classes['badge'], getBadgeUtilityClass(variant), badgeUnstyledClasses[`anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`], classes[`anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`], invisible && [badgeUnstyledClasses['invisible'], classes.invisible])
   };
-  return utilityClasses;
 };
@@ -72,3 +71,3 @@
 
-  const stateAndProps = _extends({}, props, {
+  const styleProps = _extends({}, props, {
     anchorOrigin,
@@ -88,3 +87,3 @@ badgeContent,
 
-  const classes = useBadgeClasses(_extends({}, stateAndProps, {
+  const classes = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -98,3 +97,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme
@@ -106,3 +105,3 @@ }, {
   }), children, /*#__PURE__*/React.createElement(Badge, _extends({}, badgeProps, !isHostComponent(Badge) && {
-    styleProps: _extends({}, stateAndProps, badgeProps.styleProps),
+    styleProps: _extends({}, styleProps, badgeProps.styleProps),
     theme
@@ -109,0 +108,0 @@ }, {

BadgeUnstyled/badgeUnstyledClasses.js

@@ -1,18 +0,7 @@
-export function getBadgeUtilityClass(name) {
-  return `MuiBadge-${name}`;
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getBadgeUtilityClass(slot) {
+  return generateUtilityClass('MuiBadge', slot);
 }
-const badgeUnstyledClasses = {
-  root: getBadgeUtilityClass('root'),
-  badge: getBadgeUtilityClass('badge'),
-  dot: getBadgeUtilityClass('dot'),
-  anchorOriginTopLeftCircular: getBadgeUtilityClass('anchorOriginTopLeftCircular'),
-  anchorOriginTopLeftRectangular: getBadgeUtilityClass('anchorOriginTopLeftRectangular'),
-  anchorOriginTopRightCircular: getBadgeUtilityClass('anchorOriginTopRightCircular'),
-  anchorOriginTopRightRectangular: getBadgeUtilityClass('anchorOriginTopRightRectangular'),
-  anchorOriginBottomLeftCircular: getBadgeUtilityClass('anchorOriginBottomLeftCircular'),
-  anchorOriginBottomLeftRectangular: getBadgeUtilityClass('anchorOriginBottomLeftRectangular'),
-  anchorOriginBottomRightCircular: getBadgeUtilityClass('anchorOriginBottomRightCircular'),
-  anchorOriginBottomRightRectangular: getBadgeUtilityClass('anchorOriginBottomRightRectangular'),
-  invisible: getBadgeUtilityClass('invisible')
-};
+const badgeUnstyledClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular', 'invisible']);
 export default badgeUnstyledClasses;

BadgeUnstyled/package.json

 {
   "sideEffects": false,
   "module": "./index.js",
-  "main": "../node/BadgeUnstyled/index.js",
+  "main": "..\\node\\BadgeUnstyled\\index.js",
   "types": "./index.d.ts"
 }

index.d.ts

@@ -7,2 +7,8 @@ export { default as BadgeUnstyled } from './BadgeUnstyled';
 
+export { default as generateUtilityClass } from './generateUtilityClass';
+export * from './generateUtilityClass';
+
+export { default as generateUtilityClasses } from './generateUtilityClasses';
+export * from './generateUtilityClasses';
+
 export * from './utils';

index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-alpha.20
+/** @license Material-UI v5.0.0-alpha.21
  *
@@ -10,2 +10,4 @@ * This source code is licensed under the MIT license found in the
 export * from './SliderUnstyled';
+export { default as generateUtilityClass } from './generateUtilityClass';
+export { default as generateUtilityClasses } from './generateUtilityClasses';
 export * from './utils';

legacy/BadgeUnstyled/BadgeUnstyled.js

@@ -10,14 +10,13 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-var useBadgeClasses = function useBadgeClasses(props) {
-  var variant = props.variant,
-      anchorOrigin = props.anchorOrigin,
-      overlap = props.overlap,
-      invisible = props.invisible,
-      _props$classes = props.classes,
-      classes = _props$classes === void 0 ? {} : _props$classes;
-  var utilityClasses = {
+var useUtilityClasses = function useUtilityClasses(styleProps) {
+  var variant = styleProps.variant,
+      anchorOrigin = styleProps.anchorOrigin,
+      overlap = styleProps.overlap,
+      invisible = styleProps.invisible,
+      _styleProps$classes = styleProps.classes,
+      classes = _styleProps$classes === void 0 ? {} : _styleProps$classes;
+  return {
     root: clsx(badgeUnstyledClasses['root'], classes['root']),
     badge: clsx(badgeUnstyledClasses['badge'], classes['badge'], getBadgeUtilityClass(variant), badgeUnstyledClasses["anchorOrigin".concat(capitalize(anchorOrigin.vertical)).concat(capitalize(anchorOrigin.horizontal)).concat(capitalize(overlap))], classes["anchorOrigin".concat(capitalize(anchorOrigin.vertical)).concat(capitalize(anchorOrigin.horizontal)).concat(capitalize(overlap))], invisible && [badgeUnstyledClasses['invisible'], classes.invisible])
   };
-  return utilityClasses;
 };
@@ -31,4 +30,4 @@
   } : _props$anchorOrigin,
-      _props$classes2 = props.classes,
-      classesProp = _props$classes2 === void 0 ? {} : _props$classes2,
+      _props$classes = props.classes,
+      classesProp = _props$classes === void 0 ? {} : _props$classes,
       badgeContentProp = props.badgeContent,
@@ -79,3 +78,3 @@ _props$component = props.component,
 
-  var stateAndProps = _extends({}, props, {
+  var styleProps = _extends({}, props, {
     anchorOrigin: anchorOrigin,
@@ -95,3 +94,3 @@ badgeContent: badgeContent,
 
-  var classes = useBadgeClasses(_extends({}, stateAndProps, {
+  var classes = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -105,3 +104,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme: theme
@@ -113,3 +112,3 @@ }, {
   }), children, /*#__PURE__*/React.createElement(Badge, _extends({}, badgeProps, !isHostComponent(Badge) && {
-    styleProps: _extends({}, stateAndProps, badgeProps.styleProps),
+    styleProps: _extends({}, styleProps, badgeProps.styleProps),
     theme: theme
@@ -116,0 +115,0 @@ }, {

legacy/BadgeUnstyled/badgeUnstyledClasses.js

@@ -1,18 +0,7 @@
-export function getBadgeUtilityClass(name) {
-  return "MuiBadge-".concat(name);
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getBadgeUtilityClass(slot) {
+  return generateUtilityClass('MuiBadge', slot);
 }
-var badgeUnstyledClasses = {
-  root: getBadgeUtilityClass('root'),
-  badge: getBadgeUtilityClass('badge'),
-  dot: getBadgeUtilityClass('dot'),
-  anchorOriginTopLeftCircular: getBadgeUtilityClass('anchorOriginTopLeftCircular'),
-  anchorOriginTopLeftRectangular: getBadgeUtilityClass('anchorOriginTopLeftRectangular'),
-  anchorOriginTopRightCircular: getBadgeUtilityClass('anchorOriginTopRightCircular'),
-  anchorOriginTopRightRectangular: getBadgeUtilityClass('anchorOriginTopRightRectangular'),
-  anchorOriginBottomLeftCircular: getBadgeUtilityClass('anchorOriginBottomLeftCircular'),
-  anchorOriginBottomLeftRectangular: getBadgeUtilityClass('anchorOriginBottomLeftRectangular'),
-  anchorOriginBottomRightCircular: getBadgeUtilityClass('anchorOriginBottomRightCircular'),
-  anchorOriginBottomRightRectangular: getBadgeUtilityClass('anchorOriginBottomRightRectangular'),
-  invisible: getBadgeUtilityClass('invisible')
-};
+var badgeUnstyledClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular', 'invisible']);
 export default badgeUnstyledClasses;

legacy/index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-alpha.20
+/** @license Material-UI v5.0.0-alpha.21
  *
@@ -10,2 +10,4 @@ * This source code is licensed under the MIT license found in the
 export * from './SliderUnstyled';
+export { default as generateUtilityClass } from './generateUtilityClass';
+export { default as generateUtilityClasses } from './generateUtilityClasses';
 export * from './utils';

legacy/SliderUnstyled/SliderUnstyled.js

@@ -181,10 +181,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-var useSliderClasses = function useSliderClasses(props) {
-  var disabled = props.disabled,
-      marked = props.marked,
-      orientation = props.orientation,
-      track = props.track,
-      _props$classes = props.classes,
-      classes = _props$classes === void 0 ? {} : _props$classes;
-  var utilityClasses = {
+var useUtilityClasses = function useUtilityClasses(styleProps) {
+  var disabled = styleProps.disabled,
+      marked = styleProps.marked,
+      orientation = styleProps.orientation,
+      track = styleProps.track,
+      _styleProps$classes = styleProps.classes,
+      classes = _styleProps$classes === void 0 ? {} : _styleProps$classes;
+  return {
     root: clsx(sliderUnstyledClasses['root'], classes['root'], disabled && [sliderUnstyledClasses['disabled'], classes['disabled']], marked && [sliderUnstyledClasses['marked'], classes['marked']], track === false && [sliderUnstyledClasses['trackFalse'], classes['trackFalse']], orientation === 'vertical' && [sliderUnstyledClasses['vertical'], classes['vertical']], track === 'inverted' && [sliderUnstyledClasses['trackInverted'], classes['trackInverted']]),
@@ -203,3 +203,2 @@ rail: clsx(sliderUnstyledClasses['rail'], classes['rail']),
   };
-  return utilityClasses;
 };
@@ -219,4 +218,4 @@
       Component = _props$component === void 0 ? 'span' : _props$component,
-      _props$classes2 = props.classes,
-      classesProp = _props$classes2 === void 0 ? {} : _props$classes2,
+      _props$classes = props.classes,
+      classesProp = _props$classes === void 0 ? {} : _props$classes,
       defaultValue = props.defaultValue,
@@ -710,3 +709,3 @@ _props$disabled = props.disabled,
 
-  var stateAndProps = _extends({}, props, {
+  var styleProps = _extends({}, props, {
     classes: {},
@@ -728,3 +727,3 @@ disabled: disabled,
 
-  var utilityClasses = useSliderClasses(_extends({}, stateAndProps, {
+  var utilityClasses = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -737,3 +736,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme: theme
@@ -743,3 +742,3 @@ }, other, {
   }), /*#__PURE__*/React.createElement(Rail, _extends({}, railProps, !isHostComponent(Rail) && {
-    styleProps: _extends({}, stateAndProps, railProps.styleProps),
+    styleProps: _extends({}, styleProps, railProps.styleProps),
     theme: theme
@@ -749,3 +748,3 @@ }, {
   })), /*#__PURE__*/React.createElement(Track, _extends({}, trackProps, !isHostComponent(Track) && {
-    styleProps: _extends({}, stateAndProps, trackProps.styleProps),
+    styleProps: _extends({}, styleProps, trackProps.styleProps),
     theme: theme
@@ -775,3 +774,3 @@ }, {
     }, markProps, !isHostComponent(Mark) && {
-      styleProps: _extends({}, stateAndProps, markProps.styleProps, {
+      styleProps: _extends({}, styleProps, markProps.styleProps, {
         markActive: markActive
@@ -787,3 +786,3 @@ }),
     }, markLabelProps, !isHostComponent(MarkLabel) && {
-      styleProps: _extends({}, stateAndProps, markLabelProps.styleProps, {
+      styleProps: _extends({}, styleProps, markLabelProps.styleProps, {
         markLabelActive: markActive
@@ -811,3 +810,3 @@ }),
     }, !isHostComponent(ValueLabel) && {
-      styleProps: _extends({}, stateAndProps, valueLabelProps.styleProps),
+      styleProps: _extends({}, styleProps, valueLabelProps.styleProps),
       theme: theme
@@ -833,3 +832,3 @@ }), /*#__PURE__*/React.createElement(Thumb, _extends({
     }, !isHostComponent(Thumb) && {
-      styleProps: _extends({}, stateAndProps, thumbProps.styleProps),
+      styleProps: _extends({}, styleProps, thumbProps.styleProps),
       theme: theme
@@ -836,0 +835,0 @@ }, {

legacy/SliderUnstyled/sliderUnstyledClasses.js

@@ -1,26 +0,7 @@
-export function getSliderUtilityClass(name) {
-  return "MuiSlider-".concat(name);
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getSliderUtilityClass(slot) {
+  return generateUtilityClass('MuiSlider', slot);
 }
-var sliderUnstyledClasses = {
-  root: getSliderUtilityClass('root'),
-  active: 'Mui-active',
-  focusVisible: 'Mui-focusVisible',
-  disabled: 'Mui-disabled',
-  marked: getSliderUtilityClass('marked'),
-  vertical: getSliderUtilityClass('vertical'),
-  trackInverted: getSliderUtilityClass('trackInverted'),
-  trackFalse: getSliderUtilityClass('trackFalse'),
-  rail: getSliderUtilityClass('rail'),
-  track: getSliderUtilityClass('track'),
-  mark: getSliderUtilityClass('mark'),
-  markActive: getSliderUtilityClass('markActive'),
-  markLabel: getSliderUtilityClass('markLabel'),
-  markLabelActive: getSliderUtilityClass('markLabelActive'),
-  thumb: getSliderUtilityClass('thumb'),
-  valueLabel: getSliderUtilityClass('valueLabel'),
-  valueLabelOffset: getSliderUtilityClass('valueLabelOffset'),
-  valueLabelOpen: getSliderUtilityClass('valueLabelOpen'),
-  valueLabelCircle: getSliderUtilityClass('valueLabelCircle'),
-  valueLabelLabel: getSliderUtilityClass('valueLabelLabel')
-};
+var sliderUnstyledClasses = generateUtilityClasses('MuiSlider', ['root', 'active', 'focusVisible', 'disabled', 'marked', 'vertical', 'trackInverted', 'trackFalse', 'rail', 'track', 'mark', 'markActive', 'markLabel', 'markLabelActive', 'thumb', 'valueLabel', 'valueLabelOffset', 'valueLabelOpen', 'valueLabelCircle', 'valueLabelLabel']);
 export default sliderUnstyledClasses;

modern/BadgeUnstyled/BadgeUnstyled.js

@@ -10,3 +10,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-const useBadgeClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -18,8 +18,7 @@ variant,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: clsx(badgeUnstyledClasses['root'], classes['root']),
     badge: clsx(badgeUnstyledClasses['badge'], classes['badge'], getBadgeUtilityClass(variant), badgeUnstyledClasses[`anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`], classes[`anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`], invisible && [badgeUnstyledClasses['invisible'], classes.invisible])
   };
-  return utilityClasses;
 };
@@ -72,3 +71,3 @@
 
-  const stateAndProps = _extends({}, props, {
+  const styleProps = _extends({}, props, {
     anchorOrigin,
@@ -88,3 +87,3 @@ badgeContent,
 
-  const classes = useBadgeClasses(_extends({}, stateAndProps, {
+  const classes = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -98,3 +97,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme
@@ -106,3 +105,3 @@ }, {
   }), children, /*#__PURE__*/React.createElement(Badge, _extends({}, badgeProps, !isHostComponent(Badge) && {
-    styleProps: _extends({}, stateAndProps, badgeProps.styleProps),
+    styleProps: _extends({}, styleProps, badgeProps.styleProps),
     theme
@@ -109,0 +108,0 @@ }, {

modern/BadgeUnstyled/badgeUnstyledClasses.js

@@ -1,18 +0,7 @@
-export function getBadgeUtilityClass(name) {
-  return `MuiBadge-${name}`;
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getBadgeUtilityClass(slot) {
+  return generateUtilityClass('MuiBadge', slot);
 }
-const badgeUnstyledClasses = {
-  root: getBadgeUtilityClass('root'),
-  badge: getBadgeUtilityClass('badge'),
-  dot: getBadgeUtilityClass('dot'),
-  anchorOriginTopLeftCircular: getBadgeUtilityClass('anchorOriginTopLeftCircular'),
-  anchorOriginTopLeftRectangular: getBadgeUtilityClass('anchorOriginTopLeftRectangular'),
-  anchorOriginTopRightCircular: getBadgeUtilityClass('anchorOriginTopRightCircular'),
-  anchorOriginTopRightRectangular: getBadgeUtilityClass('anchorOriginTopRightRectangular'),
-  anchorOriginBottomLeftCircular: getBadgeUtilityClass('anchorOriginBottomLeftCircular'),
-  anchorOriginBottomLeftRectangular: getBadgeUtilityClass('anchorOriginBottomLeftRectangular'),
-  anchorOriginBottomRightCircular: getBadgeUtilityClass('anchorOriginBottomRightCircular'),
-  anchorOriginBottomRightRectangular: getBadgeUtilityClass('anchorOriginBottomRightRectangular'),
-  invisible: getBadgeUtilityClass('invisible')
-};
+const badgeUnstyledClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular', 'invisible']);
 export default badgeUnstyledClasses;

modern/index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-alpha.20
+/** @license Material-UI v5.0.0-alpha.21
  *
@@ -10,2 +10,4 @@ * This source code is licensed under the MIT license found in the
 export * from './SliderUnstyled';
+export { default as generateUtilityClass } from './generateUtilityClass';
+export { default as generateUtilityClasses } from './generateUtilityClasses';
 export * from './utils';

modern/SliderUnstyled/SliderUnstyled.js

@@ -166,3 +166,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-const useSliderClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -174,4 +174,4 @@ disabled,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: clsx(sliderUnstyledClasses['root'], classes['root'], disabled && [sliderUnstyledClasses['disabled'], classes['disabled']], marked && [sliderUnstyledClasses['marked'], classes['marked']], track === false && [sliderUnstyledClasses['trackFalse'], classes['trackFalse']], orientation === 'vertical' && [sliderUnstyledClasses['vertical'], classes['vertical']], track === 'inverted' && [sliderUnstyledClasses['trackInverted'], classes['trackInverted']]),
@@ -190,3 +190,2 @@ rail: clsx(sliderUnstyledClasses['rail'], classes['rail']),
   };
-  return utilityClasses;
 };
@@ -664,3 +663,3 @@
 
-  const stateAndProps = _extends({}, props, {
+  const styleProps = _extends({}, props, {
     classes: {},
@@ -680,3 +679,3 @@ disabled,
 
-  const utilityClasses = useSliderClasses(_extends({}, stateAndProps, {
+  const utilityClasses = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -689,3 +688,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme
@@ -695,3 +694,3 @@ }, other, {
   }), /*#__PURE__*/React.createElement(Rail, _extends({}, railProps, !isHostComponent(Rail) && {
-    styleProps: _extends({}, stateAndProps, railProps.styleProps),
+    styleProps: _extends({}, styleProps, railProps.styleProps),
     theme
@@ -701,3 +700,3 @@ }, {
   })), /*#__PURE__*/React.createElement(Track, _extends({}, trackProps, !isHostComponent(Track) && {
-    styleProps: _extends({}, stateAndProps, trackProps.styleProps),
+    styleProps: _extends({}, styleProps, trackProps.styleProps),
     theme
@@ -727,3 +726,3 @@ }, {
     }, markProps, !isHostComponent(Mark) && {
-      styleProps: _extends({}, stateAndProps, markProps.styleProps, {
+      styleProps: _extends({}, styleProps, markProps.styleProps, {
         markActive
@@ -739,3 +738,3 @@ }),
     }, markLabelProps, !isHostComponent(MarkLabel) && {
-      styleProps: _extends({}, stateAndProps, markLabelProps.styleProps, {
+      styleProps: _extends({}, styleProps, markLabelProps.styleProps, {
         markLabelActive: markActive
@@ -763,3 +762,3 @@ }),
     }, !isHostComponent(ValueLabel) && {
-      styleProps: _extends({}, stateAndProps, valueLabelProps.styleProps),
+      styleProps: _extends({}, styleProps, valueLabelProps.styleProps),
       theme
@@ -785,3 +784,3 @@ }), /*#__PURE__*/React.createElement(Thumb, _extends({
     }, !isHostComponent(Thumb) && {
-      styleProps: _extends({}, stateAndProps, thumbProps.styleProps),
+      styleProps: _extends({}, styleProps, thumbProps.styleProps),
       theme
@@ -788,0 +787,0 @@ }, {

modern/SliderUnstyled/sliderUnstyledClasses.js

@@ -1,26 +0,7 @@
-export function getSliderUtilityClass(name) {
-  return `MuiSlider-${name}`;
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getSliderUtilityClass(slot) {
+  return generateUtilityClass('MuiSlider', slot);
 }
-const sliderUnstyledClasses = {
-  root: getSliderUtilityClass('root'),
-  active: 'Mui-active',
-  focusVisible: 'Mui-focusVisible',
-  disabled: 'Mui-disabled',
-  marked: getSliderUtilityClass('marked'),
-  vertical: getSliderUtilityClass('vertical'),
-  trackInverted: getSliderUtilityClass('trackInverted'),
-  trackFalse: getSliderUtilityClass('trackFalse'),
-  rail: getSliderUtilityClass('rail'),
-  track: getSliderUtilityClass('track'),
-  mark: getSliderUtilityClass('mark'),
-  markActive: getSliderUtilityClass('markActive'),
-  markLabel: getSliderUtilityClass('markLabel'),
-  markLabelActive: getSliderUtilityClass('markLabelActive'),
-  thumb: getSliderUtilityClass('thumb'),
-  valueLabel: getSliderUtilityClass('valueLabel'),
-  valueLabelOffset: getSliderUtilityClass('valueLabelOffset'),
-  valueLabelOpen: getSliderUtilityClass('valueLabelOpen'),
-  valueLabelCircle: getSliderUtilityClass('valueLabelCircle'),
-  valueLabelLabel: getSliderUtilityClass('valueLabelLabel')
-};
+const sliderUnstyledClasses = generateUtilityClasses('MuiSlider', ['root', 'active', 'focusVisible', 'disabled', 'marked', 'vertical', 'trackInverted', 'trackFalse', 'rail', 'track', 'mark', 'markActive', 'markLabel', 'markLabelActive', 'thumb', 'valueLabel', 'valueLabelOffset', 'valueLabelOpen', 'valueLabelCircle', 'valueLabelLabel']);
 export default sliderUnstyledClasses;

node/BadgeUnstyled/BadgeUnstyled.js

@@ -28,3 +28,3 @@ "use strict";
 
-const useBadgeClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -36,8 +36,7 @@ variant,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: (0, _clsx.default)(_badgeUnstyledClasses.default['root'], classes['root']),
     badge: (0, _clsx.default)(_badgeUnstyledClasses.default['badge'], classes['badge'], (0, _badgeUnstyledClasses.getBadgeUtilityClass)(variant), _badgeUnstyledClasses.default[`anchorOrigin${(0, _utils.unstable_capitalize)(anchorOrigin.vertical)}${(0, _utils.unstable_capitalize)(anchorOrigin.horizontal)}${(0, _utils.unstable_capitalize)(overlap)}`], classes[`anchorOrigin${(0, _utils.unstable_capitalize)(anchorOrigin.vertical)}${(0, _utils.unstable_capitalize)(anchorOrigin.horizontal)}${(0, _utils.unstable_capitalize)(overlap)}`], invisible && [_badgeUnstyledClasses.default['invisible'], classes.invisible])
   };
-  return utilityClasses;
 };
@@ -88,3 +87,3 @@
   } = invisible ? prevProps : props;
-  const stateAndProps = (0, _extends2.default)({}, props, {
+  const styleProps = (0, _extends2.default)({}, props, {
     anchorOrigin,
@@ -103,3 +102,3 @@ badgeContent,
 
-  const classes = useBadgeClasses((0, _extends2.default)({}, stateAndProps, {
+  const classes = useUtilityClasses((0, _extends2.default)({}, styleProps, {
     classes: classesProp
@@ -113,3 +112,3 @@ }));
     as: Component,
-    styleProps: (0, _extends2.default)({}, stateAndProps, rootProps.styleProps),
+    styleProps: (0, _extends2.default)({}, styleProps, rootProps.styleProps),
     theme
@@ -121,3 +120,3 @@ }, {
   }), children, /*#__PURE__*/React.createElement(Badge, (0, _extends2.default)({}, badgeProps, !(0, _isHostComponent.default)(Badge) && {
-    styleProps: (0, _extends2.default)({}, stateAndProps, badgeProps.styleProps),
+    styleProps: (0, _extends2.default)({}, styleProps, badgeProps.styleProps),
     theme
@@ -124,0 +123,0 @@ }, {

node/BadgeUnstyled/badgeUnstyledClasses.js

 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
@@ -9,21 +11,12 @@ value: true
 
-function getBadgeUtilityClass(name) {
-  return `MuiBadge-${name}`;
+var _generateUtilityClasses = _interopRequireDefault(require("../generateUtilityClasses"));
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
+
+function getBadgeUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiBadge', slot);
 }
 
-const badgeUnstyledClasses = {
-  root: getBadgeUtilityClass('root'),
-  badge: getBadgeUtilityClass('badge'),
-  dot: getBadgeUtilityClass('dot'),
-  anchorOriginTopLeftCircular: getBadgeUtilityClass('anchorOriginTopLeftCircular'),
-  anchorOriginTopLeftRectangular: getBadgeUtilityClass('anchorOriginTopLeftRectangular'),
-  anchorOriginTopRightCircular: getBadgeUtilityClass('anchorOriginTopRightCircular'),
-  anchorOriginTopRightRectangular: getBadgeUtilityClass('anchorOriginTopRightRectangular'),
-  anchorOriginBottomLeftCircular: getBadgeUtilityClass('anchorOriginBottomLeftCircular'),
-  anchorOriginBottomLeftRectangular: getBadgeUtilityClass('anchorOriginBottomLeftRectangular'),
-  anchorOriginBottomRightCircular: getBadgeUtilityClass('anchorOriginBottomRightCircular'),
-  anchorOriginBottomRightRectangular: getBadgeUtilityClass('anchorOriginBottomRightRectangular'),
-  invisible: getBadgeUtilityClass('invisible')
-};
+const badgeUnstyledClasses = (0, _generateUtilityClasses.default)('MuiBadge', ['root', 'badge', 'dot', 'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular', 'invisible']);
 var _default = badgeUnstyledClasses;
 exports.default = _default;

node/index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-alpha.20
+/** @license Material-UI v5.0.0-alpha.21
  *
@@ -8,2 +8,4 @@ * This source code is licensed under the MIT license found in the
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
@@ -16,3 +18,5 @@
   BadgeUnstyled: true,
-  SliderUnstyled: true
+  SliderUnstyled: true,
+  generateUtilityClass: true,
+  generateUtilityClasses: true
 };
@@ -31,2 +35,14 @@ Object.defineProperty(exports, "BadgeUnstyled", {
 });
+Object.defineProperty(exports, "generateUtilityClass", {
+  enumerable: true,
+  get: function () {
+    return _generateUtilityClass.default;
+  }
+});
+Object.defineProperty(exports, "generateUtilityClasses", {
+  enumerable: true,
+  get: function () {
+    return _generateUtilityClasses.default;
+  }
+});
 
@@ -61,2 +77,6 @@ var _BadgeUnstyled = _interopRequireWildcard(require("./BadgeUnstyled"));
 
+var _generateUtilityClass = _interopRequireDefault(require("./generateUtilityClass"));
+
+var _generateUtilityClasses = _interopRequireDefault(require("./generateUtilityClasses"));
+
 var _utils = require("./utils");
@@ -63,0 +83,0 @@

node/SliderUnstyled/SliderUnstyled.js

@@ -185,3 +185,3 @@ "use strict";
 
-const useSliderClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -193,4 +193,4 @@ disabled,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: (0, _clsx.default)(_sliderUnstyledClasses.default['root'], classes['root'], disabled && [_sliderUnstyledClasses.default['disabled'], classes['disabled']], marked && [_sliderUnstyledClasses.default['marked'], classes['marked']], track === false && [_sliderUnstyledClasses.default['trackFalse'], classes['trackFalse']], orientation === 'vertical' && [_sliderUnstyledClasses.default['vertical'], classes['vertical']], track === 'inverted' && [_sliderUnstyledClasses.default['trackInverted'], classes['trackInverted']]),
@@ -209,3 +209,2 @@ rail: (0, _clsx.default)(_sliderUnstyledClasses.default['rail'], classes['rail']),
   };
-  return utilityClasses;
 };
@@ -680,3 +679,3 @@
 
-  const stateAndProps = (0, _extends2.default)({}, props, {
+  const styleProps = (0, _extends2.default)({}, props, {
     classes: {},
@@ -695,3 +694,3 @@ disabled,
   });
-  const utilityClasses = useSliderClasses((0, _extends2.default)({}, stateAndProps, {
+  const utilityClasses = useUtilityClasses((0, _extends2.default)({}, styleProps, {
     classes: classesProp
@@ -704,3 +703,3 @@ }));
     as: Component,
-    styleProps: (0, _extends2.default)({}, stateAndProps, rootProps.styleProps),
+    styleProps: (0, _extends2.default)({}, styleProps, rootProps.styleProps),
     theme
@@ -710,3 +709,3 @@ }, other, {
   }), /*#__PURE__*/React.createElement(Rail, (0, _extends2.default)({}, railProps, !(0, _isHostComponent.default)(Rail) && {
-    styleProps: (0, _extends2.default)({}, stateAndProps, railProps.styleProps),
+    styleProps: (0, _extends2.default)({}, styleProps, railProps.styleProps),
     theme
@@ -716,3 +715,3 @@ }, {
   })), /*#__PURE__*/React.createElement(Track, (0, _extends2.default)({}, trackProps, !(0, _isHostComponent.default)(Track) && {
-    styleProps: (0, _extends2.default)({}, stateAndProps, trackProps.styleProps),
+    styleProps: (0, _extends2.default)({}, styleProps, trackProps.styleProps),
     theme
@@ -742,3 +741,3 @@ }, {
     }, markProps, !(0, _isHostComponent.default)(Mark) && {
-      styleProps: (0, _extends2.default)({}, stateAndProps, markProps.styleProps, {
+      styleProps: (0, _extends2.default)({}, styleProps, markProps.styleProps, {
         markActive
@@ -754,3 +753,3 @@ }),
     }, markLabelProps, !(0, _isHostComponent.default)(MarkLabel) && {
-      styleProps: (0, _extends2.default)({}, stateAndProps, markLabelProps.styleProps, {
+      styleProps: (0, _extends2.default)({}, styleProps, markLabelProps.styleProps, {
         markLabelActive: markActive
@@ -778,3 +777,3 @@ }),
     }, !(0, _isHostComponent.default)(ValueLabel) && {
-      styleProps: (0, _extends2.default)({}, stateAndProps, valueLabelProps.styleProps),
+      styleProps: (0, _extends2.default)({}, styleProps, valueLabelProps.styleProps),
       theme
@@ -800,3 +799,3 @@ }), /*#__PURE__*/React.createElement(Thumb, (0, _extends2.default)({
     }, !(0, _isHostComponent.default)(Thumb) && {
-      styleProps: (0, _extends2.default)({}, stateAndProps, thumbProps.styleProps),
+      styleProps: (0, _extends2.default)({}, styleProps, thumbProps.styleProps),
       theme
@@ -803,0 +802,0 @@ }, {

node/SliderUnstyled/sliderUnstyledClasses.js

 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
@@ -9,29 +11,12 @@ value: true
 
-function getSliderUtilityClass(name) {
-  return `MuiSlider-${name}`;
+var _generateUtilityClasses = _interopRequireDefault(require("../generateUtilityClasses"));
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
+
+function getSliderUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiSlider', slot);
 }
 
-const sliderUnstyledClasses = {
-  root: getSliderUtilityClass('root'),
-  active: 'Mui-active',
-  focusVisible: 'Mui-focusVisible',
-  disabled: 'Mui-disabled',
-  marked: getSliderUtilityClass('marked'),
-  vertical: getSliderUtilityClass('vertical'),
-  trackInverted: getSliderUtilityClass('trackInverted'),
-  trackFalse: getSliderUtilityClass('trackFalse'),
-  rail: getSliderUtilityClass('rail'),
-  track: getSliderUtilityClass('track'),
-  mark: getSliderUtilityClass('mark'),
-  markActive: getSliderUtilityClass('markActive'),
-  markLabel: getSliderUtilityClass('markLabel'),
-  markLabelActive: getSliderUtilityClass('markLabelActive'),
-  thumb: getSliderUtilityClass('thumb'),
-  valueLabel: getSliderUtilityClass('valueLabel'),
-  valueLabelOffset: getSliderUtilityClass('valueLabelOffset'),
-  valueLabelOpen: getSliderUtilityClass('valueLabelOpen'),
-  valueLabelCircle: getSliderUtilityClass('valueLabelCircle'),
-  valueLabelLabel: getSliderUtilityClass('valueLabelLabel')
-};
+const sliderUnstyledClasses = (0, _generateUtilityClasses.default)('MuiSlider', ['root', 'active', 'focusVisible', 'disabled', 'marked', 'vertical', 'trackInverted', 'trackFalse', 'rail', 'track', 'mark', 'markActive', 'markLabel', 'markLabelActive', 'thumb', 'valueLabel', 'valueLabelOffset', 'valueLabelOpen', 'valueLabelCircle', 'valueLabelLabel']);
 var _default = sliderUnstyledClasses;
 exports.default = _default;

package.json

 {
   "name": "@material-ui/unstyled",
-  "version": "5.0.0-alpha.20",
+  "version": "5.0.0-alpha.21",
   "private": false,
@@ -36,3 +36,3 @@ "author": "Material-UI Team",
     "@babel/runtime": "^7.4.4",
-    "@material-ui/utils": "5.0.0-alpha.20",
+    "@material-ui/utils": "5.0.0-alpha.21",
     "clsx": "^1.0.4",
@@ -39,0 +39,0 @@ "prop-types": "^15.7.2",

SliderUnstyled/package.json

 {
   "sideEffects": false,
   "module": "./index.js",
-  "main": "../node/SliderUnstyled/index.js",
+  "main": "..\\node\\SliderUnstyled\\index.js",
   "types": "./index.d.ts"
 }

SliderUnstyled/SliderUnstyled.js

@@ -166,3 +166,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 
-const useSliderClasses = props => {
+const useUtilityClasses = styleProps => {
   const {
@@ -174,4 +174,4 @@ disabled,
     classes = {}
-  } = props;
-  const utilityClasses = {
+  } = styleProps;
+  return {
     root: clsx(sliderUnstyledClasses['root'], classes['root'], disabled && [sliderUnstyledClasses['disabled'], classes['disabled']], marked && [sliderUnstyledClasses['marked'], classes['marked']], track === false && [sliderUnstyledClasses['trackFalse'], classes['trackFalse']], orientation === 'vertical' && [sliderUnstyledClasses['vertical'], classes['vertical']], track === 'inverted' && [sliderUnstyledClasses['trackInverted'], classes['trackInverted']]),
@@ -190,3 +190,2 @@ rail: clsx(sliderUnstyledClasses['rail'], classes['rail']),
   };
-  return utilityClasses;
 };
@@ -664,3 +663,3 @@
 
-  const stateAndProps = _extends({}, props, {
+  const styleProps = _extends({}, props, {
     classes: {},
@@ -680,3 +679,3 @@ disabled,
 
-  const utilityClasses = useSliderClasses(_extends({}, stateAndProps, {
+  const utilityClasses = useUtilityClasses(_extends({}, styleProps, {
     classes: classesProp
@@ -689,3 +688,3 @@ }));
     as: Component,
-    styleProps: _extends({}, stateAndProps, rootProps.styleProps),
+    styleProps: _extends({}, styleProps, rootProps.styleProps),
     theme
@@ -695,3 +694,3 @@ }, other, {
   }), /*#__PURE__*/React.createElement(Rail, _extends({}, railProps, !isHostComponent(Rail) && {
-    styleProps: _extends({}, stateAndProps, railProps.styleProps),
+    styleProps: _extends({}, styleProps, railProps.styleProps),
     theme
@@ -701,3 +700,3 @@ }, {
   })), /*#__PURE__*/React.createElement(Track, _extends({}, trackProps, !isHostComponent(Track) && {
-    styleProps: _extends({}, stateAndProps, trackProps.styleProps),
+    styleProps: _extends({}, styleProps, trackProps.styleProps),
     theme
@@ -727,3 +726,3 @@ }, {
     }, markProps, !isHostComponent(Mark) && {
-      styleProps: _extends({}, stateAndProps, markProps.styleProps, {
+      styleProps: _extends({}, styleProps, markProps.styleProps, {
         markActive
@@ -739,3 +738,3 @@ }),
     }, markLabelProps, !isHostComponent(MarkLabel) && {
-      styleProps: _extends({}, stateAndProps, markLabelProps.styleProps, {
+      styleProps: _extends({}, styleProps, markLabelProps.styleProps, {
         markLabelActive: markActive
@@ -763,3 +762,3 @@ }),
     }, !isHostComponent(ValueLabel) && {
-      styleProps: _extends({}, stateAndProps, valueLabelProps.styleProps),
+      styleProps: _extends({}, styleProps, valueLabelProps.styleProps),
       theme
@@ -785,3 +784,3 @@ }), /*#__PURE__*/React.createElement(Thumb, _extends({
     }, !isHostComponent(Thumb) && {
-      styleProps: _extends({}, stateAndProps, thumbProps.styleProps),
+      styleProps: _extends({}, styleProps, thumbProps.styleProps),
       theme
@@ -788,0 +787,0 @@ }, {

SliderUnstyled/sliderUnstyledClasses.js

@@ -1,26 +0,7 @@
-export function getSliderUtilityClass(name) {
-  return `MuiSlider-${name}`;
+import generateUtilityClasses from '../generateUtilityClasses';
+import generateUtilityClass from '../generateUtilityClass';
+export function getSliderUtilityClass(slot) {
+  return generateUtilityClass('MuiSlider', slot);
 }
-const sliderUnstyledClasses = {
-  root: getSliderUtilityClass('root'),
-  active: 'Mui-active',
-  focusVisible: 'Mui-focusVisible',
-  disabled: 'Mui-disabled',
-  marked: getSliderUtilityClass('marked'),
-  vertical: getSliderUtilityClass('vertical'),
-  trackInverted: getSliderUtilityClass('trackInverted'),
-  trackFalse: getSliderUtilityClass('trackFalse'),
-  rail: getSliderUtilityClass('rail'),
-  track: getSliderUtilityClass('track'),
-  mark: getSliderUtilityClass('mark'),
-  markActive: getSliderUtilityClass('markActive'),
-  markLabel: getSliderUtilityClass('markLabel'),
-  markLabelActive: getSliderUtilityClass('markLabelActive'),
-  thumb: getSliderUtilityClass('thumb'),
-  valueLabel: getSliderUtilityClass('valueLabel'),
-  valueLabelOffset: getSliderUtilityClass('valueLabelOffset'),
-  valueLabelOpen: getSliderUtilityClass('valueLabelOpen'),
-  valueLabelCircle: getSliderUtilityClass('valueLabelCircle'),
-  valueLabelLabel: getSliderUtilityClass('valueLabelLabel')
-};
+const sliderUnstyledClasses = generateUtilityClasses('MuiSlider', ['root', 'active', 'focusVisible', 'disabled', 'marked', 'vertical', 'trackInverted', 'trackFalse', 'rail', 'track', 'mark', 'markActive', 'markLabel', 'markLabelActive', 'thumb', 'valueLabel', 'valueLabelOffset', 'valueLabelOpen', 'valueLabelCircle', 'valueLabelLabel']);
 export default sliderUnstyledClasses;

utils/package.json

 {
   "sideEffects": false,
   "module": "./index.js",
-  "main": "../node/utils/index.js",
+  "main": "..\\node\\utils\\index.js",
   "types": "./index.d.ts"
 }

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

885273

increased by0.76%

Number of package files

79

increased by38.6%

Lines of code

5369

increased by0.66%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@material-ui/utils@5.0.0-alpha.21(transitive)

• - Removed@material-ui/utils@5.0.0-alpha.20(transitive)

• Updated@material-ui/utils@5.0.0-alpha.21