@wordpress/components 24.0.0 → 25.1.0

package/build/drop-zone/index.js

@@ -59,24 +59,21 @@ var _animation = require("../animation");
  * }
  * ```
  */
-function DropZoneComponent(_ref) {
-  let {
-    className,
-    label,
-    onFilesDrop,
-    onHTMLDrop,
-    onDrop,
-    ...restProps
-  } = _ref;
+function DropZoneComponent({
+  className,
+  label,
+  onFilesDrop,
+  onHTMLDrop,
+  onDrop,
+  ...restProps
+}) {
   const [isDraggingOverDocument, setIsDraggingOverDocument] = (0, _element.useState)();
   const [isDraggingOverElement, setIsDraggingOverElement] = (0, _element.useState)();
   const [type, setType] = (0, _element.useState)();
   const ref = (0, _compose.__experimentalUseDropZone)({
     onDrop(event) {
-      var _event$dataTransfer;
-
       const files = event.dataTransfer ? (0, _dom.getFilesFromDataTransfer)(event.dataTransfer) : [];
-      const html = (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.getData('text/html');
+      const html = event.dataTransfer?.getData('text/html');
       /**
        * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
        * The order of the checks is important to recognise the HTML drop.
@@ -92,8 +89,6 @@ function DropZoneComponent(_ref) {
     },
 
     onDragStart(event) {
-      var _event$dataTransfer2, _event$dataTransfer3;
-
       setIsDraggingOverDocument(true);
       let _type = 'default';
       /**
@@ -101,11 +96,11 @@ function DropZoneComponent(_ref) {
        * The order of the checks is important to recognise the HTML drop.
        */
 
-      if ((_event$dataTransfer2 = event.dataTransfer) !== null && _event$dataTransfer2 !== void 0 && _event$dataTransfer2.types.includes('text/html')) {
+      if (event.dataTransfer?.types.includes('text/html')) {
         _type = 'html';
       } else if ( // Check for the types because sometimes the files themselves
       // are only available on drop.
-      (_event$dataTransfer3 = event.dataTransfer) !== null && _event$dataTransfer3 !== void 0 && _event$dataTransfer3.types.includes('Files') || (event.dataTransfer ? (0, _dom.getFilesFromDataTransfer)(event.dataTransfer) : []).length > 0) {
+      event.dataTransfer?.types.includes('Files') || (event.dataTransfer ? (0, _dom.getFilesFromDataTransfer)(event.dataTransfer) : []).length > 0) {
         _type = 'file';
       }
 

package/build/drop-zone/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/drop-zone/index.tsx"],"names":["DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","restProps","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","undefined","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","pointerEvents","upload","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { DropType, DropZoneProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\n/**\n * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.\n *\n * ```jsx\n * import { DropZone } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDropZone = () => {\n *   const [ hasDropped, setHasDropped ] = useState( false );\n *\n *   return (\n *     <div>\n *       { hasDropped ? 'Dropped!' : 'Drop something here' }\n *       <DropZone\n *         onFilesDrop={ () => setHasDropped( true ) }\n *         onHTMLDrop={ () => setHasDropped( true ) }\n *         onDrop={ () => setHasDropped( true ) }\n *       />\n *     </div>\n *   );\n * }\n * ```\n */\nexport function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n\t...restProps\n}: WordPressComponentProps< DropZoneProps, 'div', false > ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] =\n\t\tuseState< boolean >();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] =\n\t\tuseState< boolean >();\n\tconst [ type, setType ] = useState< DropType >();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = event.dataTransfer\n\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t: [];\n\t\t\tconst html = event.dataTransfer?.getData( 'text/html' );\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type: DropType = 'default';\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer?.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer?.types.includes( 'Files' ) ||\n\t\t\t\t( event.dataTransfer\n\t\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t\t: []\n\t\t\t\t).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType( undefined );\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\tconst backdrop = {\n\t\thidden: { opacity: 0 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0,\n\t\t\t\tdelayChildren: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.9 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t\t// Without this, when this div is shown,\n\t\t\t\t// Safari calls a onDropZoneLeave causing a loop because of this bug\n\t\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\t\tstyle={ { pointerEvents: 'none' } }\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div { ...restProps } ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default DropZoneComponent;\n"]}
+{"version":3,"sources":["@wordpress/components/src/drop-zone/index.tsx"],"names":["DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","restProps","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","undefined","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","pointerEvents","upload","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { DropType, DropZoneProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\n/**\n * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.\n *\n * ```jsx\n * import { DropZone } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDropZone = () => {\n *   const [ hasDropped, setHasDropped ] = useState( false );\n *\n *   return (\n *     <div>\n *       { hasDropped ? 'Dropped!' : 'Drop something here' }\n *       <DropZone\n *         onFilesDrop={ () => setHasDropped( true ) }\n *         onHTMLDrop={ () => setHasDropped( true ) }\n *         onDrop={ () => setHasDropped( true ) }\n *       />\n *     </div>\n *   );\n * }\n * ```\n */\nexport function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n\t...restProps\n}: WordPressComponentProps< DropZoneProps, 'div', false > ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] =\n\t\tuseState< boolean >();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] =\n\t\tuseState< boolean >();\n\tconst [ type, setType ] = useState< DropType >();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = event.dataTransfer\n\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t: [];\n\t\t\tconst html = event.dataTransfer?.getData( 'text/html' );\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type: DropType = 'default';\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer?.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer?.types.includes( 'Files' ) ||\n\t\t\t\t( event.dataTransfer\n\t\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t\t: []\n\t\t\t\t).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType( undefined );\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\tconst backdrop = {\n\t\thidden: { opacity: 0 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0,\n\t\t\t\tdelayChildren: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.9 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t\t// Without this, when this div is shown,\n\t\t\t\t// Safari calls a onDropZoneLeave causing a loop because of this bug\n\t\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\t\tstyle={ { pointerEvents: 'none' } }\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div { ...restProps } ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default DropZoneComponent;\n"]}

package/build/drop-zone/provider.js

@@ -12,10 +12,9 @@ var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
 /**
  * WordPress dependencies
  */
-function DropZoneProvider(_ref) {
-  let {
-    children
-  } = _ref;
+function DropZoneProvider({
+  children
+}) {
   (0, _deprecated.default)('wp.components.DropZoneProvider', {
     since: '5.8',
     hint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.'

package/build/drop-zone/provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/drop-zone/provider.ts"],"names":["DropZoneProvider","children","since","hint"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,gBAAT,OAIX;AAAA,MAJsC;AACzCC,IAAAA;AADyC,GAItC;AACH,2BAAY,gCAAZ,EAA8C;AAC7CC,IAAAA,KAAK,EAAE,KADsC;AAE7CC,IAAAA,IAAI,EAAE;AAFuC,GAA9C;AAIA,SAAOF,QAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\n\nexport default function DropZoneProvider( {\n\tchildren,\n}: {\n\tchildren: React.ReactNode;\n} ) {\n\tdeprecated( 'wp.components.DropZoneProvider', {\n\t\tsince: '5.8',\n\t\thint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.',\n\t} );\n\treturn children;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/drop-zone/provider.ts"],"names":["DropZoneProvider","children","since","hint"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,gBAAT,CAA2B;AACzCC,EAAAA;AADyC,CAA3B,EAIX;AACH,2BAAY,gCAAZ,EAA8C;AAC7CC,IAAAA,KAAK,EAAE,KADsC;AAE7CC,IAAAA,IAAI,EAAE;AAFuC,GAA9C;AAIA,SAAOF,QAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\n\nexport default function DropZoneProvider( {\n\tchildren,\n}: {\n\tchildren: React.ReactNode;\n} ) {\n\tdeprecated( 'wp.components.DropZoneProvider', {\n\t\tsince: '5.8',\n\t\thint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.',\n\t} );\n\treturn children;\n}\n"]}

package/build/dropdown/index.js

@@ -41,23 +41,21 @@ function useObservableState(initialState, onStateChange) {
   }];
 }
 
-function UnforwardedDropdown(_ref, forwardedRef) {
-  let {
-    renderContent,
-    renderToggle,
-    className,
-    contentClassName,
-    expandOnMobile,
-    headerTitle,
-    focusOnMount,
-    popoverProps,
-    onClose,
-    onToggle,
-    style,
-    // Deprecated props
-    position
-  } = _ref;
-
+function UnforwardedDropdown({
+  renderContent,
+  renderToggle,
+  className,
+  contentClassName,
+  expandOnMobile,
+  headerTitle,
+  focusOnMount,
+  popoverProps,
+  onClose,
+  onToggle,
+  style,
+  // Deprecated props
+  position
+}, forwardedRef) {
   if (position !== undefined) {
     (0, _deprecated.default)('`position` prop in wp.components.Dropdown', {
       since: '6.2',
@@ -89,8 +87,6 @@ function UnforwardedDropdown(_ref, forwardedRef) {
 
 
   function closeIfFocusOutside() {
-    var _ownerDocument$active;
-
     if (!containerRef.current) {
       return;
     }
@@ -98,7 +94,7 @@ function UnforwardedDropdown(_ref, forwardedRef) {
     const {
       ownerDocument
     } = containerRef.current;
-    const dialog = ownerDocument === null || ownerDocument === void 0 ? void 0 : (_ownerDocument$active = ownerDocument.activeElement) === null || _ownerDocument$active === void 0 ? void 0 : _ownerDocument$active.closest('[role="dialog"]');
+    const dialog = ownerDocument?.activeElement?.closest('[role="dialog"]');
 
     if (!containerRef.current.contains(ownerDocument.activeElement) && (!dialog || dialog.contains(containerRef.current))) {
       close();
@@ -118,9 +114,9 @@ function UnforwardedDropdown(_ref, forwardedRef) {
     onToggle: toggle,
     onClose: close
   };
-  const popoverPropsHaveAnchor = !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchor) || // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and
+  const popoverPropsHaveAnchor = !!popoverProps?.anchor || // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and
   // be removed from `Popover` from WordPress 6.3
-  !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchorRef) || !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.getAnchorRect) || !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchorRect);
+  !!popoverProps?.anchorRef || !!popoverProps?.getAnchorRect || !!popoverProps?.anchorRect;
   return (0, _element.createElement)("div", {
     className: (0, _classnames.default)('components-dropdown', className),
     ref: (0, _compose.useMergeRefs)([containerRef, forwardedRef, setFallbackPopoverAnchor]) // Some UAs focus the closest focusable parent when the toggle is
@@ -141,7 +137,7 @@ function UnforwardedDropdown(_ref, forwardedRef) {
     offset: 13,
     anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined
   }, popoverProps, {
-    className: (0, _classnames.default)('components-dropdown__content', popoverProps === null || popoverProps === void 0 ? void 0 : popoverProps.className, contentClassName)
+    className: (0, _classnames.default)('components-dropdown__content', popoverProps?.className, contentClassName)
   }), renderContent(args)));
 }
 /**

package/build/dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/dropdown/index.tsx"],"names":["useObservableState","initialState","onStateChange","state","setState","value","UnforwardedDropdown","forwardedRef","renderContent","renderToggle","className","contentClassName","expandOnMobile","headerTitle","focusOnMount","popoverProps","onClose","onToggle","style","position","undefined","since","alternative","hint","fallbackPopoverAnchor","setFallbackPopoverAnchor","containerRef","isOpen","setIsOpen","toggle","closeIfFocusOutside","current","ownerDocument","dialog","activeElement","closest","contains","close","args","popoverPropsHaveAnchor","anchor","anchorRef","getAnchorRect","anchorRect","Dropdown"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useEffect, useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport type { DropdownProps } from './types';\n\nfunction useObservableState(\n\tinitialState: boolean,\n\tonStateChange?: ( newState: boolean ) => void\n) {\n\tconst [ state, setState ] = useState( initialState );\n\treturn [\n\t\tstate,\n\t\t( value: boolean ) => {\n\t\t\tsetState( value );\n\t\t\tif ( onStateChange ) {\n\t\t\t\tonStateChange( value );\n\t\t\t}\n\t\t},\n\t] as const;\n}\n\nfunction UnforwardedDropdown(\n\t{\n\t\trenderContent,\n\t\trenderToggle,\n\t\tclassName,\n\t\tcontentClassName,\n\t\texpandOnMobile,\n\t\theaderTitle,\n\t\tfocusOnMount,\n\t\tpopoverProps,\n\t\tonClose,\n\t\tonToggle,\n\t\tstyle,\n\n\t\t// Deprecated props\n\t\tposition,\n\t}: DropdownProps,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tif ( position !== undefined ) {\n\t\tdeprecated( '`position` prop in wp.components.Dropdown', {\n\t\t\tsince: '6.2',\n\t\t\talternative: '`popoverProps.placement` prop',\n\t\t\thint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.',\n\t\t} );\n\t}\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ fallbackPopoverAnchor, setFallbackPopoverAnchor ] =\n\t\tuseState< HTMLDivElement | null >( null );\n\tconst containerRef = useRef< HTMLDivElement >();\n\tconst [ isOpen, setIsOpen ] = useObservableState( false, onToggle );\n\n\tuseEffect(\n\t\t() => () => {\n\t\t\tif ( onToggle && isOpen ) {\n\t\t\t\tonToggle( false );\n\t\t\t}\n\t\t},\n\t\t[ onToggle, isOpen ]\n\t);\n\n\tfunction toggle() {\n\t\tsetIsOpen( ! isOpen );\n\t}\n\n\t/**\n\t * Closes the popover when focus leaves it unless the toggle was pressed or\n\t * focus has moved to a separate dialog. The former is to let the toggle\n\t * handle closing the popover and the latter is to preserve presence in\n\t * case a dialog has opened, allowing focus to return when it's dismissed.\n\t */\n\tfunction closeIfFocusOutside() {\n\t\tif ( ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = containerRef.current;\n\t\tconst dialog =\n\t\t\townerDocument?.activeElement?.closest( '[role=\"dialog\"]' );\n\t\tif (\n\t\t\t! containerRef.current.contains( ownerDocument.activeElement ) &&\n\t\t\t( ! dialog || dialog.contains( containerRef.current ) )\n\t\t) {\n\t\t\tclose();\n\t\t}\n\t}\n\n\tfunction close() {\n\t\tif ( onClose ) {\n\t\t\tonClose();\n\t\t}\n\t\tsetIsOpen( false );\n\t}\n\n\tconst args = { isOpen, onToggle: toggle, onClose: close };\n\tconst popoverPropsHaveAnchor =\n\t\t!! popoverProps?.anchor ||\n\t\t// Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n\t\t// be removed from `Popover` from WordPress 6.3\n\t\t!! popoverProps?.anchorRef ||\n\t\t!! popoverProps?.getAnchorRect ||\n\t\t!! popoverProps?.anchorRect;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-dropdown', className ) }\n\t\t\tref={ useMergeRefs( [\n\t\t\t\tcontainerRef,\n\t\t\t\tforwardedRef,\n\t\t\t\tsetFallbackPopoverAnchor,\n\t\t\t] ) }\n\t\t\t// Some UAs focus the closest focusable parent when the toggle is\n\t\t\t// clicked. Making this div focusable ensures such UAs will focus\n\t\t\t// it and `closeIfFocusOutside` can tell if the toggle was clicked.\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={ style }\n\t\t>\n\t\t\t{ renderToggle( args ) }\n\t\t\t{ isOpen && (\n\t\t\t\t<Popover\n\t\t\t\t\tposition={ position }\n\t\t\t\t\tonClose={ close }\n\t\t\t\t\tonFocusOutside={ closeIfFocusOutside }\n\t\t\t\t\texpandOnMobile={ expandOnMobile }\n\t\t\t\t\theaderTitle={ headerTitle }\n\t\t\t\t\tfocusOnMount={ focusOnMount }\n\t\t\t\t\t// This value is used to ensure that the dropdowns\n\t\t\t\t\t// align with the editor header by default.\n\t\t\t\t\toffset={ 13 }\n\t\t\t\t\tanchor={\n\t\t\t\t\t\t! popoverPropsHaveAnchor\n\t\t\t\t\t\t\t? fallbackPopoverAnchor\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\t{ ...popoverProps }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-dropdown__content',\n\t\t\t\t\t\tpopoverProps?.className,\n\t\t\t\t\t\tcontentClassName\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ renderContent( args ) }\n\t\t\t\t</Popover>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\n/**\n * Renders a button that opens a floating content modal when clicked.\n *\n * ```jsx\n * import { Button, Dropdown } from '@wordpress/components';\n *\n * const MyDropdown = () => (\n *   <Dropdown\n *     className=\"my-container-class-name\"\n *     contentClassName=\"my-dropdown-content-classname\"\n *     popoverProps={ { placement: 'bottom-start' } }\n *     renderToggle={ ( { isOpen, onToggle } ) => (\n *       <Button\n *         variant=\"primary\"\n *         onClick={ onToggle }\n *         aria-expanded={ isOpen }\n *       >\n *         Toggle Dropdown!\n *       </Button>\n *     ) }\n *     renderContent={ () => <div>This is the content of the dropdown.</div> }\n *   />\n * );\n * ```\n */\nexport const Dropdown = forwardRef( UnforwardedDropdown );\n\nexport default Dropdown;\n"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown/index.tsx"],"names":["useObservableState","initialState","onStateChange","state","setState","value","UnforwardedDropdown","renderContent","renderToggle","className","contentClassName","expandOnMobile","headerTitle","focusOnMount","popoverProps","onClose","onToggle","style","position","forwardedRef","undefined","since","alternative","hint","fallbackPopoverAnchor","setFallbackPopoverAnchor","containerRef","isOpen","setIsOpen","toggle","closeIfFocusOutside","current","ownerDocument","dialog","activeElement","closest","contains","close","args","popoverPropsHaveAnchor","anchor","anchorRef","getAnchorRect","anchorRect","Dropdown"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useEffect, useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport type { DropdownProps } from './types';\n\nfunction useObservableState(\n\tinitialState: boolean,\n\tonStateChange?: ( newState: boolean ) => void\n) {\n\tconst [ state, setState ] = useState( initialState );\n\treturn [\n\t\tstate,\n\t\t( value: boolean ) => {\n\t\t\tsetState( value );\n\t\t\tif ( onStateChange ) {\n\t\t\t\tonStateChange( value );\n\t\t\t}\n\t\t},\n\t] as const;\n}\n\nfunction UnforwardedDropdown(\n\t{\n\t\trenderContent,\n\t\trenderToggle,\n\t\tclassName,\n\t\tcontentClassName,\n\t\texpandOnMobile,\n\t\theaderTitle,\n\t\tfocusOnMount,\n\t\tpopoverProps,\n\t\tonClose,\n\t\tonToggle,\n\t\tstyle,\n\n\t\t// Deprecated props\n\t\tposition,\n\t}: DropdownProps,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tif ( position !== undefined ) {\n\t\tdeprecated( '`position` prop in wp.components.Dropdown', {\n\t\t\tsince: '6.2',\n\t\t\talternative: '`popoverProps.placement` prop',\n\t\t\thint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.',\n\t\t} );\n\t}\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ fallbackPopoverAnchor, setFallbackPopoverAnchor ] =\n\t\tuseState< HTMLDivElement | null >( null );\n\tconst containerRef = useRef< HTMLDivElement >();\n\tconst [ isOpen, setIsOpen ] = useObservableState( false, onToggle );\n\n\tuseEffect(\n\t\t() => () => {\n\t\t\tif ( onToggle && isOpen ) {\n\t\t\t\tonToggle( false );\n\t\t\t}\n\t\t},\n\t\t[ onToggle, isOpen ]\n\t);\n\n\tfunction toggle() {\n\t\tsetIsOpen( ! isOpen );\n\t}\n\n\t/**\n\t * Closes the popover when focus leaves it unless the toggle was pressed or\n\t * focus has moved to a separate dialog. The former is to let the toggle\n\t * handle closing the popover and the latter is to preserve presence in\n\t * case a dialog has opened, allowing focus to return when it's dismissed.\n\t */\n\tfunction closeIfFocusOutside() {\n\t\tif ( ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = containerRef.current;\n\t\tconst dialog =\n\t\t\townerDocument?.activeElement?.closest( '[role=\"dialog\"]' );\n\t\tif (\n\t\t\t! containerRef.current.contains( ownerDocument.activeElement ) &&\n\t\t\t( ! dialog || dialog.contains( containerRef.current ) )\n\t\t) {\n\t\t\tclose();\n\t\t}\n\t}\n\n\tfunction close() {\n\t\tif ( onClose ) {\n\t\t\tonClose();\n\t\t}\n\t\tsetIsOpen( false );\n\t}\n\n\tconst args = { isOpen, onToggle: toggle, onClose: close };\n\tconst popoverPropsHaveAnchor =\n\t\t!! popoverProps?.anchor ||\n\t\t// Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n\t\t// be removed from `Popover` from WordPress 6.3\n\t\t!! popoverProps?.anchorRef ||\n\t\t!! popoverProps?.getAnchorRect ||\n\t\t!! popoverProps?.anchorRect;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-dropdown', className ) }\n\t\t\tref={ useMergeRefs( [\n\t\t\t\tcontainerRef,\n\t\t\t\tforwardedRef,\n\t\t\t\tsetFallbackPopoverAnchor,\n\t\t\t] ) }\n\t\t\t// Some UAs focus the closest focusable parent when the toggle is\n\t\t\t// clicked. Making this div focusable ensures such UAs will focus\n\t\t\t// it and `closeIfFocusOutside` can tell if the toggle was clicked.\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={ style }\n\t\t>\n\t\t\t{ renderToggle( args ) }\n\t\t\t{ isOpen && (\n\t\t\t\t<Popover\n\t\t\t\t\tposition={ position }\n\t\t\t\t\tonClose={ close }\n\t\t\t\t\tonFocusOutside={ closeIfFocusOutside }\n\t\t\t\t\texpandOnMobile={ expandOnMobile }\n\t\t\t\t\theaderTitle={ headerTitle }\n\t\t\t\t\tfocusOnMount={ focusOnMount }\n\t\t\t\t\t// This value is used to ensure that the dropdowns\n\t\t\t\t\t// align with the editor header by default.\n\t\t\t\t\toffset={ 13 }\n\t\t\t\t\tanchor={\n\t\t\t\t\t\t! popoverPropsHaveAnchor\n\t\t\t\t\t\t\t? fallbackPopoverAnchor\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\t{ ...popoverProps }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-dropdown__content',\n\t\t\t\t\t\tpopoverProps?.className,\n\t\t\t\t\t\tcontentClassName\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ renderContent( args ) }\n\t\t\t\t</Popover>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\n/**\n * Renders a button that opens a floating content modal when clicked.\n *\n * ```jsx\n * import { Button, Dropdown } from '@wordpress/components';\n *\n * const MyDropdown = () => (\n *   <Dropdown\n *     className=\"my-container-class-name\"\n *     contentClassName=\"my-dropdown-content-classname\"\n *     popoverProps={ { placement: 'bottom-start' } }\n *     renderToggle={ ( { isOpen, onToggle } ) => (\n *       <Button\n *         variant=\"primary\"\n *         onClick={ onToggle }\n *         aria-expanded={ isOpen }\n *       >\n *         Toggle Dropdown!\n *       </Button>\n *     ) }\n *     renderContent={ () => <div>This is the content of the dropdown.</div> }\n *   />\n * );\n * ```\n */\nexport const Dropdown = forwardRef( UnforwardedDropdown );\n\nexport default Dropdown;\n"]}

