@wordpress/components 37.0.1-next.v.202607070741.0 → 39.0.0

package/build-module/draggable/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/draggable/index.tsx", "../../../style-runtime/src/index.ts", "../../src/draggable/style.module.scss"],
-  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { throttle } from '@wordpress/compose';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { getWpCompatOverlaySlot } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\n\nimport styles from './style.module.scss';\n\n// Legacy class names preserved alongside the CSS-module hashed ones for\n// backwards compatibility. `filter(Boolean)` strips `undefined` from Jest's\n// CSS-module mock.\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst dragImageClasses = [styles['invisible-drag-image'], 'components-draggable__invisible-drag-image'].filter(Boolean);\nconst cloneWrapperClasses = [styles.clone, 'components-draggable__clone'].filter(Boolean);\n// Global class — shared with external code (e.g. block-editor keyboard drag).\nconst bodyClass = 'is-dragging-components-draggable';\nconst clonePadding = 0;\n\n/**\n * `Draggable` is a Component that provides a way to set up a cross-browser\n * (including IE) customizable drag image and the transfer data for the drag\n * event. It decouples the drag handle and the element to drag: use it by\n * wrapping the component that will become the drag handle and providing the DOM\n * ID of the element to drag.\n *\n * Note that the drag handle needs to declare the `draggable=\"true\"` property\n * and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event\n * handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`\n * takes care of the logic to setup the drag image and the transfer data, but is\n * not concerned with creating an actual DOM element that is draggable.\n *\n * ```jsx\n * import { Draggable, Panel, PanelBody } from '@wordpress/components';\n * import { Icon, more } from '@wordpress/icons';\n *\n * const MyDraggable = () => (\n *   <div id=\"draggable-panel\">\n *     <Panel header=\"Draggable panel\">\n *       <PanelBody>\n *         <Draggable elementId=\"draggable-panel\" transferData={ {} }>\n *           { ( { onDraggableStart, onDraggableEnd } ) => (\n *             <div\n *               className=\"example-drag-handle\"\n *               draggable\n *               onDragStart={ onDraggableStart }\n *               onDragEnd={ onDraggableEnd }\n *             >\n *               <Icon icon={ more } />\n *             </div>\n *           ) }\n *         </Draggable>\n *       </PanelBody>\n *     </Panel>\n *   </div>\n * );\n * ```\n */\nexport function Draggable({\n  children,\n  onDragStart,\n  onDragOver,\n  onDragEnd,\n  appendToOwnerDocument = false,\n  cloneClassname,\n  elementId,\n  transferData,\n  __experimentalTransferDataType: transferDataType = 'text',\n  __experimentalDragComponent: dragComponent\n}) {\n  const dragComponentRef = useRef(null);\n  const cleanupRef = useRef(() => {});\n\n  /**\n   * Removes the element clone, resets cursor, and removes drag listener.\n   *\n   * @param event The non-custom DragEvent.\n   */\n  function end(event) {\n    event.preventDefault();\n    cleanupRef.current();\n    if (onDragEnd) {\n      onDragEnd(event);\n    }\n  }\n\n  /**\n   * This method does a couple of things:\n   *\n   * - Clones the current element and spawns clone over original element.\n   * - Adds a fake temporary drag image to avoid browser defaults.\n   * - Sets transfer data.\n   * - Adds dragover listener.\n   *\n   * @param event The non-custom DragEvent.\n   */\n  function start(event) {\n    const {\n      ownerDocument\n    } = event.target;\n    // Only use the slot when it lives in the same document as the\n    // dragged element, so coordinate resolution stays in one space.\n    const slot = getWpCompatOverlaySlot();\n    const compatSlot = slot?.ownerDocument === ownerDocument ? slot : null;\n    event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));\n    const cloneWrapper = ownerDocument.createElement('div');\n    // Reset position to 0,0. Natural stacking order will position this lower, even with a transform otherwise.\n    cloneWrapper.style.top = '0';\n    cloneWrapper.style.left = '0';\n    const dragImage = ownerDocument.createElement('div');\n\n    // Set a fake drag image to avoid browser defaults. Remove from DOM\n    // right after. event.dataTransfer.setDragImage is not supported yet in\n    // IE, we need to check for its existence first.\n    if ('function' === typeof event.dataTransfer.setDragImage) {\n      dragImage.classList.add(...dragImageClasses);\n      // Invisible — stays at the document body, no slot needed.\n      ownerDocument.body.appendChild(dragImage);\n      event.dataTransfer.setDragImage(dragImage, 0, 0);\n    }\n    cloneWrapper.classList.add(...cloneWrapperClasses);\n    const inSlotClass = styles['is-in-compat-slot'];\n    if (compatSlot && inSlotClass) {\n      cloneWrapper.classList.add(inSlotClass);\n    }\n    if (cloneClassname) {\n      cloneWrapper.classList.add(cloneClassname);\n    }\n    let x = 0;\n    let y = 0;\n    // If a dragComponent is defined, the following logic will clone the\n    // HTML node and inject it into the cloneWrapper.\n    if (dragComponentRef.current) {\n      // Position dragComponent at the same position as the cursor.\n      x = event.clientX;\n      y = event.clientY;\n      cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n      const clonedDragComponent = ownerDocument.createElement('div');\n      clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;\n      cloneWrapper.appendChild(clonedDragComponent);\n      (compatSlot ?? ownerDocument.body).appendChild(cloneWrapper);\n    } else {\n      const element = ownerDocument.getElementById(elementId);\n\n      // Prepare element clone and append to element wrapper.\n      const elementRect = element.getBoundingClientRect();\n      const elementWrapper = element.parentNode;\n      const elementTopOffset = elementRect.top;\n      const elementLeftOffset = elementRect.left;\n      cloneWrapper.style.width = `${elementRect.width + clonePadding * 2}px`;\n      const clone = element.cloneNode(true);\n      clone.id = `clone-${elementId}`;\n\n      // Position clone right over the original element (20px padding).\n      x = elementLeftOffset - clonePadding;\n      y = elementTopOffset - clonePadding;\n      cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n\n      // Hack: Remove iFrames as it's causing the embeds drag clone to freeze.\n      Array.from(clone.querySelectorAll('iframe')).forEach(child => child.parentNode?.removeChild(child));\n      cloneWrapper.appendChild(clone);\n      if (compatSlot) {\n        compatSlot.appendChild(cloneWrapper);\n      } else if (appendToOwnerDocument) {\n        ownerDocument.body.appendChild(cloneWrapper);\n      } else {\n        elementWrapper?.appendChild(cloneWrapper);\n      }\n    }\n\n    // Mark the current cursor coordinates.\n    let cursorLeft = event.clientX;\n    let cursorTop = event.clientY;\n    function over(e) {\n      // Skip doing any work if mouse has not moved.\n      if (cursorLeft === e.clientX && cursorTop === e.clientY) {\n        return;\n      }\n      const nextX = x + e.clientX - cursorLeft;\n      const nextY = y + e.clientY - cursorTop;\n      cloneWrapper.style.transform = `translate( ${nextX}px, ${nextY}px )`;\n      cursorLeft = e.clientX;\n      cursorTop = e.clientY;\n      x = nextX;\n      y = nextY;\n      if (onDragOver) {\n        onDragOver(e);\n      }\n    }\n\n    // Aim for 60fps (16 ms per frame) for now. We can potentially use requestAnimationFrame (raf) instead,\n    // note that browsers may throttle raf below 60fps in certain conditions.\n    // @ts-ignore\n    const throttledDragOver = throttle(over, 16);\n    ownerDocument.addEventListener('dragover', throttledDragOver);\n\n    // Update cursor to 'grabbing', document wide.\n    ownerDocument.body.classList.add(bodyClass);\n    if (onDragStart) {\n      onDragStart(event);\n    }\n    cleanupRef.current = () => {\n      // Remove drag clone.\n      if (cloneWrapper && cloneWrapper.parentNode) {\n        cloneWrapper.parentNode.removeChild(cloneWrapper);\n      }\n      if (dragImage && dragImage.parentNode) {\n        dragImage.parentNode.removeChild(dragImage);\n      }\n\n      // Reset cursor.\n      ownerDocument.body.classList.remove(bodyClass);\n      ownerDocument.removeEventListener('dragover', throttledDragOver);\n    };\n  }\n  useEffect(() => () => {\n    cleanupRef.current();\n  }, []);\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [children({\n      onDraggableStart: start,\n      onDraggableEnd: end\n    }), dragComponent && /*#__PURE__*/_jsx(\"div\", {\n      className: \"components-draggable-drag-component-root\",\n      style: {\n        display: 'none'\n      },\n      ref: dragComponentRef,\n      children: dragComponent\n    })]\n  });\n}\nexport default Draggable;", "const STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n  const globalScope = globalThis;\n  if (globalScope.__wpStyleRuntime) {\n    return globalScope.__wpStyleRuntime;\n  }\n  globalScope.__wpStyleRuntime = {\n    documents: new Map(),\n    styles: new Map(),\n    injectedStyles: new WeakMap()\n  };\n  if (typeof document !== 'undefined') {\n    registerDocument(document);\n  }\n  return globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash           Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(targetDocument, hash) {\n  if (!targetDocument.head) {\n    return false;\n  }\n  for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE}]`)) {\n    if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {\n      return true;\n    }\n  }\n  return false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash           Stable hash for the transformed CSS.\n * @param css            CSS text to inject.\n */\nfunction injectStyle(targetDocument, hash, css) {\n  if (!targetDocument.head) {\n    return;\n  }\n  const runtime = getRuntime();\n  let injectedStyles = runtime.injectedStyles.get(targetDocument);\n  if (!injectedStyles) {\n    injectedStyles = new Set();\n    runtime.injectedStyles.set(targetDocument, injectedStyles);\n  }\n  if (injectedStyles.has(hash)) {\n    return;\n  }\n\n  // Older generated CSS module output can still inject matching style tags\n  // after this document's cache is created, so keep the DOM as the fallback\n  // source of truth on cache misses.\n  if (documentContainsStyleHash(targetDocument, hash)) {\n    injectedStyles.add(hash);\n    return;\n  }\n  const style = targetDocument.createElement('style');\n  style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);\n  style.appendChild(targetDocument.createTextNode(css));\n  targetDocument.head.appendChild(style);\n  injectedStyles.add(hash);\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument(targetDocument) {\n  const runtime = getRuntime();\n  runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);\n  for (const [hash, css] of runtime.styles) {\n    injectStyle(targetDocument, hash, css);\n  }\n  return () => {\n    const count = runtime.documents.get(targetDocument);\n    if (count === undefined) {\n      return;\n    }\n    if (count <= 1) {\n      runtime.documents.delete(targetDocument);\n      return;\n    }\n    runtime.documents.set(targetDocument, count - 1);\n  };\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css  CSS text to inject.\n */\nexport function registerStyle(hash, css) {\n  const runtime = getRuntime();\n  runtime.styles.set(hash, css);\n  for (const targetDocument of runtime.documents.keys()) {\n    injectStyle(targetDocument, hash, css);\n  }\n}", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"e7e88c1781\", \"._3476c2e530687f96__invisible-drag-image{height:50px;left:-1000px;position:fixed;width:50px}._6f00e51ab7574306__clone{background:transparent;padding:0;pointer-events:none;position:fixed}._6f00e51ab7574306__clone:not(._664ecd37377558df__is-in-compat-slot){z-index:1000000000}body.is-dragging-components-draggable{cursor:move;cursor:grabbing!important}\");\n}\nexport default {\"invisible-drag-image\":\"_3476c2e530687f96__invisible-drag-image\",\"clone\":\"_6f00e51ab7574306__clone\",\"is-in-compat-slot\":\"_664ecd37377558df__is-in-compat-slot\"};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { throttle } from '@wordpress/compose';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { getWpCompatOverlaySlot } from '@wordpress/ui';\nimport styles from './style.module.scss';\n\n// Legacy class names preserved alongside the CSS-module hashed ones for\n// backwards compatibility. `filter(Boolean)` strips `undefined` from Jest's\n// CSS-module mock.\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst dragImageClasses = [styles['invisible-drag-image'], 'components-draggable__invisible-drag-image'].filter(Boolean);\nconst cloneWrapperClasses = [styles.clone, 'components-draggable__clone'].filter(Boolean);\n// Global class — shared with external code (e.g. block-editor keyboard drag).\nconst bodyClass = 'is-dragging-components-draggable';\nconst clonePadding = 0;\n\n/**\n * `Draggable` is a Component that provides a way to set up a cross-browser\n * (including IE) customizable drag image and the transfer data for the drag\n * event. It decouples the drag handle and the element to drag: use it by\n * wrapping the component that will become the drag handle and providing the DOM\n * ID of the element to drag.\n *\n * Note that the drag handle needs to declare the `draggable=\"true\"` property\n * and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event\n * handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`\n * takes care of the logic to setup the drag image and the transfer data, but is\n * not concerned with creating an actual DOM element that is draggable.\n *\n * ```jsx\n * import { Draggable, Panel, PanelBody } from '@wordpress/components';\n * import { Icon, more } from '@wordpress/icons';\n *\n * const MyDraggable = () => (\n *   <div id=\"draggable-panel\">\n *     <Panel header=\"Draggable panel\">\n *       <PanelBody>\n *         <Draggable elementId=\"draggable-panel\" transferData={ {} }>\n *           { ( { onDraggableStart, onDraggableEnd } ) => (\n *             <div\n *               className=\"example-drag-handle\"\n *               draggable\n *               onDragStart={ onDraggableStart }\n *               onDragEnd={ onDraggableEnd }\n *             >\n *               <Icon icon={ more } />\n *             </div>\n *           ) }\n *         </Draggable>\n *       </PanelBody>\n *     </Panel>\n *   </div>\n * );\n * ```\n */\nexport function Draggable({\n  children,\n  onDragStart,\n  onDragOver,\n  onDragEnd,\n  appendToOwnerDocument = false,\n  cloneClassname,\n  elementId,\n  transferData,\n  __experimentalTransferDataType: transferDataType = 'text',\n  __experimentalDragComponent: dragComponent\n}) {\n  const dragComponentRef = useRef(null);\n  const cleanupRef = useRef(() => {});\n\n  /**\n   * Removes the element clone, resets cursor, and removes drag listener.\n   *\n   * @param event The non-custom DragEvent.\n   */\n  function end(event) {\n    event.preventDefault();\n    cleanupRef.current();\n    if (onDragEnd) {\n      onDragEnd(event);\n    }\n  }\n\n  /**\n   * This method does a couple of things:\n   *\n   * - Clones the current element and spawns clone over original element.\n   * - Adds a fake temporary drag image to avoid browser defaults.\n   * - Sets transfer data.\n   * - Adds dragover listener.\n   *\n   * @param event The non-custom DragEvent.\n   */\n  function start(event) {\n    const {\n      ownerDocument\n    } = event.target;\n    // Only use the slot when it lives in the same document as the\n    // dragged element, so coordinate resolution stays in one space.\n    const slot = getWpCompatOverlaySlot();\n    const compatSlot = slot?.ownerDocument === ownerDocument ? slot : null;\n    event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));\n    const cloneWrapper = ownerDocument.createElement('div');\n    // Reset position to 0,0. Natural stacking order will position this lower, even with a transform otherwise.\n    cloneWrapper.style.top = '0';\n    cloneWrapper.style.left = '0';\n    const dragImage = ownerDocument.createElement('div');\n\n    // Set a fake drag image to avoid browser defaults. Remove from DOM\n    // right after. event.dataTransfer.setDragImage is not supported yet in\n    // IE, we need to check for its existence first.\n    if ('function' === typeof event.dataTransfer.setDragImage) {\n      dragImage.classList.add(...dragImageClasses);\n      // Invisible — stays at the document body, no slot needed.\n      ownerDocument.body.appendChild(dragImage);\n      event.dataTransfer.setDragImage(dragImage, 0, 0);\n    }\n    cloneWrapper.classList.add(...cloneWrapperClasses);\n    const inSlotClass = styles['is-in-compat-slot'];\n    if (compatSlot && inSlotClass) {\n      cloneWrapper.classList.add(inSlotClass);\n    }\n    if (cloneClassname) {\n      cloneWrapper.classList.add(cloneClassname);\n    }\n    let x = 0;\n    let y = 0;\n    // If a dragComponent is defined, the following logic will clone the\n    // HTML node and inject it into the cloneWrapper.\n    if (dragComponentRef.current) {\n      // Position dragComponent at the same position as the cursor.\n      x = event.clientX;\n      y = event.clientY;\n      cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n      const clonedDragComponent = ownerDocument.createElement('div');\n      clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;\n      cloneWrapper.appendChild(clonedDragComponent);\n      (compatSlot ?? ownerDocument.body).appendChild(cloneWrapper);\n    } else {\n      const element = ownerDocument.getElementById(elementId);\n\n      // Prepare element clone and append to element wrapper.\n      const elementRect = element.getBoundingClientRect();\n      const elementWrapper = element.parentNode;\n      const elementTopOffset = elementRect.top;\n      const elementLeftOffset = elementRect.left;\n      cloneWrapper.style.width = `${elementRect.width + clonePadding * 2}px`;\n      const clone = element.cloneNode(true);\n      clone.id = `clone-${elementId}`;\n\n      // Position clone right over the original element (20px padding).\n      x = elementLeftOffset - clonePadding;\n      y = elementTopOffset - clonePadding;\n      cloneWrapper.style.transform = `translate( ${x}px, ${y}px )`;\n\n      // Hack: Remove iFrames as it's causing the embeds drag clone to freeze.\n      Array.from(clone.querySelectorAll('iframe')).forEach(child => child.parentNode?.removeChild(child));\n      cloneWrapper.appendChild(clone);\n      if (compatSlot) {\n        compatSlot.appendChild(cloneWrapper);\n      } else if (appendToOwnerDocument) {\n        ownerDocument.body.appendChild(cloneWrapper);\n      } else {\n        elementWrapper?.appendChild(cloneWrapper);\n      }\n    }\n\n    // Mark the current cursor coordinates.\n    let cursorLeft = event.clientX;\n    let cursorTop = event.clientY;\n    function over(e) {\n      // Skip doing any work if mouse has not moved.\n      if (cursorLeft === e.clientX && cursorTop === e.clientY) {\n        return;\n      }\n      const nextX = x + e.clientX - cursorLeft;\n      const nextY = y + e.clientY - cursorTop;\n      cloneWrapper.style.transform = `translate( ${nextX}px, ${nextY}px )`;\n      cursorLeft = e.clientX;\n      cursorTop = e.clientY;\n      x = nextX;\n      y = nextY;\n      if (onDragOver) {\n        onDragOver(e);\n      }\n    }\n\n    // Aim for 60fps (16 ms per frame) for now. We can potentially use requestAnimationFrame (raf) instead,\n    // note that browsers may throttle raf below 60fps in certain conditions.\n    // @ts-expect-error `throttle` expects a `(...args: unknown[]) => unknown` callback.\n    const throttledDragOver = throttle(over, 16);\n    ownerDocument.addEventListener('dragover', throttledDragOver);\n\n    // Update cursor to 'grabbing', document wide.\n    ownerDocument.body.classList.add(bodyClass);\n    if (onDragStart) {\n      onDragStart(event);\n    }\n    cleanupRef.current = () => {\n      // Remove drag clone.\n      if (cloneWrapper && cloneWrapper.parentNode) {\n        cloneWrapper.parentNode.removeChild(cloneWrapper);\n      }\n      if (dragImage && dragImage.parentNode) {\n        dragImage.parentNode.removeChild(dragImage);\n      }\n\n      // Reset cursor.\n      ownerDocument.body.classList.remove(bodyClass);\n      ownerDocument.removeEventListener('dragover', throttledDragOver);\n    };\n  }\n  useEffect(() => () => {\n    cleanupRef.current();\n  }, []);\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [children({\n      onDraggableStart: start,\n      onDraggableEnd: end\n    }), dragComponent && /*#__PURE__*/_jsx(\"div\", {\n      className: \"components-draggable-drag-component-root\",\n      style: {\n        display: 'none'\n      },\n      ref: dragComponentRef,\n      children: dragComponent\n    })]\n  });\n}\nexport default Draggable;", "const STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n  const globalScope = globalThis;\n  if (globalScope.__wpStyleRuntime) {\n    return globalScope.__wpStyleRuntime;\n  }\n  globalScope.__wpStyleRuntime = {\n    documents: new Map(),\n    styles: new Map(),\n    injectedStyles: new WeakMap()\n  };\n  if (typeof document !== 'undefined') {\n    registerDocument(document);\n  }\n  return globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash           Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(targetDocument, hash) {\n  if (!targetDocument.head) {\n    return false;\n  }\n  for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE}]`)) {\n    if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {\n      return true;\n    }\n  }\n  return false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash           Stable hash for the transformed CSS.\n * @param css            CSS text to inject.\n */\nfunction injectStyle(targetDocument, hash, css) {\n  if (!targetDocument.head) {\n    return;\n  }\n  const runtime = getRuntime();\n  let injectedStyles = runtime.injectedStyles.get(targetDocument);\n  if (!injectedStyles) {\n    injectedStyles = new Set();\n    runtime.injectedStyles.set(targetDocument, injectedStyles);\n  }\n  if (injectedStyles.has(hash)) {\n    return;\n  }\n\n  // Older generated CSS module output can still inject matching style tags\n  // after this document's cache is created, so keep the DOM as the fallback\n  // source of truth on cache misses.\n  if (documentContainsStyleHash(targetDocument, hash)) {\n    injectedStyles.add(hash);\n    return;\n  }\n  const style = targetDocument.createElement('style');\n  style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);\n  style.appendChild(targetDocument.createTextNode(css));\n  targetDocument.head.appendChild(style);\n  injectedStyles.add(hash);\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument(targetDocument) {\n  const runtime = getRuntime();\n  runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);\n  for (const [hash, css] of runtime.styles) {\n    injectStyle(targetDocument, hash, css);\n  }\n  return () => {\n    const count = runtime.documents.get(targetDocument);\n    if (count === undefined) {\n      return;\n    }\n    if (count <= 1) {\n      runtime.documents.delete(targetDocument);\n      return;\n    }\n    runtime.documents.set(targetDocument, count - 1);\n  };\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css  CSS text to inject.\n */\nexport function registerStyle(hash, css) {\n  const runtime = getRuntime();\n  runtime.styles.set(hash, css);\n  for (const targetDocument of runtime.documents.keys()) {\n    injectStyle(targetDocument, hash, css);\n  }\n}", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"e7e88c1781\", \"._3476c2e530687f96__invisible-drag-image{height:50px;left:-1000px;position:fixed;width:50px}._6f00e51ab7574306__clone{background:transparent;padding:0;pointer-events:none;position:fixed}._6f00e51ab7574306__clone:not(._664ecd37377558df__is-in-compat-slot){z-index:1000000000}body.is-dragging-components-draggable{cursor:move;cursor:grabbing!important}\");\n}\nexport default {\"invisible-drag-image\":\"_3476c2e530687f96__invisible-drag-image\",\"clone\":\"_6f00e51ab7574306__clone\",\"is-in-compat-slot\":\"_664ecd37377558df__is-in-compat-slot\"};\n"],
+  "mappings": ";AAAA,SAAS,gBAAgB;AACzB,SAAS,WAAW,cAAc;AAClC,SAAS,8BAA8B;;;ACFvC,IAAM,uBAAuB;AAU7B,SAAS,aAAa;AACpB,QAAM,cAAc;AACpB,MAAI,YAAY,kBAAkB;AAChC,WAAO,YAAY;AAAA,EACrB;AACA,cAAY,mBAAmB;AAAA,IAC7B,WAAW,oBAAI,IAAI;AAAA,IACnB,QAAQ,oBAAI,IAAI;AAAA,IAChB,gBAAgB,oBAAI,QAAQ;AAAA,EAC9B;AACA,MAAI,OAAO,aAAa,aAAa;AACnC,qBAAiB,QAAQ;AAAA,EAC3B;AACA,SAAO,YAAY;AACrB;AAUA,SAAS,0BAA0B,gBAAgB,MAAM;AACvD,MAAI,CAAC,eAAe,MAAM;AACxB,WAAO;AAAA,EACT;AACA,aAAW,SAAS,eAAe,KAAK,iBAAiB,SAAS,oBAAoB,GAAG,GAAG;AAC1F,QAAI,MAAM,aAAa,oBAAoB,MAAM,MAAM;AACrD,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;AAUA,SAAS,YAAY,gBAAgB,MAAM,KAAK;AAC9C,MAAI,CAAC,eAAe,MAAM;AACxB;AAAA,EACF;AACA,QAAM,UAAU,WAAW;AAC3B,MAAI,iBAAiB,QAAQ,eAAe,IAAI,cAAc;AAC9D,MAAI,CAAC,gBAAgB;AACnB,qBAAiB,oBAAI,IAAI;AACzB,YAAQ,eAAe,IAAI,gBAAgB,cAAc;AAAA,EAC3D;AACA,MAAI,eAAe,IAAI,IAAI,GAAG;AAC5B;AAAA,EACF;AAKA,MAAI,0BAA0B,gBAAgB,IAAI,GAAG;AACnD,mBAAe,IAAI,IAAI;AACvB;AAAA,EACF;AACA,QAAM,QAAQ,eAAe,cAAc,OAAO;AAClD,QAAM,aAAa,sBAAsB,IAAI;AAC7C,QAAM,YAAY,eAAe,eAAe,GAAG,CAAC;AACpD,iBAAe,KAAK,YAAY,KAAK;AACrC,iBAAe,IAAI,IAAI;AACzB;AAaO,SAAS,iBAAiB,gBAAgB;AAC/C,QAAM,UAAU,WAAW;AAC3B,UAAQ,UAAU,IAAI,iBAAiB,QAAQ,UAAU,IAAI,cAAc,KAAK,KAAK,CAAC;AACtF,aAAW,CAAC,MAAM,GAAG,KAAK,QAAQ,QAAQ;AACxC,gBAAY,gBAAgB,MAAM,GAAG;AAAA,EACvC;AACA,SAAO,MAAM;AACX,UAAM,QAAQ,QAAQ,UAAU,IAAI,cAAc;AAClD,QAAI,UAAU,QAAW;AACvB;AAAA,IACF;AACA,QAAI,SAAS,GAAG;AACd,cAAQ,UAAU,OAAO,cAAc;AACvC;AAAA,IACF;AACA,YAAQ,UAAU,IAAI,gBAAgB,QAAQ,CAAC;AAAA,EACjD;AACF;AAaO,SAAS,cAAc,MAAM,KAAK;AACvC,QAAM,UAAU,WAAW;AAC3B,UAAQ,OAAO,IAAI,MAAM,GAAG;AAC5B,aAAW,kBAAkB,QAAQ,UAAU,KAAK,GAAG;AACrD,gBAAY,gBAAgB,MAAM,GAAG;AAAA,EACvC;AACF;;;AChIA,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,gWAAgW;AAC7X;AACA,IAAO,uBAAQ,EAAC,wBAAuB,2CAA0C,SAAQ,4BAA2B,qBAAoB,uCAAsC;;;AFI9K,SAAS,OAAO,MAAM,YAAY,WAAW,QAAQ,aAAa;AAClE,IAAM,mBAAmB,CAAC,qBAAO,sBAAsB,GAAG,4CAA4C,EAAE,OAAO,OAAO;AACtH,IAAM,sBAAsB,CAAC,qBAAO,OAAO,6BAA6B,EAAE,OAAO,OAAO;AAExF,IAAM,YAAY;AAClB,IAAM,eAAe;AAyCd,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA,gCAAgC,mBAAmB;AAAA,EACnD,6BAA6B;AAC/B,GAAG;AACD,QAAM,mBAAmB,OAAO,IAAI;AACpC,QAAM,aAAa,OAAO,MAAM;AAAA,EAAC,CAAC;AAOlC,WAAS,IAAI,OAAO;AAClB,UAAM,eAAe;AACrB,eAAW,QAAQ;AACnB,QAAI,WAAW;AACb,gBAAU,KAAK;AAAA,IACjB;AAAA,EACF;AAYA,WAAS,MAAM,OAAO;AACpB,UAAM;AAAA,MACJ;AAAA,IACF,IAAI,MAAM;AAGV,UAAM,OAAO,uBAAuB;AACpC,UAAM,aAAa,MAAM,kBAAkB,gBAAgB,OAAO;AAClE,UAAM,aAAa,QAAQ,kBAAkB,KAAK,UAAU,YAAY,CAAC;AACzE,UAAM,eAAe,cAAc,cAAc,KAAK;AAEtD,iBAAa,MAAM,MAAM;AACzB,iBAAa,MAAM,OAAO;AAC1B,UAAM,YAAY,cAAc,cAAc,KAAK;AAKnD,QAAI,eAAe,OAAO,MAAM,aAAa,cAAc;AACzD,gBAAU,UAAU,IAAI,GAAG,gBAAgB;AAE3C,oBAAc,KAAK,YAAY,SAAS;AACxC,YAAM,aAAa,aAAa,WAAW,GAAG,CAAC;AAAA,IACjD;AACA,iBAAa,UAAU,IAAI,GAAG,mBAAmB;AACjD,UAAM,cAAc,qBAAO,mBAAmB;AAC9C,QAAI,cAAc,aAAa;AAC7B,mBAAa,UAAU,IAAI,WAAW;AAAA,IACxC;AACA,QAAI,gBAAgB;AAClB,mBAAa,UAAU,IAAI,cAAc;AAAA,IAC3C;AACA,QAAI,IAAI;AACR,QAAI,IAAI;AAGR,QAAI,iBAAiB,SAAS;AAE5B,UAAI,MAAM;AACV,UAAI,MAAM;AACV,mBAAa,MAAM,YAAY,cAAc,CAAC,OAAO,CAAC;AACtD,YAAM,sBAAsB,cAAc,cAAc,KAAK;AAC7D,0BAAoB,YAAY,iBAAiB,QAAQ;AACzD,mBAAa,YAAY,mBAAmB;AAC5C,OAAC,cAAc,cAAc,MAAM,YAAY,YAAY;AAAA,IAC7D,OAAO;AACL,YAAM,UAAU,cAAc,eAAe,SAAS;AAGtD,YAAM,cAAc,QAAQ,sBAAsB;AAClD,YAAM,iBAAiB,QAAQ;AAC/B,YAAM,mBAAmB,YAAY;AACrC,YAAM,oBAAoB,YAAY;AACtC,mBAAa,MAAM,QAAQ,GAAG,YAAY,QAAQ,eAAe,CAAC;AAClE,YAAM,QAAQ,QAAQ,UAAU,IAAI;AACpC,YAAM,KAAK,SAAS,SAAS;AAG7B,UAAI,oBAAoB;AACxB,UAAI,mBAAmB;AACvB,mBAAa,MAAM,YAAY,cAAc,CAAC,OAAO,CAAC;AAGtD,YAAM,KAAK,MAAM,iBAAiB,QAAQ,CAAC,EAAE,QAAQ,WAAS,MAAM,YAAY,YAAY,KAAK,CAAC;AAClG,mBAAa,YAAY,KAAK;AAC9B,UAAI,YAAY;AACd,mBAAW,YAAY,YAAY;AAAA,MACrC,WAAW,uBAAuB;AAChC,sBAAc,KAAK,YAAY,YAAY;AAAA,MAC7C,OAAO;AACL,wBAAgB,YAAY,YAAY;AAAA,MAC1C;AAAA,IACF;AAGA,QAAI,aAAa,MAAM;AACvB,QAAI,YAAY,MAAM;AACtB,aAAS,KAAK,GAAG;AAEf,UAAI,eAAe,EAAE,WAAW,cAAc,EAAE,SAAS;AACvD;AAAA,MACF;AACA,YAAM,QAAQ,IAAI,EAAE,UAAU;AAC9B,YAAM,QAAQ,IAAI,EAAE,UAAU;AAC9B,mBAAa,MAAM,YAAY,cAAc,KAAK,OAAO,KAAK;AAC9D,mBAAa,EAAE;AACf,kBAAY,EAAE;AACd,UAAI;AACJ,UAAI;AACJ,UAAI,YAAY;AACd,mBAAW,CAAC;AAAA,MACd;AAAA,IACF;AAKA,UAAM,oBAAoB,SAAS,MAAM,EAAE;AAC3C,kBAAc,iBAAiB,YAAY,iBAAiB;AAG5D,kBAAc,KAAK,UAAU,IAAI,SAAS;AAC1C,QAAI,aAAa;AACf,kBAAY,KAAK;AAAA,IACnB;AACA,eAAW,UAAU,MAAM;AAEzB,UAAI,gBAAgB,aAAa,YAAY;AAC3C,qBAAa,WAAW,YAAY,YAAY;AAAA,MAClD;AACA,UAAI,aAAa,UAAU,YAAY;AACrC,kBAAU,WAAW,YAAY,SAAS;AAAA,MAC5C;AAGA,oBAAc,KAAK,UAAU,OAAO,SAAS;AAC7C,oBAAc,oBAAoB,YAAY,iBAAiB;AAAA,IACjE;AAAA,EACF;AACA,YAAU,MAAM,MAAM;AACpB,eAAW,QAAQ;AAAA,EACrB,GAAG,CAAC,CAAC;AACL,SAAoB,sBAAM,WAAW;AAAA,IACnC,UAAU,CAAC,SAAS;AAAA,MAClB,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,IAClB,CAAC,GAAG,iBAA8B,qBAAK,OAAO;AAAA,MAC5C,WAAW;AAAA,MACX,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,MACA,KAAK;AAAA,MACL,UAAU;AAAA,IACZ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,IAAO,oBAAQ;",
   "names": []
 }

