@wordpress/components 19.13.0 → 19.16.0

package/build/dropdown-menu/index.js

@@ -13,8 +13,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _lodash = require("lodash");
-
 var _keycodes = require("@wordpress/keycodes");
 
 var _icons = require("@wordpress/icons");
@@ -78,14 +76,14 @@ function DropdownMenu(dropdownMenuProps) {
     noIcons
   } = dropdownMenuProps;
 
-  if ((0, _lodash.isEmpty)(controls) && !isFunction(children)) {
+  if (!(controls !== null && controls !== void 0 && controls.length) && !isFunction(children)) {
     return null;
   } // Normalize controls to nested array of objects (sets of controls)
 
 
   let controlSets;
 
-  if (!(0, _lodash.isEmpty)(controls)) {
+  if (controls !== null && controls !== void 0 && controls.length) {
     controlSets = controls;
 
     if (!Array.isArray(controlSets[0])) {
@@ -147,6 +145,8 @@ function DropdownMenu(dropdownMenuProps) {
       }), mergedToggleProps.children);
     },
     renderContent: props => {
+      var _controlSets;
+
       const mergedMenuProps = mergeProps({
         'aria-label': label,
         className: (0, _classnames.default)('components-dropdown-menu__menu', {
@@ -155,7 +155,7 @@ function DropdownMenu(dropdownMenuProps) {
       }, menuProps);
       return (0, _element.createElement)(_navigableContainer.NavigableMenu, (0, _extends2.default)({}, mergedMenuProps, {
         role: "menu"
-      }), isFunction(children) ? children(props) : null, (0, _lodash.flatMap)(controlSets, (controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_button.default, {
+      }), isFunction(children) ? children(props) : null, (_controlSets = controlSets) === null || _controlSets === void 0 ? void 0 : _controlSets.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_button.default, {
         key: [indexOfSet, indexOfControl].join(),
         onClick: event => {
           event.stopPropagation();

package/build/dropdown-menu/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/dropdown-menu/index.js"],"names":["mergeProps","defaultProps","props","mergedProps","className","isFunction","maybeFunc","DropdownMenu","dropdownMenuProps","children","controls","icon","menu","label","popoverProps","toggleProps","menuProps","disableOpenOnArrowDown","text","noIcons","controlSets","Array","isArray","mergedPopoverProps","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault","mergedToggleProps","onClick","onKeyDown","showTooltip","mergedMenuProps","controlSet","indexOfSet","map","control","indexOfControl","join","stopPropagation","onClose","isActive","title","role","undefined","isDisabled"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { flatMap, isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { DOWN } from '@wordpress/keycodes';\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\n\nfunction mergeProps( defaultProps = {}, props = {} ) {\n\tconst mergedProps = {\n\t\t...defaultProps,\n\t\t...props,\n\t};\n\n\tif ( props.className && defaultProps.className ) {\n\t\tmergedProps.className = classnames(\n\t\t\tprops.className,\n\t\t\tdefaultProps.className\n\t\t);\n\t}\n\n\treturn mergedProps;\n}\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction DropdownMenu( dropdownMenuProps ) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tcontrols,\n\t\ticon = menu,\n\t\tlabel,\n\t\tpopoverProps,\n\t\ttoggleProps,\n\t\tmenuProps,\n\t\tdisableOpenOnArrowDown = false,\n\t\ttext,\n\t\tnoIcons,\n\t} = dropdownMenuProps;\n\n\tif ( isEmpty( controls ) && ! isFunction( children ) ) {\n\t\treturn null;\n\t}\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets;\n\tif ( ! isEmpty( controls ) ) {\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\tcontrolSets = [ controlSets ];\n\t\t}\n\t}\n\tconst mergedPopoverProps = mergeProps(\n\t\t{\n\t\t\tclassName: 'components-dropdown-menu__popover',\n\t\t},\n\t\tpopoverProps\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames( 'components-dropdown-menu', className ) }\n\t\t\tpopoverProps={ mergedPopoverProps }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( disableOpenOnArrowDown ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\tconst mergedToggleProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__toggle',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-opened': isOpen,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\ttoggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tonToggle( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\ttext={ text }\n\t\t\t\t\t\tshowTooltip={ toggleProps?.showTooltip ?? true }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ mergedToggleProps.children }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ ( props ) => {\n\t\t\t\tconst mergedMenuProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__menu',\n\t\t\t\t\t\t\t{ 'no-icons': noIcons }\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\tmenuProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<NavigableMenu { ...mergedMenuProps } role=\"menu\">\n\t\t\t\t\t\t{ isFunction( children ) ? children( props ) : null }\n\t\t\t\t\t\t{ flatMap( controlSets, ( controlSet, indexOfSet ) =>\n\t\t\t\t\t\t\tcontrolSet.map( ( control, indexOfControl ) => (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tkey={ [\n\t\t\t\t\t\t\t\t\t\tindexOfSet,\n\t\t\t\t\t\t\t\t\t\tindexOfControl,\n\t\t\t\t\t\t\t\t\t].join() }\n\t\t\t\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tprops.onClose();\n\t\t\t\t\t\t\t\t\t\tif ( control.onClick ) {\n\t\t\t\t\t\t\t\t\t\t\tcontrol.onClick();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'components-dropdown-menu__menu-item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'has-separator':\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfSet > 0 &&\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfControl === 0,\n\t\t\t\t\t\t\t\t\t\t\t'is-active': control.isActive,\n\t\t\t\t\t\t\t\t\t\t\t'is-icon-only': ! control.title,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\ticon={ control.icon }\n\t\t\t\t\t\t\t\t\tlabel={ control.label }\n\t\t\t\t\t\t\t\t\taria-checked={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.isActive\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\trole={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.role\n\t\t\t\t\t\t\t\t\t\t\t: 'menuitem'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tdisabled={ control.isDisabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ control.title }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) )\n\t\t\t\t\t\t) }\n\t\t\t\t\t</NavigableMenu>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport default DropdownMenu;\n"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown-menu/index.js"],"names":["mergeProps","defaultProps","props","mergedProps","className","isFunction","maybeFunc","DropdownMenu","dropdownMenuProps","children","controls","icon","menu","label","popoverProps","toggleProps","menuProps","disableOpenOnArrowDown","text","noIcons","length","controlSets","Array","isArray","mergedPopoverProps","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault","mergedToggleProps","onClick","onKeyDown","showTooltip","mergedMenuProps","flatMap","controlSet","indexOfSet","map","control","indexOfControl","join","stopPropagation","onClose","isActive","title","role","undefined","isDisabled"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { DOWN } from '@wordpress/keycodes';\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\n\nfunction mergeProps( defaultProps = {}, props = {} ) {\n\tconst mergedProps = {\n\t\t...defaultProps,\n\t\t...props,\n\t};\n\n\tif ( props.className && defaultProps.className ) {\n\t\tmergedProps.className = classnames(\n\t\t\tprops.className,\n\t\t\tdefaultProps.className\n\t\t);\n\t}\n\n\treturn mergedProps;\n}\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction DropdownMenu( dropdownMenuProps ) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tcontrols,\n\t\ticon = menu,\n\t\tlabel,\n\t\tpopoverProps,\n\t\ttoggleProps,\n\t\tmenuProps,\n\t\tdisableOpenOnArrowDown = false,\n\t\ttext,\n\t\tnoIcons,\n\t} = dropdownMenuProps;\n\n\tif ( ! controls?.length && ! isFunction( children ) ) {\n\t\treturn null;\n\t}\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets;\n\tif ( controls?.length ) {\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\tcontrolSets = [ controlSets ];\n\t\t}\n\t}\n\tconst mergedPopoverProps = mergeProps(\n\t\t{\n\t\t\tclassName: 'components-dropdown-menu__popover',\n\t\t},\n\t\tpopoverProps\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames( 'components-dropdown-menu', className ) }\n\t\t\tpopoverProps={ mergedPopoverProps }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( disableOpenOnArrowDown ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\tconst mergedToggleProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__toggle',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-opened': isOpen,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\ttoggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tonToggle( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\ttext={ text }\n\t\t\t\t\t\tshowTooltip={ toggleProps?.showTooltip ?? true }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ mergedToggleProps.children }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ ( props ) => {\n\t\t\t\tconst mergedMenuProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__menu',\n\t\t\t\t\t\t\t{ 'no-icons': noIcons }\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\tmenuProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<NavigableMenu { ...mergedMenuProps } role=\"menu\">\n\t\t\t\t\t\t{ isFunction( children ) ? children( props ) : null }\n\t\t\t\t\t\t{ controlSets?.flatMap( ( controlSet, indexOfSet ) =>\n\t\t\t\t\t\t\tcontrolSet.map( ( control, indexOfControl ) => (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tkey={ [\n\t\t\t\t\t\t\t\t\t\tindexOfSet,\n\t\t\t\t\t\t\t\t\t\tindexOfControl,\n\t\t\t\t\t\t\t\t\t].join() }\n\t\t\t\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tprops.onClose();\n\t\t\t\t\t\t\t\t\t\tif ( control.onClick ) {\n\t\t\t\t\t\t\t\t\t\t\tcontrol.onClick();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'components-dropdown-menu__menu-item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'has-separator':\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfSet > 0 &&\n\t\t\t\t\t\t\t\t\t\t\t\tindexOfControl === 0,\n\t\t\t\t\t\t\t\t\t\t\t'is-active': control.isActive,\n\t\t\t\t\t\t\t\t\t\t\t'is-icon-only': ! control.title,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\ticon={ control.icon }\n\t\t\t\t\t\t\t\t\tlabel={ control.label }\n\t\t\t\t\t\t\t\t\taria-checked={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.isActive\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\trole={\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemcheckbox' ||\n\t\t\t\t\t\t\t\t\t\tcontrol.role === 'menuitemradio'\n\t\t\t\t\t\t\t\t\t\t\t? control.role\n\t\t\t\t\t\t\t\t\t\t\t: 'menuitem'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tdisabled={ control.isDisabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ control.title }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) )\n\t\t\t\t\t\t) }\n\t\t\t\t\t</NavigableMenu>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport default DropdownMenu;\n"]}

package/build/dropdown-menu/index.native.js

@@ -13,8 +13,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _lodash = require("lodash");
-
 var _reactNative = require("react-native");
 
 var _keycodes = require("@wordpress/keycodes");
@@ -76,14 +74,14 @@ function DropdownMenu(_ref) {
     toggleProps
   } = _ref;
 
-  if ((0, _lodash.isEmpty)(controls) && !isFunction(children)) {
+  if (!(controls !== null && controls !== void 0 && controls.length) && !isFunction(children)) {
     return null;
   } // Normalize controls to nested array of objects (sets of controls)
 
 
   let controlSets;
 
-  if (!(0, _lodash.isEmpty)(controls)) {
+  if (controls !== null && controls !== void 0 && controls.length) {
     controlSets = controls;
 
     if (!Array.isArray(controlSets[0])) {
@@ -137,6 +135,8 @@ function DropdownMenu(_ref) {
       }), mergedToggleProps.children);
     },
     renderContent: _ref3 => {
+      var _controlSets;
+
       let {
         isOpen,
         onClose,
@@ -152,7 +152,7 @@ function DropdownMenu(_ref) {
           paddingLeft: 0,
           paddingRight: 0
         }
-      }, (0, _lodash.flatMap)(controlSets, (controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_components.BottomSheet.Cell, {
+      }, (_controlSets = controlSets) === null || _controlSets === void 0 ? void 0 : _controlSets.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_components.BottomSheet.Cell, {
         key: [indexOfSet, indexOfControl].join(),
         label: control.title,
         onPress: () => {

package/build/dropdown-menu/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/dropdown-menu/index.native.js"],"names":["mergeProps","defaultProps","props","mergedProps","className","isFunction","maybeFunc","DropdownMenu","children","controls","icon","menu","label","popoverProps","toggleProps","controlSets","Array","isArray","mergedPopoverProps","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault","mergedToggleProps","onClick","onKeyDown","onClose","paddingLeft","paddingRight","controlSet","indexOfSet","map","control","indexOfControl","join","title","isActive","Platform","OS"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { flatMap, isEmpty } from 'lodash';\nimport { Platform } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { DOWN } from '@wordpress/keycodes';\nimport { BottomSheet, PanelBody } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\n\nfunction mergeProps( defaultProps = {}, props = {} ) {\n\tconst mergedProps = {\n\t\t...defaultProps,\n\t\t...props,\n\t};\n\n\tif ( props.className && defaultProps.className ) {\n\t\tmergedProps.className = classnames(\n\t\t\tprops.className,\n\t\t\tdefaultProps.className\n\t\t);\n\t}\n\n\treturn mergedProps;\n}\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction DropdownMenu( {\n\tchildren,\n\tclassName,\n\tcontrols,\n\ticon = menu,\n\tlabel,\n\tpopoverProps,\n\ttoggleProps,\n} ) {\n\tif ( isEmpty( controls ) && ! isFunction( children ) ) {\n\t\treturn null;\n\t}\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets;\n\tif ( ! isEmpty( controls ) ) {\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\tcontrolSets = [ controlSets ];\n\t\t}\n\t}\n\tconst mergedPopoverProps = mergeProps(\n\t\t{\n\t\t\tclassName: 'components-dropdown-menu__popover',\n\t\t},\n\t\tpopoverProps\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames( 'components-dropdown-menu', className ) }\n\t\t\tpopoverProps={ mergedPopoverProps }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\tconst mergedToggleProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__toggle',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-opened': isOpen,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\ttoggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tonToggle( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ mergedToggleProps.children }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ ( { isOpen, onClose, ...props } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<BottomSheet\n\t\t\t\t\t\thideHeader={ true }\n\t\t\t\t\t\tisVisible={ isOpen }\n\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isFunction( children ) ? children( props ) : null }\n\t\t\t\t\t\t<PanelBody\n\t\t\t\t\t\t\ttitle={ label }\n\t\t\t\t\t\t\tstyle={ { paddingLeft: 0, paddingRight: 0 } }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ flatMap(\n\t\t\t\t\t\t\t\tcontrolSets,\n\t\t\t\t\t\t\t\t( controlSet, indexOfSet ) =>\n\t\t\t\t\t\t\t\t\tcontrolSet.map(\n\t\t\t\t\t\t\t\t\t\t( control, indexOfControl ) => (\n\t\t\t\t\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ [\n\t\t\t\t\t\t\t\t\t\t\t\t\tindexOfSet,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindexOfControl,\n\t\t\t\t\t\t\t\t\t\t\t\t].join() }\n\t\t\t\t\t\t\t\t\t\t\t\tlabel={ control.title }\n\t\t\t\t\t\t\t\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif ( control.onClick ) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrol.onClick();\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\teditable={ false }\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ control.icon }\n\t\t\t\t\t\t\t\t\t\t\t\tleftAlign={ true }\n\t\t\t\t\t\t\t\t\t\t\t\tisSelected={ control.isActive }\n\t\t\t\t\t\t\t\t\t\t\t\tseparatorType={\n\t\t\t\t\t\t\t\t\t\t\t\t\tPlatform.OS === 'android'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'leftMargin'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t</BottomSheet>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( DropdownMenu );\n"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown-menu/index.native.js"],"names":["mergeProps","defaultProps","props","mergedProps","className","isFunction","maybeFunc","DropdownMenu","children","controls","icon","menu","label","popoverProps","toggleProps","length","controlSets","Array","isArray","mergedPopoverProps","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault","mergedToggleProps","onClick","onKeyDown","onClose","paddingLeft","paddingRight","flatMap","controlSet","indexOfSet","map","control","indexOfControl","join","title","isActive","Platform","OS"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { Platform } from 'react-native';\n/**\n * WordPress dependencies\n */\nimport { DOWN } from '@wordpress/keycodes';\nimport { BottomSheet, PanelBody } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\n\nfunction mergeProps( defaultProps = {}, props = {} ) {\n\tconst mergedProps = {\n\t\t...defaultProps,\n\t\t...props,\n\t};\n\n\tif ( props.className && defaultProps.className ) {\n\t\tmergedProps.className = classnames(\n\t\t\tprops.className,\n\t\t\tdefaultProps.className\n\t\t);\n\t}\n\n\treturn mergedProps;\n}\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nfunction DropdownMenu( {\n\tchildren,\n\tclassName,\n\tcontrols,\n\ticon = menu,\n\tlabel,\n\tpopoverProps,\n\ttoggleProps,\n} ) {\n\tif ( ! controls?.length && ! isFunction( children ) ) {\n\t\treturn null;\n\t}\n\n\t// Normalize controls to nested array of objects (sets of controls)\n\tlet controlSets;\n\tif ( controls?.length ) {\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\tcontrolSets = [ controlSets ];\n\t\t}\n\t}\n\tconst mergedPopoverProps = mergeProps(\n\t\t{\n\t\t\tclassName: 'components-dropdown-menu__popover',\n\t\t},\n\t\tpopoverProps\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames( 'components-dropdown-menu', className ) }\n\t\t\tpopoverProps={ mergedPopoverProps }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\tconst mergedToggleProps = mergeProps(\n\t\t\t\t\t{\n\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t'components-dropdown-menu__toggle',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-opened': isOpen,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t\t\ttoggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tonToggle( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ mergedToggleProps.children }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ ( { isOpen, onClose, ...props } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<BottomSheet\n\t\t\t\t\t\thideHeader={ true }\n\t\t\t\t\t\tisVisible={ isOpen }\n\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isFunction( children ) ? children( props ) : null }\n\t\t\t\t\t\t<PanelBody\n\t\t\t\t\t\t\ttitle={ label }\n\t\t\t\t\t\t\tstyle={ { paddingLeft: 0, paddingRight: 0 } }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ controlSets?.flatMap(\n\t\t\t\t\t\t\t\t( controlSet, indexOfSet ) =>\n\t\t\t\t\t\t\t\t\tcontrolSet.map(\n\t\t\t\t\t\t\t\t\t\t( control, indexOfControl ) => (\n\t\t\t\t\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ [\n\t\t\t\t\t\t\t\t\t\t\t\t\tindexOfSet,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindexOfControl,\n\t\t\t\t\t\t\t\t\t\t\t\t].join() }\n\t\t\t\t\t\t\t\t\t\t\t\tlabel={ control.title }\n\t\t\t\t\t\t\t\t\t\t\t\tonPress={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif ( control.onClick ) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrol.onClick();\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\teditable={ false }\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ control.icon }\n\t\t\t\t\t\t\t\t\t\t\t\tleftAlign={ true }\n\t\t\t\t\t\t\t\t\t\t\t\tisSelected={ control.isActive }\n\t\t\t\t\t\t\t\t\t\t\t\tseparatorType={\n\t\t\t\t\t\t\t\t\t\t\t\t\tPlatform.OS === 'android'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'leftMargin'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t</BottomSheet>\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( DropdownMenu );\n"]}

package/build/duotone-picker/duotone-picker.js

@@ -35,6 +35,7 @@ var _utils = require("./utils");
 function DuotonePicker(_ref) {
   let {
     clearable = true,
+    unsetable = true,
     colorPalette,
     duotonePalette,
     disableCustomColors,
@@ -43,44 +44,56 @@ function DuotonePicker(_ref) {
     onChange
   } = _ref;
   const [defaultDark, defaultLight] = (0, _element.useMemo)(() => (0, _utils.getDefaultColors)(colorPalette), [colorPalette]);
+  const isUnset = value === 'unset';
+  const unsetOption = (0, _element.createElement)(_circularOptionPicker.default.Option, {
+    key: "unset",
+    value: "unset",
+    isSelected: isUnset,
+    tooltipText: (0, _i18n.__)('Unset'),
+    className: "components-duotone-picker__color-indicator",
+    onClick: () => {
+      onChange(isUnset ? undefined : 'unset');
+    }
+  });
+  const options = duotonePalette.map(_ref2 => {
+    let {
+      colors,
+      slug,
+      name
+    } = _ref2;
+    const style = {
+      background: (0, _utils.getGradientFromCSSColors)(colors, '135deg'),
+      color: 'transparent'
+    };
+    const tooltipText = name !== null && name !== void 0 ? name : (0, _i18n.sprintf)( // translators: %s: duotone code e.g: "dark-grayscale" or "7f7f7f-ffffff".
+    (0, _i18n.__)('Duotone code: %s'), slug);
+    const label = name ? (0, _i18n.sprintf)( // translators: %s: The name of the option e.g: "Dark grayscale".
+    (0, _i18n.__)('Duotone: %s'), name) : tooltipText;
+    const isSelected = (0, _lodash.isEqual)(colors, value);
+    return (0, _element.createElement)(_circularOptionPicker.default.Option, {
+      key: slug,
+      value: colors,
+      isSelected: isSelected,
+      "aria-label": label,
+      tooltipText: tooltipText,
+      style: style,
+      onClick: () => {
+        onChange(isSelected ? undefined : colors);
+      }
+    });
+  });
   return (0, _element.createElement)(_circularOptionPicker.default, {
-    options: duotonePalette.map(_ref2 => {
-      let {
-        colors,
-        slug,
-        name
-      } = _ref2;
-      const style = {
-        background: (0, _utils.getGradientFromCSSColors)(colors, '135deg'),
-        color: 'transparent'
-      };
-      const tooltipText = name !== null && name !== void 0 ? name : (0, _i18n.sprintf)( // translators: %s: duotone code e.g: "dark-grayscale" or "7f7f7f-ffffff".
-      (0, _i18n.__)('Duotone code: %s'), slug);
-      const label = name ? (0, _i18n.sprintf)( // translators: %s: The name of the option e.g: "Dark grayscale".
-      (0, _i18n.__)('Duotone: %s'), name) : tooltipText;
-      const isSelected = (0, _lodash.isEqual)(colors, value);
-      return (0, _element.createElement)(_circularOptionPicker.default.Option, {
-        key: slug,
-        value: colors,
-        isSelected: isSelected,
-        "aria-label": label,
-        tooltipText: tooltipText,
-        style: style,
-        onClick: () => {
-          onChange(isSelected ? undefined : colors);
-        }
-      });
-    }),
+    options: unsetable ? [unsetOption, ...options] : options,
     actions: !!clearable && (0, _element.createElement)(_circularOptionPicker.default.ButtonAction, {
       onClick: () => onChange(undefined)
     }, (0, _i18n.__)('Clear'))
   }, !disableCustomColors && !disableCustomDuotone && (0, _element.createElement)(_customDuotoneBar.default, {
-    value: value,
+    value: isUnset ? undefined : value,
     onChange: onChange
   }), !disableCustomDuotone && (0, _element.createElement)(_colorListPicker.default, {
     labels: [(0, _i18n.__)('Shadows'), (0, _i18n.__)('Highlights')],
     colors: colorPalette,
-    value: value,
+    value: isUnset ? undefined : value,
     disableCustomColors: disableCustomColors,
     enableAlpha: true,
     onChange: newColors => {

package/build/duotone-picker/duotone-picker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/duotone-picker/duotone-picker.js"],"names":["DuotonePicker","clearable","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","defaultDark","defaultLight","map","colors","slug","name","style","background","color","tooltipText","label","isSelected","undefined","newColors","newValue","length"],"mappings":";;;;;;;;;AAQA;;AALA;;AAMA;;AAKA;;AACA;;AAEA;;AACA;;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAOA,SAASA,aAAT,OAQI;AAAA,MARoB;AACvBC,IAAAA,SAAS,GAAG,IADW;AAEvBC,IAAAA,YAFuB;AAGvBC,IAAAA,cAHuB;AAIvBC,IAAAA,mBAJuB;AAKvBC,IAAAA,oBALuB;AAMvBC,IAAAA,KANuB;AAOvBC,IAAAA;AAPuB,GAQpB;AACH,QAAM,CAAEC,WAAF,EAAeC,YAAf,IAAgC,sBACrC,MAAM,6BAAkBP,YAAlB,CAD+B,EAErC,CAAEA,YAAF,CAFqC,CAAtC;AAKA,SACC,4BAAC,6BAAD;AACC,IAAA,OAAO,EAAGC,cAAc,CAACO,GAAf,CAAoB,SAA8B;AAAA,UAA5B;AAAEC,QAAAA,MAAF;AAAUC,QAAAA,IAAV;AAAgBC,QAAAA;AAAhB,OAA4B;AAC3D,YAAMC,KAAK,GAAG;AACbC,QAAAA,UAAU,EAAE,qCAA0BJ,MAA1B,EAAkC,QAAlC,CADC;AAEbK,QAAAA,KAAK,EAAE;AAFM,OAAd;AAIA,YAAMC,WAAW,GAChBJ,IADgB,aAChBA,IADgB,cAChBA,IADgB,GAEhB,oBACC;AACA,oBAAI,kBAAJ,CAFD,EAGCD,IAHD,CAFD;AAOA,YAAMM,KAAK,GAAGL,IAAI,GACf,oBACA;AACA,oBAAI,aAAJ,CAFA,EAGAA,IAHA,CADe,GAMfI,WANH;AAOA,YAAME,UAAU,GAAG,qBAASR,MAAT,EAAiBL,KAAjB,CAAnB;AAEA,aACC,4BAAC,6BAAD,CAAsB,MAAtB;AACC,QAAA,GAAG,EAAGM,IADP;AAEC,QAAA,KAAK,EAAGD,MAFT;AAGC,QAAA,UAAU,EAAGQ,UAHd;AAIC,sBAAaD,KAJd;AAKC,QAAA,WAAW,EAAGD,WALf;AAMC,QAAA,KAAK,EAAGH,KANT;AAOC,QAAA,OAAO,EAAG,MAAM;AACfP,UAAAA,QAAQ,CAAEY,UAAU,GAAGC,SAAH,GAAeT,MAA3B,CAAR;AACA;AATF,QADD;AAaA,KAlCS,CADX;AAoCC,IAAA,OAAO,EACN,CAAC,CAAEV,SAAH,IACC,4BAAC,6BAAD,CAAsB,YAAtB;AACC,MAAA,OAAO,EAAG,MAAMM,QAAQ,CAAEa,SAAF;AADzB,OAGG,cAAI,OAAJ,CAHH;AAtCH,KA8CG,CAAEhB,mBAAF,IAAyB,CAAEC,oBAA3B,IACD,4BAAC,yBAAD;AAAkB,IAAA,KAAK,EAAGC,KAA1B;AAAkC,IAAA,QAAQ,EAAGC;AAA7C,IA/CF,EAiDG,CAAEF,oBAAF,IACD,4BAAC,wBAAD;AACC,IAAA,MAAM,EAAG,CAAE,cAAI,SAAJ,CAAF,EAAmB,cAAI,YAAJ,CAAnB,CADV;AAEC,IAAA,MAAM,EAAGH,YAFV;AAGC,IAAA,KAAK,EAAGI,KAHT;AAIC,IAAA,mBAAmB,EAAGF,mBAJvB;AAKC,IAAA,WAAW,MALZ;AAMC,IAAA,QAAQ,EAAKiB,SAAF,IAAiB;AAC3B,UAAK,CAAEA,SAAS,CAAE,CAAF,CAAhB,EAAwB;AACvBA,QAAAA,SAAS,CAAE,CAAF,CAAT,GAAiBb,WAAjB;AACA;;AACD,UAAK,CAAEa,SAAS,CAAE,CAAF,CAAhB,EAAwB;AACvBA,QAAAA,SAAS,CAAE,CAAF,CAAT,GAAiBZ,YAAjB;AACA;;AACD,YAAMa,QAAQ,GACbD,SAAS,CAACE,MAAV,IAAoB,CAApB,GAAwBF,SAAxB,GAAoCD,SADrC;AAEAb,MAAAA,QAAQ,CAAEe,QAAF,CAAR;AACA;AAhBF,IAlDF,CADD;AAwEA;;eAEctB,a","sourcesContent":["/**\n * External dependencies\n */\nimport { isEqual } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ColorListPicker from '../color-list-picker';\nimport CircularOptionPicker from '../circular-option-picker';\n\nimport CustomDuotoneBar from './custom-duotone-bar';\nimport { getDefaultColors, getGradientFromCSSColors } from './utils';\n\nfunction DuotonePicker( {\n\tclearable = true,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tconst [ defaultDark, defaultLight ] = useMemo(\n\t\t() => getDefaultColors( colorPalette ),\n\t\t[ colorPalette ]\n\t);\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\toptions={ duotonePalette.map( ( { colors, slug, name } ) => {\n\t\t\t\tconst style = {\n\t\t\t\t\tbackground: getGradientFromCSSColors( colors, '135deg' ),\n\t\t\t\t\tcolor: 'transparent',\n\t\t\t\t};\n\t\t\t\tconst tooltipText =\n\t\t\t\t\tname ??\n\t\t\t\t\tsprintf(\n\t\t\t\t\t\t// translators: %s: duotone code e.g: \"dark-grayscale\" or \"7f7f7f-ffffff\".\n\t\t\t\t\t\t__( 'Duotone code: %s' ),\n\t\t\t\t\t\tslug\n\t\t\t\t\t);\n\t\t\t\tconst label = name\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the option e.g: \"Dark grayscale\".\n\t\t\t\t\t\t\t__( 'Duotone: %s' ),\n\t\t\t\t\t\t\tname\n\t\t\t\t\t  )\n\t\t\t\t\t: tooltipText;\n\t\t\t\tconst isSelected = isEqual( colors, value );\n\n\t\t\t\treturn (\n\t\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\t\tkey={ slug }\n\t\t\t\t\t\tvalue={ colors }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\taria-label={ label }\n\t\t\t\t\t\ttooltipText={ tooltipText }\n\t\t\t\t\t\tstyle={ style }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( isSelected ? undefined : colors );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\tactions={\n\t\t\t\t!! clearable && (\n\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\tonClick={ () => onChange( undefined ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t)\n\t\t\t}\n\t\t>\n\t\t\t{ ! disableCustomColors && ! disableCustomDuotone && (\n\t\t\t\t<CustomDuotoneBar value={ value } onChange={ onChange } />\n\t\t\t) }\n\t\t\t{ ! disableCustomDuotone && (\n\t\t\t\t<ColorListPicker\n\t\t\t\t\tlabels={ [ __( 'Shadows' ), __( 'Highlights' ) ] }\n\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColors ) => {\n\t\t\t\t\t\tif ( ! newColors[ 0 ] ) {\n\t\t\t\t\t\t\tnewColors[ 0 ] = defaultDark;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif ( ! newColors[ 1 ] ) {\n\t\t\t\t\t\t\tnewColors[ 1 ] = defaultLight;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst newValue =\n\t\t\t\t\t\t\tnewColors.length >= 2 ? newColors : undefined;\n\t\t\t\t\t\tonChange( newValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</CircularOptionPicker>\n\t);\n}\n\nexport default DuotonePicker;\n"]}
+{"version":3,"sources":["@wordpress/components/src/duotone-picker/duotone-picker.js"],"names":["DuotonePicker","clearable","unsetable","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","defaultDark","defaultLight","isUnset","unsetOption","undefined","options","map","colors","slug","name","style","background","color","tooltipText","label","isSelected","newColors","newValue","length"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEqual } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ColorListPicker from '../color-list-picker';\nimport CircularOptionPicker from '../circular-option-picker';\n\nimport CustomDuotoneBar from './custom-duotone-bar';\nimport { getDefaultColors, getGradientFromCSSColors } from './utils';\n\nfunction DuotonePicker( {\n\tclearable = true,\n\tunsetable = true,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tconst [ defaultDark, defaultLight ] = useMemo(\n\t\t() => getDefaultColors( colorPalette ),\n\t\t[ colorPalette ]\n\t);\n\n\tconst isUnset = value === 'unset';\n\n\tconst unsetOption = (\n\t\t<CircularOptionPicker.Option\n\t\t\tkey=\"unset\"\n\t\t\tvalue=\"unset\"\n\t\t\tisSelected={ isUnset }\n\t\t\ttooltipText={ __( 'Unset' ) }\n\t\t\tclassName=\"components-duotone-picker__color-indicator\"\n\t\t\tonClick={ () => {\n\t\t\t\tonChange( isUnset ? undefined : 'unset' );\n\t\t\t} }\n\t\t/>\n\t);\n\n\tconst options = duotonePalette.map( ( { colors, slug, name } ) => {\n\t\tconst style = {\n\t\t\tbackground: getGradientFromCSSColors( colors, '135deg' ),\n\t\t\tcolor: 'transparent',\n\t\t};\n\t\tconst tooltipText =\n\t\t\tname ??\n\t\t\tsprintf(\n\t\t\t\t// translators: %s: duotone code e.g: \"dark-grayscale\" or \"7f7f7f-ffffff\".\n\t\t\t\t__( 'Duotone code: %s' ),\n\t\t\t\tslug\n\t\t\t);\n\t\tconst label = name\n\t\t\t? sprintf(\n\t\t\t\t\t// translators: %s: The name of the option e.g: \"Dark grayscale\".\n\t\t\t\t\t__( 'Duotone: %s' ),\n\t\t\t\t\tname\n\t\t\t  )\n\t\t\t: tooltipText;\n\t\tconst isSelected = isEqual( colors, value );\n\n\t\treturn (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ slug }\n\t\t\t\tvalue={ colors }\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\taria-label={ label }\n\t\t\t\ttooltipText={ tooltipText }\n\t\t\t\tstyle={ style }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tonChange( isSelected ? undefined : colors );\n\t\t\t\t} }\n\t\t\t/>\n\t\t);\n\t} );\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\toptions={ unsetable ? [ unsetOption, ...options ] : options }\n\t\t\tactions={\n\t\t\t\t!! clearable && (\n\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\tonClick={ () => onChange( undefined ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t)\n\t\t\t}\n\t\t>\n\t\t\t{ ! disableCustomColors && ! disableCustomDuotone && (\n\t\t\t\t<CustomDuotoneBar\n\t\t\t\t\tvalue={ isUnset ? undefined : value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! disableCustomDuotone && (\n\t\t\t\t<ColorListPicker\n\t\t\t\t\tlabels={ [ __( 'Shadows' ), __( 'Highlights' ) ] }\n\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\tvalue={ isUnset ? undefined : value }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColors ) => {\n\t\t\t\t\t\tif ( ! newColors[ 0 ] ) {\n\t\t\t\t\t\t\tnewColors[ 0 ] = defaultDark;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif ( ! newColors[ 1 ] ) {\n\t\t\t\t\t\t\tnewColors[ 1 ] = defaultLight;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst newValue =\n\t\t\t\t\t\t\tnewColors.length >= 2 ? newColors : undefined;\n\t\t\t\t\t\tonChange( newValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</CircularOptionPicker>\n\t);\n}\n\nexport default DuotonePicker;\n"]}

package/build/elevation/component.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.Elevation = void 0;
 
 var _element = require("@wordpress/element");
 
@@ -18,25 +18,24 @@ var _view = require("../view");
 var _hook = require("./hook");
 
 /**
- * Internal dependencies
+ * External dependencies
  */
 
 /**
- * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props
- * @param {import('react').ForwardedRef<any>}                                               forwardedRef
+ * Internal dependencies
  */
-function Elevation(props, forwardedRef) {
+function UnconnectedElevation(props, forwardedRef) {
   const elevationProps = (0, _hook.useElevation)(props);
   return (0, _element.createElement)(_view.View, (0, _extends2.default)({}, elevationProps, {
     ref: forwardedRef
   }));
 }
 /**
- * `Elevation` is a core component that renders shadow, using the library's shadow system.
+ * `Elevation` is a core component that renders shadow, using the component
+ * system's shadow system.
  *
  * The shadow effect is generated using the `value` prop.
  *
- * @example
  * ```jsx
  * import {
  *	__experimentalElevation as Elevation,
@@ -45,18 +44,19 @@ function Elevation(props, forwardedRef) {
  * } from '@wordpress/components';
  *
  * function Example() {
- * 	return (
- * 		<Surface>
- * 			<Text>Code is Poetry</Text>
- * 			<Elevation value={ 5 } />
- * 		</Surface>
- * 	);
+ *   return (
+ *     <Surface>
+ *       <Text>Code is Poetry</Text>
+ *       <Elevation value={ 5 } />
+ *     </Surface>
+ *   );
  * }
  * ```
  */
 
 
-const ConnectedElevation = (0, _context.contextConnect)(Elevation, 'Elevation');
-var _default = ConnectedElevation;
+const Elevation = (0, _context.contextConnect)(UnconnectedElevation, 'Elevation');
+exports.Elevation = Elevation;
+var _default = Elevation;
 exports.default = _default;
 //# sourceMappingURL=component.js.map

package/build/elevation/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/elevation/component.js"],"names":["Elevation","props","forwardedRef","elevationProps","ConnectedElevation"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA,SAASA,SAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAA0C;AACzC,QAAMC,cAAc,GAAG,wBAAcF,KAAd,CAAvB;AAEA,SAAO,4BAAC,UAAD,6BAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,kBAAkB,GAAG,6BAAgBJ,SAAhB,EAA2B,WAA3B,CAA3B;eAEeI,kB","sourcesContent":["/**\n * Internal dependencies\n */\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>}                                               forwardedRef\n */\nfunction Elevation( props, forwardedRef ) {\n\tconst elevationProps = useElevation( props );\n\n\treturn <View { ...elevationProps } ref={ forwardedRef } />;\n}\n\n/**\n * `Elevation` is a core component that renders shadow, using the library's shadow system.\n *\n * The shadow effect is generated using the `value` prop.\n *\n * @example\n * ```jsx\n * import {\n *\t__experimentalElevation as Elevation,\n *\t__experimentalSurface as Surface,\n *\t__experimentalText as Text,\n * } from '@wordpress/components';\n *\n * function Example() {\n * \treturn (\n * \t\t<Surface>\n * \t\t\t<Text>Code is Poetry</Text>\n * \t\t\t<Elevation value={ 5 } />\n * \t\t</Surface>\n * \t);\n * }\n * ```\n */\nconst ConnectedElevation = contextConnect( Elevation, 'Elevation' );\n\nexport default ConnectedElevation;\n"]}
+{"version":3,"sources":["@wordpress/components/src/elevation/component.tsx"],"names":["UnconnectedElevation","props","forwardedRef","elevationProps","Elevation"],"mappings":";;;;;;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,oBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,cAAc,GAAG,wBAAcF,KAAd,CAAvB;AAEA,SAAO,4BAAC,UAAD,6BAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,SAAS,GAAG,6BAAgBJ,oBAAhB,EAAsC,WAAtC,CAAlB;;eAEQI,S","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, WordPressComponentProps } from '../ui/context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\nimport type { ElevationProps } from './types';\n\nfunction UnconnectedElevation(\n\tprops: WordPressComponentProps< ElevationProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst elevationProps = useElevation( props );\n\n\treturn <View { ...elevationProps } ref={ forwardedRef } />;\n}\n\n/**\n * `Elevation` is a core component that renders shadow, using the component\n * system's shadow system.\n *\n * The shadow effect is generated using the `value` prop.\n *\n * ```jsx\n * import {\n *\t__experimentalElevation as Elevation,\n *\t__experimentalSurface as Surface,\n *\t__experimentalText as Text,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <Surface>\n *       <Text>Code is Poetry</Text>\n *       <Elevation value={ 5 } />\n *     </Surface>\n *   );\n * }\n * ```\n */\nexport const Elevation = contextConnect( UnconnectedElevation, 'Elevation' );\n\nexport default Elevation;\n"]}

package/build/elevation/hook.js

@@ -8,8 +8,6 @@ exports.useElevation = useElevation;
 
 var _react = require("@emotion/react");
 
-var _lodash = require("lodash");
-
 var _element = require("@wordpress/element");
 
 var _context = require("../ui/context");
@@ -20,6 +18,8 @@ var _utils = require("../utils");
 
 var _useCx = require("../utils/hooks/use-cx");
 
+var _values = require("../utils/values");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -35,21 +35,12 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * Internal dependencies
  */
-
-/**
- * @param {number} value
- * @return {string} The box shadow value.
- */
 function getBoxShadow(value) {
-  const boxShadowColor = `rgba(0 ,0, 0, ${value / 20})`;
+  const boxShadowColor = `rgba(0, 0, 0, ${value / 20})`;
   const boxShadow = `0 ${value}px ${value * 2}px 0
 	${boxShadowColor}`;
   return boxShadow;
 }
-/**
- * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props
- */
-
 
 function useElevation(props) {
   const {
@@ -65,15 +56,12 @@ function useElevation(props) {
   } = (0, _context.useContextSystem)(props, 'Elevation');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => {
-    /** @type {number | undefined} */
-    let hoverValue = !(0, _lodash.isNil)(hover) ? hover : value * 2;
-    /** @type {number | undefined} */
-
-    let activeValue = !(0, _lodash.isNil)(active) ? active : value / 2;
+    let hoverValue = (0, _values.isValueDefined)(hover) ? hover : value * 2;
+    let activeValue = (0, _values.isValueDefined)(active) ? active : value / 2;
 
     if (!isInteractive) {
-      hoverValue = !(0, _lodash.isNil)(hover) ? hover : undefined;
-      activeValue = !(0, _lodash.isNil)(active) ? active : undefined;
+      hoverValue = (0, _values.isValueDefined)(hover) ? hover : undefined;
+      activeValue = (0, _values.isValueDefined)(active) ? active : undefined;
     }
 
     const transition = `box-shadow ${_utils.CONFIG.transitionDuration} ${_utils.CONFIG.transitionTimingFunction}`;
@@ -87,21 +75,21 @@ function useElevation(props) {
       right: offset,
       top: offset,
       transition
-    }, (0, _utils.reduceMotion)('transition'), process.env.NODE_ENV === "production" ? "" : ";label:sx-Base;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2suanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0VZIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2suanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBpc05pbCB9IGZyb20gJ2xvZGFzaCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlQ29udGV4dFN5c3RlbSB9IGZyb20gJy4uL3VpL2NvbnRleHQnO1xuaW1wb3J0ICogYXMgc3R5bGVzIGZyb20gJy4vc3R5bGVzJztcbmltcG9ydCB7IENPTkZJRywgcmVkdWNlTW90aW9uIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHsgdXNlQ3ggfSBmcm9tICcuLi91dGlscy9ob29rcy91c2UtY3gnO1xuXG4vKipcbiAqIEBwYXJhbSB7bnVtYmVyfSB2YWx1ZVxuICogQHJldHVybiB7c3RyaW5nfSBUaGUgYm94IHNoYWRvdyB2YWx1ZS5cbiAqL1xuZXhwb3J0IGZ1bmN0aW9uIGdldEJveFNoYWRvdyggdmFsdWUgKSB7XG5cdGNvbnN0IGJveFNoYWRvd0NvbG9yID0gYHJnYmEoMCAsMCwgMCwgJHsgdmFsdWUgLyAyMCB9KWA7XG5cdGNvbnN0IGJveFNoYWRvdyA9IGAwICR7IHZhbHVlIH1weCAkeyB2YWx1ZSAqIDIgfXB4IDBcblx0JHsgYm94U2hhZG93Q29sb3IgfWA7XG5cblx0cmV0dXJuIGJveFNoYWRvdztcbn1cblxuLyoqXG4gKiBAcGFyYW0ge2ltcG9ydCgnLi4vdWkvY29udGV4dCcpLldvcmRQcmVzc0NvbXBvbmVudFByb3BzPGltcG9ydCgnLi90eXBlcycpLlByb3BzLCAnZGl2Jz59IHByb3BzXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiB1c2VFbGV2YXRpb24oIHByb3BzICkge1xuXHRjb25zdCB7XG5cdFx0YWN0aXZlLFxuXHRcdGJvcmRlclJhZGl1cyA9ICdpbmhlcml0Jyxcblx0XHRjbGFzc05hbWUsXG5cdFx0Zm9jdXMsXG5cdFx0aG92ZXIsXG5cdFx0aXNJbnRlcmFjdGl2ZSA9IGZhbHNlLFxuXHRcdG9mZnNldCA9IDAsXG5cdFx0dmFsdWUgPSAwLFxuXHRcdC4uLm90aGVyUHJvcHNcblx0fSA9IHVzZUNvbnRleHRTeXN0ZW0oIHByb3BzLCAnRWxldmF0aW9uJyApO1xuXG5cdGNvbnN0IGN4ID0gdXNlQ3goKTtcblxuXHRjb25zdCBjbGFzc2VzID0gdXNlTWVtbyggKCkgPT4ge1xuXHRcdC8qKiBAdHlwZSB7bnVtYmVyIHwgdW5kZWZpbmVkfSAqL1xuXHRcdGxldCBob3ZlclZhbHVlID0gISBpc05pbCggaG92ZXIgKSA/IGhvdmVyIDogdmFsdWUgKiAyO1xuXHRcdC8qKiBAdHlwZSB7bnVtYmVyIHwgdW5kZWZpbmVkfSAqL1xuXHRcdGxldCBhY3RpdmVWYWx1ZSA9ICEgaXNOaWwoIGFjdGl2ZSApID8gYWN0aXZlIDogdmFsdWUgLyAyO1xuXG5cdFx0aWYgKCAhIGlzSW50ZXJhY3RpdmUgKSB7XG5cdFx0XHRob3ZlclZhbHVlID0gISBpc05pbCggaG92ZXIgKSA/IGhvdmVyIDogdW5kZWZpbmVkO1xuXHRcdFx0YWN0aXZlVmFsdWUgPSAhIGlzTmlsKCBhY3RpdmUgKSA/IGFjdGl2ZSA6IHVuZGVmaW5lZDtcblx0XHR9XG5cblx0XHRjb25zdCB0cmFuc2l0aW9uID0gYGJveC1zaGFkb3cgJHsgQ09ORklHLnRyYW5zaXRpb25EdXJhdGlvbiB9ICR7IENPTkZJRy50cmFuc2l0aW9uVGltaW5nRnVuY3Rpb24gfWA7XG5cblx0XHRjb25zdCBzeCA9IHt9O1xuXG5cdFx0c3guQmFzZSA9IGNzcyhcblx0XHRcdHtcblx0XHRcdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdFx0XHRib3R0b206IG9mZnNldCxcblx0XHRcdFx0Ym94U2hhZG93OiBnZXRCb3hTaGFkb3coIHZhbHVlICksXG5cdFx0XHRcdG9wYWNpdHk6IENPTkZJRy5lbGV2YXRpb25JbnRlbnNpdHksXG5cdFx0XHRcdGxlZnQ6IG9mZnNldCxcblx0XHRcdFx0cmlnaHQ6IG9mZnNldCxcblx0XHRcdFx0dG9wOiBvZmZzZXQsXG5cdFx0XHRcdHRyYW5zaXRpb24sXG5cdFx0XHR9LFxuXHRcdFx0cmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKVxuXHRcdCk7XG5cblx0XHRpZiAoICEgaXNOaWwoIGhvdmVyVmFsdWUgKSApIHtcblx0XHRcdHN4LmhvdmVyID0gY3NzYFxuXHRcdFx0XHQqOmhvdmVyID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBob3ZlclZhbHVlICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRpZiAoICEgaXNOaWwoIGFjdGl2ZVZhbHVlICkgKSB7XG5cdFx0XHRzeC5hY3RpdmUgPSBjc3NgXG5cdFx0XHRcdCo6YWN0aXZlID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBhY3RpdmVWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCAhIGlzTmlsKCBmb2N1cyApICkge1xuXHRcdFx0c3guZm9jdXMgPSBjc3NgXG5cdFx0XHRcdCo6Zm9jdXMgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGZvY3VzICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRyZXR1cm4gY3goXG5cdFx0XHRzdHlsZXMuRWxldmF0aW9uLFxuXHRcdFx0c3guQmFzZSxcblx0XHRcdHN4LmhvdmVyICYmIHN4LmhvdmVyLFxuXHRcdFx0c3guZm9jdXMgJiYgc3guZm9jdXMsXG5cdFx0XHRzeC5hY3RpdmUgJiYgc3guYWN0aXZlLFxuXHRcdFx0Y2xhc3NOYW1lXG5cdFx0KTtcblx0fSwgW1xuXHRcdGFjdGl2ZSxcblx0XHRib3JkZXJSYWRpdXMsXG5cdFx0Y2xhc3NOYW1lLFxuXHRcdGN4LFxuXHRcdGZvY3VzLFxuXHRcdGhvdmVyLFxuXHRcdGlzSW50ZXJhY3RpdmUsXG5cdFx0b2Zmc2V0LFxuXHRcdHZhbHVlLFxuXHRdICk7XG5cblx0cmV0dXJuIHsgLi4ub3RoZXJQcm9wcywgY2xhc3NOYW1lOiBjbGFzc2VzLCAnYXJpYS1oaWRkZW4nOiB0cnVlIH07XG59XG4iXX0= */");
+    }, (0, _utils.reduceMotion)('transition'), process.env.NODE_ENV === "production" ? "" : ";label:sx-Base;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBbUVZIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2sudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MsIFNlcmlhbGl6ZWRTdHlsZXMgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlQ29udGV4dFN5c3RlbSwgV29yZFByZXNzQ29tcG9uZW50UHJvcHMgfSBmcm9tICcuLi91aS9jb250ZXh0JztcbmltcG9ydCAqIGFzIHN0eWxlcyBmcm9tICcuL3N0eWxlcyc7XG5pbXBvcnQgeyBDT05GSUcsIHJlZHVjZU1vdGlvbiB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcbmltcG9ydCB7IGlzVmFsdWVEZWZpbmVkIH0gZnJvbSAnLi4vdXRpbHMvdmFsdWVzJztcbmltcG9ydCB0eXBlIHsgRWxldmF0aW9uUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuZXhwb3J0IGZ1bmN0aW9uIGdldEJveFNoYWRvdyggdmFsdWU6IG51bWJlciApIHtcblx0Y29uc3QgYm94U2hhZG93Q29sb3IgPSBgcmdiYSgwLCAwLCAwLCAkeyB2YWx1ZSAvIDIwIH0pYDtcblx0Y29uc3QgYm94U2hhZG93ID0gYDAgJHsgdmFsdWUgfXB4ICR7IHZhbHVlICogMiB9cHggMFxuXHQkeyBib3hTaGFkb3dDb2xvciB9YDtcblxuXHRyZXR1cm4gYm94U2hhZG93O1xufVxuXG5leHBvcnQgZnVuY3Rpb24gdXNlRWxldmF0aW9uKFxuXHRwcm9wczogV29yZFByZXNzQ29tcG9uZW50UHJvcHM8IEVsZXZhdGlvblByb3BzLCAnZGl2JyA+XG4pIHtcblx0Y29uc3Qge1xuXHRcdGFjdGl2ZSxcblx0XHRib3JkZXJSYWRpdXMgPSAnaW5oZXJpdCcsXG5cdFx0Y2xhc3NOYW1lLFxuXHRcdGZvY3VzLFxuXHRcdGhvdmVyLFxuXHRcdGlzSW50ZXJhY3RpdmUgPSBmYWxzZSxcblx0XHRvZmZzZXQgPSAwLFxuXHRcdHZhbHVlID0gMCxcblx0XHQuLi5vdGhlclByb3BzXG5cdH0gPSB1c2VDb250ZXh0U3lzdGVtKCBwcm9wcywgJ0VsZXZhdGlvbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHRsZXQgaG92ZXJWYWx1ZTogbnVtYmVyIHwgdW5kZWZpbmVkID0gaXNWYWx1ZURlZmluZWQoIGhvdmVyIClcblx0XHRcdD8gaG92ZXJcblx0XHRcdDogdmFsdWUgKiAyO1xuXHRcdGxldCBhY3RpdmVWYWx1ZTogbnVtYmVyIHwgdW5kZWZpbmVkID0gaXNWYWx1ZURlZmluZWQoIGFjdGl2ZSApXG5cdFx0XHQ/IGFjdGl2ZVxuXHRcdFx0OiB2YWx1ZSAvIDI7XG5cblx0XHRpZiAoICEgaXNJbnRlcmFjdGl2ZSApIHtcblx0XHRcdGhvdmVyVmFsdWUgPSBpc1ZhbHVlRGVmaW5lZCggaG92ZXIgKSA/IGhvdmVyIDogdW5kZWZpbmVkO1xuXHRcdFx0YWN0aXZlVmFsdWUgPSBpc1ZhbHVlRGVmaW5lZCggYWN0aXZlICkgPyBhY3RpdmUgOiB1bmRlZmluZWQ7XG5cdFx0fVxuXG5cdFx0Y29uc3QgdHJhbnNpdGlvbiA9IGBib3gtc2hhZG93ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb24gfSAkeyBDT05GSUcudHJhbnNpdGlvblRpbWluZ0Z1bmN0aW9uIH1gO1xuXG5cdFx0Y29uc3Qgc3g6IHtcblx0XHRcdEJhc2U/OiBTZXJpYWxpemVkU3R5bGVzO1xuXHRcdFx0aG92ZXI/OiBTZXJpYWxpemVkU3R5bGVzO1xuXHRcdFx0YWN0aXZlPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGZvY3VzPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHR9ID0ge307XG5cblx0XHRzeC5CYXNlID0gY3NzKFxuXHRcdFx0e1xuXHRcdFx0XHRib3JkZXJSYWRpdXMsXG5cdFx0XHRcdGJvdHRvbTogb2Zmc2V0LFxuXHRcdFx0XHRib3hTaGFkb3c6IGdldEJveFNoYWRvdyggdmFsdWUgKSxcblx0XHRcdFx0b3BhY2l0eTogQ09ORklHLmVsZXZhdGlvbkludGVuc2l0eSxcblx0XHRcdFx0bGVmdDogb2Zmc2V0LFxuXHRcdFx0XHRyaWdodDogb2Zmc2V0LFxuXHRcdFx0XHR0b3A6IG9mZnNldCxcblx0XHRcdFx0dHJhbnNpdGlvbixcblx0XHRcdH0sXG5cdFx0XHRyZWR1Y2VNb3Rpb24oICd0cmFuc2l0aW9uJyApXG5cdFx0KTtcblxuXHRcdGlmICggaXNWYWx1ZURlZmluZWQoIGhvdmVyVmFsdWUgKSApIHtcblx0XHRcdHN4LmhvdmVyID0gY3NzYFxuXHRcdFx0XHQqOmhvdmVyID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBob3ZlclZhbHVlICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBhY3RpdmVWYWx1ZSApICkge1xuXHRcdFx0c3guYWN0aXZlID0gY3NzYFxuXHRcdFx0XHQqOmFjdGl2ZSA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggYWN0aXZlVmFsdWUgKSB9O1xuXHRcdFx0XHR9XG5cdFx0XHRgO1xuXHRcdH1cblxuXHRcdGlmICggaXNWYWx1ZURlZmluZWQoIGZvY3VzICkgKSB7XG5cdFx0XHRzeC5mb2N1cyA9IGNzc2Bcblx0XHRcdFx0Kjpmb2N1cyA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggZm9jdXMgKSB9O1xuXHRcdFx0XHR9XG5cdFx0XHRgO1xuXHRcdH1cblxuXHRcdHJldHVybiBjeChcblx0XHRcdHN0eWxlcy5FbGV2YXRpb24sXG5cdFx0XHRzeC5CYXNlLFxuXHRcdFx0c3guaG92ZXIsXG5cdFx0XHRzeC5mb2N1cyxcblx0XHRcdHN4LmFjdGl2ZSxcblx0XHRcdGNsYXNzTmFtZVxuXHRcdCk7XG5cdH0sIFtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlLFxuXHRcdG9mZnNldCxcblx0XHR2YWx1ZSxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgJ2FyaWEtaGlkZGVuJzogdHJ1ZSB9O1xufVxuIl19 */");
 
-    if (!(0, _lodash.isNil)(hoverValue)) {
-      sx.hover = /*#__PURE__*/(0, _react.css)("*:hover>&{box-shadow:", getBoxShadow(hoverValue), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-hover;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2suanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK0VpQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgaXNOaWwgfSBmcm9tICdsb2Rhc2gnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0gfSBmcm9tICcuLi91aS9jb250ZXh0JztcbmltcG9ydCAqIGFzIHN0eWxlcyBmcm9tICcuL3N0eWxlcyc7XG5pbXBvcnQgeyBDT05GSUcsIHJlZHVjZU1vdGlvbiB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcblxuLyoqXG4gKiBAcGFyYW0ge251bWJlcn0gdmFsdWVcbiAqIEByZXR1cm4ge3N0cmluZ30gVGhlIGJveCBzaGFkb3cgdmFsdWUuXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlICkge1xuXHRjb25zdCBib3hTaGFkb3dDb2xvciA9IGByZ2JhKDAgLDAsIDAsICR7IHZhbHVlIC8gMjAgfSlgO1xuXHRjb25zdCBib3hTaGFkb3cgPSBgMCAkeyB2YWx1ZSB9cHggJHsgdmFsdWUgKiAyIH1weCAwXG5cdCR7IGJveFNoYWRvd0NvbG9yIH1gO1xuXG5cdHJldHVybiBib3hTaGFkb3c7XG59XG5cbi8qKlxuICogQHBhcmFtIHtpbXBvcnQoJy4uL3VpL2NvbnRleHQnKS5Xb3JkUHJlc3NDb21wb25lbnRQcm9wczxpbXBvcnQoJy4vdHlwZXMnKS5Qcm9wcywgJ2Rpdic+fSBwcm9wc1xuICovXG5leHBvcnQgZnVuY3Rpb24gdXNlRWxldmF0aW9uKCBwcm9wcyApIHtcblx0Y29uc3Qge1xuXHRcdGFjdGl2ZSxcblx0XHRib3JkZXJSYWRpdXMgPSAnaW5oZXJpdCcsXG5cdFx0Y2xhc3NOYW1lLFxuXHRcdGZvY3VzLFxuXHRcdGhvdmVyLFxuXHRcdGlzSW50ZXJhY3RpdmUgPSBmYWxzZSxcblx0XHRvZmZzZXQgPSAwLFxuXHRcdHZhbHVlID0gMCxcblx0XHQuLi5vdGhlclByb3BzXG5cdH0gPSB1c2VDb250ZXh0U3lzdGVtKCBwcm9wcywgJ0VsZXZhdGlvbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgaG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHZhbHVlICogMjtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgYWN0aXZlVmFsdWUgPSAhIGlzTmlsKCBhY3RpdmUgKSA/IGFjdGl2ZSA6IHZhbHVlIC8gMjtcblxuXHRcdGlmICggISBpc0ludGVyYWN0aXZlICkge1xuXHRcdFx0aG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gISBpc05pbCggYWN0aXZlICkgPyBhY3RpdmUgOiB1bmRlZmluZWQ7XG5cdFx0fVxuXG5cdFx0Y29uc3QgdHJhbnNpdGlvbiA9IGBib3gtc2hhZG93ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb24gfSAkeyBDT05GSUcudHJhbnNpdGlvblRpbWluZ0Z1bmN0aW9uIH1gO1xuXG5cdFx0Y29uc3Qgc3ggPSB7fTtcblxuXHRcdHN4LkJhc2UgPSBjc3MoXG5cdFx0XHR7XG5cdFx0XHRcdGJvcmRlclJhZGl1cyxcblx0XHRcdFx0Ym90dG9tOiBvZmZzZXQsXG5cdFx0XHRcdGJveFNoYWRvdzogZ2V0Qm94U2hhZG93KCB2YWx1ZSApLFxuXHRcdFx0XHRvcGFjaXR5OiBDT05GSUcuZWxldmF0aW9uSW50ZW5zaXR5LFxuXHRcdFx0XHRsZWZ0OiBvZmZzZXQsXG5cdFx0XHRcdHJpZ2h0OiBvZmZzZXQsXG5cdFx0XHRcdHRvcDogb2Zmc2V0LFxuXHRcdFx0XHR0cmFuc2l0aW9uLFxuXHRcdFx0fSxcblx0XHRcdHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nIClcblx0XHQpO1xuXG5cdFx0aWYgKCAhIGlzTmlsKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCAhIGlzTmlsKCBhY3RpdmVWYWx1ZSApICkge1xuXHRcdFx0c3guYWN0aXZlID0gY3NzYFxuXHRcdFx0XHQqOmFjdGl2ZSA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggYWN0aXZlVmFsdWUgKSB9O1xuXHRcdFx0XHR9XG5cdFx0XHRgO1xuXHRcdH1cblxuXHRcdGlmICggISBpc05pbCggZm9jdXMgKSApIHtcblx0XHRcdHN4LmZvY3VzID0gY3NzYFxuXHRcdFx0XHQqOmZvY3VzID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBmb2N1cyApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0cmV0dXJuIGN4KFxuXHRcdFx0c3R5bGVzLkVsZXZhdGlvbixcblx0XHRcdHN4LkJhc2UsXG5cdFx0XHRzeC5ob3ZlciAmJiBzeC5ob3Zlcixcblx0XHRcdHN4LmZvY3VzICYmIHN4LmZvY3VzLFxuXHRcdFx0c3guYWN0aXZlICYmIHN4LmFjdGl2ZSxcblx0XHRcdGNsYXNzTmFtZVxuXHRcdCk7XG5cdH0sIFtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlLFxuXHRcdG9mZnNldCxcblx0XHR2YWx1ZSxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgJ2FyaWEtaGlkZGVuJzogdHJ1ZSB9O1xufVxuIl19 */");
+    if ((0, _values.isValueDefined)(hoverValue)) {
+      sx.hover = /*#__PURE__*/(0, _react.css)("*:hover>&{box-shadow:", getBoxShadow(hoverValue), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-hover;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0ZpQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0sIFdvcmRQcmVzc0NvbXBvbmVudFByb3BzIH0gZnJvbSAnLi4vdWkvY29udGV4dCc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi9zdHlsZXMnO1xuaW1wb3J0IHsgQ09ORklHLCByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uL3V0aWxzL2hvb2tzL3VzZS1jeCc7XG5pbXBvcnQgeyBpc1ZhbHVlRGVmaW5lZCB9IGZyb20gJy4uL3V0aWxzL3ZhbHVlcyc7XG5pbXBvcnQgdHlwZSB7IEVsZXZhdGlvblByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlOiBudW1iZXIgKSB7XG5cdGNvbnN0IGJveFNoYWRvd0NvbG9yID0gYHJnYmEoMCwgMCwgMCwgJHsgdmFsdWUgLyAyMCB9KWA7XG5cdGNvbnN0IGJveFNoYWRvdyA9IGAwICR7IHZhbHVlIH1weCAkeyB2YWx1ZSAqIDIgfXB4IDBcblx0JHsgYm94U2hhZG93Q29sb3IgfWA7XG5cblx0cmV0dXJuIGJveFNoYWRvdztcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIHVzZUVsZXZhdGlvbihcblx0cHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBFbGV2YXRpb25Qcm9wcywgJ2RpdicgPlxuKSB7XG5cdGNvbnN0IHtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzID0gJ2luaGVyaXQnLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlID0gZmFsc2UsXG5cdFx0b2Zmc2V0ID0gMCxcblx0XHR2YWx1ZSA9IDAsXG5cdFx0Li4ub3RoZXJQcm9wc1xuXHR9ID0gdXNlQ29udGV4dFN5c3RlbSggcHJvcHMsICdFbGV2YXRpb24nICk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0bGV0IGhvdmVyVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBob3ZlciApXG5cdFx0XHQ/IGhvdmVyXG5cdFx0XHQ6IHZhbHVlICogMjtcblx0XHRsZXQgYWN0aXZlVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBhY3RpdmUgKVxuXHRcdFx0PyBhY3RpdmVcblx0XHRcdDogdmFsdWUgLyAyO1xuXG5cdFx0aWYgKCAhIGlzSW50ZXJhY3RpdmUgKSB7XG5cdFx0XHRob3ZlclZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGFjdGl2ZSApID8gYWN0aXZlIDogdW5kZWZpbmVkO1xuXHRcdH1cblxuXHRcdGNvbnN0IHRyYW5zaXRpb24gPSBgYm94LXNoYWRvdyAkeyBDT05GSUcudHJhbnNpdGlvbkR1cmF0aW9uIH0gJHsgQ09ORklHLnRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbiB9YDtcblxuXHRcdGNvbnN0IHN4OiB7XG5cdFx0XHRCYXNlPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGhvdmVyPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGFjdGl2ZT86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0XHRmb2N1cz86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0fSA9IHt9O1xuXG5cdFx0c3guQmFzZSA9IGNzcyhcblx0XHRcdHtcblx0XHRcdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdFx0XHRib3R0b206IG9mZnNldCxcblx0XHRcdFx0Ym94U2hhZG93OiBnZXRCb3hTaGFkb3coIHZhbHVlICksXG5cdFx0XHRcdG9wYWNpdHk6IENPTkZJRy5lbGV2YXRpb25JbnRlbnNpdHksXG5cdFx0XHRcdGxlZnQ6IG9mZnNldCxcblx0XHRcdFx0cmlnaHQ6IG9mZnNldCxcblx0XHRcdFx0dG9wOiBvZmZzZXQsXG5cdFx0XHRcdHRyYW5zaXRpb24sXG5cdFx0XHR9LFxuXHRcdFx0cmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKVxuXHRcdCk7XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCBpc1ZhbHVlRGVmaW5lZCggYWN0aXZlVmFsdWUgKSApIHtcblx0XHRcdHN4LmFjdGl2ZSA9IGNzc2Bcblx0XHRcdFx0KjphY3RpdmUgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGFjdGl2ZVZhbHVlICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBmb2N1cyApICkge1xuXHRcdFx0c3guZm9jdXMgPSBjc3NgXG5cdFx0XHRcdCo6Zm9jdXMgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGZvY3VzICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRyZXR1cm4gY3goXG5cdFx0XHRzdHlsZXMuRWxldmF0aW9uLFxuXHRcdFx0c3guQmFzZSxcblx0XHRcdHN4LmhvdmVyLFxuXHRcdFx0c3guZm9jdXMsXG5cdFx0XHRzeC5hY3RpdmUsXG5cdFx0XHRjbGFzc05hbWVcblx0XHQpO1xuXHR9LCBbXG5cdFx0YWN0aXZlLFxuXHRcdGJvcmRlclJhZGl1cyxcblx0XHRjbGFzc05hbWUsXG5cdFx0Y3gsXG5cdFx0Zm9jdXMsXG5cdFx0aG92ZXIsXG5cdFx0aXNJbnRlcmFjdGl2ZSxcblx0XHRvZmZzZXQsXG5cdFx0dmFsdWUsXG5cdF0gKTtcblxuXHRyZXR1cm4geyAuLi5vdGhlclByb3BzLCBjbGFzc05hbWU6IGNsYXNzZXMsICdhcmlhLWhpZGRlbic6IHRydWUgfTtcbn1cbiJdfQ== */");
     }
 
-    if (!(0, _lodash.isNil)(activeValue)) {
-      sx.active = /*#__PURE__*/(0, _react.css)("*:active>&{box-shadow:", getBoxShadow(activeValue), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-active;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2suanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUZrQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgaXNOaWwgfSBmcm9tICdsb2Rhc2gnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0gfSBmcm9tICcuLi91aS9jb250ZXh0JztcbmltcG9ydCAqIGFzIHN0eWxlcyBmcm9tICcuL3N0eWxlcyc7XG5pbXBvcnQgeyBDT05GSUcsIHJlZHVjZU1vdGlvbiB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcblxuLyoqXG4gKiBAcGFyYW0ge251bWJlcn0gdmFsdWVcbiAqIEByZXR1cm4ge3N0cmluZ30gVGhlIGJveCBzaGFkb3cgdmFsdWUuXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlICkge1xuXHRjb25zdCBib3hTaGFkb3dDb2xvciA9IGByZ2JhKDAgLDAsIDAsICR7IHZhbHVlIC8gMjAgfSlgO1xuXHRjb25zdCBib3hTaGFkb3cgPSBgMCAkeyB2YWx1ZSB9cHggJHsgdmFsdWUgKiAyIH1weCAwXG5cdCR7IGJveFNoYWRvd0NvbG9yIH1gO1xuXG5cdHJldHVybiBib3hTaGFkb3c7XG59XG5cbi8qKlxuICogQHBhcmFtIHtpbXBvcnQoJy4uL3VpL2NvbnRleHQnKS5Xb3JkUHJlc3NDb21wb25lbnRQcm9wczxpbXBvcnQoJy4vdHlwZXMnKS5Qcm9wcywgJ2Rpdic+fSBwcm9wc1xuICovXG5leHBvcnQgZnVuY3Rpb24gdXNlRWxldmF0aW9uKCBwcm9wcyApIHtcblx0Y29uc3Qge1xuXHRcdGFjdGl2ZSxcblx0XHRib3JkZXJSYWRpdXMgPSAnaW5oZXJpdCcsXG5cdFx0Y2xhc3NOYW1lLFxuXHRcdGZvY3VzLFxuXHRcdGhvdmVyLFxuXHRcdGlzSW50ZXJhY3RpdmUgPSBmYWxzZSxcblx0XHRvZmZzZXQgPSAwLFxuXHRcdHZhbHVlID0gMCxcblx0XHQuLi5vdGhlclByb3BzXG5cdH0gPSB1c2VDb250ZXh0U3lzdGVtKCBwcm9wcywgJ0VsZXZhdGlvbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgaG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHZhbHVlICogMjtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgYWN0aXZlVmFsdWUgPSAhIGlzTmlsKCBhY3RpdmUgKSA/IGFjdGl2ZSA6IHZhbHVlIC8gMjtcblxuXHRcdGlmICggISBpc0ludGVyYWN0aXZlICkge1xuXHRcdFx0aG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gISBpc05pbCggYWN0aXZlICkgPyBhY3RpdmUgOiB1bmRlZmluZWQ7XG5cdFx0fVxuXG5cdFx0Y29uc3QgdHJhbnNpdGlvbiA9IGBib3gtc2hhZG93ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb24gfSAkeyBDT05GSUcudHJhbnNpdGlvblRpbWluZ0Z1bmN0aW9uIH1gO1xuXG5cdFx0Y29uc3Qgc3ggPSB7fTtcblxuXHRcdHN4LkJhc2UgPSBjc3MoXG5cdFx0XHR7XG5cdFx0XHRcdGJvcmRlclJhZGl1cyxcblx0XHRcdFx0Ym90dG9tOiBvZmZzZXQsXG5cdFx0XHRcdGJveFNoYWRvdzogZ2V0Qm94U2hhZG93KCB2YWx1ZSApLFxuXHRcdFx0XHRvcGFjaXR5OiBDT05GSUcuZWxldmF0aW9uSW50ZW5zaXR5LFxuXHRcdFx0XHRsZWZ0OiBvZmZzZXQsXG5cdFx0XHRcdHJpZ2h0OiBvZmZzZXQsXG5cdFx0XHRcdHRvcDogb2Zmc2V0LFxuXHRcdFx0XHR0cmFuc2l0aW9uLFxuXHRcdFx0fSxcblx0XHRcdHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nIClcblx0XHQpO1xuXG5cdFx0aWYgKCAhIGlzTmlsKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCAhIGlzTmlsKCBhY3RpdmVWYWx1ZSApICkge1xuXHRcdFx0c3guYWN0aXZlID0gY3NzYFxuXHRcdFx0XHQqOmFjdGl2ZSA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggYWN0aXZlVmFsdWUgKSB9O1xuXHRcdFx0XHR9XG5cdFx0XHRgO1xuXHRcdH1cblxuXHRcdGlmICggISBpc05pbCggZm9jdXMgKSApIHtcblx0XHRcdHN4LmZvY3VzID0gY3NzYFxuXHRcdFx0XHQqOmZvY3VzID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBmb2N1cyApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0cmV0dXJuIGN4KFxuXHRcdFx0c3R5bGVzLkVsZXZhdGlvbixcblx0XHRcdHN4LkJhc2UsXG5cdFx0XHRzeC5ob3ZlciAmJiBzeC5ob3Zlcixcblx0XHRcdHN4LmZvY3VzICYmIHN4LmZvY3VzLFxuXHRcdFx0c3guYWN0aXZlICYmIHN4LmFjdGl2ZSxcblx0XHRcdGNsYXNzTmFtZVxuXHRcdCk7XG5cdH0sIFtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlLFxuXHRcdG9mZnNldCxcblx0XHR2YWx1ZSxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgJ2FyaWEtaGlkZGVuJzogdHJ1ZSB9O1xufVxuIl19 */");
+    if ((0, _values.isValueDefined)(activeValue)) {
+      sx.active = /*#__PURE__*/(0, _react.css)("*:active>&{box-shadow:", getBoxShadow(activeValue), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-active;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMEZrQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0sIFdvcmRQcmVzc0NvbXBvbmVudFByb3BzIH0gZnJvbSAnLi4vdWkvY29udGV4dCc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi9zdHlsZXMnO1xuaW1wb3J0IHsgQ09ORklHLCByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uL3V0aWxzL2hvb2tzL3VzZS1jeCc7XG5pbXBvcnQgeyBpc1ZhbHVlRGVmaW5lZCB9IGZyb20gJy4uL3V0aWxzL3ZhbHVlcyc7XG5pbXBvcnQgdHlwZSB7IEVsZXZhdGlvblByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlOiBudW1iZXIgKSB7XG5cdGNvbnN0IGJveFNoYWRvd0NvbG9yID0gYHJnYmEoMCwgMCwgMCwgJHsgdmFsdWUgLyAyMCB9KWA7XG5cdGNvbnN0IGJveFNoYWRvdyA9IGAwICR7IHZhbHVlIH1weCAkeyB2YWx1ZSAqIDIgfXB4IDBcblx0JHsgYm94U2hhZG93Q29sb3IgfWA7XG5cblx0cmV0dXJuIGJveFNoYWRvdztcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIHVzZUVsZXZhdGlvbihcblx0cHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBFbGV2YXRpb25Qcm9wcywgJ2RpdicgPlxuKSB7XG5cdGNvbnN0IHtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzID0gJ2luaGVyaXQnLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlID0gZmFsc2UsXG5cdFx0b2Zmc2V0ID0gMCxcblx0XHR2YWx1ZSA9IDAsXG5cdFx0Li4ub3RoZXJQcm9wc1xuXHR9ID0gdXNlQ29udGV4dFN5c3RlbSggcHJvcHMsICdFbGV2YXRpb24nICk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0bGV0IGhvdmVyVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBob3ZlciApXG5cdFx0XHQ/IGhvdmVyXG5cdFx0XHQ6IHZhbHVlICogMjtcblx0XHRsZXQgYWN0aXZlVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBhY3RpdmUgKVxuXHRcdFx0PyBhY3RpdmVcblx0XHRcdDogdmFsdWUgLyAyO1xuXG5cdFx0aWYgKCAhIGlzSW50ZXJhY3RpdmUgKSB7XG5cdFx0XHRob3ZlclZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGFjdGl2ZSApID8gYWN0aXZlIDogdW5kZWZpbmVkO1xuXHRcdH1cblxuXHRcdGNvbnN0IHRyYW5zaXRpb24gPSBgYm94LXNoYWRvdyAkeyBDT05GSUcudHJhbnNpdGlvbkR1cmF0aW9uIH0gJHsgQ09ORklHLnRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbiB9YDtcblxuXHRcdGNvbnN0IHN4OiB7XG5cdFx0XHRCYXNlPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGhvdmVyPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGFjdGl2ZT86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0XHRmb2N1cz86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0fSA9IHt9O1xuXG5cdFx0c3guQmFzZSA9IGNzcyhcblx0XHRcdHtcblx0XHRcdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdFx0XHRib3R0b206IG9mZnNldCxcblx0XHRcdFx0Ym94U2hhZG93OiBnZXRCb3hTaGFkb3coIHZhbHVlICksXG5cdFx0XHRcdG9wYWNpdHk6IENPTkZJRy5lbGV2YXRpb25JbnRlbnNpdHksXG5cdFx0XHRcdGxlZnQ6IG9mZnNldCxcblx0XHRcdFx0cmlnaHQ6IG9mZnNldCxcblx0XHRcdFx0dG9wOiBvZmZzZXQsXG5cdFx0XHRcdHRyYW5zaXRpb24sXG5cdFx0XHR9LFxuXHRcdFx0cmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKVxuXHRcdCk7XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCBpc1ZhbHVlRGVmaW5lZCggYWN0aXZlVmFsdWUgKSApIHtcblx0XHRcdHN4LmFjdGl2ZSA9IGNzc2Bcblx0XHRcdFx0KjphY3RpdmUgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGFjdGl2ZVZhbHVlICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBmb2N1cyApICkge1xuXHRcdFx0c3guZm9jdXMgPSBjc3NgXG5cdFx0XHRcdCo6Zm9jdXMgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGZvY3VzICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRyZXR1cm4gY3goXG5cdFx0XHRzdHlsZXMuRWxldmF0aW9uLFxuXHRcdFx0c3guQmFzZSxcblx0XHRcdHN4LmhvdmVyLFxuXHRcdFx0c3guZm9jdXMsXG5cdFx0XHRzeC5hY3RpdmUsXG5cdFx0XHRjbGFzc05hbWVcblx0XHQpO1xuXHR9LCBbXG5cdFx0YWN0aXZlLFxuXHRcdGJvcmRlclJhZGl1cyxcblx0XHRjbGFzc05hbWUsXG5cdFx0Y3gsXG5cdFx0Zm9jdXMsXG5cdFx0aG92ZXIsXG5cdFx0aXNJbnRlcmFjdGl2ZSxcblx0XHRvZmZzZXQsXG5cdFx0dmFsdWUsXG5cdF0gKTtcblxuXHRyZXR1cm4geyAuLi5vdGhlclByb3BzLCBjbGFzc05hbWU6IGNsYXNzZXMsICdhcmlhLWhpZGRlbic6IHRydWUgfTtcbn1cbiJdfQ== */");
     }
 
-    if (!(0, _lodash.isNil)(focus)) {
-      sx.focus = /*#__PURE__*/(0, _react.css)("*:focus>&{box-shadow:", getBoxShadow(focus), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-focus;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2suanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK0ZpQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgaXNOaWwgfSBmcm9tICdsb2Rhc2gnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0gfSBmcm9tICcuLi91aS9jb250ZXh0JztcbmltcG9ydCAqIGFzIHN0eWxlcyBmcm9tICcuL3N0eWxlcyc7XG5pbXBvcnQgeyBDT05GSUcsIHJlZHVjZU1vdGlvbiB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcblxuLyoqXG4gKiBAcGFyYW0ge251bWJlcn0gdmFsdWVcbiAqIEByZXR1cm4ge3N0cmluZ30gVGhlIGJveCBzaGFkb3cgdmFsdWUuXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlICkge1xuXHRjb25zdCBib3hTaGFkb3dDb2xvciA9IGByZ2JhKDAgLDAsIDAsICR7IHZhbHVlIC8gMjAgfSlgO1xuXHRjb25zdCBib3hTaGFkb3cgPSBgMCAkeyB2YWx1ZSB9cHggJHsgdmFsdWUgKiAyIH1weCAwXG5cdCR7IGJveFNoYWRvd0NvbG9yIH1gO1xuXG5cdHJldHVybiBib3hTaGFkb3c7XG59XG5cbi8qKlxuICogQHBhcmFtIHtpbXBvcnQoJy4uL3VpL2NvbnRleHQnKS5Xb3JkUHJlc3NDb21wb25lbnRQcm9wczxpbXBvcnQoJy4vdHlwZXMnKS5Qcm9wcywgJ2Rpdic+fSBwcm9wc1xuICovXG5leHBvcnQgZnVuY3Rpb24gdXNlRWxldmF0aW9uKCBwcm9wcyApIHtcblx0Y29uc3Qge1xuXHRcdGFjdGl2ZSxcblx0XHRib3JkZXJSYWRpdXMgPSAnaW5oZXJpdCcsXG5cdFx0Y2xhc3NOYW1lLFxuXHRcdGZvY3VzLFxuXHRcdGhvdmVyLFxuXHRcdGlzSW50ZXJhY3RpdmUgPSBmYWxzZSxcblx0XHRvZmZzZXQgPSAwLFxuXHRcdHZhbHVlID0gMCxcblx0XHQuLi5vdGhlclByb3BzXG5cdH0gPSB1c2VDb250ZXh0U3lzdGVtKCBwcm9wcywgJ0VsZXZhdGlvbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgaG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHZhbHVlICogMjtcblx0XHQvKiogQHR5cGUge251bWJlciB8IHVuZGVmaW5lZH0gKi9cblx0XHRsZXQgYWN0aXZlVmFsdWUgPSAhIGlzTmlsKCBhY3RpdmUgKSA/IGFjdGl2ZSA6IHZhbHVlIC8gMjtcblxuXHRcdGlmICggISBpc0ludGVyYWN0aXZlICkge1xuXHRcdFx0aG92ZXJWYWx1ZSA9ICEgaXNOaWwoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gISBpc05pbCggYWN0aXZlICkgPyBhY3RpdmUgOiB1bmRlZmluZWQ7XG5cdFx0fVxuXG5cdFx0Y29uc3QgdHJhbnNpdGlvbiA9IGBib3gtc2hhZG93ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb24gfSAkeyBDT05GSUcudHJhbnNpdGlvblRpbWluZ0Z1bmN0aW9uIH1gO1xuXG5cdFx0Y29uc3Qgc3ggPSB7fTtcblxuXHRcdHN4LkJhc2UgPSBjc3MoXG5cdFx0XHR7XG5cdFx0XHRcdGJvcmRlclJhZGl1cyxcblx0XHRcdFx0Ym90dG9tOiBvZmZzZXQsXG5cdFx0XHRcdGJveFNoYWRvdzogZ2V0Qm94U2hhZG93KCB2YWx1ZSApLFxuXHRcdFx0XHRvcGFjaXR5OiBDT05GSUcuZWxldmF0aW9uSW50ZW5zaXR5LFxuXHRcdFx0XHRsZWZ0OiBvZmZzZXQsXG5cdFx0XHRcdHJpZ2h0OiBvZmZzZXQsXG5cdFx0XHRcdHRvcDogb2Zmc2V0LFxuXHRcdFx0XHR0cmFuc2l0aW9uLFxuXHRcdFx0fSxcblx0XHRcdHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nIClcblx0XHQpO1xuXG5cdFx0aWYgKCAhIGlzTmlsKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCAhIGlzTmlsKCBhY3RpdmVWYWx1ZSApICkge1xuXHRcdFx0c3guYWN0aXZlID0gY3NzYFxuXHRcdFx0XHQqOmFjdGl2ZSA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggYWN0aXZlVmFsdWUgKSB9O1xuXHRcdFx0XHR9XG5cdFx0XHRgO1xuXHRcdH1cblxuXHRcdGlmICggISBpc05pbCggZm9jdXMgKSApIHtcblx0XHRcdHN4LmZvY3VzID0gY3NzYFxuXHRcdFx0XHQqOmZvY3VzID4gJiB7XG5cdFx0XHRcdFx0Ym94LXNoYWRvdzogJHsgZ2V0Qm94U2hhZG93KCBmb2N1cyApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0cmV0dXJuIGN4KFxuXHRcdFx0c3R5bGVzLkVsZXZhdGlvbixcblx0XHRcdHN4LkJhc2UsXG5cdFx0XHRzeC5ob3ZlciAmJiBzeC5ob3Zlcixcblx0XHRcdHN4LmZvY3VzICYmIHN4LmZvY3VzLFxuXHRcdFx0c3guYWN0aXZlICYmIHN4LmFjdGl2ZSxcblx0XHRcdGNsYXNzTmFtZVxuXHRcdCk7XG5cdH0sIFtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlLFxuXHRcdG9mZnNldCxcblx0XHR2YWx1ZSxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgJ2FyaWEtaGlkZGVuJzogdHJ1ZSB9O1xufVxuIl19 */");
+    if ((0, _values.isValueDefined)(focus)) {
+      sx.focus = /*#__PURE__*/(0, _react.css)("*:focus>&{box-shadow:", getBoxShadow(focus), ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:sx-focus;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZWxldmF0aW9uL2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0dpQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2VsZXZhdGlvbi9ob29rLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0sIFdvcmRQcmVzc0NvbXBvbmVudFByb3BzIH0gZnJvbSAnLi4vdWkvY29udGV4dCc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi9zdHlsZXMnO1xuaW1wb3J0IHsgQ09ORklHLCByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi91dGlscyc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uL3V0aWxzL2hvb2tzL3VzZS1jeCc7XG5pbXBvcnQgeyBpc1ZhbHVlRGVmaW5lZCB9IGZyb20gJy4uL3V0aWxzL3ZhbHVlcyc7XG5pbXBvcnQgdHlwZSB7IEVsZXZhdGlvblByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmV4cG9ydCBmdW5jdGlvbiBnZXRCb3hTaGFkb3coIHZhbHVlOiBudW1iZXIgKSB7XG5cdGNvbnN0IGJveFNoYWRvd0NvbG9yID0gYHJnYmEoMCwgMCwgMCwgJHsgdmFsdWUgLyAyMCB9KWA7XG5cdGNvbnN0IGJveFNoYWRvdyA9IGAwICR7IHZhbHVlIH1weCAkeyB2YWx1ZSAqIDIgfXB4IDBcblx0JHsgYm94U2hhZG93Q29sb3IgfWA7XG5cblx0cmV0dXJuIGJveFNoYWRvdztcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIHVzZUVsZXZhdGlvbihcblx0cHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBFbGV2YXRpb25Qcm9wcywgJ2RpdicgPlxuKSB7XG5cdGNvbnN0IHtcblx0XHRhY3RpdmUsXG5cdFx0Ym9yZGVyUmFkaXVzID0gJ2luaGVyaXQnLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRmb2N1cyxcblx0XHRob3Zlcixcblx0XHRpc0ludGVyYWN0aXZlID0gZmFsc2UsXG5cdFx0b2Zmc2V0ID0gMCxcblx0XHR2YWx1ZSA9IDAsXG5cdFx0Li4ub3RoZXJQcm9wc1xuXHR9ID0gdXNlQ29udGV4dFN5c3RlbSggcHJvcHMsICdFbGV2YXRpb24nICk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0bGV0IGhvdmVyVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBob3ZlciApXG5cdFx0XHQ/IGhvdmVyXG5cdFx0XHQ6IHZhbHVlICogMjtcblx0XHRsZXQgYWN0aXZlVmFsdWU6IG51bWJlciB8IHVuZGVmaW5lZCA9IGlzVmFsdWVEZWZpbmVkKCBhY3RpdmUgKVxuXHRcdFx0PyBhY3RpdmVcblx0XHRcdDogdmFsdWUgLyAyO1xuXG5cdFx0aWYgKCAhIGlzSW50ZXJhY3RpdmUgKSB7XG5cdFx0XHRob3ZlclZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGhvdmVyICkgPyBob3ZlciA6IHVuZGVmaW5lZDtcblx0XHRcdGFjdGl2ZVZhbHVlID0gaXNWYWx1ZURlZmluZWQoIGFjdGl2ZSApID8gYWN0aXZlIDogdW5kZWZpbmVkO1xuXHRcdH1cblxuXHRcdGNvbnN0IHRyYW5zaXRpb24gPSBgYm94LXNoYWRvdyAkeyBDT05GSUcudHJhbnNpdGlvbkR1cmF0aW9uIH0gJHsgQ09ORklHLnRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbiB9YDtcblxuXHRcdGNvbnN0IHN4OiB7XG5cdFx0XHRCYXNlPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGhvdmVyPzogU2VyaWFsaXplZFN0eWxlcztcblx0XHRcdGFjdGl2ZT86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0XHRmb2N1cz86IFNlcmlhbGl6ZWRTdHlsZXM7XG5cdFx0fSA9IHt9O1xuXG5cdFx0c3guQmFzZSA9IGNzcyhcblx0XHRcdHtcblx0XHRcdFx0Ym9yZGVyUmFkaXVzLFxuXHRcdFx0XHRib3R0b206IG9mZnNldCxcblx0XHRcdFx0Ym94U2hhZG93OiBnZXRCb3hTaGFkb3coIHZhbHVlICksXG5cdFx0XHRcdG9wYWNpdHk6IENPTkZJRy5lbGV2YXRpb25JbnRlbnNpdHksXG5cdFx0XHRcdGxlZnQ6IG9mZnNldCxcblx0XHRcdFx0cmlnaHQ6IG9mZnNldCxcblx0XHRcdFx0dG9wOiBvZmZzZXQsXG5cdFx0XHRcdHRyYW5zaXRpb24sXG5cdFx0XHR9LFxuXHRcdFx0cmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKVxuXHRcdCk7XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBob3ZlclZhbHVlICkgKSB7XG5cdFx0XHRzeC5ob3ZlciA9IGNzc2Bcblx0XHRcdFx0Kjpob3ZlciA+ICYge1xuXHRcdFx0XHRcdGJveC1zaGFkb3c6ICR7IGdldEJveFNoYWRvdyggaG92ZXJWYWx1ZSApIH07XG5cdFx0XHRcdH1cblx0XHRcdGA7XG5cdFx0fVxuXG5cdFx0aWYgKCBpc1ZhbHVlRGVmaW5lZCggYWN0aXZlVmFsdWUgKSApIHtcblx0XHRcdHN4LmFjdGl2ZSA9IGNzc2Bcblx0XHRcdFx0KjphY3RpdmUgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGFjdGl2ZVZhbHVlICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRpZiAoIGlzVmFsdWVEZWZpbmVkKCBmb2N1cyApICkge1xuXHRcdFx0c3guZm9jdXMgPSBjc3NgXG5cdFx0XHRcdCo6Zm9jdXMgPiAmIHtcblx0XHRcdFx0XHRib3gtc2hhZG93OiAkeyBnZXRCb3hTaGFkb3coIGZvY3VzICkgfTtcblx0XHRcdFx0fVxuXHRcdFx0YDtcblx0XHR9XG5cblx0XHRyZXR1cm4gY3goXG5cdFx0XHRzdHlsZXMuRWxldmF0aW9uLFxuXHRcdFx0c3guQmFzZSxcblx0XHRcdHN4LmhvdmVyLFxuXHRcdFx0c3guZm9jdXMsXG5cdFx0XHRzeC5hY3RpdmUsXG5cdFx0XHRjbGFzc05hbWVcblx0XHQpO1xuXHR9LCBbXG5cdFx0YWN0aXZlLFxuXHRcdGJvcmRlclJhZGl1cyxcblx0XHRjbGFzc05hbWUsXG5cdFx0Y3gsXG5cdFx0Zm9jdXMsXG5cdFx0aG92ZXIsXG5cdFx0aXNJbnRlcmFjdGl2ZSxcblx0XHRvZmZzZXQsXG5cdFx0dmFsdWUsXG5cdF0gKTtcblxuXHRyZXR1cm4geyAuLi5vdGhlclByb3BzLCBjbGFzc05hbWU6IGNsYXNzZXMsICdhcmlhLWhpZGRlbic6IHRydWUgfTtcbn1cbiJdfQ== */");
     }
 
-    return cx(styles.Elevation, sx.Base, sx.hover && sx.hover, sx.focus && sx.focus, sx.active && sx.active, className);
+    return cx(styles.Elevation, sx.Base, sx.hover, sx.focus, sx.active, className);
   }, [active, borderRadius, className, cx, focus, hover, isInteractive, offset, value]);
   return { ...otherProps,
     className: classes,

package/build/elevation/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/elevation/hook.js"],"names":["getBoxShadow","value","boxShadowColor","boxShadow","useElevation","props","active","borderRadius","className","focus","hover","isInteractive","offset","otherProps","cx","classes","hoverValue","activeValue","undefined","transition","CONFIG","transitionDuration","transitionTimingFunction","sx","Base","bottom","opacity","elevationIntensity","left","right","top","css","styles","Elevation"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport { isNil } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../ui/context';\nimport * as styles from './styles';\nimport { CONFIG, reduceMotion } from '../utils';\nimport { useCx } from '../utils/hooks/use-cx';\n\n/**\n * @param {number} value\n * @return {string} The box shadow value.\n */\nexport function getBoxShadow( value ) {\n\tconst boxShadowColor = `rgba(0 ,0, 0, ${ value / 20 })`;\n\tconst boxShadow = `0 ${ value }px ${ value * 2 }px 0\n\t${ boxShadowColor }`;\n\n\treturn boxShadow;\n}\n\n/**\n * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n */\nexport function useElevation( props ) {\n\tconst {\n\t\tactive,\n\t\tborderRadius = 'inherit',\n\t\tclassName,\n\t\tfocus,\n\t\thover,\n\t\tisInteractive = false,\n\t\toffset = 0,\n\t\tvalue = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Elevation' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\t/** @type {number | undefined} */\n\t\tlet hoverValue = ! isNil( hover ) ? hover : value * 2;\n\t\t/** @type {number | undefined} */\n\t\tlet activeValue = ! isNil( active ) ? active : value / 2;\n\n\t\tif ( ! isInteractive ) {\n\t\t\thoverValue = ! isNil( hover ) ? hover : undefined;\n\t\t\tactiveValue = ! isNil( active ) ? active : undefined;\n\t\t}\n\n\t\tconst transition = `box-shadow ${ CONFIG.transitionDuration } ${ CONFIG.transitionTimingFunction }`;\n\n\t\tconst sx = {};\n\n\t\tsx.Base = css(\n\t\t\t{\n\t\t\t\tborderRadius,\n\t\t\t\tbottom: offset,\n\t\t\t\tboxShadow: getBoxShadow( value ),\n\t\t\t\topacity: CONFIG.elevationIntensity,\n\t\t\t\tleft: offset,\n\t\t\t\tright: offset,\n\t\t\t\ttop: offset,\n\t\t\t\ttransition,\n\t\t\t},\n\t\t\treduceMotion( 'transition' )\n\t\t);\n\n\t\tif ( ! isNil( hoverValue ) ) {\n\t\t\tsx.hover = css`\n\t\t\t\t*:hover > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( hoverValue ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\tif ( ! isNil( activeValue ) ) {\n\t\t\tsx.active = css`\n\t\t\t\t*:active > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( activeValue ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\tif ( ! isNil( focus ) ) {\n\t\t\tsx.focus = css`\n\t\t\t\t*:focus > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( focus ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\treturn cx(\n\t\t\tstyles.Elevation,\n\t\t\tsx.Base,\n\t\t\tsx.hover && sx.hover,\n\t\t\tsx.focus && sx.focus,\n\t\t\tsx.active && sx.active,\n\t\t\tclassName\n\t\t);\n\t}, [\n\t\tactive,\n\t\tborderRadius,\n\t\tclassName,\n\t\tcx,\n\t\tfocus,\n\t\thover,\n\t\tisInteractive,\n\t\toffset,\n\t\tvalue,\n\t] );\n\n\treturn { ...otherProps, className: classes, 'aria-hidden': true };\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/elevation/hook.ts"],"names":["getBoxShadow","value","boxShadowColor","boxShadow","useElevation","props","active","borderRadius","className","focus","hover","isInteractive","offset","otherProps","cx","classes","hoverValue","activeValue","undefined","transition","CONFIG","transitionDuration","transitionTimingFunction","sx","Base","bottom","opacity","elevationIntensity","left","right","top","css","styles","Elevation"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { css, SerializedStyles } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../ui/context';\nimport * as styles from './styles';\nimport { CONFIG, reduceMotion } from '../utils';\nimport { useCx } from '../utils/hooks/use-cx';\nimport { isValueDefined } from '../utils/values';\nimport type { ElevationProps } from './types';\n\nexport function getBoxShadow( value: number ) {\n\tconst boxShadowColor = `rgba(0, 0, 0, ${ value / 20 })`;\n\tconst boxShadow = `0 ${ value }px ${ value * 2 }px 0\n\t${ boxShadowColor }`;\n\n\treturn boxShadow;\n}\n\nexport function useElevation(\n\tprops: WordPressComponentProps< ElevationProps, 'div' >\n) {\n\tconst {\n\t\tactive,\n\t\tborderRadius = 'inherit',\n\t\tclassName,\n\t\tfocus,\n\t\thover,\n\t\tisInteractive = false,\n\t\toffset = 0,\n\t\tvalue = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Elevation' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\tlet hoverValue: number | undefined = isValueDefined( hover )\n\t\t\t? hover\n\t\t\t: value * 2;\n\t\tlet activeValue: number | undefined = isValueDefined( active )\n\t\t\t? active\n\t\t\t: value / 2;\n\n\t\tif ( ! isInteractive ) {\n\t\t\thoverValue = isValueDefined( hover ) ? hover : undefined;\n\t\t\tactiveValue = isValueDefined( active ) ? active : undefined;\n\t\t}\n\n\t\tconst transition = `box-shadow ${ CONFIG.transitionDuration } ${ CONFIG.transitionTimingFunction }`;\n\n\t\tconst sx: {\n\t\t\tBase?: SerializedStyles;\n\t\t\thover?: SerializedStyles;\n\t\t\tactive?: SerializedStyles;\n\t\t\tfocus?: SerializedStyles;\n\t\t} = {};\n\n\t\tsx.Base = css(\n\t\t\t{\n\t\t\t\tborderRadius,\n\t\t\t\tbottom: offset,\n\t\t\t\tboxShadow: getBoxShadow( value ),\n\t\t\t\topacity: CONFIG.elevationIntensity,\n\t\t\t\tleft: offset,\n\t\t\t\tright: offset,\n\t\t\t\ttop: offset,\n\t\t\t\ttransition,\n\t\t\t},\n\t\t\treduceMotion( 'transition' )\n\t\t);\n\n\t\tif ( isValueDefined( hoverValue ) ) {\n\t\t\tsx.hover = css`\n\t\t\t\t*:hover > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( hoverValue ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\tif ( isValueDefined( activeValue ) ) {\n\t\t\tsx.active = css`\n\t\t\t\t*:active > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( activeValue ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\tif ( isValueDefined( focus ) ) {\n\t\t\tsx.focus = css`\n\t\t\t\t*:focus > & {\n\t\t\t\t\tbox-shadow: ${ getBoxShadow( focus ) };\n\t\t\t\t}\n\t\t\t`;\n\t\t}\n\n\t\treturn cx(\n\t\t\tstyles.Elevation,\n\t\t\tsx.Base,\n\t\t\tsx.hover,\n\t\t\tsx.focus,\n\t\t\tsx.active,\n\t\t\tclassName\n\t\t);\n\t}, [\n\t\tactive,\n\t\tborderRadius,\n\t\tclassName,\n\t\tcx,\n\t\tfocus,\n\t\thover,\n\t\tisInteractive,\n\t\toffset,\n\t\tvalue,\n\t] );\n\n\treturn { ...otherProps, className: classes, 'aria-hidden': true };\n}\n"]}

package/build/elevation/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/elevation/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export { default as Elevation } from './component';\nexport * from './hook';\n"]}
+{"version":3,"sources":["@wordpress/components/src/elevation/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export { default as Elevation } from './component';\nexport * from './hook';\n"]}