package/build/dropdown/styles.js

@@ -20,10 +20,9 @@ var _space = require("../ui/utils/space");
 /**
  * Internal dependencies
  */
-const padding = _ref => {
-  let {
-    paddingSize = 'small'
-  } = _ref;
+const padding = ({
+  paddingSize = 'small'
+}) => {
   if (paddingSize === 'none') return;
   const paddingValues = {
     small: (0, _space.space)(2),

package/build/dropdown/styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/dropdown/styles.ts"],"names":["padding","paddingSize","paddingValues","small","medium","css","DropdownContentWrapperDiv"],"mappings":";;;;;;;;;;;AAGA;;AAMA;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAIA,MAAMA,OAAO,GAAG,QAA8D;AAAA,MAA5D;AAAEC,IAAAA,WAAW,GAAG;AAAhB,GAA4D;AAC7E,MAAKA,WAAW,KAAK,MAArB,EAA8B;AAE9B,QAAMC,aAAa,GAAG;AACrBC,IAAAA,KAAK,EAAE,kBAAO,CAAP,CADc;AAErBC,IAAAA,MAAM,EAAE,kBAAO,CAAP;AAFa,GAAtB;AAKA,0BAAOC,UAAP,cACaH,aAAa,CAAED,WAAF,CAAb,IAAgCC,aAAa,CAACC,KAD3D;AAGA,CAXD;;AAaO,MAAMG,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA,mBAErB,kBAAO,CAAC,CAAR,CAFqB,oBAGpB,kBAAO,CAAC,CAAR,CAHoB,kCAKrB,kBAAO,CAAC,CAAR,CALqB,qCAQlB,kBAAO,CAAC,CAAR,CARkB,QAWlCN,OAXkC,6mDAA/B","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport type { DropdownContentWrapperProps } from './types';\n\nconst padding = ( { paddingSize = 'small' }: DropdownContentWrapperProps ) => {\n\tif ( paddingSize === 'none' ) return;\n\n\tconst paddingValues = {\n\t\tsmall: space( 2 ),\n\t\tmedium: space( 4 ),\n\t};\n\n\treturn css`\n\t\tpadding: ${ paddingValues[ paddingSize ] || paddingValues.small };\n\t`;\n};\n\nexport const DropdownContentWrapperDiv = styled.div< DropdownContentWrapperProps >`\n\t// Negative margin to reset (offset) the default padding on .components-popover__content\n\tmargin-left: ${ space( -2 ) };\n\tmargin-right: ${ space( -2 ) };\n\t&:first-of-type {\n\t\tmargin-top: ${ space( -2 ) };\n\t}\n\t&:last-of-type {\n\t\tmargin-bottom: ${ space( -2 ) };\n\t}\n\n\t${ padding };\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown/styles.ts"],"names":["padding","paddingSize","paddingValues","small","medium","css","DropdownContentWrapperDiv"],"mappings":";;;;;;;;;;;AAGA;;AAMA;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAIA,MAAMA,OAAO,GAAG,CAAE;AAAEC,EAAAA,WAAW,GAAG;AAAhB,CAAF,KAA8D;AAC7E,MAAKA,WAAW,KAAK,MAArB,EAA8B;AAE9B,QAAMC,aAAa,GAAG;AACrBC,IAAAA,KAAK,EAAE,kBAAO,CAAP,CADc;AAErBC,IAAAA,MAAM,EAAE,kBAAO,CAAP;AAFa,GAAtB;AAKA,0BAAOC,UAAP,cACaH,aAAa,CAAED,WAAF,CAAb,IAAgCC,aAAa,CAACC,KAD3D;AAGA,CAXD;;AAaO,MAAMG,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA,mBAErB,kBAAO,CAAC,CAAR,CAFqB,oBAGpB,kBAAO,CAAC,CAAR,CAHoB,kCAKrB,kBAAO,CAAC,CAAR,CALqB,qCAQlB,kBAAO,CAAC,CAAR,CARkB,QAWlCN,OAXkC,6mDAA/B","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport type { DropdownContentWrapperProps } from './types';\n\nconst padding = ( { paddingSize = 'small' }: DropdownContentWrapperProps ) => {\n\tif ( paddingSize === 'none' ) return;\n\n\tconst paddingValues = {\n\t\tsmall: space( 2 ),\n\t\tmedium: space( 4 ),\n\t};\n\n\treturn css`\n\t\tpadding: ${ paddingValues[ paddingSize ] || paddingValues.small };\n\t`;\n};\n\nexport const DropdownContentWrapperDiv = styled.div< DropdownContentWrapperProps >`\n\t// Negative margin to reset (offset) the default padding on .components-popover__content\n\tmargin-left: ${ space( -2 ) };\n\tmargin-right: ${ space( -2 ) };\n\t&:first-of-type {\n\t\tmargin-top: ${ space( -2 ) };\n\t}\n\t&:last-of-type {\n\t\tmargin-bottom: ${ space( -2 ) };\n\t}\n\n\t${ padding };\n`;\n"]}

package/build/dropdown-menu/index.js

@@ -21,8 +21,6 @@ var _dropdown = _interopRequireDefault(require("../dropdown"));
 
 var _navigableContainer = require("../navigable-container");
 
-// @ts-nocheck
-
 /**
  * External dependencies
  */
@@ -34,9 +32,7 @@ var _navigableContainer = require("../navigable-container");
 /**
  * Internal dependencies
  */
-function mergeProps() {
-  let defaultProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+function mergeProps(defaultProps = {}, props = {}) {
   const mergedProps = { ...defaultProps,
     ...props
   };
@@ -47,17 +43,91 @@ function mergeProps() {
 
   return mergedProps;
 }
-/**
- * Whether the argument is a function.
- *
- * @param {*} maybeFunc The argument to check.
- * @return {boolean} True if the argument is a function, false otherwise.
- */
-
 
 function isFunction(maybeFunc) {
   return typeof maybeFunc === 'function';
 }
+/**
+ *
+ * The DropdownMenu displays a list of actions (each contained in a MenuItem,
+ * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover
+ * after the user has interacted with an element (a button or icon) or when
+ * they perform a specific action.
+ *
+ * Render a Dropdown Menu with a set of controls:
+ *
+ * ```jsx
+ * import { DropdownMenu } from '@wordpress/components';
+ * import {
+ * 	more,
+ * 	arrowLeft,
+ * 	arrowRight,
+ * 	arrowUp,
+ * 	arrowDown,
+ * } from '@wordpress/icons';
+ *
+ * const MyDropdownMenu = () => (
+ * 	<DropdownMenu
+ * 		icon={ more }
+ * 		label="Select a direction"
+ * 		controls={ [
+ * 			{
+ * 				title: 'Up',
+ * 				icon: arrowUp,
+ * 				onClick: () => console.log( 'up' ),
+ * 			},
+ * 			{
+ * 				title: 'Right',
+ * 				icon: arrowRight,
+ * 				onClick: () => console.log( 'right' ),
+ * 			},
+ * 			{
+ * 				title: 'Down',
+ * 				icon: arrowDown,
+ * 				onClick: () => console.log( 'down' ),
+ * 			},
+ * 			{
+ * 				title: 'Left',
+ * 				icon: arrowLeft,
+ * 				onClick: () => console.log( 'left' ),
+ * 			},
+ * 		] }
+ * 	/>
+ * );
+ * ```
+ *
+ * Alternatively, specify a `children` function which returns elements valid for
+ * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.
+ *
+ * ```jsx
+ * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
+ * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';
+ *
+ * const MyDropdownMenu = () => (
+ * 	<DropdownMenu icon={ more } label="Select a direction">
+ * 		{ ( { onClose } ) => (
+ * 			<>
+ * 				<MenuGroup>
+ * 					<MenuItem icon={ arrowUp } onClick={ onClose }>
+ * 						Move Up
+ * 					</MenuItem>
+ * 					<MenuItem icon={ arrowDown } onClick={ onClose }>
+ * 						Move Down
+ * 					</MenuItem>
+ * 				</MenuGroup>
+ * 				<MenuGroup>
+ * 					<MenuItem icon={ trash } onClick={ onClose }>
+ * 						Remove
+ * 					</MenuItem>
+ * 				</MenuGroup>
+ * 			</>
+ * 		) }
+ * 	</DropdownMenu>
+ * );
+ * ```
+ *
+ */
+
 
 function DropdownMenu(dropdownMenuProps) {
   const {
@@ -74,18 +144,22 @@ function DropdownMenu(dropdownMenuProps) {
     noIcons
   } = dropdownMenuProps;
 
-  if (!(controls !== null && controls !== void 0 && controls.length) && !isFunction(children)) {
+  if (!controls?.length && !isFunction(children)) {
     return null;
   } // Normalize controls to nested array of objects (sets of controls)
 
 
   let controlSets;
 
-  if (controls !== null && controls !== void 0 && controls.length) {
+  if (controls?.length) {
+    // @ts-expect-error The check below is needed because `DropdownMenus`
+    // rendered by `ToolBarGroup` receive controls as a nested array.
     controlSets = controls;
 
     if (!Array.isArray(controlSets[0])) {
-      controlSets = [controlSets];
+      // This is not ideal, but at this point we know that `controls` is
+      // not a nested array, even if TypeScript doesn't.
+      controlSets = [controls];
     }
   }
 
@@ -95,14 +169,12 @@ function DropdownMenu(dropdownMenuProps) {
   return (0, _element.createElement)(_dropdown.default, {
     className: (0, _classnames.default)('components-dropdown-menu', className),
     popoverProps: mergedPopoverProps,
-    renderToggle: _ref => {
+    renderToggle: ({
+      isOpen,
+      onToggle
+    }) => {
       var _toggleProps$showTool;
 
-      let {
-        isOpen,
-        onToggle
-      } = _ref;
-
       const openOnArrowDown = event => {
         if (disableOpenOnArrowDown) {
           return;
@@ -126,7 +198,7 @@ function DropdownMenu(dropdownMenuProps) {
       return (0, _element.createElement)(Toggle, (0, _extends2.default)({}, mergedToggleProps, {
         icon: icon,
         onClick: event => {
-          onToggle(event);
+          onToggle();
 
           if (mergedToggleProps.onClick) {
             mergedToggleProps.onClick(event);
@@ -143,12 +215,10 @@ function DropdownMenu(dropdownMenuProps) {
         "aria-expanded": isOpen,
         label: label,
         text: text,
-        showTooltip: (_toggleProps$showTool = toggleProps === null || toggleProps === void 0 ? void 0 : toggleProps.showTooltip) !== null && _toggleProps$showTool !== void 0 ? _toggleProps$showTool : true
+        showTooltip: (_toggleProps$showTool = toggleProps?.showTooltip) !== null && _toggleProps$showTool !== void 0 ? _toggleProps$showTool : true
       }), mergedToggleProps.children);
     },
     renderContent: props => {
-      var _controlSets;
-
       const mergedMenuProps = mergeProps({
         'aria-label': label,
         className: (0, _classnames.default)('components-dropdown-menu__menu', {
@@ -157,7 +227,7 @@ function DropdownMenu(dropdownMenuProps) {
       }, menuProps);
       return (0, _element.createElement)(_navigableContainer.NavigableMenu, (0, _extends2.default)({}, mergedMenuProps, {
         role: "menu"
-      }), 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, {
+      }), isFunction(children) ? children(props) : null, 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","length","controlSets","Array","isArray","mergedPopoverProps","isOpen","onToggle","openOnArrowDown","event","code","preventDefault","as","Toggle","Button","restToggleProps","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 { 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.code === 'ArrowDown' ) {\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 { as: Toggle = Button, ...restToggleProps } =\n\t\t\t\t\ttoggleProps ?? {};\n\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\trestToggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Toggle\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</Toggle>\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"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown-menu/index.tsx"],"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","code","preventDefault","as","Toggle","Button","restToggleProps","mergedToggleProps","onClick","onKeyDown","showTooltip","mergedMenuProps","flatMap","controlSet","indexOfSet","map","control","indexOfControl","join","stopPropagation","onClose","isActive","title","role","undefined","isDisabled"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,UAAT,CAEGC,YAA0B,GAAG,EAFhC,EAEoCC,KAAQ,GAAG,EAF/C,EAEyD;AACxD,QAAMC,WAAc,GAAG,EACtB,GAAGF,YADmB;AAEtB,OAAGC;AAFmB,GAAvB;;AAKA,MAAKA,KAAK,CAACE,SAAN,IAAmBH,YAAY,CAACG,SAArC,EAAiD;AAChDD,IAAAA,WAAW,CAACC,SAAZ,GAAwB,yBACvBF,KAAK,CAACE,SADiB,EAEvBH,YAAY,CAACG,SAFU,CAAxB;AAIA;;AAED,SAAOD,WAAP;AACA;;AAED,SAASE,UAAT,CAAqBC,SAArB,EAAmE;AAClE,SAAO,OAAOA,SAAP,KAAqB,UAA5B;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA,SAASC,YAAT,CAAuBC,iBAAvB,EAA8D;AAC7D,QAAM;AACLC,IAAAA,QADK;AAELL,IAAAA,SAFK;AAGLM,IAAAA,QAHK;AAILC,IAAAA,IAAI,GAAGC,WAJF;AAKLC,IAAAA,KALK;AAMLC,IAAAA,YANK;AAOLC,IAAAA,WAPK;AAQLC,IAAAA,SARK;AASLC,IAAAA,sBAAsB,GAAG,KATpB;AAULC,IAAAA,IAVK;AAWLC,IAAAA;AAXK,MAYFX,iBAZJ;;AAcA,MAAK,CAAEE,QAAQ,EAAEU,MAAZ,IAAsB,CAAEf,UAAU,CAAEI,Q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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\nimport type { DropdownMenuProps, DropdownOption } from './types';\n\nfunction mergeProps<\n\tT extends { className?: string; [ key: string ]: unknown }\n>( defaultProps: Partial< T > = {}, props: T = {} as T ) {\n\tconst mergedProps: T = {\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\nfunction isFunction( maybeFunc: unknown ): maybeFunc is () => void {\n\treturn typeof maybeFunc === 'function';\n}\n\n/**\n *\n * The DropdownMenu displays a list of actions (each contained in a MenuItem,\n * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover\n * after the user has interacted with an element (a button or icon) or when\n * they perform a specific action.\n *\n * Render a Dropdown Menu with a set of controls:\n *\n * ```jsx\n * import { DropdownMenu } from '@wordpress/components';\n * import {\n * \tmore,\n * \tarrowLeft,\n * \tarrowRight,\n * \tarrowUp,\n * \tarrowDown,\n * } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu\n * \t\ticon={ more }\n * \t\tlabel=\"Select a direction\"\n * \t\tcontrols={ [\n * \t\t\t{\n * \t\t\t\ttitle: 'Up',\n * \t\t\t\ticon: arrowUp,\n * \t\t\t\tonClick: () => console.log( 'up' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Right',\n * \t\t\t\ticon: arrowRight,\n * \t\t\t\tonClick: () => console.log( 'right' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Down',\n * \t\t\t\ticon: arrowDown,\n * \t\t\t\tonClick: () => console.log( 'down' ),\n * \t\t\t},\n * \t\t\t{\n * \t\t\t\ttitle: 'Left',\n * \t\t\t\ticon: arrowLeft,\n * \t\t\t\tonClick: () => console.log( 'left' ),\n * \t\t\t},\n * \t\t] }\n * \t/>\n * );\n * ```\n *\n * Alternatively, specify a `children` function which returns elements valid for\n * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.\n *\n * ```jsx\n * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\n * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';\n *\n * const MyDropdownMenu = () => (\n * \t<DropdownMenu icon={ more } label=\"Select a direction\">\n * \t\t{ ( { onClose } ) => (\n * \t\t\t<>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ arrowUp } onClick={ onClose }>\n * \t\t\t\t\t\tMove Up\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t\t<MenuItem icon={ arrowDown } onClick={ onClose }>\n * \t\t\t\t\t\tMove Down\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t\t<MenuGroup>\n * \t\t\t\t\t<MenuItem icon={ trash } onClick={ onClose }>\n * \t\t\t\t\t\tRemove\n * \t\t\t\t\t</MenuItem>\n * \t\t\t\t</MenuGroup>\n * \t\t\t</>\n * \t\t) }\n * \t</DropdownMenu>\n * );\n * ```\n *\n */\n\nfunction DropdownMenu( dropdownMenuProps: 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: DropdownOption[][];\n\tif ( controls?.length ) {\n\t\t// @ts-expect-error The check below is needed because `DropdownMenus`\n\t\t// rendered by `ToolBarGroup` receive controls as a nested array.\n\t\tcontrolSets = controls;\n\t\tif ( ! Array.isArray( controlSets[ 0 ] ) ) {\n\t\t\t// This is not ideal, but at this point we know that `controls` is\n\t\t\t// not a nested array, even if TypeScript doesn't.\n\t\t\tcontrolSets = [ controls as DropdownOption[] ];\n\t\t}\n\t}\n\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: React.KeyboardEvent ) => {\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.code === 'ArrowDown' ) {\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 { as: Toggle = Button, ...restToggleProps } =\n\t\t\t\t\ttoggleProps ?? {};\n\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\trestToggleProps\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<Toggle\n\t\t\t\t\t\t{ ...mergedToggleProps }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\t( ( event ) => {\n\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\tif ( mergedToggleProps.onClick ) {\n\t\t\t\t\t\t\t\t\tmergedToggleProps.onClick( event );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} ) as React.MouseEventHandler< HTMLButtonElement >\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonKeyDown={\n\t\t\t\t\t\t\t( ( event ) => {\n\t\t\t\t\t\t\t\topenOnArrowDown( event );\n\t\t\t\t\t\t\t\tif ( mergedToggleProps.onKeyDown ) {\n\t\t\t\t\t\t\t\t\tmergedToggleProps.onKeyDown( event );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} ) as React.KeyboardEventHandler< HTMLButtonElement >\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</Toggle>\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

@@ -36,9 +36,7 @@ var _dropdown = _interopRequireDefault(require("../dropdown"));
 /**
  * Internal dependencies
  */
-function mergeProps() {
-  let defaultProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+function mergeProps(defaultProps = {}, props = {}) {
   const mergedProps = { ...defaultProps,
     ...props
   };
@@ -61,25 +59,23 @@ function isFunction(maybeFunc) {
   return typeof maybeFunc === 'function';
 }
 
-function DropdownMenu(_ref) {
-  let {
-    children,
-    className,
-    controls,
-    icon = _icons.menu,
-    label,
-    popoverProps,
-    toggleProps
-  } = _ref;
-
-  if (!(controls !== null && controls !== void 0 && controls.length) && !isFunction(children)) {
+function DropdownMenu({
+  children,
+  className,
+  controls,
+  icon = _icons.menu,
+  label,
+  popoverProps,
+  toggleProps
+}) {
+  if (!controls?.length && !isFunction(children)) {
     return null;
   } // Normalize controls to nested array of objects (sets of controls)
 
 
   let controlSets;
 
-  if (controls !== null && controls !== void 0 && controls.length) {
+  if (controls?.length) {
     controlSets = controls;
 
     if (!Array.isArray(controlSets[0])) {
@@ -93,11 +89,10 @@ function DropdownMenu(_ref) {
   return (0, _element.createElement)(_dropdown.default, {
     className: (0, _classnames.default)('components-dropdown-menu', className),
     popoverProps: mergedPopoverProps,
-    renderToggle: _ref2 => {
-      let {
-        isOpen,
-        onToggle
-      } = _ref2;
+    renderToggle: ({
+      isOpen,
+      onToggle
+    }) => {
       const mergedToggleProps = mergeProps({
         className: (0, _classnames.default)('components-dropdown-menu__toggle', {
           'is-opened': isOpen
@@ -117,14 +112,11 @@ function DropdownMenu(_ref) {
         label: label
       }), mergedToggleProps.children);
     },
-    renderContent: _ref3 => {
-      var _controlSets;
-
-      let {
-        isOpen,
-        onClose,
-        ...props
-      } = _ref3;
+    renderContent: ({
+      isOpen,
+      onClose,
+      ...props
+    }) => {
       return (0, _element.createElement)(_components.BottomSheet, {
         hideHeader: true,
         isVisible: isOpen,
@@ -135,7 +127,7 @@ function DropdownMenu(_ref) {
           paddingLeft: 0,
           paddingRight: 0
         }
-      }, (_controlSets = controlSets) === null || _controlSets === void 0 ? void 0 : _controlSets.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_components.BottomSheet.Cell, {
+      }, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => (0, _element.createElement)(_components.BottomSheet.Cell, {
         key: [indexOfSet, indexOfControl].join(),
         label: control.title,
         onPress: () => {