package/build-module/drop-zone/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/drop-zone/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 { __experimentalUseDropZone as useDropZone } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\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  className,\n  icon = upload,\n  label,\n  onFilesDrop,\n  onHTMLDrop,\n  onDrop,\n  isEligible = () => true,\n  ...restProps\n}) {\n  const [isDraggingOverDocument, setIsDraggingOverDocument] = useState();\n  const [isDraggingOverElement, setIsDraggingOverElement] = useState();\n  const [isActive, setIsActive] = useState();\n  const ref = useDropZone({\n    onDrop(event) {\n      if (!event.dataTransfer) {\n        return;\n      }\n      const files = getFilesFromDataTransfer(event.dataTransfer);\n      const html = event.dataTransfer.getData('text/html');\n\n      /**\n       * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n       * The order of the checks is important to recognize the HTML drop.\n       */\n      if (html && onHTMLDrop) {\n        onHTMLDrop(html);\n      } else if (files.length && onFilesDrop) {\n        onFilesDrop(files);\n      } else if (onDrop) {\n        onDrop(event);\n      }\n    },\n    onDragStart(event) {\n      setIsDraggingOverDocument(true);\n      if (!event.dataTransfer) {\n        return;\n      }\n\n      /**\n       * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n       * The order of the checks is important to recognize the HTML drop.\n       */\n      if (event.dataTransfer.types.includes('text/html')) {\n        setIsActive(!!onHTMLDrop);\n      } else if (\n      // Check for the types because sometimes the files themselves\n      // are only available on drop.\n      event.dataTransfer.types.includes('Files') || getFilesFromDataTransfer(event.dataTransfer).length > 0) {\n        setIsActive(!!onFilesDrop);\n      } else {\n        setIsActive(!!onDrop && isEligible(event.dataTransfer));\n      }\n    },\n    onDragEnd() {\n      setIsDraggingOverElement(false);\n      setIsDraggingOverDocument(false);\n      setIsActive(undefined);\n    },\n    onDragEnter() {\n      setIsDraggingOverElement(true);\n    },\n    onDragLeave() {\n      setIsDraggingOverElement(false);\n    }\n  });\n  const classes = clsx('components-drop-zone', className, {\n    'is-active': isActive,\n    'is-dragging-over-document': isDraggingOverDocument,\n    'is-dragging-over-element': isDraggingOverElement\n  });\n  return /*#__PURE__*/_jsx(\"div\", {\n    ...restProps,\n    ref: ref,\n    className: classes,\n    children: /*#__PURE__*/_jsx(\"div\", {\n      className: \"components-drop-zone__content\",\n      children: /*#__PURE__*/_jsxs(\"div\", {\n        className: \"components-drop-zone__content-inner\",\n        children: [/*#__PURE__*/_jsx(Icon, {\n          icon: icon,\n          className: \"components-drop-zone__content-icon\"\n        }), /*#__PURE__*/_jsx(\"span\", {\n          className: \"components-drop-zone__content-text\",\n          children: label ? label : __('Drop files to upload')\n        })]\n      })\n    })\n  });\n}\nexport default DropZoneComponent;"],
-  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,QAAQ,YAAY;AAC7B,SAAS,gCAAgC;AACzC,SAAS,6BAA6B,mBAAmB;AAKzD,SAAS,OAAO,MAAM,QAAQ,aAAa;AAwBpC,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,MAAM;AAAA,EACnB,GAAG;AACL,GAAG;AACD,QAAM,CAAC,wBAAwB,yBAAyB,IAAI,SAAS;AACrE,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAAS;AACnE,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS;AACzC,QAAM,MAAM,YAAY;AAAA,IACtB,OAAO,OAAO;AACZ,UAAI,CAAC,MAAM,cAAc;AACvB;AAAA,MACF;AACA,YAAM,QAAQ,yBAAyB,MAAM,YAAY;AACzD,YAAM,OAAO,MAAM,aAAa,QAAQ,WAAW;AAMnD,UAAI,QAAQ,YAAY;AACtB,mBAAW,IAAI;AAAA,MACjB,WAAW,MAAM,UAAU,aAAa;AACtC,oBAAY,KAAK;AAAA,MACnB,WAAW,QAAQ;AACjB,eAAO,KAAK;AAAA,MACd;AAAA,IACF;AAAA,IACA,YAAY,OAAO;AACjB,gCAA0B,IAAI;AAC9B,UAAI,CAAC,MAAM,cAAc;AACvB;AAAA,MACF;AAMA,UAAI,MAAM,aAAa,MAAM,SAAS,WAAW,GAAG;AAClD,oBAAY,CAAC,CAAC,UAAU;AAAA,MAC1B;AAAA;AAAA;AAAA,QAGA,MAAM,aAAa,MAAM,SAAS,OAAO,KAAK,yBAAyB,MAAM,YAAY,EAAE,SAAS;AAAA,QAAG;AACrG,oBAAY,CAAC,CAAC,WAAW;AAAA,MAC3B,OAAO;AACL,oBAAY,CAAC,CAAC,UAAU,WAAW,MAAM,YAAY,CAAC;AAAA,MACxD;AAAA,IACF;AAAA,IACA,YAAY;AACV,+BAAyB,KAAK;AAC9B,gCAA0B,KAAK;AAC/B,kBAAY,MAAS;AAAA,IACvB;AAAA,IACA,cAAc;AACZ,+BAAyB,IAAI;AAAA,IAC/B;AAAA,IACA,cAAc;AACZ,+BAAyB,KAAK;AAAA,IAChC;AAAA,EACF,CAAC;AACD,QAAM,UAAU,KAAK,wBAAwB,WAAW;AAAA,IACtD,aAAa;AAAA,IACb,6BAA6B;AAAA,IAC7B,4BAA4B;AAAA,EAC9B,CAAC;AACD,SAAoB,qBAAK,OAAO;AAAA,IAC9B,GAAG;AAAA,IACH;AAAA,IACA,WAAW;AAAA,IACX,UAAuB,qBAAK,OAAO;AAAA,MACjC,WAAW;AAAA,MACX,UAAuB,sBAAM,OAAO;AAAA,QAClC,WAAW;AAAA,QACX,UAAU,CAAc,qBAAK,MAAM;AAAA,UACjC;AAAA,UACA,WAAW;AAAA,QACb,CAAC,GAAgB,qBAAK,QAAQ;AAAA,UAC5B,WAAW;AAAA,UACX,UAAU,QAAQ,QAAQ,GAAG,sBAAsB;AAAA,QACrD,CAAC,CAAC;AAAA,MACJ,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAO,oBAAQ;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport { __experimentalUseDropZone as useDropZone } from '@wordpress/compose';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\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  className,\n  icon = upload,\n  label,\n  onFilesDrop,\n  onHTMLDrop,\n  onDrop,\n  isEligible = () => true,\n  ...restProps\n}) {\n  const [isDraggingOverDocument, setIsDraggingOverDocument] = useState();\n  const [isDraggingOverElement, setIsDraggingOverElement] = useState();\n  const [isActive, setIsActive] = useState();\n  const ref = useDropZone({\n    onDrop(event) {\n      if (!event.dataTransfer) {\n        return;\n      }\n      const files = getFilesFromDataTransfer(event.dataTransfer);\n      const html = event.dataTransfer.getData('text/html');\n\n      /**\n       * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n       * The order of the checks is important to recognize the HTML drop.\n       */\n      if (html && onHTMLDrop) {\n        onHTMLDrop(html);\n      } else if (files.length && onFilesDrop) {\n        onFilesDrop(files);\n      } else if (onDrop) {\n        onDrop(event);\n      }\n    },\n    onDragStart(event) {\n      setIsDraggingOverDocument(true);\n      if (!event.dataTransfer) {\n        return;\n      }\n\n      /**\n       * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n       * The order of the checks is important to recognize the HTML drop.\n       */\n      if (event.dataTransfer.types.includes('text/html')) {\n        setIsActive(!!onHTMLDrop);\n      } else if (\n      // Check for the types because sometimes the files themselves\n      // are only available on drop.\n      event.dataTransfer.types.includes('Files') || getFilesFromDataTransfer(event.dataTransfer).length > 0) {\n        setIsActive(!!onFilesDrop);\n      } else {\n        setIsActive(!!onDrop && isEligible(event.dataTransfer));\n      }\n    },\n    onDragEnd() {\n      setIsDraggingOverElement(false);\n      setIsDraggingOverDocument(false);\n      setIsActive(undefined);\n    },\n    onDragEnter() {\n      setIsDraggingOverElement(true);\n    },\n    onDragLeave() {\n      setIsDraggingOverElement(false);\n    }\n  });\n  const classes = clsx('components-drop-zone', className, {\n    'is-active': isActive,\n    'is-dragging-over-document': isDraggingOverDocument,\n    'is-dragging-over-element': isDraggingOverElement\n  });\n  return /*#__PURE__*/_jsx(\"div\", {\n    ...restProps,\n    ref: ref,\n    className: classes,\n    children: /*#__PURE__*/_jsx(\"div\", {\n      className: \"components-drop-zone__content\",\n      children: /*#__PURE__*/_jsxs(\"div\", {\n        className: \"components-drop-zone__content-inner\",\n        children: [/*#__PURE__*/_jsx(Icon, {\n          icon: icon,\n          className: \"components-drop-zone__content-icon\"\n        }), /*#__PURE__*/_jsx(\"span\", {\n          className: \"components-drop-zone__content-text\",\n          children: label ? label : __('Drop files to upload')\n        })]\n      })\n    })\n  });\n}\nexport default DropZoneComponent;"],
+  "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,QAAQ,YAAY;AAC7B,SAAS,gCAAgC;AACzC,SAAS,6BAA6B,mBAAmB;AACzD,SAAS,OAAO,MAAM,QAAQ,aAAa;AAwBpC,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,MAAM;AAAA,EACnB,GAAG;AACL,GAAG;AACD,QAAM,CAAC,wBAAwB,yBAAyB,IAAI,SAAS;AACrE,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAAS;AACnE,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS;AACzC,QAAM,MAAM,YAAY;AAAA,IACtB,OAAO,OAAO;AACZ,UAAI,CAAC,MAAM,cAAc;AACvB;AAAA,MACF;AACA,YAAM,QAAQ,yBAAyB,MAAM,YAAY;AACzD,YAAM,OAAO,MAAM,aAAa,QAAQ,WAAW;AAMnD,UAAI,QAAQ,YAAY;AACtB,mBAAW,IAAI;AAAA,MACjB,WAAW,MAAM,UAAU,aAAa;AACtC,oBAAY,KAAK;AAAA,MACnB,WAAW,QAAQ;AACjB,eAAO,KAAK;AAAA,MACd;AAAA,IACF;AAAA,IACA,YAAY,OAAO;AACjB,gCAA0B,IAAI;AAC9B,UAAI,CAAC,MAAM,cAAc;AACvB;AAAA,MACF;AAMA,UAAI,MAAM,aAAa,MAAM,SAAS,WAAW,GAAG;AAClD,oBAAY,CAAC,CAAC,UAAU;AAAA,MAC1B;AAAA;AAAA;AAAA,QAGA,MAAM,aAAa,MAAM,SAAS,OAAO,KAAK,yBAAyB,MAAM,YAAY,EAAE,SAAS;AAAA,QAAG;AACrG,oBAAY,CAAC,CAAC,WAAW;AAAA,MAC3B,OAAO;AACL,oBAAY,CAAC,CAAC,UAAU,WAAW,MAAM,YAAY,CAAC;AAAA,MACxD;AAAA,IACF;AAAA,IACA,YAAY;AACV,+BAAyB,KAAK;AAC9B,gCAA0B,KAAK;AAC/B,kBAAY,MAAS;AAAA,IACvB;AAAA,IACA,cAAc;AACZ,+BAAyB,IAAI;AAAA,IAC/B;AAAA,IACA,cAAc;AACZ,+BAAyB,KAAK;AAAA,IAChC;AAAA,EACF,CAAC;AACD,QAAM,UAAU,KAAK,wBAAwB,WAAW;AAAA,IACtD,aAAa;AAAA,IACb,6BAA6B;AAAA,IAC7B,4BAA4B;AAAA,EAC9B,CAAC;AACD,SAAoB,qBAAK,OAAO;AAAA,IAC9B,GAAG;AAAA,IACH;AAAA,IACA,WAAW;AAAA,IACX,UAAuB,qBAAK,OAAO;AAAA,MACjC,WAAW;AAAA,MACX,UAAuB,sBAAM,OAAO;AAAA,QAClC,WAAW;AAAA,QACX,UAAU,CAAc,qBAAK,MAAM;AAAA,UACjC;AAAA,UACA,WAAW;AAAA,QACb,CAAC,GAAgB,qBAAK,QAAQ;AAAA,UAC5B,WAAW;AAAA,UACX,UAAU,QAAQ,QAAQ,GAAG,sBAAsB;AAAA,QACrD,CAAC,CAAC;AAAA,MACJ,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAO,oBAAQ;",
   "names": []
 }

package/build-module/drop-zone/provider.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/drop-zone/provider.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nexport default function DropZoneProvider({\n  children\n}) {\n  deprecated('wp.components.DropZoneProvider', {\n    since: '5.8',\n    hint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.'\n  });\n  return children;\n}"],
-  "mappings": ";AAGA,OAAO,gBAAgB;AACR,SAAR,iBAAkC;AAAA,EACvC;AACF,GAAG;AACD,aAAW,kCAAkC;AAAA,IAC3C,OAAO;AAAA,IACP,MAAM;AAAA,EACR,CAAC;AACD,SAAO;AACT;",
+  "sourcesContent": ["import deprecated from '@wordpress/deprecated';\nexport default function DropZoneProvider({\n  children\n}) {\n  deprecated('wp.components.DropZoneProvider', {\n    since: '5.8',\n    hint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.'\n  });\n  return children;\n}"],
+  "mappings": ";AAAA,OAAO,gBAAgB;AACR,SAAR,iBAAkC;AAAA,EACvC;AACF,GAAG;AACD,aAAW,kCAAkC;AAAA,IAC3C,OAAO;AAAA,IACP,MAAM;AAAA,EACR,CAAC;AACD,SAAO;AACT;",
   "names": []
 }

package/build-module/dropdown/dropdown-content-wrapper.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dropdown/dropdown-content-wrapper.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * Internal dependencies\n */\n\nimport { contextConnect, useContextSystem } from '../context';\nimport { DropdownContentWrapperDiv } from './styles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction UnconnectedDropdownContentWrapper(props, forwardedRef) {\n  const {\n    paddingSize = 'small',\n    ...derivedProps\n  } = useContextSystem(props, 'DropdownContentWrapper');\n  return /*#__PURE__*/_jsx(DropdownContentWrapperDiv, {\n    ...derivedProps,\n    paddingSize: paddingSize,\n    ref: forwardedRef\n  });\n}\n\n/**\n * A convenience wrapper for the `renderContent` when you want to apply\n * different padding. (Default is `paddingSize=\"small\"`).\n *\n * ```jsx\n * import {\n *   Dropdown,\n *   __experimentalDropdownContentWrapper as DropdownContentWrapper,\n * } from '@wordpress/components';\n *\n * <Dropdown\n *   renderContent={ () => (\n *     <DropdownContentWrapper paddingSize=\"medium\">\n *       My dropdown content\n *     </DropdownContentWrapper>\n * ) }\n * />\n * ```\n */\nexport const DropdownContentWrapper = contextConnect(UnconnectedDropdownContentWrapper, 'DropdownContentWrapper');\nexport default DropdownContentWrapper;"],
-  "mappings": ";AAQA,SAAS,gBAAgB,wBAAwB;AACjD,SAAS,iCAAiC;AAC1C,SAAS,OAAO,YAAY;AAC5B,SAAS,kCAAkC,OAAO,cAAc;AAC9D,QAAM;AAAA,IACJ,cAAc;AAAA,IACd,GAAG;AAAA,EACL,IAAI,iBAAiB,OAAO,wBAAwB;AACpD,SAAoB,qBAAK,2BAA2B;AAAA,IAClD,GAAG;AAAA,IACH;AAAA,IACA,KAAK;AAAA,EACP,CAAC;AACH;AAqBO,IAAM,yBAAyB,eAAe,mCAAmC,wBAAwB;AAChH,IAAO,mCAAQ;",
+  "sourcesContent": ["import { contextConnect, useContextSystem } from '../context';\nimport { DropdownContentWrapperDiv } from './styles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction UnconnectedDropdownContentWrapper(props, forwardedRef) {\n  const {\n    paddingSize = 'small',\n    ...derivedProps\n  } = useContextSystem(props, 'DropdownContentWrapper');\n  return /*#__PURE__*/_jsx(DropdownContentWrapperDiv, {\n    ...derivedProps,\n    paddingSize: paddingSize,\n    ref: forwardedRef\n  });\n}\n\n/**\n * A convenience wrapper for the `renderContent` when you want to apply\n * different padding. (Default is `paddingSize=\"small\"`).\n *\n * ```jsx\n * import {\n *   Dropdown,\n *   __experimentalDropdownContentWrapper as DropdownContentWrapper,\n * } from '@wordpress/components';\n *\n * <Dropdown\n *   renderContent={ () => (\n *     <DropdownContentWrapper paddingSize=\"medium\">\n *       My dropdown content\n *     </DropdownContentWrapper>\n * ) }\n * />\n * ```\n */\nexport const DropdownContentWrapper = contextConnect(UnconnectedDropdownContentWrapper, 'DropdownContentWrapper');\nexport default DropdownContentWrapper;"],
+  "mappings": ";AAAA,SAAS,gBAAgB,wBAAwB;AACjD,SAAS,iCAAiC;AAC1C,SAAS,OAAO,YAAY;AAC5B,SAAS,kCAAkC,OAAO,cAAc;AAC9D,QAAM;AAAA,IACJ,cAAc;AAAA,IACd,GAAG;AAAA,EACL,IAAI,iBAAiB,OAAO,wBAAwB;AACpD,SAAoB,qBAAK,2BAA2B;AAAA,IAClD,GAAG;AAAA,IACH;AAAA,IACA,KAAK;AAAA,EACP,CAAC;AACH;AAqBO,IAAM,yBAAyB,eAAe,mCAAmC,wBAAwB;AAChH,IAAO,mCAAQ;",
   "names": []
 }

package/build-module/dropdown/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dropdown/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../context';\nimport { useControlledValue } from '../utils/hooks';\nimport Popover from '../popover';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnconnectedDropdown = (props, forwardedRef) => {\n  const {\n    renderContent,\n    renderToggle,\n    className,\n    contentClassName,\n    expandOnMobile,\n    headerTitle,\n    focusOnMount,\n    popoverProps,\n    onClose,\n    onToggle,\n    style,\n    open,\n    defaultOpen,\n    // Deprecated props\n    position,\n    // From context system\n    variant\n  } = useContextSystem(props, 'Dropdown');\n  if (position !== undefined) {\n    deprecated('`position` prop in wp.components.Dropdown', {\n      since: '6.2',\n      alternative: '`popoverProps.placement` prop',\n      hint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.'\n    });\n  }\n\n  // Use internal state instead of a ref to make sure that the component\n  // re-renders when the popover's anchor updates.\n  const [fallbackPopoverAnchor, setFallbackPopoverAnchor] = useState(null);\n  const containerRef = useRef(null);\n  const [isOpen, setIsOpen] = useControlledValue({\n    defaultValue: defaultOpen,\n    value: open,\n    onChange: onToggle\n  });\n\n  /**\n   * Closes the popover when focus leaves it unless the toggle was pressed or\n   * focus has moved to a separate dialog. The former is to let the toggle\n   * handle closing the popover and the latter is to preserve presence in\n   * case a dialog has opened, allowing focus to return when it's dismissed.\n   */\n  function closeIfFocusOutside() {\n    if (!containerRef.current) {\n      return;\n    }\n    const {\n      ownerDocument\n    } = containerRef.current;\n    const dialog = ownerDocument?.activeElement?.closest('[role=\"dialog\"]');\n    if (!containerRef.current.contains(ownerDocument.activeElement) && (!dialog || dialog.contains(containerRef.current))) {\n      close();\n    }\n  }\n  function close() {\n    onClose?.();\n    setIsOpen(false);\n  }\n  const args = {\n    isOpen: !!isOpen,\n    onToggle: () => setIsOpen(!isOpen),\n    onClose: close\n  };\n  const popoverPropsHaveAnchor = !!popoverProps?.anchor ||\n  // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n  // be removed from `Popover` from WordPress 6.3\n  !!popoverProps?.anchorRef || !!popoverProps?.getAnchorRect || !!popoverProps?.anchorRect;\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: className,\n    ref: useMergeRefs([containerRef, forwardedRef, setFallbackPopoverAnchor])\n    // Some UAs focus the closest focusable parent when the toggle is\n    // clicked. Making this div focusable ensures such UAs will focus\n    // it and `closeIfFocusOutside` can tell if the toggle was clicked.\n    ,\n    tabIndex: -1,\n    style: style,\n    children: [renderToggle(args), isOpen && /*#__PURE__*/_jsx(Popover, {\n      position: position,\n      onClose: close,\n      onFocusOutside: closeIfFocusOutside,\n      expandOnMobile: expandOnMobile,\n      headerTitle: headerTitle,\n      focusOnMount: focusOnMount\n      // This value is used to ensure that the dropdowns\n      // align with the editor header by default.\n      ,\n      offset: 13,\n      anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined,\n      variant: variant,\n      ...popoverProps,\n      className: clsx('components-dropdown__content', popoverProps?.className, contentClassName),\n      children: renderContent(args)\n    })]\n  });\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 = contextConnect(UnconnectedDropdown, 'Dropdown');\nexport default Dropdown;"],
-  "mappings": ";AAGA,OAAO,UAAU;AAIjB,SAAS,QAAQ,gBAAgB;AACjC,SAAS,oBAAoB;AAC7B,OAAO,gBAAgB;AAKvB,SAAS,gBAAgB,wBAAwB;AACjD,SAAS,0BAA0B;AACnC,OAAO,aAAa;AACpB,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,sBAAsB,CAAC,OAAO,iBAAiB;AACnD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA,EACF,IAAI,iBAAiB,OAAO,UAAU;AACtC,MAAI,aAAa,QAAW;AAC1B,eAAW,6CAA6C;AAAA,MACtD,OAAO;AAAA,MACP,aAAa;AAAA,MACb,MAAM;AAAA,IACR,CAAC;AAAA,EACH;AAIA,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAAS,IAAI;AACvE,QAAM,eAAe,OAAO,IAAI;AAChC,QAAM,CAAC,QAAQ,SAAS,IAAI,mBAAmB;AAAA,IAC7C,cAAc;AAAA,IACd,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AAQD,WAAS,sBAAsB;AAC7B,QAAI,CAAC,aAAa,SAAS;AACzB;AAAA,IACF;AACA,UAAM;AAAA,MACJ;AAAA,IACF,IAAI,aAAa;AACjB,UAAM,SAAS,eAAe,eAAe,QAAQ,iBAAiB;AACtE,QAAI,CAAC,aAAa,QAAQ,SAAS,cAAc,aAAa,MAAM,CAAC,UAAU,OAAO,SAAS,aAAa,OAAO,IAAI;AACrH,YAAM;AAAA,IACR;AAAA,EACF;AACA,WAAS,QAAQ;AACf,cAAU;AACV,cAAU,KAAK;AAAA,EACjB;AACA,QAAM,OAAO;AAAA,IACX,QAAQ,CAAC,CAAC;AAAA,IACV,UAAU,MAAM,UAAU,CAAC,MAAM;AAAA,IACjC,SAAS;AAAA,EACX;AACA,QAAM,yBAAyB,CAAC,CAAC,cAAc;AAAA;AAAA,EAG/C,CAAC,CAAC,cAAc,aAAa,CAAC,CAAC,cAAc,iBAAiB,CAAC,CAAC,cAAc;AAC9E,SAAoB,sBAAM,OAAO;AAAA,IAC/B;AAAA,IACA,KAAK,aAAa,CAAC,cAAc,cAAc,wBAAwB,CAAC;AAAA,IAKxE,UAAU;AAAA,IACV;AAAA,IACA,UAAU,CAAC,aAAa,IAAI,GAAG,UAAuB,qBAAK,SAAS;AAAA,MAClE;AAAA,MACA,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MAIA,QAAQ;AAAA,MACR,QAAQ,CAAC,yBAAyB,wBAAwB;AAAA,MAC1D;AAAA,MACA,GAAG;AAAA,MACH,WAAW,KAAK,gCAAgC,cAAc,WAAW,gBAAgB;AAAA,MACzF,UAAU,cAAc,IAAI;AAAA,IAC9B,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AA2BO,IAAM,WAAW,eAAe,qBAAqB,UAAU;AACtE,IAAO,mBAAQ;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\nimport { contextConnect, useContextSystem } from '../context';\nimport { useControlledValue } from '../utils/hooks';\nimport Popover from '../popover';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnconnectedDropdown = (props, forwardedRef) => {\n  const {\n    renderContent,\n    renderToggle,\n    className,\n    contentClassName,\n    expandOnMobile,\n    headerTitle,\n    focusOnMount,\n    popoverProps,\n    onClose,\n    onToggle,\n    style,\n    open,\n    defaultOpen,\n    // Deprecated props\n    position,\n    // From context system\n    variant\n  } = useContextSystem(props, 'Dropdown');\n  if (position !== undefined) {\n    deprecated('`position` prop in wp.components.Dropdown', {\n      since: '6.2',\n      alternative: '`popoverProps.placement` prop',\n      hint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.'\n    });\n  }\n\n  // Use internal state instead of a ref to make sure that the component\n  // re-renders when the popover's anchor updates.\n  const [fallbackPopoverAnchor, setFallbackPopoverAnchor] = useState(null);\n  const containerRef = useRef(null);\n  const [isOpen, setIsOpen] = useControlledValue({\n    defaultValue: defaultOpen,\n    value: open,\n    onChange: onToggle\n  });\n\n  /**\n   * Closes the popover when focus leaves it unless the toggle was pressed or\n   * focus has moved to a separate dialog. The former is to let the toggle\n   * handle closing the popover and the latter is to preserve presence in\n   * case a dialog has opened, allowing focus to return when it's dismissed.\n   */\n  function closeIfFocusOutside() {\n    if (!containerRef.current) {\n      return;\n    }\n    const {\n      ownerDocument\n    } = containerRef.current;\n    const dialog = ownerDocument?.activeElement?.closest('[role=\"dialog\"]');\n    if (!containerRef.current.contains(ownerDocument.activeElement) && (!dialog || dialog.contains(containerRef.current))) {\n      close();\n    }\n  }\n  function close() {\n    onClose?.();\n    setIsOpen(false);\n  }\n  const args = {\n    isOpen: !!isOpen,\n    onToggle: () => setIsOpen(!isOpen),\n    onClose: close\n  };\n  const popoverPropsHaveAnchor = !!popoverProps?.anchor ||\n  // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n  // be removed from `Popover` from WordPress 6.3\n  !!popoverProps?.anchorRef || !!popoverProps?.getAnchorRect || !!popoverProps?.anchorRect;\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: className,\n    ref: useMergeRefs([containerRef, forwardedRef, setFallbackPopoverAnchor])\n    // Some UAs focus the closest focusable parent when the toggle is\n    // clicked. Making this div focusable ensures such UAs will focus\n    // it and `closeIfFocusOutside` can tell if the toggle was clicked.\n    ,\n    tabIndex: -1,\n    style: style,\n    children: [renderToggle(args), isOpen && /*#__PURE__*/_jsx(Popover, {\n      position: position,\n      onClose: close,\n      onFocusOutside: closeIfFocusOutside,\n      expandOnMobile: expandOnMobile,\n      headerTitle: headerTitle,\n      focusOnMount: focusOnMount\n      // This value is used to ensure that the dropdowns\n      // align with the editor header by default.\n      ,\n      offset: 13,\n      anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined,\n      variant: variant,\n      ...popoverProps,\n      className: clsx('components-dropdown__content', popoverProps?.className, contentClassName),\n      children: renderContent(args)\n    })]\n  });\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 = contextConnect(UnconnectedDropdown, 'Dropdown');\nexport default Dropdown;"],
+  "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,QAAQ,gBAAgB;AACjC,SAAS,oBAAoB;AAC7B,OAAO,gBAAgB;AACvB,SAAS,gBAAgB,wBAAwB;AACjD,SAAS,0BAA0B;AACnC,OAAO,aAAa;AACpB,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,sBAAsB,CAAC,OAAO,iBAAiB;AACnD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA,EACF,IAAI,iBAAiB,OAAO,UAAU;AACtC,MAAI,aAAa,QAAW;AAC1B,eAAW,6CAA6C;AAAA,MACtD,OAAO;AAAA,MACP,aAAa;AAAA,MACb,MAAM;AAAA,IACR,CAAC;AAAA,EACH;AAIA,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAAS,IAAI;AACvE,QAAM,eAAe,OAAO,IAAI;AAChC,QAAM,CAAC,QAAQ,SAAS,IAAI,mBAAmB;AAAA,IAC7C,cAAc;AAAA,IACd,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AAQD,WAAS,sBAAsB;AAC7B,QAAI,CAAC,aAAa,SAAS;AACzB;AAAA,IACF;AACA,UAAM;AAAA,MACJ;AAAA,IACF,IAAI,aAAa;AACjB,UAAM,SAAS,eAAe,eAAe,QAAQ,iBAAiB;AACtE,QAAI,CAAC,aAAa,QAAQ,SAAS,cAAc,aAAa,MAAM,CAAC,UAAU,OAAO,SAAS,aAAa,OAAO,IAAI;AACrH,YAAM;AAAA,IACR;AAAA,EACF;AACA,WAAS,QAAQ;AACf,cAAU;AACV,cAAU,KAAK;AAAA,EACjB;AACA,QAAM,OAAO;AAAA,IACX,QAAQ,CAAC,CAAC;AAAA,IACV,UAAU,MAAM,UAAU,CAAC,MAAM;AAAA,IACjC,SAAS;AAAA,EACX;AACA,QAAM,yBAAyB,CAAC,CAAC,cAAc;AAAA;AAAA,EAG/C,CAAC,CAAC,cAAc,aAAa,CAAC,CAAC,cAAc,iBAAiB,CAAC,CAAC,cAAc;AAC9E,SAAoB,sBAAM,OAAO;AAAA,IAC/B;AAAA,IACA,KAAK,aAAa,CAAC,cAAc,cAAc,wBAAwB,CAAC;AAAA,IAKxE,UAAU;AAAA,IACV;AAAA,IACA,UAAU,CAAC,aAAa,IAAI,GAAG,UAAuB,qBAAK,SAAS;AAAA,MAClE;AAAA,MACA,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MAIA,QAAQ;AAAA,MACR,QAAQ,CAAC,yBAAyB,wBAAwB;AAAA,MAC1D;AAAA,MACA,GAAG;AAAA,MACH,WAAW,KAAK,gCAAgC,cAAc,WAAW,gBAAgB;AAAA,MACzF,UAAU,cAAc,IAAI;AAAA,IAC9B,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AA2BO,IAAM,WAAW,eAAe,qBAAqB,UAAU;AACtE,IAAO,mBAAQ;",
   "names": []
 }

package/build-module/dropdown/styles.mjs

@@ -12,14 +12,14 @@ var padding = ({
     small: space(2),
     medium: space(4)
   };
-  return /* @__PURE__ */ css("padding:", paddingValues[paddingSize] || paddingValues.small, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:padding;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQlciLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB0eXBlIHsgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IHBhZGRpbmcgPSAoIHsgcGFkZGluZ1NpemUgPSAnc21hbGwnIH06IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyApID0+IHtcblx0aWYgKCBwYWRkaW5nU2l6ZSA9PT0gJ25vbmUnICkge1xuXHRcdHJldHVybjtcblx0fVxuXG5cdGNvbnN0IHBhZGRpbmdWYWx1ZXMgPSB7XG5cdFx0c21hbGw6IHNwYWNlKCAyICksXG5cdFx0bWVkaXVtOiBzcGFjZSggNCApLFxuXHR9O1xuXG5cdHJldHVybiBjc3NgXG5cdFx0cGFkZGluZzogJHsgcGFkZGluZ1ZhbHVlc1sgcGFkZGluZ1NpemUgXSB8fCBwYWRkaW5nVmFsdWVzLnNtYWxsIH07XG5cdGA7XG59O1xuXG5leHBvcnQgY29uc3QgRHJvcGRvd25Db250ZW50V3JhcHBlckRpdiA9IHN0eWxlZC5kaXY8IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyA+YFxuXHQvLyBOZWdhdGl2ZSBtYXJnaW4gdG8gcmVzZXQgKG9mZnNldCkgdGhlIGRlZmF1bHQgcGFkZGluZyBvbiAuY29tcG9uZW50cy1wb3BvdmVyX19jb250ZW50XG5cdG1hcmdpbi1sZWZ0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHRtYXJnaW4tcmlnaHQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdCY6Zmlyc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLXRvcDogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXHQmOmxhc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLWJvdHRvbTogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXG5cdCR7IHBhZGRpbmcgfTtcbmA7XG4iXX0= */");
+  return /* @__PURE__ */ css("padding:", paddingValues[paddingSize] || paddingValues.small, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:padding;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlVyIsImZpbGUiOiJzdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB0eXBlIHsgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IHBhZGRpbmcgPSAoIHsgcGFkZGluZ1NpemUgPSAnc21hbGwnIH06IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyApID0+IHtcblx0aWYgKCBwYWRkaW5nU2l6ZSA9PT0gJ25vbmUnICkge1xuXHRcdHJldHVybjtcblx0fVxuXG5cdGNvbnN0IHBhZGRpbmdWYWx1ZXMgPSB7XG5cdFx0c21hbGw6IHNwYWNlKCAyICksXG5cdFx0bWVkaXVtOiBzcGFjZSggNCApLFxuXHR9O1xuXG5cdHJldHVybiBjc3NgXG5cdFx0cGFkZGluZzogJHsgcGFkZGluZ1ZhbHVlc1sgcGFkZGluZ1NpemUgXSB8fCBwYWRkaW5nVmFsdWVzLnNtYWxsIH07XG5cdGA7XG59O1xuXG5leHBvcnQgY29uc3QgRHJvcGRvd25Db250ZW50V3JhcHBlckRpdiA9IHN0eWxlZC5kaXY8IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyA+YFxuXHQvLyBOZWdhdGl2ZSBtYXJnaW4gdG8gcmVzZXQgKG9mZnNldCkgdGhlIGRlZmF1bHQgcGFkZGluZyBvbiAuY29tcG9uZW50cy1wb3BvdmVyX19jb250ZW50XG5cdG1hcmdpbi1sZWZ0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHRtYXJnaW4tcmlnaHQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdCY6Zmlyc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLXRvcDogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXHQmOmxhc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLWJvdHRvbTogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXG5cdCR7IHBhZGRpbmcgfTtcbmA7XG4iXX0= */");
 };
 var DropdownContentWrapperDiv = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eovvns30"
 } : {
   target: "eovvns30",
   label: "DropdownContentWrapperDiv"
-})("margin-left:", space(-2), ";margin-right:", space(-2), ";&:first-of-type{margin-top:", space(-2), ";}&:last-of-type{margin-bottom:", space(-2), ";}", padding, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQmtGIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgdHlwZSB7IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBwYWRkaW5nID0gKCB7IHBhZGRpbmdTaXplID0gJ3NtYWxsJyB9OiBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgKSA9PiB7XG5cdGlmICggcGFkZGluZ1NpemUgPT09ICdub25lJyApIHtcblx0XHRyZXR1cm47XG5cdH1cblxuXHRjb25zdCBwYWRkaW5nVmFsdWVzID0ge1xuXHRcdHNtYWxsOiBzcGFjZSggMiApLFxuXHRcdG1lZGl1bTogc3BhY2UoIDQgKSxcblx0fTtcblxuXHRyZXR1cm4gY3NzYFxuXHRcdHBhZGRpbmc6ICR7IHBhZGRpbmdWYWx1ZXNbIHBhZGRpbmdTaXplIF0gfHwgcGFkZGluZ1ZhbHVlcy5zbWFsbCB9O1xuXHRgO1xufTtcblxuZXhwb3J0IGNvbnN0IERyb3Bkb3duQ29udGVudFdyYXBwZXJEaXYgPSBzdHlsZWQuZGl2PCBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgPmBcblx0Ly8gTmVnYXRpdmUgbWFyZ2luIHRvIHJlc2V0IChvZmZzZXQpIHRoZSBkZWZhdWx0IHBhZGRpbmcgb24gLmNvbXBvbmVudHMtcG9wb3Zlcl9fY29udGVudFxuXHRtYXJnaW4tbGVmdDogJHsgc3BhY2UoIC0yICkgfTtcblx0bWFyZ2luLXJpZ2h0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHQmOmZpcnN0LW9mLXR5cGUge1xuXHRcdG1hcmdpbi10b3A6ICR7IHNwYWNlKCAtMiApIH07XG5cdH1cblx0JjpsYXN0LW9mLXR5cGUge1xuXHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAtMiApIH07XG5cdH1cblxuXHQkeyBwYWRkaW5nIH07XG5gO1xuIl19 */"));
+})("margin-left:", space(-2), ";margin-right:", space(-2), ";&:first-of-type{margin-top:", space(-2), ";}&:last-of-type{margin-bottom:", space(-2), ";}", padding, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQmtGIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHR5cGUgeyBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgcGFkZGluZyA9ICggeyBwYWRkaW5nU2l6ZSA9ICdzbWFsbCcgfTogRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzICkgPT4ge1xuXHRpZiAoIHBhZGRpbmdTaXplID09PSAnbm9uZScgKSB7XG5cdFx0cmV0dXJuO1xuXHR9XG5cblx0Y29uc3QgcGFkZGluZ1ZhbHVlcyA9IHtcblx0XHRzbWFsbDogc3BhY2UoIDIgKSxcblx0XHRtZWRpdW06IHNwYWNlKCA0ICksXG5cdH07XG5cblx0cmV0dXJuIGNzc2Bcblx0XHRwYWRkaW5nOiAkeyBwYWRkaW5nVmFsdWVzWyBwYWRkaW5nU2l6ZSBdIHx8IHBhZGRpbmdWYWx1ZXMuc21hbGwgfTtcblx0YDtcbn07XG5cbmV4cG9ydCBjb25zdCBEcm9wZG93bkNvbnRlbnRXcmFwcGVyRGl2ID0gc3R5bGVkLmRpdjwgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzID5gXG5cdC8vIE5lZ2F0aXZlIG1hcmdpbiB0byByZXNldCAob2Zmc2V0KSB0aGUgZGVmYXVsdCBwYWRkaW5nIG9uIC5jb21wb25lbnRzLXBvcG92ZXJfX2NvbnRlbnRcblx0bWFyZ2luLWxlZnQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdG1hcmdpbi1yaWdodDogJHsgc3BhY2UoIC0yICkgfTtcblx0JjpmaXJzdC1vZi10eXBlIHtcblx0XHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTIgKSB9O1xuXHR9XG5cdCY6bGFzdC1vZi10eXBlIHtcblx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggLTIgKSB9O1xuXHR9XG5cblx0JHsgcGFkZGluZyB9O1xuYDtcbiJdfQ== */"));
 export {
   DropdownContentWrapperDiv
 };

package/build-module/dropdown/styles.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dropdown/styles.ts"],
-  "sourcesContent": ["import _styled from \"@emotion/styled/base\";\n/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n/**\n * Internal dependencies\n */\nimport { space } from '../utils/space';\nconst padding = ({\n  paddingSize = 'small'\n}) => {\n  if (paddingSize === 'none') {\n    return;\n  }\n  const paddingValues = {\n    small: space(2),\n    medium: space(4)\n  };\n  return /*#__PURE__*/css(\"padding:\", paddingValues[paddingSize] || paddingValues.small, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \";label:padding;\"), process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQlciLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB0eXBlIHsgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IHBhZGRpbmcgPSAoIHsgcGFkZGluZ1NpemUgPSAnc21hbGwnIH06IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyApID0+IHtcblx0aWYgKCBwYWRkaW5nU2l6ZSA9PT0gJ25vbmUnICkge1xuXHRcdHJldHVybjtcblx0fVxuXG5cdGNvbnN0IHBhZGRpbmdWYWx1ZXMgPSB7XG5cdFx0c21hbGw6IHNwYWNlKCAyICksXG5cdFx0bWVkaXVtOiBzcGFjZSggNCApLFxuXHR9O1xuXG5cdHJldHVybiBjc3NgXG5cdFx0cGFkZGluZzogJHsgcGFkZGluZ1ZhbHVlc1sgcGFkZGluZ1NpemUgXSB8fCBwYWRkaW5nVmFsdWVzLnNtYWxsIH07XG5cdGA7XG59O1xuXG5leHBvcnQgY29uc3QgRHJvcGRvd25Db250ZW50V3JhcHBlckRpdiA9IHN0eWxlZC5kaXY8IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyA+YFxuXHQvLyBOZWdhdGl2ZSBtYXJnaW4gdG8gcmVzZXQgKG9mZnNldCkgdGhlIGRlZmF1bHQgcGFkZGluZyBvbiAuY29tcG9uZW50cy1wb3BvdmVyX19jb250ZW50XG5cdG1hcmdpbi1sZWZ0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHRtYXJnaW4tcmlnaHQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdCY6Zmlyc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLXRvcDogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXHQmOmxhc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLWJvdHRvbTogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXG5cdCR7IHBhZGRpbmcgfTtcbmA7XG4iXX0= */\");\n};\nexport const DropdownContentWrapperDiv = /*#__PURE__*/_styled(\"div\", process.env.NODE_ENV === \"production\" ? {\n  target: \"eovvns30\"\n} : {\n  target: \"eovvns30\",\n  label: \"DropdownContentWrapperDiv\"\n})(\"margin-left:\", space(-2), \";margin-right:\", space(-2), \";&:first-of-type{margin-top:\", space(-2), \";}&:last-of-type{margin-bottom:\", space(-2), \";}\", padding, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQmtGIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgdHlwZSB7IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBwYWRkaW5nID0gKCB7IHBhZGRpbmdTaXplID0gJ3NtYWxsJyB9OiBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgKSA9PiB7XG5cdGlmICggcGFkZGluZ1NpemUgPT09ICdub25lJyApIHtcblx0XHRyZXR1cm47XG5cdH1cblxuXHRjb25zdCBwYWRkaW5nVmFsdWVzID0ge1xuXHRcdHNtYWxsOiBzcGFjZSggMiApLFxuXHRcdG1lZGl1bTogc3BhY2UoIDQgKSxcblx0fTtcblxuXHRyZXR1cm4gY3NzYFxuXHRcdHBhZGRpbmc6ICR7IHBhZGRpbmdWYWx1ZXNbIHBhZGRpbmdTaXplIF0gfHwgcGFkZGluZ1ZhbHVlcy5zbWFsbCB9O1xuXHRgO1xufTtcblxuZXhwb3J0IGNvbnN0IERyb3Bkb3duQ29udGVudFdyYXBwZXJEaXYgPSBzdHlsZWQuZGl2PCBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgPmBcblx0Ly8gTmVnYXRpdmUgbWFyZ2luIHRvIHJlc2V0IChvZmZzZXQpIHRoZSBkZWZhdWx0IHBhZGRpbmcgb24gLmNvbXBvbmVudHMtcG9wb3Zlcl9fY29udGVudFxuXHRtYXJnaW4tbGVmdDogJHsgc3BhY2UoIC0yICkgfTtcblx0bWFyZ2luLXJpZ2h0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHQmOmZpcnN0LW9mLXR5cGUge1xuXHRcdG1hcmdpbi10b3A6ICR7IHNwYWNlKCAtMiApIH07XG5cdH1cblx0JjpsYXN0LW9mLXR5cGUge1xuXHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAtMiApIH07XG5cdH1cblxuXHQkeyBwYWRkaW5nIH07XG5gO1xuIl19 */\"));"],
-  "mappings": ";AAAA,OAAO,aAAa;AAIpB,SAAS,WAAW;AAIpB,SAAS,aAAa;AACtB,IAAM,UAAU,CAAC;AAAA,EACf,cAAc;AAChB,MAAM;AACJ,MAAI,gBAAgB,QAAQ;AAC1B;AAAA,EACF;AACA,QAAM,gBAAgB;AAAA,IACpB,OAAO,MAAM,CAAC;AAAA,IACd,QAAQ,MAAM,CAAC;AAAA,EACjB;AACA,SAAoB,oBAAI,YAAY,cAAc,WAAW,KAAK,cAAc,OAAO,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,oBAAoB,QAAQ,IAAI,aAAa,eAAe,KAAK,i+CAAi+C;AAC/qD;AACO,IAAM,4BAAyC,wBAAQ,OAAO,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC3G,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,gBAAgB,MAAM,EAAE,GAAG,kBAAkB,MAAM,EAAE,GAAG,gCAAgC,MAAM,EAAE,GAAG,mCAAmC,MAAM,EAAE,GAAG,MAAM,SAAS,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,k+CAAk+C;",
+  "sourcesContent": ["import _styled from \"@emotion/styled/base\";\nimport { css } from '@emotion/react';\nimport { space } from '../utils/space';\nconst padding = ({\n  paddingSize = 'small'\n}) => {\n  if (paddingSize === 'none') {\n    return;\n  }\n  const paddingValues = {\n    small: space(2),\n    medium: space(4)\n  };\n  return /*#__PURE__*/css(\"padding:\", paddingValues[paddingSize] || paddingValues.small, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \";label:padding;\"), process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlVyIsImZpbGUiOiJzdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3V0aWxzL3NwYWNlJztcbmltcG9ydCB0eXBlIHsgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IHBhZGRpbmcgPSAoIHsgcGFkZGluZ1NpemUgPSAnc21hbGwnIH06IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyApID0+IHtcblx0aWYgKCBwYWRkaW5nU2l6ZSA9PT0gJ25vbmUnICkge1xuXHRcdHJldHVybjtcblx0fVxuXG5cdGNvbnN0IHBhZGRpbmdWYWx1ZXMgPSB7XG5cdFx0c21hbGw6IHNwYWNlKCAyICksXG5cdFx0bWVkaXVtOiBzcGFjZSggNCApLFxuXHR9O1xuXG5cdHJldHVybiBjc3NgXG5cdFx0cGFkZGluZzogJHsgcGFkZGluZ1ZhbHVlc1sgcGFkZGluZ1NpemUgXSB8fCBwYWRkaW5nVmFsdWVzLnNtYWxsIH07XG5cdGA7XG59O1xuXG5leHBvcnQgY29uc3QgRHJvcGRvd25Db250ZW50V3JhcHBlckRpdiA9IHN0eWxlZC5kaXY8IERyb3Bkb3duQ29udGVudFdyYXBwZXJQcm9wcyA+YFxuXHQvLyBOZWdhdGl2ZSBtYXJnaW4gdG8gcmVzZXQgKG9mZnNldCkgdGhlIGRlZmF1bHQgcGFkZGluZyBvbiAuY29tcG9uZW50cy1wb3BvdmVyX19jb250ZW50XG5cdG1hcmdpbi1sZWZ0OiAkeyBzcGFjZSggLTIgKSB9O1xuXHRtYXJnaW4tcmlnaHQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdCY6Zmlyc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLXRvcDogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXHQmOmxhc3Qtb2YtdHlwZSB7XG5cdFx0bWFyZ2luLWJvdHRvbTogJHsgc3BhY2UoIC0yICkgfTtcblx0fVxuXG5cdCR7IHBhZGRpbmcgfTtcbmA7XG4iXX0= */\");\n};\nexport const DropdownContentWrapperDiv = /*#__PURE__*/_styled(\"div\", process.env.NODE_ENV === \"production\" ? {\n  target: \"eovvns30\"\n} : {\n  target: \"eovvns30\",\n  label: \"DropdownContentWrapperDiv\"\n})(\"margin-left:\", space(-2), \";margin-right:\", space(-2), \";&:first-of-type{margin-top:\", space(-2), \";}&:last-of-type{margin-bottom:\", space(-2), \";}\", padding, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQmtGIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHR5cGUgeyBEcm9wZG93bkNvbnRlbnRXcmFwcGVyUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgcGFkZGluZyA9ICggeyBwYWRkaW5nU2l6ZSA9ICdzbWFsbCcgfTogRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzICkgPT4ge1xuXHRpZiAoIHBhZGRpbmdTaXplID09PSAnbm9uZScgKSB7XG5cdFx0cmV0dXJuO1xuXHR9XG5cblx0Y29uc3QgcGFkZGluZ1ZhbHVlcyA9IHtcblx0XHRzbWFsbDogc3BhY2UoIDIgKSxcblx0XHRtZWRpdW06IHNwYWNlKCA0ICksXG5cdH07XG5cblx0cmV0dXJuIGNzc2Bcblx0XHRwYWRkaW5nOiAkeyBwYWRkaW5nVmFsdWVzWyBwYWRkaW5nU2l6ZSBdIHx8IHBhZGRpbmdWYWx1ZXMuc21hbGwgfTtcblx0YDtcbn07XG5cbmV4cG9ydCBjb25zdCBEcm9wZG93bkNvbnRlbnRXcmFwcGVyRGl2ID0gc3R5bGVkLmRpdjwgRHJvcGRvd25Db250ZW50V3JhcHBlclByb3BzID5gXG5cdC8vIE5lZ2F0aXZlIG1hcmdpbiB0byByZXNldCAob2Zmc2V0KSB0aGUgZGVmYXVsdCBwYWRkaW5nIG9uIC5jb21wb25lbnRzLXBvcG92ZXJfX2NvbnRlbnRcblx0bWFyZ2luLWxlZnQ6ICR7IHNwYWNlKCAtMiApIH07XG5cdG1hcmdpbi1yaWdodDogJHsgc3BhY2UoIC0yICkgfTtcblx0JjpmaXJzdC1vZi10eXBlIHtcblx0XHRtYXJnaW4tdG9wOiAkeyBzcGFjZSggLTIgKSB9O1xuXHR9XG5cdCY6bGFzdC1vZi10eXBlIHtcblx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggLTIgKSB9O1xuXHR9XG5cblx0JHsgcGFkZGluZyB9O1xuYDtcbiJdfQ== */\"));"],
+  "mappings": ";AAAA,OAAO,aAAa;AACpB,SAAS,WAAW;AACpB,SAAS,aAAa;AACtB,IAAM,UAAU,CAAC;AAAA,EACf,cAAc;AAChB,MAAM;AACJ,MAAI,gBAAgB,QAAQ;AAC1B;AAAA,EACF;AACA,QAAM,gBAAgB;AAAA,IACpB,OAAO,MAAM,CAAC;AAAA,IACd,QAAQ,MAAM,CAAC;AAAA,EACjB;AACA,SAAoB,oBAAI,YAAY,cAAc,WAAW,KAAK,cAAc,OAAO,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,oBAAoB,QAAQ,IAAI,aAAa,eAAe,KAAK,63CAA63C;AAC3kD;AACO,IAAM,4BAAyC,wBAAQ,OAAO,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC3G,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,gBAAgB,MAAM,EAAE,GAAG,kBAAkB,MAAM,EAAE,GAAG,gCAAgC,MAAM,EAAE,GAAG,mCAAmC,MAAM,EAAE,GAAG,MAAM,SAAS,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,k4CAAk4C;",
   "names": []
 }

package/build-module/dropdown-menu/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/dropdown-menu/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { menu } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction mergeProps(defaultProps = {}, props = {}) {\n  const mergedProps = {\n    ...defaultProps,\n    ...props\n  };\n  if (props.className && defaultProps.className) {\n    mergedProps.className = clsx(props.className, defaultProps.className);\n  }\n  return mergedProps;\n}\nfunction isFunction(maybeFunc) {\n  return typeof maybeFunc === 'function';\n}\nfunction UnconnectedDropdownMenu(dropdownMenuProps) {\n  const {\n    children,\n    className,\n    controls,\n    icon = menu,\n    label,\n    popoverProps,\n    toggleProps,\n    menuProps,\n    disableOpenOnArrowDown = false,\n    text,\n    noIcons,\n    open,\n    defaultOpen,\n    onToggle: onToggleProp,\n    // Context\n    variant\n  } = useContextSystem(dropdownMenuProps, 'DropdownMenu');\n  if (!controls?.length && !isFunction(children)) {\n    return null;\n  }\n\n  // Normalize controls to nested array of objects (sets of controls)\n  let controlSets;\n  if (controls?.length) {\n    // @ts-expect-error The check below is needed because `DropdownMenus`\n    // rendered by `ToolBarGroup` receive controls as a nested array.\n    controlSets = controls;\n    if (!Array.isArray(controlSets[0])) {\n      // This is not ideal, but at this point we know that `controls` is\n      // not a nested array, even if TypeScript doesn't.\n      controlSets = [controls];\n    }\n  }\n  const mergedPopoverProps = mergeProps({\n    className: 'components-dropdown-menu__popover',\n    variant\n  }, popoverProps);\n  return /*#__PURE__*/_jsx(Dropdown, {\n    className: className,\n    popoverProps: mergedPopoverProps,\n    renderToggle: ({\n      isOpen,\n      onToggle\n    }) => {\n      const openOnArrowDown = event => {\n        if (disableOpenOnArrowDown) {\n          return;\n        }\n        if (!isOpen && event.code === 'ArrowDown') {\n          event.preventDefault();\n          onToggle();\n        }\n      };\n      const {\n        as: Toggle = Button,\n        ...restToggleProps\n      } = toggleProps ?? {};\n      const mergedToggleProps = mergeProps({\n        className: clsx('components-dropdown-menu__toggle', {\n          'is-opened': isOpen\n        })\n      }, restToggleProps);\n      return /*#__PURE__*/_jsx(Toggle, {\n        ...mergedToggleProps,\n        icon: icon,\n        onClick: event => {\n          onToggle();\n          if (mergedToggleProps.onClick) {\n            mergedToggleProps.onClick(event);\n          }\n        },\n        onKeyDown: event => {\n          openOnArrowDown(event);\n          if (mergedToggleProps.onKeyDown) {\n            mergedToggleProps.onKeyDown(event);\n          }\n        },\n        \"aria-haspopup\": \"true\",\n        \"aria-expanded\": isOpen,\n        label: label,\n        text: text,\n        showTooltip: toggleProps?.showTooltip ?? true,\n        children: mergedToggleProps.children\n      });\n    },\n    renderContent: props => {\n      const mergedMenuProps = mergeProps({\n        'aria-label': label,\n        className: clsx('components-dropdown-menu__menu', {\n          'no-icons': noIcons\n        })\n      }, menuProps);\n      return /*#__PURE__*/_jsxs(NavigableMenu, {\n        ...mergedMenuProps,\n        role: \"menu\",\n        children: [isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/_jsx(Button, {\n          size: \"compact\",\n          onClick: event => {\n            event.stopPropagation();\n            props.onClose();\n            if (control.onClick) {\n              control.onClick();\n            }\n          },\n          className: clsx('components-dropdown-menu__menu-item', {\n            'has-separator': indexOfSet > 0 && indexOfControl === 0,\n            'is-active': control.isActive,\n            'is-icon-only': !control.title\n          }),\n          icon: control.icon,\n          label: control.label,\n          \"aria-checked\": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined,\n          role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem',\n          accessibleWhenDisabled: true,\n          disabled: control.isDisabled,\n          children: control.title\n        }, [indexOfSet, indexOfControl].join())))]\n      });\n    },\n    open: open,\n    defaultOpen: defaultOpen,\n    onToggle: onToggleProp\n  });\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 */\nexport const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');\nexport default DropdownMenu;"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { menu } from '@wordpress/icons';\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport { NavigableMenu } from '../navigable-container';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction mergeProps(defaultProps = {}, props = {}) {\n  const mergedProps = {\n    ...defaultProps,\n    ...props\n  };\n  if (props.className && defaultProps.className) {\n    mergedProps.className = clsx(props.className, defaultProps.className);\n  }\n  return mergedProps;\n}\nfunction isFunction(maybeFunc) {\n  return typeof maybeFunc === 'function';\n}\nfunction UnconnectedDropdownMenu(dropdownMenuProps) {\n  const {\n    children,\n    className,\n    controls,\n    icon = menu,\n    label,\n    popoverProps,\n    toggleProps,\n    menuProps,\n    disableOpenOnArrowDown = false,\n    text,\n    noIcons,\n    open,\n    defaultOpen,\n    onToggle: onToggleProp,\n    // Context\n    variant\n  } = useContextSystem(dropdownMenuProps, 'DropdownMenu');\n  if (!controls?.length && !isFunction(children)) {\n    return null;\n  }\n\n  // Normalize controls to nested array of objects (sets of controls)\n  let controlSets;\n  if (controls?.length) {\n    // @ts-expect-error The check below is needed because `DropdownMenus`\n    // rendered by `ToolBarGroup` receive controls as a nested array.\n    controlSets = controls;\n    if (!Array.isArray(controlSets[0])) {\n      // This is not ideal, but at this point we know that `controls` is\n      // not a nested array, even if TypeScript doesn't.\n      controlSets = [controls];\n    }\n  }\n  const mergedPopoverProps = mergeProps({\n    className: 'components-dropdown-menu__popover',\n    variant\n  }, popoverProps);\n  return /*#__PURE__*/_jsx(Dropdown, {\n    className: className,\n    popoverProps: mergedPopoverProps,\n    renderToggle: ({\n      isOpen,\n      onToggle\n    }) => {\n      const openOnArrowDown = event => {\n        if (disableOpenOnArrowDown) {\n          return;\n        }\n        if (!isOpen && event.code === 'ArrowDown') {\n          event.preventDefault();\n          onToggle();\n        }\n      };\n      const {\n        as: Toggle = Button,\n        ...restToggleProps\n      } = toggleProps ?? {};\n      const mergedToggleProps = mergeProps({\n        className: clsx('components-dropdown-menu__toggle', {\n          'is-opened': isOpen\n        })\n      }, restToggleProps);\n      return /*#__PURE__*/_jsx(Toggle, {\n        ...mergedToggleProps,\n        icon: icon,\n        onClick: event => {\n          onToggle();\n          if (mergedToggleProps.onClick) {\n            mergedToggleProps.onClick(event);\n          }\n        },\n        onKeyDown: event => {\n          openOnArrowDown(event);\n          if (mergedToggleProps.onKeyDown) {\n            mergedToggleProps.onKeyDown(event);\n          }\n        },\n        \"aria-haspopup\": \"true\",\n        \"aria-expanded\": isOpen,\n        label: label,\n        text: text,\n        showTooltip: toggleProps?.showTooltip ?? true,\n        children: mergedToggleProps.children\n      });\n    },\n    renderContent: props => {\n      const mergedMenuProps = mergeProps({\n        'aria-label': label,\n        className: clsx('components-dropdown-menu__menu', {\n          'no-icons': noIcons\n        })\n      }, menuProps);\n      return /*#__PURE__*/_jsxs(NavigableMenu, {\n        ...mergedMenuProps,\n        role: \"menu\",\n        children: [isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/_jsx(Button, {\n          size: \"compact\",\n          onClick: event => {\n            event.stopPropagation();\n            props.onClose();\n            if (control.onClick) {\n              control.onClick();\n            }\n          },\n          className: clsx('components-dropdown-menu__menu-item', {\n            'has-separator': indexOfSet > 0 && indexOfControl === 0,\n            'is-active': control.isActive,\n            'is-icon-only': !control.title\n          }),\n          icon: control.icon,\n          label: control.label,\n          \"aria-checked\": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined,\n          role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem',\n          accessibleWhenDisabled: true,\n          disabled: control.isDisabled,\n          children: control.title\n        }, [indexOfSet, indexOfControl].join())))]\n      });\n    },\n    open: open,\n    defaultOpen: defaultOpen,\n    onToggle: onToggleProp\n  });\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 */\nexport const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');\nexport default DropdownMenu;"],
+  "mappings": "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",
   "names": []
 }

package/build-module/duotone-picker/color-list-picker/index.mjs

@@ -2,11 +2,11 @@
 import { useState } from "@wordpress/element";
 import { swatch } from "@wordpress/icons";
 import { __ } from "@wordpress/i18n";
+import { useInstanceId } from "@wordpress/compose";
 import Button from "../../button/index.mjs";
 import ColorPalette from "../../color-palette/index.mjs";
 import ColorIndicator from "../../color-indicator/index.mjs";
 import Icon from "../../icon/index.mjs";
-import { useInstanceId } from "@wordpress/compose";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 function ColorOption({
   label,

package/build-module/duotone-picker/color-list-picker/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/duotone-picker/color-list-picker/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport Icon from '../../icon';\nimport { useInstanceId } from '@wordpress/compose';\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction ColorOption({\n  label,\n  value,\n  colors,\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  const [isOpen, setIsOpen] = useState(false);\n  const idRoot = useInstanceId(ColorOption, 'color-list-picker-option');\n  const labelId = `${idRoot}__label`;\n  const contentId = `${idRoot}__content`;\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [/*#__PURE__*/_jsx(Button, {\n      __next40pxDefaultSize: true,\n      className: \"components-color-list-picker__swatch-button\",\n      id: labelId,\n      onClick: () => setIsOpen(prev => !prev),\n      \"aria-expanded\": isOpen,\n      \"aria-controls\": contentId,\n      icon: value ? /*#__PURE__*/_jsx(ColorIndicator, {\n        colorValue: value,\n        className: \"components-color-list-picker__swatch-color\"\n      }) : /*#__PURE__*/_jsx(Icon, {\n        icon: swatch\n      }),\n      text: label\n    }), /*#__PURE__*/_jsx(\"div\", {\n      role: \"group\",\n      id: contentId,\n      \"aria-labelledby\": labelId,\n      \"aria-hidden\": !isOpen,\n      children: isOpen && /*#__PURE__*/_jsx(ColorPalette, {\n        \"aria-label\": __('Color options'),\n        className: \"components-color-list-picker__color-picker\",\n        colors: colors,\n        value: value,\n        clearable: false,\n        onChange: onChange,\n        disableCustomColors: disableCustomColors,\n        enableAlpha: enableAlpha\n      })\n    })]\n  });\n}\nfunction ColorListPicker({\n  colors,\n  labels,\n  value = [],\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: \"components-color-list-picker\",\n    children: labels.map((label, index) => /*#__PURE__*/_jsx(ColorOption, {\n      label: label,\n      value: value[index],\n      colors: colors,\n      disableCustomColors: disableCustomColors,\n      enableAlpha: enableAlpha,\n      onChange: newColor => {\n        const newColors = value.slice();\n        newColors[index] = newColor;\n        onChange(newColors);\n      }\n    }, index))\n  });\n}\nexport default ColorListPicker;"],
-  "mappings": ";AAGA,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB,SAAS,UAAU;AAKnB,OAAO,YAAY;AACnB,OAAO,kBAAkB;AACzB,OAAO,oBAAoB;AAC3B,OAAO,UAAU;AACjB,SAAS,qBAAqB;AAC9B,SAAS,OAAO,MAAM,YAAY,WAAW,QAAQ,aAAa;AAClE,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,SAAS,cAAc,aAAa,0BAA0B;AACpE,QAAM,UAAU,GAAG,MAAM;AACzB,QAAM,YAAY,GAAG,MAAM;AAC3B,SAAoB,sBAAM,WAAW;AAAA,IACnC,UAAU,CAAc,qBAAK,QAAQ;AAAA,MACnC,uBAAuB;AAAA,MACvB,WAAW;AAAA,MACX,IAAI;AAAA,MACJ,SAAS,MAAM,UAAU,UAAQ,CAAC,IAAI;AAAA,MACtC,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,MAAM,QAAqB,qBAAK,gBAAgB;AAAA,QAC9C,YAAY;AAAA,QACZ,WAAW;AAAA,MACb,CAAC,IAAiB,qBAAK,MAAM;AAAA,QAC3B,MAAM;AAAA,MACR,CAAC;AAAA,MACD,MAAM;AAAA,IACR,CAAC,GAAgB,qBAAK,OAAO;AAAA,MAC3B,MAAM;AAAA,MACN,IAAI;AAAA,MACJ,mBAAmB;AAAA,MACnB,eAAe,CAAC;AAAA,MAChB,UAAU,UAAuB,qBAAK,cAAc;AAAA,QAClD,cAAc,GAAG,eAAe;AAAA,QAChC,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,SAAoB,qBAAK,OAAO;AAAA,IAC9B,WAAW;AAAA,IACX,UAAU,OAAO,IAAI,CAAC,OAAO,UAAuB,qBAAK,aAAa;AAAA,MACpE;AAAA,MACA,OAAO,MAAM,KAAK;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU,cAAY;AACpB,cAAM,YAAY,MAAM,MAAM;AAC9B,kBAAU,KAAK,IAAI;AACnB,iBAAS,SAAS;AAAA,MACpB;AAAA,IACF,GAAG,KAAK,CAAC;AAAA,EACX,CAAC;AACH;AACA,IAAO,4BAAQ;",
+  "sourcesContent": ["import { useState } from '@wordpress/element';\nimport { swatch } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport Button from '../../button';\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport Icon from '../../icon';\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction ColorOption({\n  label,\n  value,\n  colors,\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  const [isOpen, setIsOpen] = useState(false);\n  const idRoot = useInstanceId(ColorOption, 'color-list-picker-option');\n  const labelId = `${idRoot}__label`;\n  const contentId = `${idRoot}__content`;\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [/*#__PURE__*/_jsx(Button, {\n      __next40pxDefaultSize: true,\n      className: \"components-color-list-picker__swatch-button\",\n      id: labelId,\n      onClick: () => setIsOpen(prev => !prev),\n      \"aria-expanded\": isOpen,\n      \"aria-controls\": contentId,\n      icon: value ? /*#__PURE__*/_jsx(ColorIndicator, {\n        colorValue: value,\n        className: \"components-color-list-picker__swatch-color\"\n      }) : /*#__PURE__*/_jsx(Icon, {\n        icon: swatch\n      }),\n      text: label\n    }), /*#__PURE__*/_jsx(\"div\", {\n      role: \"group\",\n      id: contentId,\n      \"aria-labelledby\": labelId,\n      \"aria-hidden\": !isOpen,\n      children: isOpen && /*#__PURE__*/_jsx(ColorPalette, {\n        \"aria-label\": __('Color options'),\n        className: \"components-color-list-picker__color-picker\",\n        colors: colors,\n        value: value,\n        clearable: false,\n        onChange: onChange,\n        disableCustomColors: disableCustomColors,\n        enableAlpha: enableAlpha\n      })\n    })]\n  });\n}\nfunction ColorListPicker({\n  colors,\n  labels,\n  value = [],\n  disableCustomColors,\n  enableAlpha,\n  onChange\n}) {\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: \"components-color-list-picker\",\n    children: labels.map((label, index) => /*#__PURE__*/_jsx(ColorOption, {\n      label: label,\n      value: value[index],\n      colors: colors,\n      disableCustomColors: disableCustomColors,\n      enableAlpha: enableAlpha,\n      onChange: newColor => {\n        const newColors = value.slice();\n        newColors[index] = newColor;\n        onChange(newColors);\n      }\n    }, index))\n  });\n}\nexport default ColorListPicker;"],
+  "mappings": ";AAAA,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB,SAAS,UAAU;AACnB,SAAS,qBAAqB;AAC9B,OAAO,YAAY;AACnB,OAAO,kBAAkB;AACzB,OAAO,oBAAoB;AAC3B,OAAO,UAAU;AACjB,SAAS,OAAO,MAAM,YAAY,WAAW,QAAQ,aAAa;AAClE,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,SAAS,cAAc,aAAa,0BAA0B;AACpE,QAAM,UAAU,GAAG,MAAM;AACzB,QAAM,YAAY,GAAG,MAAM;AAC3B,SAAoB,sBAAM,WAAW;AAAA,IACnC,UAAU,CAAc,qBAAK,QAAQ;AAAA,MACnC,uBAAuB;AAAA,MACvB,WAAW;AAAA,MACX,IAAI;AAAA,MACJ,SAAS,MAAM,UAAU,UAAQ,CAAC,IAAI;AAAA,MACtC,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,MAAM,QAAqB,qBAAK,gBAAgB;AAAA,QAC9C,YAAY;AAAA,QACZ,WAAW;AAAA,MACb,CAAC,IAAiB,qBAAK,MAAM;AAAA,QAC3B,MAAM;AAAA,MACR,CAAC;AAAA,MACD,MAAM;AAAA,IACR,CAAC,GAAgB,qBAAK,OAAO;AAAA,MAC3B,MAAM;AAAA,MACN,IAAI;AAAA,MACJ,mBAAmB;AAAA,MACnB,eAAe,CAAC;AAAA,MAChB,UAAU,UAAuB,qBAAK,cAAc;AAAA,QAClD,cAAc,GAAG,eAAe;AAAA,QAChC,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,SAAoB,qBAAK,OAAO;AAAA,IAC9B,WAAW;AAAA,IACX,UAAU,OAAO,IAAI,CAAC,OAAO,UAAuB,qBAAK,aAAa;AAAA,MACpE;AAAA,MACA,OAAO,MAAM,KAAK;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU,cAAY;AACpB,cAAM,YAAY,MAAM,MAAM;AAC9B,kBAAU,KAAK,IAAI;AACnB,iBAAS,SAAS;AAAA,MACpB;AAAA,IACF,GAAG,KAAK,CAAC;AAAA,EACX,CAAC;AACH;AACA,IAAO,4BAAQ;",
   "names": []
 }

package/build-module/duotone-picker/custom-duotone-bar.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/duotone-picker/custom-duotone-bar.tsx"],
-  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport CustomGradientBar from '../custom-gradient-picker/gradient-bar';\nimport { getColorStopsFromColors, getGradientFromCSSColors, getColorsFromColorStops } from './utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst PLACEHOLDER_VALUES = ['#333', '#CCC'];\nexport default function CustomDuotoneBar({\n  value,\n  onChange\n}) {\n  const hasGradient = !!value;\n  const values = hasGradient ? value : PLACEHOLDER_VALUES;\n  const background = getGradientFromCSSColors(values);\n  const controlPoints = getColorStopsFromColors(values);\n  return /*#__PURE__*/_jsx(CustomGradientBar, {\n    disableInserter: true,\n    background: background,\n    hasGradient: hasGradient,\n    value: controlPoints,\n    onChange: newColorStops => {\n      const newValue = getColorsFromColorStops(newColorStops);\n      onChange(newValue);\n    }\n  });\n}"],
-  "mappings": ";AAGA,OAAO,uBAAuB;AAC9B,SAAS,yBAAyB,0BAA0B,+BAA+B;AAC3F,SAAS,OAAO,YAAY;AAC5B,IAAM,qBAAqB,CAAC,QAAQ,MAAM;AAC3B,SAAR,iBAAkC;AAAA,EACvC;AAAA,EACA;AACF,GAAG;AACD,QAAM,cAAc,CAAC,CAAC;AACtB,QAAM,SAAS,cAAc,QAAQ;AACrC,QAAM,aAAa,yBAAyB,MAAM;AAClD,QAAM,gBAAgB,wBAAwB,MAAM;AACpD,SAAoB,qBAAK,mBAAmB;AAAA,IAC1C,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,UAAU,mBAAiB;AACzB,YAAM,WAAW,wBAAwB,aAAa;AACtD,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,CAAC;AACH;",
+  "sourcesContent": ["import CustomGradientBar from '../custom-gradient-picker/gradient-bar';\nimport { getColorStopsFromColors, getGradientFromCSSColors, getColorsFromColorStops } from './utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst PLACEHOLDER_VALUES = ['#333', '#CCC'];\nexport default function CustomDuotoneBar({\n  value,\n  onChange\n}) {\n  const hasGradient = !!value;\n  const values = hasGradient ? value : PLACEHOLDER_VALUES;\n  const background = getGradientFromCSSColors(values);\n  const controlPoints = getColorStopsFromColors(values);\n  return /*#__PURE__*/_jsx(CustomGradientBar, {\n    disableInserter: true,\n    background: background,\n    hasGradient: hasGradient,\n    value: controlPoints,\n    onChange: newColorStops => {\n      const newValue = getColorsFromColorStops(newColorStops);\n      onChange(newValue);\n    }\n  });\n}"],
+  "mappings": ";AAAA,OAAO,uBAAuB;AAC9B,SAAS,yBAAyB,0BAA0B,+BAA+B;AAC3F,SAAS,OAAO,YAAY;AAC5B,IAAM,qBAAqB,CAAC,QAAQ,MAAM;AAC3B,SAAR,iBAAkC;AAAA,EACvC;AAAA,EACA;AACF,GAAG;AACD,QAAM,cAAc,CAAC,CAAC;AACtB,QAAM,SAAS,cAAc,QAAQ;AACrC,QAAM,aAAa,yBAAyB,MAAM;AAClD,QAAM,gBAAgB,wBAAwB,MAAM;AACpD,SAAoB,qBAAK,mBAAmB;AAAA,IAC1C,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,UAAU,mBAAiB;AACzB,YAAM,WAAW,wBAAwB,aAAa;AACtD,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,CAAC;AACH;",
   "names": []
 }

package/build-module/duotone-picker/duotone-picker.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/duotone-picker/duotone-picker.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport fastDeepEqual from 'fast-deep-equal/es6/index.js';\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, { getComputeCircularOptionPickerCommonProps } from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport CustomDuotoneBar from './custom-duotone-bar';\nimport { getDefaultColors, getGradientFromCSSColors } from './utils';\nimport { Spacer } from '../spacer';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\n/**\n * ```jsx\n * import { DuotonePicker, DuotoneSwatch } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const DUOTONE_PALETTE = [\n * \t{ colors: [ '#8c00b7', '#fcff41' ], name: 'Purple and yellow', slug: 'purple-yellow' },\n * \t{ colors: [ '#000097', '#ff4747' ], name: 'Blue and red', slug: 'blue-red' },\n * ];\n *\n * const COLOR_PALETTE = [\n * \t{ color: '#ff4747', name: 'Red', slug: 'red' },\n * \t{ color: '#fcff41', name: 'Yellow', slug: 'yellow' },\n * \t{ color: '#000097', name: 'Blue', slug: 'blue' },\n * \t{ color: '#8c00b7', name: 'Purple', slug: 'purple' },\n * ];\n *\n * const Example = () => {\n * \tconst [ duotone, setDuotone ] = useState( [ '#000000', '#ffffff' ] );\n * \treturn (\n * \t\t<>\n * \t\t\t<DuotonePicker\n * \t\t\t\tduotonePalette={ DUOTONE_PALETTE }\n * \t\t\t\tcolorPalette={ COLOR_PALETTE }\n * \t\t\t\tvalue={ duotone }\n * \t\t\t\tonChange={ setDuotone }\n * \t\t\t/>\n * \t\t\t<DuotoneSwatch values={ duotone } />\n * \t\t</>\n * \t);\n * };\n * ```\n */\nfunction DuotonePicker({\n  asButtons,\n  loop,\n  clearable = true,\n  unsetable = true,\n  colorPalette,\n  duotonePalette,\n  disableCustomColors,\n  disableCustomDuotone,\n  value,\n  onChange,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  ...otherProps\n}) {\n  const [defaultDark, defaultLight] = useMemo(() => getDefaultColors(colorPalette), [colorPalette]);\n  const isUnset = value === 'unset';\n  const unsetOptionLabel = __('Unset');\n  const unsetOption = /*#__PURE__*/_jsx(CircularOptionPicker.Option, {\n    value: \"unset\",\n    isSelected: isUnset,\n    tooltipText: unsetOptionLabel,\n    \"aria-label\": unsetOptionLabel,\n    className: \"components-duotone-picker__color-indicator\",\n    onClick: () => {\n      onChange(isUnset ? undefined : 'unset');\n    }\n  }, \"unset\");\n  const duotoneOptions = duotonePalette.map(({\n    colors,\n    slug,\n    name\n  }) => {\n    const style = {\n      background: getGradientFromCSSColors(colors, '135deg'),\n      color: 'transparent'\n    };\n    const tooltipText = name ?? sprintf(\n    // translators: %s: duotone code e.g: \"dark-grayscale\" or \"7f7f7f-ffffff\".\n    __('Duotone code: %s'), slug);\n    const label = name ? sprintf(\n    // translators: %s: The name of the option e.g: \"Dark grayscale\".\n    __('Duotone: %s'), name) : tooltipText;\n    const isSelected = fastDeepEqual(colors, value);\n    return /*#__PURE__*/_jsx(CircularOptionPicker.Option, {\n      value: colors,\n      isSelected: isSelected,\n      \"aria-label\": label,\n      tooltipText: tooltipText,\n      style: style,\n      onClick: () => {\n        onChange(isSelected ? undefined : colors);\n      }\n    }, slug);\n  });\n  const {\n    metaProps,\n    labelProps\n  } = getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby);\n  const options = unsetable ? [unsetOption, ...duotoneOptions] : duotoneOptions;\n  return /*#__PURE__*/_jsx(CircularOptionPicker, {\n    ...otherProps,\n    ...metaProps,\n    ...labelProps,\n    options: options,\n    actions: !!clearable && /*#__PURE__*/_jsx(CircularOptionPicker.ButtonAction, {\n      onClick: () => onChange(undefined),\n      accessibleWhenDisabled: true,\n      disabled: !value,\n      children: __('Clear')\n    }),\n    children: /*#__PURE__*/_jsx(Spacer, {\n      paddingTop: options.length === 0 ? 0 : 4,\n      children: /*#__PURE__*/_jsxs(VStack, {\n        spacing: 3,\n        children: [!disableCustomColors && !disableCustomDuotone && /*#__PURE__*/_jsx(CustomDuotoneBar, {\n          value: isUnset ? undefined : value,\n          onChange: onChange\n        }), !disableCustomDuotone && /*#__PURE__*/_jsx(ColorListPicker, {\n          labels: [__('Shadows'), __('Highlights')],\n          colors: colorPalette,\n          value: isUnset ? undefined : value,\n          disableCustomColors: disableCustomColors,\n          enableAlpha: true,\n          onChange: newColors => {\n            if (!newColors[0]) {\n              newColors[0] = defaultDark;\n            }\n            if (!newColors[1]) {\n              newColors[1] = defaultLight;\n            }\n            const newValue = newColors.length >= 2 ? newColors : undefined;\n            // @ts-expect-error TODO: The color arrays for a DuotonePicker should be a tuple of two colors,\n            // but it's currently typed as a string[].\n            // See also https://github.com/WordPress/gutenberg/pull/49060#discussion_r1136951035\n            onChange(newValue);\n          }\n        })]\n      })\n    })\n  });\n}\nexport default DuotonePicker;"],
-  "mappings": ";AAGA,OAAO,mBAAmB;AAK1B,SAAS,eAAe;AACxB,SAAS,IAAI,eAAe;AAK5B,OAAO,qBAAqB;AAC5B,OAAO,wBAAwB,iDAAiD;AAChF,SAAS,cAAc;AACvB,OAAO,sBAAsB;AAC7B,SAAS,kBAAkB,gCAAgC;AAC3D,SAAS,cAAc;AACvB,SAAS,OAAO,MAAM,QAAQ,aAAa;AAkC3C,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,GAAG;AACL,GAAG;AACD,QAAM,CAAC,aAAa,YAAY,IAAI,QAAQ,MAAM,iBAAiB,YAAY,GAAG,CAAC,YAAY,CAAC;AAChG,QAAM,UAAU,UAAU;AAC1B,QAAM,mBAAmB,GAAG,OAAO;AACnC,QAAM,cAA2B,qBAAK,qBAAqB,QAAQ;AAAA,IACjE,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,cAAc;AAAA,IACd,WAAW;AAAA,IACX,SAAS,MAAM;AACb,eAAS,UAAU,SAAY,OAAO;AAAA,IACxC;AAAA,EACF,GAAG,OAAO;AACV,QAAM,iBAAiB,eAAe,IAAI,CAAC;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAM;AACJ,UAAM,QAAQ;AAAA,MACZ,YAAY,yBAAyB,QAAQ,QAAQ;AAAA,MACrD,OAAO;AAAA,IACT;AACA,UAAM,cAAc,QAAQ;AAAA;AAAA,MAE5B,GAAG,kBAAkB;AAAA,MAAG;AAAA,IAAI;AAC5B,UAAM,QAAQ,OAAO;AAAA;AAAA,MAErB,GAAG,aAAa;AAAA,MAAG;AAAA,IAAI,IAAI;AAC3B,UAAM,aAAa,cAAc,QAAQ,KAAK;AAC9C,WAAoB,qBAAK,qBAAqB,QAAQ;AAAA,MACpD,OAAO;AAAA,MACP;AAAA,MACA,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,SAAS,MAAM;AACb,iBAAS,aAAa,SAAY,MAAM;AAAA,MAC1C;AAAA,IACF,GAAG,IAAI;AAAA,EACT,CAAC;AACD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF,IAAI,0CAA0C,WAAW,MAAM,WAAW,cAAc;AACxF,QAAM,UAAU,YAAY,CAAC,aAAa,GAAG,cAAc,IAAI;AAC/D,SAAoB,qBAAK,sBAAsB;AAAA,IAC7C,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH;AAAA,IACA,SAAS,CAAC,CAAC,aAA0B,qBAAK,qBAAqB,cAAc;AAAA,MAC3E,SAAS,MAAM,SAAS,MAAS;AAAA,MACjC,wBAAwB;AAAA,MACxB,UAAU,CAAC;AAAA,MACX,UAAU,GAAG,OAAO;AAAA,IACtB,CAAC;AAAA,IACD,UAAuB,qBAAK,QAAQ;AAAA,MAClC,YAAY,QAAQ,WAAW,IAAI,IAAI;AAAA,MACvC,UAAuB,sBAAM,QAAQ;AAAA,QACnC,SAAS;AAAA,QACT,UAAU,CAAC,CAAC,uBAAuB,CAAC,wBAAqC,qBAAK,kBAAkB;AAAA,UAC9F,OAAO,UAAU,SAAY;AAAA,UAC7B;AAAA,QACF,CAAC,GAAG,CAAC,wBAAqC,qBAAK,iBAAiB;AAAA,UAC9D,QAAQ,CAAC,GAAG,SAAS,GAAG,GAAG,YAAY,CAAC;AAAA,UACxC,QAAQ;AAAA,UACR,OAAO,UAAU,SAAY;AAAA,UAC7B;AAAA,UACA,aAAa;AAAA,UACb,UAAU,eAAa;AACrB,gBAAI,CAAC,UAAU,CAAC,GAAG;AACjB,wBAAU,CAAC,IAAI;AAAA,YACjB;AACA,gBAAI,CAAC,UAAU,CAAC,GAAG;AACjB,wBAAU,CAAC,IAAI;AAAA,YACjB;AACA,kBAAM,WAAW,UAAU,UAAU,IAAI,YAAY;AAIrD,qBAAS,QAAQ;AAAA,UACnB;AAAA,QACF,CAAC,CAAC;AAAA,MACJ,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAO,yBAAQ;",
+  "sourcesContent": ["import fastDeepEqual from 'fast-deep-equal/es6/index.js';\nimport { useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport ColorListPicker from './color-list-picker';\nimport CircularOptionPicker, { getComputeCircularOptionPickerCommonProps } from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport CustomDuotoneBar from './custom-duotone-bar';\nimport { getDefaultColors, getGradientFromCSSColors } from './utils';\nimport { Spacer } from '../spacer';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\n/**\n * ```jsx\n * import { DuotonePicker, DuotoneSwatch } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const DUOTONE_PALETTE = [\n * \t{ colors: [ '#8c00b7', '#fcff41' ], name: 'Purple and yellow', slug: 'purple-yellow' },\n * \t{ colors: [ '#000097', '#ff4747' ], name: 'Blue and red', slug: 'blue-red' },\n * ];\n *\n * const COLOR_PALETTE = [\n * \t{ color: '#ff4747', name: 'Red', slug: 'red' },\n * \t{ color: '#fcff41', name: 'Yellow', slug: 'yellow' },\n * \t{ color: '#000097', name: 'Blue', slug: 'blue' },\n * \t{ color: '#8c00b7', name: 'Purple', slug: 'purple' },\n * ];\n *\n * const Example = () => {\n * \tconst [ duotone, setDuotone ] = useState( [ '#000000', '#ffffff' ] );\n * \treturn (\n * \t\t<>\n * \t\t\t<DuotonePicker\n * \t\t\t\tduotonePalette={ DUOTONE_PALETTE }\n * \t\t\t\tcolorPalette={ COLOR_PALETTE }\n * \t\t\t\tvalue={ duotone }\n * \t\t\t\tonChange={ setDuotone }\n * \t\t\t/>\n * \t\t\t<DuotoneSwatch values={ duotone } />\n * \t\t</>\n * \t);\n * };\n * ```\n */\nfunction DuotonePicker({\n  asButtons,\n  loop,\n  clearable = true,\n  unsetable = true,\n  colorPalette,\n  duotonePalette,\n  disableCustomColors,\n  disableCustomDuotone,\n  value,\n  onChange,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  ...otherProps\n}) {\n  const [defaultDark, defaultLight] = useMemo(() => getDefaultColors(colorPalette), [colorPalette]);\n  const isUnset = value === 'unset';\n  const unsetOptionLabel = __('Unset');\n  const unsetOption = /*#__PURE__*/_jsx(CircularOptionPicker.Option, {\n    value: \"unset\",\n    isSelected: isUnset,\n    tooltipText: unsetOptionLabel,\n    \"aria-label\": unsetOptionLabel,\n    className: \"components-duotone-picker__color-indicator\",\n    onClick: () => {\n      onChange(isUnset ? undefined : 'unset');\n    }\n  }, \"unset\");\n  const duotoneOptions = duotonePalette.map(({\n    colors,\n    slug,\n    name\n  }) => {\n    const style = {\n      background: getGradientFromCSSColors(colors, '135deg'),\n      color: 'transparent'\n    };\n    const tooltipText = name ?? sprintf(\n    // translators: %s: duotone code e.g: \"dark-grayscale\" or \"7f7f7f-ffffff\".\n    __('Duotone code: %s'), slug);\n    const label = name ? sprintf(\n    // translators: %s: The name of the option e.g: \"Dark grayscale\".\n    __('Duotone: %s'), name) : tooltipText;\n    const isSelected = fastDeepEqual(colors, value);\n    return /*#__PURE__*/_jsx(CircularOptionPicker.Option, {\n      value: colors,\n      isSelected: isSelected,\n      \"aria-label\": label,\n      tooltipText: tooltipText,\n      style: style,\n      onClick: () => {\n        onChange(isSelected ? undefined : colors);\n      }\n    }, slug);\n  });\n  const {\n    metaProps,\n    labelProps\n  } = getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby);\n  const options = unsetable ? [unsetOption, ...duotoneOptions] : duotoneOptions;\n  return /*#__PURE__*/_jsx(CircularOptionPicker, {\n    ...otherProps,\n    ...metaProps,\n    ...labelProps,\n    options: options,\n    actions: !!clearable && /*#__PURE__*/_jsx(CircularOptionPicker.ButtonAction, {\n      onClick: () => onChange(undefined),\n      accessibleWhenDisabled: true,\n      disabled: !value,\n      children: __('Clear')\n    }),\n    children: /*#__PURE__*/_jsx(Spacer, {\n      paddingTop: options.length === 0 ? 0 : 4,\n      children: /*#__PURE__*/_jsxs(VStack, {\n        spacing: 3,\n        children: [!disableCustomColors && !disableCustomDuotone && /*#__PURE__*/_jsx(CustomDuotoneBar, {\n          value: isUnset ? undefined : value,\n          onChange: onChange\n        }), !disableCustomDuotone && /*#__PURE__*/_jsx(ColorListPicker, {\n          labels: [__('Shadows'), __('Highlights')],\n          colors: colorPalette,\n          value: isUnset ? undefined : value,\n          disableCustomColors: disableCustomColors,\n          enableAlpha: true,\n          onChange: newColors => {\n            if (!newColors[0]) {\n              newColors[0] = defaultDark;\n            }\n            if (!newColors[1]) {\n              newColors[1] = defaultLight;\n            }\n            const newValue = newColors.length >= 2 ? newColors : undefined;\n            // @ts-expect-error TODO: The color arrays for a DuotonePicker should be a tuple of two colors,\n            // but it's currently typed as a string[].\n            // See also https://github.com/WordPress/gutenberg/pull/49060#discussion_r1136951035\n            onChange(newValue);\n          }\n        })]\n      })\n    })\n  });\n}\nexport default DuotonePicker;"],
+  "mappings": "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",
   "names": []
 }

package/build-module/duotone-picker/duotone-swatch.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/duotone-picker/duotone-swatch.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { swatch } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ColorIndicator from '../color-indicator';\nimport Icon from '../icon';\nimport { getGradientFromCSSColors } from './utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction DuotoneSwatch({\n  values\n}) {\n  return values ? /*#__PURE__*/_jsx(ColorIndicator, {\n    colorValue: getGradientFromCSSColors(values, '135deg')\n  }) : /*#__PURE__*/_jsx(Icon, {\n    icon: swatch\n  });\n}\nexport default DuotoneSwatch;"],
-  "mappings": ";AAGA,SAAS,cAAc;AAKvB,OAAO,oBAAoB;AAC3B,OAAO,UAAU;AACjB,SAAS,gCAAgC;AACzC,SAAS,OAAO,YAAY;AAC5B,SAAS,cAAc;AAAA,EACrB;AACF,GAAG;AACD,SAAO,SAAsB,qBAAK,gBAAgB;AAAA,IAChD,YAAY,yBAAyB,QAAQ,QAAQ;AAAA,EACvD,CAAC,IAAiB,qBAAK,MAAM;AAAA,IAC3B,MAAM;AAAA,EACR,CAAC;AACH;AACA,IAAO,yBAAQ;",
+  "sourcesContent": ["import { swatch } from '@wordpress/icons';\nimport ColorIndicator from '../color-indicator';\nimport Icon from '../icon';\nimport { getGradientFromCSSColors } from './utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction DuotoneSwatch({\n  values\n}) {\n  return values ? /*#__PURE__*/_jsx(ColorIndicator, {\n    colorValue: getGradientFromCSSColors(values, '135deg')\n  }) : /*#__PURE__*/_jsx(Icon, {\n    icon: swatch\n  });\n}\nexport default DuotoneSwatch;"],
+  "mappings": ";AAAA,SAAS,cAAc;AACvB,OAAO,oBAAoB;AAC3B,OAAO,UAAU;AACjB,SAAS,gCAAgC;AACzC,SAAS,OAAO,YAAY;AAC5B,SAAS,cAAc;AAAA,EACrB;AACF,GAAG;AACD,SAAO,SAAsB,qBAAK,gBAAgB;AAAA,IAChD,YAAY,yBAAyB,QAAQ,QAAQ;AAAA,EACvD,CAAC,IAAiB,qBAAK,MAAM;AAAA,IAC3B,MAAM;AAAA,EACR,CAAC;AACH;AACA,IAAO,yBAAQ;",
   "names": []
 }

package/build-module/duotone-picker/utils.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/duotone-picker/utils.ts"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * Internal dependencies\n */\n\nextend([namesPlugin]);\n\n/**\n * Object representation for a color.\n *\n * @typedef {Object} RGBColor\n * @property {number} r Red component of the color in the range [0,1].\n * @property {number} g Green component of the color in the range [0,1].\n * @property {number} b Blue component of the color in the range [0,1].\n */\n\n/**\n * Calculate the brightest and darkest values from a color palette.\n *\n * @param palette Color palette for the theme.\n *\n * @return Tuple of the darkest color and brightest color.\n */\nexport function getDefaultColors(palette) {\n  // A default dark and light color are required.\n  if (!palette || palette.length < 2) {\n    return ['#000', '#fff'];\n  }\n  return palette.map(({\n    color\n  }) => ({\n    color,\n    brightness: colord(color).brightness()\n  })).reduce(([min, max], current) => {\n    return [current.brightness <= min.brightness ? current : min, current.brightness >= max.brightness ? current : max];\n  }, [{\n    brightness: 1,\n    color: ''\n  }, {\n    brightness: 0,\n    color: ''\n  }]).map(({\n    color\n  }) => color);\n}\n\n/**\n * Generate a duotone gradient from a list of colors.\n *\n * @param colors CSS color strings.\n * @param angle  CSS gradient angle.\n *\n * @return  CSS gradient string for the duotone swatch.\n */\nexport function getGradientFromCSSColors(colors = [], angle = '90deg') {\n  const l = 100 / colors.length;\n  const stops = colors.map((c, i) => `${c} ${i * l}%, ${c} ${(i + 1) * l}%`).join(', ');\n  return `linear-gradient( ${angle}, ${stops} )`;\n}\n\n/**\n * Convert a color array to an array of color stops.\n *\n * @param colors CSS colors array\n *\n * @return Color stop information.\n */\nexport function getColorStopsFromColors(colors) {\n  return colors.map((color, i) => ({\n    position: i * 100 / (colors.length - 1),\n    color\n  }));\n}\n\n/**\n * Convert a color stop array to an array colors.\n *\n * @param colorStops Color stop information.\n *\n * @return CSS colors array.\n */\nexport function getColorsFromColorStops(colorStops = []) {\n  return colorStops.map(({\n    color\n  }) => color);\n}"],
-  "mappings": ";AAGA,SAAS,QAAQ,cAAc;AAC/B,OAAO,iBAAiB;AAMxB,OAAO,CAAC,WAAW,CAAC;AAkBb,SAAS,iBAAiB,SAAS;AAExC,MAAI,CAAC,WAAW,QAAQ,SAAS,GAAG;AAClC,WAAO,CAAC,QAAQ,MAAM;AAAA,EACxB;AACA,SAAO,QAAQ,IAAI,CAAC;AAAA,IAClB;AAAA,EACF,OAAO;AAAA,IACL;AAAA,IACA,YAAY,OAAO,KAAK,EAAE,WAAW;AAAA,EACvC,EAAE,EAAE,OAAO,CAAC,CAAC,KAAK,GAAG,GAAG,YAAY;AAClC,WAAO,CAAC,QAAQ,cAAc,IAAI,aAAa,UAAU,KAAK,QAAQ,cAAc,IAAI,aAAa,UAAU,GAAG;AAAA,EACpH,GAAG,CAAC;AAAA,IACF,YAAY;AAAA,IACZ,OAAO;AAAA,EACT,GAAG;AAAA,IACD,YAAY;AAAA,IACZ,OAAO;AAAA,EACT,CAAC,CAAC,EAAE,IAAI,CAAC;AAAA,IACP;AAAA,EACF,MAAM,KAAK;AACb;AAUO,SAAS,yBAAyB,SAAS,CAAC,GAAG,QAAQ,SAAS;AACrE,QAAM,IAAI,MAAM,OAAO;AACvB,QAAM,QAAQ,OAAO,IAAI,CAAC,GAAG,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,GAAG,EAAE,KAAK,IAAI;AACpF,SAAO,oBAAoB,KAAK,KAAK,KAAK;AAC5C;AASO,SAAS,wBAAwB,QAAQ;AAC9C,SAAO,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,IAC/B,UAAU,IAAI,OAAO,OAAO,SAAS;AAAA,IACrC;AAAA,EACF,EAAE;AACJ;AASO,SAAS,wBAAwB,aAAa,CAAC,GAAG;AACvD,SAAO,WAAW,IAAI,CAAC;AAAA,IACrB;AAAA,EACF,MAAM,KAAK;AACb;",
+  "sourcesContent": ["import { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nextend([namesPlugin]);\n\n/**\n * Object representation for a color.\n *\n * @typedef {Object} RGBColor\n * @property {number} r Red component of the color in the range [0,1].\n * @property {number} g Green component of the color in the range [0,1].\n * @property {number} b Blue component of the color in the range [0,1].\n */\n\n/**\n * Calculate the brightest and darkest values from a color palette.\n *\n * @param palette Color palette for the theme.\n *\n * @return Tuple of the darkest color and brightest color.\n */\nexport function getDefaultColors(palette) {\n  // A default dark and light color are required.\n  if (!palette || palette.length < 2) {\n    return ['#000', '#fff'];\n  }\n  return palette.map(({\n    color\n  }) => ({\n    color,\n    brightness: colord(color).brightness()\n  })).reduce(([min, max], current) => {\n    return [current.brightness <= min.brightness ? current : min, current.brightness >= max.brightness ? current : max];\n  }, [{\n    brightness: 1,\n    color: ''\n  }, {\n    brightness: 0,\n    color: ''\n  }]).map(({\n    color\n  }) => color);\n}\n\n/**\n * Generate a duotone gradient from a list of colors.\n *\n * @param colors CSS color strings.\n * @param angle  CSS gradient angle.\n *\n * @return  CSS gradient string for the duotone swatch.\n */\nexport function getGradientFromCSSColors(colors = [], angle = '90deg') {\n  const l = 100 / colors.length;\n  const stops = colors.map((c, i) => `${c} ${i * l}%, ${c} ${(i + 1) * l}%`).join(', ');\n  return `linear-gradient( ${angle}, ${stops} )`;\n}\n\n/**\n * Convert a color array to an array of color stops.\n *\n * @param colors CSS colors array\n *\n * @return Color stop information.\n */\nexport function getColorStopsFromColors(colors) {\n  return colors.map((color, i) => ({\n    position: i * 100 / (colors.length - 1),\n    color\n  }));\n}\n\n/**\n * Convert a color stop array to an array colors.\n *\n * @param colorStops Color stop information.\n *\n * @return CSS colors array.\n */\nexport function getColorsFromColorStops(colorStops = []) {\n  return colorStops.map(({\n    color\n  }) => color);\n}"],
+  "mappings": ";AAAA,SAAS,QAAQ,cAAc;AAC/B,OAAO,iBAAiB;AACxB,OAAO,CAAC,WAAW,CAAC;AAkBb,SAAS,iBAAiB,SAAS;AAExC,MAAI,CAAC,WAAW,QAAQ,SAAS,GAAG;AAClC,WAAO,CAAC,QAAQ,MAAM;AAAA,EACxB;AACA,SAAO,QAAQ,IAAI,CAAC;AAAA,IAClB;AAAA,EACF,OAAO;AAAA,IACL;AAAA,IACA,YAAY,OAAO,KAAK,EAAE,WAAW;AAAA,EACvC,EAAE,EAAE,OAAO,CAAC,CAAC,KAAK,GAAG,GAAG,YAAY;AAClC,WAAO,CAAC,QAAQ,cAAc,IAAI,aAAa,UAAU,KAAK,QAAQ,cAAc,IAAI,aAAa,UAAU,GAAG;AAAA,EACpH,GAAG,CAAC;AAAA,IACF,YAAY;AAAA,IACZ,OAAO;AAAA,EACT,GAAG;AAAA,IACD,YAAY;AAAA,IACZ,OAAO;AAAA,EACT,CAAC,CAAC,EAAE,IAAI,CAAC;AAAA,IACP;AAAA,EACF,MAAM,KAAK;AACb;AAUO,SAAS,yBAAyB,SAAS,CAAC,GAAG,QAAQ,SAAS;AACrE,QAAM,IAAI,MAAM,OAAO;AACvB,QAAM,QAAQ,OAAO,IAAI,CAAC,GAAG,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,GAAG,EAAE,KAAK,IAAI;AACpF,SAAO,oBAAoB,KAAK,KAAK,KAAK;AAC5C;AASO,SAAS,wBAAwB,QAAQ;AAC9C,SAAO,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,IAC/B,UAAU,IAAI,OAAO,OAAO,SAAS;AAAA,IACrC;AAAA,EACF,EAAE;AACJ;AASO,SAAS,wBAAwB,aAAa,CAAC,GAAG;AACvD,SAAO,WAAW,IAAI,CAAC;AAAA,IACrB;AAAA,EACF,MAAM,KAAK;AACb;",
   "names": []
 }

package/build-module/elevation/component.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/elevation/component.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * Internal dependencies\n */\n\nimport { contextConnect } from '../context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction UnconnectedElevation(props, forwardedRef) {\n  const elevationProps = useElevation(props);\n  return /*#__PURE__*/_jsx(View, {\n    ...elevationProps,\n    ref: forwardedRef\n  });\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');\nexport default Elevation;"],
-  "mappings": ";AAQA,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,OAAO,YAAY;AAC5B,SAAS,qBAAqB,OAAO,cAAc;AACjD,QAAM,iBAAiB,aAAa,KAAK;AACzC,SAAoB,qBAAK,MAAM;AAAA,IAC7B,GAAG;AAAA,IACH,KAAK;AAAA,EACP,CAAC;AACH;AAyBO,IAAM,YAAY,eAAe,sBAAsB,WAAW;AACzE,IAAO,oBAAQ;",
+  "sourcesContent": ["import { contextConnect } from '../context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction UnconnectedElevation(props, forwardedRef) {\n  const elevationProps = useElevation(props);\n  return /*#__PURE__*/_jsx(View, {\n    ...elevationProps,\n    ref: forwardedRef\n  });\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__experimentalText as Text,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <div>\n *       <Text>Code is Poetry</Text>\n *       <Elevation value={ 5 } />\n *     </div>\n *   );\n * }\n * ```\n */\nexport const Elevation = contextConnect(UnconnectedElevation, 'Elevation');\nexport default Elevation;"],
+  "mappings": ";AAAA,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,OAAO,YAAY;AAC5B,SAAS,qBAAqB,OAAO,cAAc;AACjD,QAAM,iBAAiB,aAAa,KAAK;AACzC,SAAoB,qBAAK,MAAM;AAAA,IAC7B,GAAG;AAAA,IACH,KAAK;AAAA,EACP,CAAC;AACH;AAwBO,IAAM,YAAY,eAAe,sBAAsB,WAAW;AACzE,IAAO,oBAAQ;",
   "names": []
 }