@wordpress/components 33.1.1-next.v.202605131006.0 → 34.0.0

package/build/tooltip/index.cjs

@@ -93,7 +93,8 @@ function UnforwardedTooltip(props, ref) {
       render: children
     }) : children;
   }
-  function addDescribedById(element) {
+  function addDescribedById(el) {
+    const element = el;
     return describedById && mounted && element.props["aria-describedby"] === void 0 && element.props["aria-label"] !== text ? (0, import_element.cloneElement)(element, {
       "aria-describedby": describedById
     }) : element;

package/build/tooltip/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/tooltip/index.tsx"],
-  "sourcesContent": ["import * as Ariakit from '@ariakit/react';\nimport clsx from 'clsx';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Children, useContext, forwardRef, cloneElement } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport Shortcut from '../shortcut';\nimport { positionToPlacement } from '../popover/utils';\nimport { TooltipInternalContext } from './context';\n\n/**\n * Time over anchor to wait before showing tooltip\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport const TOOLTIP_DELAY = 700;\nconst CONTEXT_VALUE = {\n  isNestedInTooltip: true\n};\nfunction UnforwardedTooltip(props, ref) {\n  const {\n    children,\n    className,\n    delay = TOOLTIP_DELAY,\n    hideOnClick = true,\n    placement,\n    position,\n    shortcut,\n    text,\n    ...restProps\n  } = props;\n  const {\n    isNestedInTooltip\n  } = useContext(TooltipInternalContext);\n  const baseId = useInstanceId(Tooltip, 'tooltip');\n  const describedById = text || shortcut ? baseId : undefined;\n  const isOnlyChild = Children.count(children) === 1;\n  // console error if more than one child element is added\n  if (!isOnlyChild) {\n    if ('development' === process.env.NODE_ENV) {\n      // eslint-disable-next-line no-console\n      console.error('wp-components.Tooltip should be called with only a single child element.');\n    }\n  }\n\n  // Compute tooltip's placement:\n  // - give priority to `placement` prop, if defined\n  // - otherwise, compute it from the legacy `position` prop (if defined)\n  // - finally, fallback to the default placement: 'top'\n  let computedPlacement;\n  if (placement !== undefined) {\n    computedPlacement = placement;\n  } else if (position !== undefined) {\n    computedPlacement = positionToPlacement(position);\n    deprecated('`position` prop in wp.components.tooltip', {\n      since: '6.4',\n      alternative: '`placement` prop'\n    });\n  }\n  computedPlacement = computedPlacement || 'top';\n  const tooltipStore = Ariakit.useTooltipStore({\n    placement: computedPlacement,\n    showTimeout: delay\n  });\n  const mounted = Ariakit.useStoreState(tooltipStore, 'mounted');\n  if (isNestedInTooltip) {\n    return isOnlyChild ? /*#__PURE__*/_jsx(Ariakit.Role, {\n      ...restProps,\n      render: children\n    }) : children;\n  }\n\n  // TODO: this is a temporary workaround to minimize the effects of the\n  // Ariakit upgrade. Ariakit doesn't pass the `aria-describedby` prop to\n  // the tooltip anchor anymore since 0.4.0, so we need to add it manually.\n  // The `aria-describedby` attribute is added only if the anchor doesn't have\n  // one already, and if the tooltip text is not the same as the anchor's\n  // `aria-label`\n  // See: https://github.com/WordPress/gutenberg/pull/64066\n  // See: https://github.com/WordPress/gutenberg/pull/65989\n  function addDescribedById(element) {\n    return describedById && mounted && element.props['aria-describedby'] === undefined && element.props['aria-label'] !== text ? cloneElement(element, {\n      'aria-describedby': describedById\n    }) : element;\n  }\n  return /*#__PURE__*/_jsxs(TooltipInternalContext.Provider, {\n    value: CONTEXT_VALUE,\n    children: [/*#__PURE__*/_jsx(Ariakit.TooltipAnchor, {\n      onClick: hideOnClick ? tooltipStore.hide : undefined,\n      store: tooltipStore,\n      render: isOnlyChild ? addDescribedById(children) : undefined,\n      ref: ref,\n      children: isOnlyChild ? undefined : children\n    }), isOnlyChild && (text || shortcut) && /*#__PURE__*/_jsxs(Ariakit.Tooltip, {\n      ...restProps,\n      className: clsx('components-tooltip', className),\n      unmountOnHide: true,\n      gutter: 4,\n      id: describedById,\n      overflowPadding: 0.5,\n      store: tooltipStore,\n      children: [text, shortcut && /*#__PURE__*/_jsx(Shortcut, {\n        className: text ? 'components-tooltip__shortcut' : '',\n        shortcut: shortcut\n      })]\n    })]\n  });\n}\nexport const Tooltip = forwardRef(UnforwardedTooltip);\nexport default Tooltip;"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,iBAAAA;AAAA,EAAA;AAAA;AAAA;AAAA,cAAyB;AACzB,kBAAiB;AACjB,qBAA8B;AAC9B,qBAA+D;AAC/D,wBAAuB;AACvB,sBAAqB;AACrB,mBAAoC;AACpC,qBAAuC;AAKvC,yBAA2C;AACpC,IAAM,gBAAgB;AAC7B,IAAM,gBAAgB;AAAA,EACpB,mBAAmB;AACrB;AACA,SAAS,mBAAmB,OAAO,KAAK;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM;AAAA,IACJ;AAAA,EACF,QAAI,2BAAW,qCAAsB;AACrC,QAAM,aAAS,8BAAcA,UAAS,SAAS;AAC/C,QAAM,gBAAgB,QAAQ,WAAW,SAAS;AAClD,QAAM,cAAc,wBAAS,MAAM,QAAQ,MAAM;AAEjD,MAAI,CAAC,aAAa;AAChB,QAAI,kBAAkB,QAAQ,IAAI,UAAU;AAE1C,cAAQ,MAAM,0EAA0E;AAAA,IAC1F;AAAA,EACF;AAMA,MAAI;AACJ,MAAI,cAAc,QAAW;AAC3B,wBAAoB;AAAA,EACtB,WAAW,aAAa,QAAW;AACjC,4BAAoB,kCAAoB,QAAQ;AAChD,0BAAAC,SAAW,4CAA4C;AAAA,MACrD,OAAO;AAAA,MACP,aAAa;AAAA,IACf,CAAC;AAAA,EACH;AACA,sBAAoB,qBAAqB;AACzC,QAAM,eAAuB,wBAAgB;AAAA,IAC3C,WAAW;AAAA,IACX,aAAa;AAAA,EACf,CAAC;AACD,QAAM,UAAkB,sBAAc,cAAc,SAAS;AAC7D,MAAI,mBAAmB;AACrB,WAAO,cAA2B,uCAAAC,KAAa,cAAM;AAAA,MACnD,GAAG;AAAA,MACH,QAAQ;AAAA,IACV,CAAC,IAAI;AAAA,EACP;AAUA,WAAS,iBAAiB,SAAS;AACjC,WAAO,iBAAiB,WAAW,QAAQ,MAAM,kBAAkB,MAAM,UAAa,QAAQ,MAAM,YAAY,MAAM,WAAO,6BAAa,SAAS;AAAA,MACjJ,oBAAoB;AAAA,IACtB,CAAC,IAAI;AAAA,EACP;AACA,SAAoB,uCAAAC,MAAM,sCAAuB,UAAU;AAAA,IACzD,OAAO;AAAA,IACP,UAAU,CAAc,uCAAAD,KAAa,uBAAe;AAAA,MAClD,SAAS,cAAc,aAAa,OAAO;AAAA,MAC3C,OAAO;AAAA,MACP,QAAQ,cAAc,iBAAiB,QAAQ,IAAI;AAAA,MACnD;AAAA,MACA,UAAU,cAAc,SAAY;AAAA,IACtC,CAAC,GAAG,gBAAgB,QAAQ,aAA0B,uCAAAC,MAAc,iBAAS;AAAA,MAC3E,GAAG;AAAA,MACH,eAAW,YAAAC,SAAK,sBAAsB,SAAS;AAAA,MAC/C,eAAe;AAAA,MACf,QAAQ;AAAA,MACR,IAAI;AAAA,MACJ,iBAAiB;AAAA,MACjB,OAAO;AAAA,MACP,UAAU,CAAC,MAAM,YAAyB,uCAAAF,KAAK,gBAAAG,SAAU;AAAA,QACvD,WAAW,OAAO,iCAAiC;AAAA,QACnD;AAAA,MACF,CAAC,CAAC;AAAA,IACJ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAML,eAAU,2BAAW,kBAAkB;AACpD,IAAO,kBAAQA;",
+  "sourcesContent": ["import * as Ariakit from '@ariakit/react';\nimport clsx from 'clsx';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Children, useContext, forwardRef, cloneElement } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport Shortcut from '../shortcut';\nimport { positionToPlacement } from '../popover/utils';\nimport { TooltipInternalContext } from './context';\n\n/**\n * Time over anchor to wait before showing tooltip\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport const TOOLTIP_DELAY = 700;\nconst CONTEXT_VALUE = {\n  isNestedInTooltip: true\n};\nfunction UnforwardedTooltip(props, ref) {\n  const {\n    children,\n    className,\n    delay = TOOLTIP_DELAY,\n    hideOnClick = true,\n    placement,\n    position,\n    shortcut,\n    text,\n    ...restProps\n  } = props;\n  const {\n    isNestedInTooltip\n  } = useContext(TooltipInternalContext);\n  const baseId = useInstanceId(Tooltip, 'tooltip');\n  const describedById = text || shortcut ? baseId : undefined;\n  const isOnlyChild = Children.count(children) === 1;\n  // console error if more than one child element is added\n  if (!isOnlyChild) {\n    if ('development' === process.env.NODE_ENV) {\n      // eslint-disable-next-line no-console\n      console.error('wp-components.Tooltip should be called with only a single child element.');\n    }\n  }\n\n  // Compute tooltip's placement:\n  // - give priority to `placement` prop, if defined\n  // - otherwise, compute it from the legacy `position` prop (if defined)\n  // - finally, fallback to the default placement: 'top'\n  let computedPlacement;\n  if (placement !== undefined) {\n    computedPlacement = placement;\n  } else if (position !== undefined) {\n    computedPlacement = positionToPlacement(position);\n    deprecated('`position` prop in wp.components.tooltip', {\n      since: '6.4',\n      alternative: '`placement` prop'\n    });\n  }\n  computedPlacement = computedPlacement || 'top';\n  const tooltipStore = Ariakit.useTooltipStore({\n    placement: computedPlacement,\n    showTimeout: delay\n  });\n  const mounted = Ariakit.useStoreState(tooltipStore, 'mounted');\n  if (isNestedInTooltip) {\n    return isOnlyChild ? /*#__PURE__*/_jsx(Ariakit.Role, {\n      ...restProps,\n      render: children\n    }) : children;\n  }\n\n  // TODO: this is a temporary workaround to minimize the effects of the\n  // Ariakit upgrade. Ariakit doesn't pass the `aria-describedby` prop to\n  // the tooltip anchor anymore since 0.4.0, so we need to add it manually.\n  // The `aria-describedby` attribute is added only if the anchor doesn't have\n  // one already, and if the tooltip text is not the same as the anchor's\n  // `aria-label`\n  // See: https://github.com/WordPress/gutenberg/pull/64066\n  // See: https://github.com/WordPress/gutenberg/pull/65989\n  function addDescribedById(el) {\n    const element = el;\n    return describedById && mounted && element.props['aria-describedby'] === undefined && element.props['aria-label'] !== text ? cloneElement(element, {\n      'aria-describedby': describedById\n    }) : element;\n  }\n  return /*#__PURE__*/_jsxs(TooltipInternalContext.Provider, {\n    value: CONTEXT_VALUE,\n    children: [/*#__PURE__*/_jsx(Ariakit.TooltipAnchor, {\n      onClick: hideOnClick ? tooltipStore.hide : undefined,\n      store: tooltipStore,\n      render: isOnlyChild ? addDescribedById(children) : undefined,\n      ref: ref,\n      children: isOnlyChild ? undefined : children\n    }), isOnlyChild && (text || shortcut) && /*#__PURE__*/_jsxs(Ariakit.Tooltip, {\n      ...restProps,\n      className: clsx('components-tooltip', className),\n      unmountOnHide: true,\n      gutter: 4,\n      id: describedById,\n      overflowPadding: 0.5,\n      store: tooltipStore,\n      children: [text, shortcut && /*#__PURE__*/_jsx(Shortcut, {\n        className: text ? 'components-tooltip__shortcut' : '',\n        shortcut: shortcut\n      })]\n    })]\n  });\n}\nexport const Tooltip = forwardRef(UnforwardedTooltip);\nexport default Tooltip;"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,iBAAAA;AAAA,EAAA;AAAA;AAAA;AAAA,cAAyB;AACzB,kBAAiB;AACjB,qBAA8B;AAC9B,qBAA+D;AAC/D,wBAAuB;AACvB,sBAAqB;AACrB,mBAAoC;AACpC,qBAAuC;AAKvC,yBAA2C;AACpC,IAAM,gBAAgB;AAC7B,IAAM,gBAAgB;AAAA,EACpB,mBAAmB;AACrB;AACA,SAAS,mBAAmB,OAAO,KAAK;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM;AAAA,IACJ;AAAA,EACF,QAAI,2BAAW,qCAAsB;AACrC,QAAM,aAAS,8BAAcA,UAAS,SAAS;AAC/C,QAAM,gBAAgB,QAAQ,WAAW,SAAS;AAClD,QAAM,cAAc,wBAAS,MAAM,QAAQ,MAAM;AAEjD,MAAI,CAAC,aAAa;AAChB,QAAI,kBAAkB,QAAQ,IAAI,UAAU;AAE1C,cAAQ,MAAM,0EAA0E;AAAA,IAC1F;AAAA,EACF;AAMA,MAAI;AACJ,MAAI,cAAc,QAAW;AAC3B,wBAAoB;AAAA,EACtB,WAAW,aAAa,QAAW;AACjC,4BAAoB,kCAAoB,QAAQ;AAChD,0BAAAC,SAAW,4CAA4C;AAAA,MACrD,OAAO;AAAA,MACP,aAAa;AAAA,IACf,CAAC;AAAA,EACH;AACA,sBAAoB,qBAAqB;AACzC,QAAM,eAAuB,wBAAgB;AAAA,IAC3C,WAAW;AAAA,IACX,aAAa;AAAA,EACf,CAAC;AACD,QAAM,UAAkB,sBAAc,cAAc,SAAS;AAC7D,MAAI,mBAAmB;AACrB,WAAO,cAA2B,uCAAAC,KAAa,cAAM;AAAA,MACnD,GAAG;AAAA,MACH,QAAQ;AAAA,IACV,CAAC,IAAI;AAAA,EACP;AAUA,WAAS,iBAAiB,IAAI;AAC5B,UAAM,UAAU;AAChB,WAAO,iBAAiB,WAAW,QAAQ,MAAM,kBAAkB,MAAM,UAAa,QAAQ,MAAM,YAAY,MAAM,WAAO,6BAAa,SAAS;AAAA,MACjJ,oBAAoB;AAAA,IACtB,CAAC,IAAI;AAAA,EACP;AACA,SAAoB,uCAAAC,MAAM,sCAAuB,UAAU;AAAA,IACzD,OAAO;AAAA,IACP,UAAU,CAAc,uCAAAD,KAAa,uBAAe;AAAA,MAClD,SAAS,cAAc,aAAa,OAAO;AAAA,MAC3C,OAAO;AAAA,MACP,QAAQ,cAAc,iBAAiB,QAAQ,IAAI;AAAA,MACnD;AAAA,MACA,UAAU,cAAc,SAAY;AAAA,IACtC,CAAC,GAAG,gBAAgB,QAAQ,aAA0B,uCAAAC,MAAc,iBAAS;AAAA,MAC3E,GAAG;AAAA,MACH,eAAW,YAAAC,SAAK,sBAAsB,SAAS;AAAA,MAC/C,eAAe;AAAA,MACf,QAAQ;AAAA,MACR,IAAI;AAAA,MACJ,iBAAiB;AAAA,MACjB,OAAO;AAAA,MACP,UAAU,CAAC,MAAM,YAAyB,uCAAAF,KAAK,gBAAAG,SAAU;AAAA,QACvD,WAAW,OAAO,iCAAiC;AAAA,QACnD;AAAA,MACF,CAAC,CAAC;AAAA,IACJ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAML,eAAU,2BAAW,kBAAkB;AACpD,IAAO,kBAAQA;",
   "names": ["Tooltip", "deprecated", "_jsx", "_jsxs", "clsx", "Shortcut"]
 }

package/build-module/autocomplete/index.mjs

@@ -1,6 +1,6 @@
 // packages/components/src/autocomplete/index.tsx
 import { renderToString, useEffect, useMemo, useReducer, useRef } from "@wordpress/element";
-import { useInstanceId, useMergeRefs, useRefEffect } from "@wordpress/compose";
+import { useInstanceId, useMergeRefs, useRefEffect, privateApis as composePrivateApis } from "@wordpress/compose";
 import { create, slice, insert, isCollapsed, getTextContent } from "@wordpress/rich-text";
 import { speak } from "@wordpress/a11y";
 import { isAppleOS } from "@wordpress/keycodes";
@@ -8,7 +8,11 @@ import { AutocompleterUI } from "./autocompleter-ui.mjs";
 import { getAutocompleteMatch } from "./get-autocomplete-match.mjs";
 import { withIgnoreIMEEvents } from "../utils/with-ignore-ime-events.mjs";
 import getNodeText from "../utils/get-node-text.mjs";
+import { unlock } from "../lock-unlock.mjs";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+var {
+  subscribeDelegatedListener
+} = unlock(composePrivateApis);
 var EMPTY_FILTERED_OPTIONS = [];
 var AUTOCOMPLETE_HOOK_REFERENCE = {};
 function getCompletionObject(completion) {
@@ -274,10 +278,7 @@ function useAutocompleteProps(options) {
     function _onKeyDown(event) {
       onKeyDownRef.current?.(event);
     }
-    element.addEventListener("keydown", _onKeyDown);
-    return () => {
-      element.removeEventListener("keydown", _onKeyDown);
-    };
+    return subscribeDelegatedListener(element, "keydown", _onKeyDown, true);
   }, [])]);
   const didUserInput = record.text !== previousRecord?.text;
   if (!didUserInput) {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/autocomplete/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { renderToString, useEffect, useMemo, useReducer, useRef } from '@wordpress/element';\nimport { useInstanceId, useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport { create, slice, insert, isCollapsed, getTextContent } from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { AutocompleterUI } from './autocompleter-ui';\nimport { getAutocompleteMatch } from './get-autocomplete-match';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport getNodeText from '../utils/get-node-text';\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst EMPTY_FILTERED_OPTIONS = [];\n\n// Used for generating the instance ID\nconst AUTOCOMPLETE_HOOK_REFERENCE = {};\nfunction getCompletionObject(completion) {\n  if (completion !== null && typeof completion === 'object' && 'action' in completion && completion.action !== undefined && 'value' in completion && completion.value !== undefined) {\n    return completion;\n  }\n  return {\n    action: 'insert-at-caret',\n    value: completion\n  };\n}\nconst initialState = {\n  selectedIndex: 0,\n  filteredOptions: EMPTY_FILTERED_OPTIONS,\n  filterValue: '',\n  autocompleter: null\n};\nfunction autocompleteReducer(state, action) {\n  switch (action.type) {\n    case 'RESET':\n      return initialState;\n    case 'SELECT':\n      return {\n        ...state,\n        selectedIndex: action.index\n      };\n    case 'OPTIONS':\n      return {\n        ...state,\n        filteredOptions: action.options,\n        selectedIndex: action.options.length === state.filteredOptions.length ? state.selectedIndex : 0\n      };\n    case 'MATCH':\n      return {\n        ...state,\n        autocompleter: action.completer,\n        filterValue: action.query\n      };\n  }\n}\nexport function useAutocomplete({\n  record,\n  onChange,\n  onReplace,\n  completers,\n  contentRef\n}) {\n  const instanceId = useInstanceId(AUTOCOMPLETE_HOOK_REFERENCE);\n  const [state, dispatch] = useReducer(autocompleteReducer, initialState);\n  const {\n    selectedIndex,\n    filteredOptions,\n    filterValue,\n    autocompleter\n  } = state;\n  const backspacingRef = useRef(false);\n  const prevRecordTextRef = useRef('');\n  const lastCompletionRef = useRef(null);\n  function insertCompletion(replacement) {\n    if (autocompleter === null) {\n      return '';\n    }\n    const end = record.start;\n    const start = end - autocompleter.triggerPrefix.length - filterValue.length;\n    const toInsert = create({\n      html: renderToString(replacement)\n    });\n    onChange(insert(record, toInsert, start, end));\n    return getTextContent(toInsert);\n  }\n  function select(option) {\n    if (option.isDisabled || !autocompleter) {\n      return;\n    }\n    const {\n      getOptionCompletion\n    } = autocompleter;\n    if (!getOptionCompletion) {\n      dispatch({\n        type: 'RESET'\n      });\n      contentRef.current?.focus();\n      return;\n    }\n    const completionObject = getCompletionObject(getOptionCompletion(option.value, filterValue));\n    if ('replace' === completionObject.action) {\n      onReplace([completionObject.value]);\n      // When replacing, the component will unmount, so don't reset\n      // state (below) on an unmounted component.\n      return;\n    }\n    if ('insert-at-caret' === completionObject.action) {\n      const completionText = insertCompletion(completionObject.value);\n      // When the completion value starts with the trigger prefix\n      // (e.g. @username), the trigger stays in the text and would\n      // re-activate the autocompleter. Store the completed text so\n      // the effect can suppress the stale re-match.\n      if (completionText.startsWith(autocompleter.triggerPrefix)) {\n        const afterPrefix = completionText.slice(autocompleter.triggerPrefix.length);\n        if (afterPrefix) {\n          lastCompletionRef.current = {\n            name: autocompleter.name,\n            value: afterPrefix\n          };\n        }\n      }\n    }\n\n    // Reset autocomplete state after insertion rather than before\n    // so insertion events don't cause the completion menu to redisplay.\n    dispatch({\n      type: 'RESET'\n    });\n\n    // Make sure that the content remains focused after making a selection\n    // and that the text cursor position is not lost.\n    contentRef.current?.focus();\n  }\n  function onChangeOptions(options) {\n    dispatch({\n      type: 'OPTIONS',\n      options\n    });\n  }\n  function handleKeyDown(event) {\n    backspacingRef.current = event.key === 'Backspace';\n    if (!autocompleter) {\n      return;\n    }\n    if (filteredOptions.length === 0) {\n      return;\n    }\n    if (event.defaultPrevented) {\n      return;\n    }\n    switch (event.key) {\n      case 'ArrowUp':\n      case 'ArrowDown':\n        {\n          const offset = event.key === 'ArrowUp' ? -1 : 1;\n          const newIndex = (selectedIndex + offset + filteredOptions.length) % filteredOptions.length;\n          dispatch({\n            type: 'SELECT',\n            index: newIndex\n          });\n          // See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.\n          if (isAppleOS()) {\n            speak(getNodeText(filteredOptions[newIndex].label), 'assertive');\n          }\n          break;\n        }\n      case 'Escape':\n        dispatch({\n          type: 'RESET'\n        });\n        event.preventDefault();\n        break;\n      case 'Enter':\n        select(filteredOptions[selectedIndex]);\n        break;\n      case 'ArrowLeft':\n      case 'ArrowRight':\n        dispatch({\n          type: 'RESET'\n        });\n        return;\n      default:\n        return;\n    }\n\n    // Any handled key should prevent original behavior. This relies on\n    // the early return in the default case.\n    event.preventDefault();\n  }\n\n  // textContent is a primitive (string), memoizing is not strictly necessary\n  // but this is a preemptive performance improvement, since the autocompleter\n  // is a potential bottleneck for the editor type metric.\n  const textContent = useMemo(() => {\n    if (isCollapsed(record)) {\n      return getTextContent(slice(record, 0));\n    }\n    return '';\n  }, [record]);\n  useEffect(() => {\n    const isTextChange = record.text !== prevRecordTextRef.current;\n    prevRecordTextRef.current = record.text;\n    function getTextAfterSelection() {\n      return textContent ? getTextContent(slice(record, undefined, getTextContent(record).length)) : '';\n    }\n    const match = getAutocompleteMatch(textContent, completers, {\n      matchCount: filteredOptions.length,\n      isBackspacing: backspacingRef.current,\n      getTextAfterSelection,\n      lastCompletion: lastCompletionRef.current\n    });\n    if (!match) {\n      if (autocompleter) {\n        dispatch({\n          type: 'RESET'\n        });\n      }\n      return;\n    }\n    const {\n      completer,\n      filterValue: query\n    } = match;\n\n    // Don't re-activate a dismissed autocompleter on cursor-only\n    // movement. `textContent` (text before cursor) changes with the\n    // caret, so the effect re-runs, but `record.text` does not.\n    // Complements the render-time `didUserInput` gate in\n    // `useAutocompleteProps` for callers using this hook directly.\n    if (!autocompleter && !isTextChange) {\n      return;\n    }\n\n    // Clear stale completion ref when the user types a new trigger\n    // for the same completer (the previous completion is no longer\n    // relevant). Must be after the cursor-only check so that mere\n    // cursor movement doesn't discard the suppression state.\n    if (lastCompletionRef.current && lastCompletionRef.current.name === completer.name) {\n      lastCompletionRef.current = null;\n    }\n    dispatch({\n      type: 'MATCH',\n      completer,\n      query\n    });\n    // We want to avoid introducing unexpected side effects.\n    // See https://github.com/WordPress/gutenberg/pull/41820\n  }, [textContent]);\n  const {\n    key: selectedKey = ''\n  } = filteredOptions[selectedIndex] || {};\n  const {\n    className\n  } = autocompleter || {};\n  const isExpanded = !!autocompleter && filteredOptions.length > 0;\n  const listBoxId = isExpanded ? `components-autocomplete-listbox-${instanceId}` : undefined;\n  const activeId = isExpanded ? `components-autocomplete-item-${instanceId}-${selectedKey}` : null;\n  const hasSelection = record.start !== undefined;\n  const showPopover = !!textContent && hasSelection && !!autocompleter;\n  return {\n    listBoxId,\n    activeId,\n    onKeyDown: withIgnoreIMEEvents(handleKeyDown),\n    popover: showPopover && /*#__PURE__*/_jsx(AutocompleterUI, {\n      autocompleter: autocompleter,\n      className: className,\n      filterValue: filterValue,\n      instanceId: instanceId,\n      listBoxId: listBoxId,\n      selectedIndex: selectedIndex,\n      onChangeOptions: onChangeOptions,\n      onSelect: select,\n      contentRef: contentRef,\n      reset: () => dispatch({\n        type: 'RESET'\n      })\n    }, autocompleter.name + autocompleter.triggerPrefix)\n  };\n}\n\n/**\n * Checks whether two records represent the same user-visible state\n * (same text content and cursor position).\n */\nfunction recordValuesMatch(a, b) {\n  return a.text === b.text && a.start === b.start && a.end === b.end;\n}\n\n/**\n * Tracks the last record whose value differed from the current one.\n * Used to determine whether the user has actually typed something\n */\nexport function useLastDifferentValue(value) {\n  const history = useRef([]);\n  const lastEntry = history.current[history.current.length - 1];\n\n  // Only add to history if the value is meaningfully different from\n  // the most recent entry (analogous to Set.add being a no-op for\n  // duplicate references in the original implementation).\n  if (!lastEntry || !recordValuesMatch(value, lastEntry)) {\n    history.current.push(value);\n  }\n\n  // Keep the history size to 2.\n  if (history.current.length > 2) {\n    history.current.shift();\n  }\n  return history.current[0];\n}\nexport function useAutocompleteProps(options) {\n  const ref = useRef(null);\n  const onKeyDownRef = useRef(undefined);\n  const {\n    record\n  } = options;\n  const previousRecord = useLastDifferentValue(record);\n  const {\n    popover,\n    listBoxId,\n    activeId,\n    onKeyDown\n  } = useAutocomplete({\n    ...options,\n    contentRef: ref\n  });\n  onKeyDownRef.current = onKeyDown;\n  const mergedRefs = useMergeRefs([ref, useRefEffect(element => {\n    function _onKeyDown(event) {\n      onKeyDownRef.current?.(event);\n    }\n    element.addEventListener('keydown', _onKeyDown);\n    return () => {\n      element.removeEventListener('keydown', _onKeyDown);\n    };\n  }, [])]);\n\n  // We only want to show the popover if the user has typed something.\n  const didUserInput = record.text !== previousRecord?.text;\n  if (!didUserInput) {\n    return {\n      ref: mergedRefs\n    };\n  }\n  return {\n    ref: mergedRefs,\n    children: popover,\n    'aria-autocomplete': listBoxId ? 'list' : undefined,\n    'aria-owns': listBoxId,\n    'aria-activedescendant': activeId\n  };\n}\nexport default function Autocomplete({\n  children,\n  isSelected,\n  ...options\n}) {\n  const {\n    popover,\n    ...props\n  } = useAutocomplete(options);\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [children(props), isSelected && popover]\n  });\n}"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { renderToString, useEffect, useMemo, useReducer, useRef } from '@wordpress/element';\nimport { useInstanceId, useMergeRefs, useRefEffect, privateApis as composePrivateApis } from '@wordpress/compose';\nimport { create, slice, insert, isCollapsed, getTextContent } from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { AutocompleterUI } from './autocompleter-ui';\nimport { getAutocompleteMatch } from './get-autocomplete-match';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport getNodeText from '../utils/get-node-text';\nimport { unlock } from '../lock-unlock';\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst {\n  subscribeDelegatedListener\n} = unlock(composePrivateApis);\nconst EMPTY_FILTERED_OPTIONS = [];\n\n// Used for generating the instance ID\nconst AUTOCOMPLETE_HOOK_REFERENCE = {};\nfunction getCompletionObject(completion) {\n  if (completion !== null && typeof completion === 'object' && 'action' in completion && completion.action !== undefined && 'value' in completion && completion.value !== undefined) {\n    return completion;\n  }\n  return {\n    action: 'insert-at-caret',\n    value: completion\n  };\n}\nconst initialState = {\n  selectedIndex: 0,\n  filteredOptions: EMPTY_FILTERED_OPTIONS,\n  filterValue: '',\n  autocompleter: null\n};\nfunction autocompleteReducer(state, action) {\n  switch (action.type) {\n    case 'RESET':\n      return initialState;\n    case 'SELECT':\n      return {\n        ...state,\n        selectedIndex: action.index\n      };\n    case 'OPTIONS':\n      return {\n        ...state,\n        filteredOptions: action.options,\n        selectedIndex: action.options.length === state.filteredOptions.length ? state.selectedIndex : 0\n      };\n    case 'MATCH':\n      return {\n        ...state,\n        autocompleter: action.completer,\n        filterValue: action.query\n      };\n  }\n}\nexport function useAutocomplete({\n  record,\n  onChange,\n  onReplace,\n  completers,\n  contentRef\n}) {\n  const instanceId = useInstanceId(AUTOCOMPLETE_HOOK_REFERENCE);\n  const [state, dispatch] = useReducer(autocompleteReducer, initialState);\n  const {\n    selectedIndex,\n    filteredOptions,\n    filterValue,\n    autocompleter\n  } = state;\n  const backspacingRef = useRef(false);\n  const prevRecordTextRef = useRef('');\n  const lastCompletionRef = useRef(null);\n  function insertCompletion(replacement) {\n    if (autocompleter === null) {\n      return '';\n    }\n    const end = record.start;\n    const start = end - autocompleter.triggerPrefix.length - filterValue.length;\n    const toInsert = create({\n      html: renderToString(replacement)\n    });\n    onChange(insert(record, toInsert, start, end));\n    return getTextContent(toInsert);\n  }\n  function select(option) {\n    if (option.isDisabled || !autocompleter) {\n      return;\n    }\n    const {\n      getOptionCompletion\n    } = autocompleter;\n    if (!getOptionCompletion) {\n      dispatch({\n        type: 'RESET'\n      });\n      contentRef.current?.focus();\n      return;\n    }\n    const completionObject = getCompletionObject(getOptionCompletion(option.value, filterValue));\n    if ('replace' === completionObject.action) {\n      onReplace([completionObject.value]);\n      // When replacing, the component will unmount, so don't reset\n      // state (below) on an unmounted component.\n      return;\n    }\n    if ('insert-at-caret' === completionObject.action) {\n      const completionText = insertCompletion(completionObject.value);\n      // When the completion value starts with the trigger prefix\n      // (e.g. @username), the trigger stays in the text and would\n      // re-activate the autocompleter. Store the completed text so\n      // the effect can suppress the stale re-match.\n      if (completionText.startsWith(autocompleter.triggerPrefix)) {\n        const afterPrefix = completionText.slice(autocompleter.triggerPrefix.length);\n        if (afterPrefix) {\n          lastCompletionRef.current = {\n            name: autocompleter.name,\n            value: afterPrefix\n          };\n        }\n      }\n    }\n\n    // Reset autocomplete state after insertion rather than before\n    // so insertion events don't cause the completion menu to redisplay.\n    dispatch({\n      type: 'RESET'\n    });\n\n    // Make sure that the content remains focused after making a selection\n    // and that the text cursor position is not lost.\n    contentRef.current?.focus();\n  }\n  function onChangeOptions(options) {\n    dispatch({\n      type: 'OPTIONS',\n      options\n    });\n  }\n  function handleKeyDown(event) {\n    backspacingRef.current = event.key === 'Backspace';\n    if (!autocompleter) {\n      return;\n    }\n    if (filteredOptions.length === 0) {\n      return;\n    }\n    if (event.defaultPrevented) {\n      return;\n    }\n    switch (event.key) {\n      case 'ArrowUp':\n      case 'ArrowDown':\n        {\n          const offset = event.key === 'ArrowUp' ? -1 : 1;\n          const newIndex = (selectedIndex + offset + filteredOptions.length) % filteredOptions.length;\n          dispatch({\n            type: 'SELECT',\n            index: newIndex\n          });\n          // See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.\n          if (isAppleOS()) {\n            speak(getNodeText(filteredOptions[newIndex].label), 'assertive');\n          }\n          break;\n        }\n      case 'Escape':\n        dispatch({\n          type: 'RESET'\n        });\n        event.preventDefault();\n        break;\n      case 'Enter':\n        select(filteredOptions[selectedIndex]);\n        break;\n      case 'ArrowLeft':\n      case 'ArrowRight':\n        dispatch({\n          type: 'RESET'\n        });\n        return;\n      default:\n        return;\n    }\n\n    // Any handled key should prevent original behavior. This relies on\n    // the early return in the default case.\n    event.preventDefault();\n  }\n\n  // textContent is a primitive (string), memoizing is not strictly necessary\n  // but this is a preemptive performance improvement, since the autocompleter\n  // is a potential bottleneck for the editor type metric.\n  const textContent = useMemo(() => {\n    if (isCollapsed(record)) {\n      return getTextContent(slice(record, 0));\n    }\n    return '';\n  }, [record]);\n  useEffect(() => {\n    const isTextChange = record.text !== prevRecordTextRef.current;\n    prevRecordTextRef.current = record.text;\n    function getTextAfterSelection() {\n      return textContent ? getTextContent(slice(record, undefined, getTextContent(record).length)) : '';\n    }\n    const match = getAutocompleteMatch(textContent, completers, {\n      matchCount: filteredOptions.length,\n      isBackspacing: backspacingRef.current,\n      getTextAfterSelection,\n      lastCompletion: lastCompletionRef.current\n    });\n    if (!match) {\n      if (autocompleter) {\n        dispatch({\n          type: 'RESET'\n        });\n      }\n      return;\n    }\n    const {\n      completer,\n      filterValue: query\n    } = match;\n\n    // Don't re-activate a dismissed autocompleter on cursor-only\n    // movement. `textContent` (text before cursor) changes with the\n    // caret, so the effect re-runs, but `record.text` does not.\n    // Complements the render-time `didUserInput` gate in\n    // `useAutocompleteProps` for callers using this hook directly.\n    if (!autocompleter && !isTextChange) {\n      return;\n    }\n\n    // Clear stale completion ref when the user types a new trigger\n    // for the same completer (the previous completion is no longer\n    // relevant). Must be after the cursor-only check so that mere\n    // cursor movement doesn't discard the suppression state.\n    if (lastCompletionRef.current && lastCompletionRef.current.name === completer.name) {\n      lastCompletionRef.current = null;\n    }\n    dispatch({\n      type: 'MATCH',\n      completer,\n      query\n    });\n    // We want to avoid introducing unexpected side effects.\n    // See https://github.com/WordPress/gutenberg/pull/41820\n  }, [textContent]);\n  const {\n    key: selectedKey = ''\n  } = filteredOptions[selectedIndex] || {};\n  const {\n    className\n  } = autocompleter || {};\n  const isExpanded = !!autocompleter && filteredOptions.length > 0;\n  const listBoxId = isExpanded ? `components-autocomplete-listbox-${instanceId}` : undefined;\n  const activeId = isExpanded ? `components-autocomplete-item-${instanceId}-${selectedKey}` : null;\n  const hasSelection = record.start !== undefined;\n  const showPopover = !!textContent && hasSelection && !!autocompleter;\n  return {\n    listBoxId,\n    activeId,\n    onKeyDown: withIgnoreIMEEvents(handleKeyDown),\n    popover: showPopover && /*#__PURE__*/_jsx(AutocompleterUI, {\n      autocompleter: autocompleter,\n      className: className,\n      filterValue: filterValue,\n      instanceId: instanceId,\n      listBoxId: listBoxId,\n      selectedIndex: selectedIndex,\n      onChangeOptions: onChangeOptions,\n      onSelect: select,\n      contentRef: contentRef,\n      reset: () => dispatch({\n        type: 'RESET'\n      })\n    }, autocompleter.name + autocompleter.triggerPrefix)\n  };\n}\n\n/**\n * Checks whether two records represent the same user-visible state\n * (same text content and cursor position).\n */\nfunction recordValuesMatch(a, b) {\n  return a.text === b.text && a.start === b.start && a.end === b.end;\n}\n\n/**\n * Tracks the last record whose value differed from the current one.\n * Used to determine whether the user has actually typed something\n */\nexport function useLastDifferentValue(value) {\n  const history = useRef([]);\n  const lastEntry = history.current[history.current.length - 1];\n\n  // Only add to history if the value is meaningfully different from\n  // the most recent entry (analogous to Set.add being a no-op for\n  // duplicate references in the original implementation).\n  if (!lastEntry || !recordValuesMatch(value, lastEntry)) {\n    history.current.push(value);\n  }\n\n  // Keep the history size to 2.\n  if (history.current.length > 2) {\n    history.current.shift();\n  }\n  return history.current[0];\n}\nexport function useAutocompleteProps(options) {\n  const ref = useRef(null);\n  const onKeyDownRef = useRef(undefined);\n  const {\n    record\n  } = options;\n  const previousRecord = useLastDifferentValue(record);\n  const {\n    popover,\n    listBoxId,\n    activeId,\n    onKeyDown\n  } = useAutocomplete({\n    ...options,\n    contentRef: ref\n  });\n  onKeyDownRef.current = onKeyDown;\n  const mergedRefs = useMergeRefs([ref, useRefEffect(element => {\n    function _onKeyDown(event) {\n      onKeyDownRef.current?.(event);\n    }\n    // Capture phase. When the autocomplete popover is open,\n    // Up/Down/Enter/Escape must navigate the completion list \u2014\n    // they shouldn't be consumed by ancestor handlers (e.g.\n    // block-editor's writing-flow) for block navigation, block\n    // splitting, or \"move out of parent\" actions. Those handlers\n    // fire at bubble phase and gate on `event.defaultPrevented`,\n    // so firing in capture lets us preventDefault first when the\n    // popover is active.\n    return subscribeDelegatedListener(element, 'keydown', _onKeyDown, true);\n  }, [])]);\n\n  // We only want to show the popover if the user has typed something.\n  const didUserInput = record.text !== previousRecord?.text;\n  if (!didUserInput) {\n    return {\n      ref: mergedRefs\n    };\n  }\n  return {\n    ref: mergedRefs,\n    children: popover,\n    'aria-autocomplete': listBoxId ? 'list' : undefined,\n    'aria-owns': listBoxId,\n    'aria-activedescendant': activeId\n  };\n}\nexport default function Autocomplete({\n  children,\n  isSelected,\n  ...options\n}) {\n  const {\n    popover,\n    ...props\n  } = useAutocomplete(options);\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [children(props), isSelected && popover]\n  });\n}"],
+  "mappings": "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",
   "names": []
 }

package/build-module/border-control/border-control-dropdown/component.mjs

@@ -10,7 +10,7 @@ import { contextConnect } from "../../context/index.mjs";
 import { useBorderControlDropdown } from "./hook.mjs";
 import DropdownContentWrapper from "../../dropdown/dropdown-content-wrapper.mjs";
 import { isMultiplePaletteArray } from "../../color-palette/utils.mjs";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var getAriaLabelColorValue = (colorValue) => {
   return colorValue.replace(/^var\((.+)\)$/, "$1");
 };
@@ -99,6 +99,8 @@ var BorderControlDropdown = (props, forwardedRef) => {
     resetButtonWrapperClassName,
     size,
     __unstablePopoverProps,
+    onToggle: onToggleProp,
+    // Remove from `otherProps` to avoid type errors (native HTML `onToggle` vs `Dropdown` `onToggle`).
     ...otherProps
   } = useBorderControlDropdown(props);
   const {
@@ -127,40 +129,38 @@ var BorderControlDropdown = (props, forwardedRef) => {
       })
     })
   });
-  const renderContent = () => /* @__PURE__ */ _jsx(_Fragment, {
-    children: /* @__PURE__ */ _jsxs(DropdownContentWrapper, {
-      paddingSize: "medium",
-      children: [/* @__PURE__ */ _jsxs(VStack, {
-        className: popoverControlsClassName,
-        spacing: 6,
-        children: [/* @__PURE__ */ _jsx(ColorPalette, {
-          className: popoverContentClassName,
-          value: color,
-          onChange: onColorChange,
-          colors,
-          disableCustomColors,
-          __experimentalIsRenderedInSidebar,
-          clearable: false,
-          enableAlpha
-        }), enableStyle && isStyleSettable && /* @__PURE__ */ _jsx(BorderControlStylePicker, {
-          label: __("Style"),
-          value: style,
-          onChange: onStyleChange
-        })]
-      }), /* @__PURE__ */ _jsx("div", {
-        className: resetButtonWrapperClassName,
-        children: /* @__PURE__ */ _jsx(Button, {
-          variant: "tertiary",
-          onClick: () => {
-            onReset();
-          },
-          disabled: !enableResetButton,
-          accessibleWhenDisabled: true,
-          __next40pxDefaultSize: true,
-          children: __("Reset")
-        })
+  const renderContent = () => /* @__PURE__ */ _jsxs(DropdownContentWrapper, {
+    paddingSize: "medium",
+    children: [/* @__PURE__ */ _jsxs(VStack, {
+      className: popoverControlsClassName,
+      spacing: 6,
+      children: [/* @__PURE__ */ _jsx(ColorPalette, {
+        className: popoverContentClassName,
+        value: color,
+        onChange: onColorChange,
+        colors,
+        disableCustomColors,
+        __experimentalIsRenderedInSidebar,
+        clearable: false,
+        enableAlpha
+      }), enableStyle && isStyleSettable && /* @__PURE__ */ _jsx(BorderControlStylePicker, {
+        label: __("Style"),
+        value: style,
+        onChange: onStyleChange
       })]
-    })
+    }), /* @__PURE__ */ _jsx("div", {
+      className: resetButtonWrapperClassName,
+      children: /* @__PURE__ */ _jsx(Button, {
+        variant: "tertiary",
+        onClick: () => {
+          onReset();
+        },
+        disabled: !enableResetButton,
+        accessibleWhenDisabled: true,
+        __next40pxDefaultSize: true,
+        children: __("Reset")
+      })
+    })]
   });
   return /* @__PURE__ */ _jsx(Dropdown, {
     renderToggle,

package/build-module/border-control/border-control-dropdown/component.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/border-control/border-control-dropdown/component.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { VStack } from '../../v-stack';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nconst getAriaLabelColorValue = colorValue => {\n  // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n  return colorValue.replace(/^var\\((.+)\\)$/, '$1');\n};\nconst getColorObject = (colorValue, colors) => {\n  if (!colorValue || !colors) {\n    return;\n  }\n  if (isMultiplePaletteArray(colors)) {\n    // Multiple origins\n    let matchedColor;\n    colors.some(origin => origin.colors.some(color => {\n      if (color.color === colorValue) {\n        matchedColor = color;\n        return true;\n      }\n      return false;\n    }));\n    return matchedColor;\n  }\n\n  // Single origin\n  return colors.find(color => color.color === colorValue);\n};\nconst getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {\n  if (isStyleEnabled) {\n    if (colorObject) {\n      const ariaLabelValue = getAriaLabelColorValue(colorObject.color);\n      return style ? sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\". 3: The current border style selection e.g. \"solid\".\n      __('Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".'), colorObject.name, ariaLabelValue, style) : sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\".\n      __('Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, ariaLabelValue);\n    }\n    if (colorValue) {\n      const ariaLabelValue = getAriaLabelColorValue(colorValue);\n      return style ? sprintf(\n      // translators: 1: The color's hex code e.g.: \"#f00:\". 2: The current border style selection e.g. \"solid\".\n      __('Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".'), ariaLabelValue, style) : sprintf(\n      // translators: %s: The color's hex code e.g: \"#f00\".\n      __('Border color and style picker. The currently selected color has a value of \"%s\".'), ariaLabelValue);\n    }\n    return __('Border color and style picker.');\n  }\n  if (colorObject) {\n    return sprintf(\n    // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, getAriaLabelColorValue(colorObject.color));\n  }\n  if (colorValue) {\n    return sprintf(\n    // translators: %s: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color has a value of \"%s\".'), getAriaLabelColorValue(colorValue));\n  }\n  return __('Border color picker.');\n};\nconst BorderControlDropdown = (props, forwardedRef) => {\n  const {\n    __experimentalIsRenderedInSidebar,\n    border,\n    colors,\n    disableCustomColors,\n    enableAlpha,\n    enableStyle,\n    indicatorClassName,\n    indicatorWrapperClassName,\n    isStyleSettable,\n    onReset,\n    onColorChange,\n    onStyleChange,\n    popoverContentClassName,\n    popoverControlsClassName,\n    resetButtonWrapperClassName,\n    size,\n    __unstablePopoverProps,\n    ...otherProps\n  } = useBorderControlDropdown(props);\n  const {\n    color,\n    style\n  } = border || {};\n  const colorObject = getColorObject(color, colors);\n  const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle);\n  const enableResetButton = color || style && style !== 'none';\n  const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;\n  const renderToggle = ({\n    onToggle\n  }) => /*#__PURE__*/_jsx(Button, {\n    onClick: onToggle,\n    variant: \"tertiary\",\n    \"aria-label\": toggleAriaLabel,\n    tooltipPosition: dropdownPosition,\n    label: __('Border color and style picker'),\n    showTooltip: true,\n    __next40pxDefaultSize: size === '__unstable-large',\n    children: /*#__PURE__*/_jsx(\"span\", {\n      className: indicatorWrapperClassName,\n      children: /*#__PURE__*/_jsx(ColorIndicator, {\n        className: indicatorClassName,\n        colorValue: color\n      })\n    })\n  });\n  const renderContent = () => /*#__PURE__*/_jsx(_Fragment, {\n    children: /*#__PURE__*/_jsxs(DropdownContentWrapper, {\n      paddingSize: \"medium\",\n      children: [/*#__PURE__*/_jsxs(VStack, {\n        className: popoverControlsClassName,\n        spacing: 6,\n        children: [/*#__PURE__*/_jsx(ColorPalette, {\n          className: popoverContentClassName,\n          value: color,\n          onChange: onColorChange,\n          colors,\n          disableCustomColors,\n          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n          clearable: false,\n          enableAlpha: enableAlpha\n        }), enableStyle && isStyleSettable && /*#__PURE__*/_jsx(BorderControlStylePicker, {\n          label: __('Style'),\n          value: style,\n          onChange: onStyleChange\n        })]\n      }), /*#__PURE__*/_jsx(\"div\", {\n        className: resetButtonWrapperClassName,\n        children: /*#__PURE__*/_jsx(Button, {\n          variant: \"tertiary\",\n          onClick: () => {\n            onReset();\n          },\n          disabled: !enableResetButton,\n          accessibleWhenDisabled: true,\n          __next40pxDefaultSize: true,\n          children: __('Reset')\n        })\n      })]\n    })\n  });\n  return /*#__PURE__*/_jsx(Dropdown, {\n    renderToggle: renderToggle,\n    renderContent: renderContent,\n    popoverProps: {\n      ...__unstablePopoverProps\n    },\n    ...otherProps,\n    ref: forwardedRef\n  });\n};\nconst ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown');\nexport default ConnectedBorderControlDropdown;"],
-  "mappings": ";AAOA,SAAS,IAAI,eAAe;AAK5B,OAAO,8BAA8B;AACrC,OAAO,YAAY;AACnB,OAAO,oBAAoB;AAC3B,OAAO,kBAAkB;AACzB,OAAO,cAAc;AACrB,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAC/B,SAAS,gCAAgC;AACzC,OAAO,4BAA4B;AACnC,SAAS,8BAA8B;AACvC,SAAS,OAAO,MAAM,QAAQ,OAAO,YAAY,iBAAiB;AAClE,IAAM,yBAAyB,gBAAc;AAE3C,SAAO,WAAW,QAAQ,iBAAiB,IAAI;AACjD;AACA,IAAM,iBAAiB,CAAC,YAAY,WAAW;AAC7C,MAAI,CAAC,cAAc,CAAC,QAAQ;AAC1B;AAAA,EACF;AACA,MAAI,uBAAuB,MAAM,GAAG;AAElC,QAAI;AACJ,WAAO,KAAK,YAAU,OAAO,OAAO,KAAK,WAAS;AAChD,UAAI,MAAM,UAAU,YAAY;AAC9B,uBAAe;AACf,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC,CAAC;AACF,WAAO;AAAA,EACT;AAGA,SAAO,OAAO,KAAK,WAAS,MAAM,UAAU,UAAU;AACxD;AACA,IAAM,qBAAqB,CAAC,YAAY,aAAa,OAAO,mBAAmB;AAC7E,MAAI,gBAAgB;AAClB,QAAI,aAAa;AACf,YAAM,iBAAiB,uBAAuB,YAAY,KAAK;AAC/D,aAAO,QAAQ;AAAA;AAAA,QAEf,GAAG,iJAAiJ;AAAA,QAAG,YAAY;AAAA,QAAM;AAAA,QAAgB;AAAA,MAAK,IAAI;AAAA;AAAA,QAElM,GAAG,yGAAyG;AAAA,QAAG,YAAY;AAAA,QAAM;AAAA,MAAc;AAAA,IACjJ;AACA,QAAI,YAAY;AACd,YAAM,iBAAiB,uBAAuB,UAAU;AACxD,aAAO,QAAQ;AAAA;AAAA,QAEf,GAAG,4HAA4H;AAAA,QAAG;AAAA,QAAgB;AAAA,MAAK,IAAI;AAAA;AAAA,QAE3J,GAAG,kFAAkF;AAAA,QAAG;AAAA,MAAc;AAAA,IACxG;AACA,WAAO,GAAG,gCAAgC;AAAA,EAC5C;AACA,MAAI,aAAa;AACf,WAAO;AAAA;AAAA,MAEP,GAAG,+FAA+F;AAAA,MAAG,YAAY;AAAA,MAAM,uBAAuB,YAAY,KAAK;AAAA,IAAC;AAAA,EAClK;AACA,MAAI,YAAY;AACd,WAAO;AAAA;AAAA,MAEP,GAAG,wEAAwE;AAAA,MAAG,uBAAuB,UAAU;AAAA,IAAC;AAAA,EAClH;AACA,SAAO,GAAG,sBAAsB;AAClC;AACA,IAAM,wBAAwB,CAAC,OAAO,iBAAiB;AACrD,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,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,yBAAyB,KAAK;AAClC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF,IAAI,UAAU,CAAC;AACf,QAAM,cAAc,eAAe,OAAO,MAAM;AAChD,QAAM,kBAAkB,mBAAmB,OAAO,aAAa,OAAO,WAAW;AACjF,QAAM,oBAAoB,SAAS,SAAS,UAAU;AACtD,QAAM,mBAAmB,oCAAoC,gBAAgB;AAC7E,QAAM,eAAe,CAAC;AAAA,IACpB;AAAA,EACF,MAAmB,qBAAK,QAAQ;AAAA,IAC9B,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,OAAO,GAAG,+BAA+B;AAAA,IACzC,aAAa;AAAA,IACb,uBAAuB,SAAS;AAAA,IAChC,UAAuB,qBAAK,QAAQ;AAAA,MAClC,WAAW;AAAA,MACX,UAAuB,qBAAK,gBAAgB;AAAA,QAC1C,WAAW;AAAA,QACX,YAAY;AAAA,MACd,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACD,QAAM,gBAAgB,MAAmB,qBAAK,WAAW;AAAA,IACvD,UAAuB,sBAAM,wBAAwB;AAAA,MACnD,aAAa;AAAA,MACb,UAAU,CAAc,sBAAM,QAAQ;AAAA,QACpC,WAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU,CAAc,qBAAK,cAAc;AAAA,UACzC,WAAW;AAAA,UACX,OAAO;AAAA,UACP,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA;AAAA,UACA,WAAW;AAAA,UACX;AAAA,QACF,CAAC,GAAG,eAAe,mBAAgC,qBAAK,0BAA0B;AAAA,UAChF,OAAO,GAAG,OAAO;AAAA,UACjB,OAAO;AAAA,UACP,UAAU;AAAA,QACZ,CAAC,CAAC;AAAA,MACJ,CAAC,GAAgB,qBAAK,OAAO;AAAA,QAC3B,WAAW;AAAA,QACX,UAAuB,qBAAK,QAAQ;AAAA,UAClC,SAAS;AAAA,UACT,SAAS,MAAM;AACb,oBAAQ;AAAA,UACV;AAAA,UACA,UAAU,CAAC;AAAA,UACX,wBAAwB;AAAA,UACxB,uBAAuB;AAAA,UACvB,UAAU,GAAG,OAAO;AAAA,QACtB,CAAC;AAAA,MACH,CAAC,CAAC;AAAA,IACJ,CAAC;AAAA,EACH,CAAC;AACD,SAAoB,qBAAK,UAAU;AAAA,IACjC;AAAA,IACA;AAAA,IACA,cAAc;AAAA,MACZ,GAAG;AAAA,IACL;AAAA,IACA,GAAG;AAAA,IACH,KAAK;AAAA,EACP,CAAC;AACH;AACA,IAAM,iCAAiC,eAAe,uBAAuB,uBAAuB;AACpG,IAAO,oBAAQ;",
+  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { VStack } from '../../v-stack';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst getAriaLabelColorValue = colorValue => {\n  // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n  return colorValue.replace(/^var\\((.+)\\)$/, '$1');\n};\nconst getColorObject = (colorValue, colors) => {\n  if (!colorValue || !colors) {\n    return;\n  }\n  if (isMultiplePaletteArray(colors)) {\n    // Multiple origins\n    let matchedColor;\n    colors.some(origin => origin.colors.some(color => {\n      if (color.color === colorValue) {\n        matchedColor = color;\n        return true;\n      }\n      return false;\n    }));\n    return matchedColor;\n  }\n\n  // Single origin\n  return colors.find(color => color.color === colorValue);\n};\nconst getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {\n  if (isStyleEnabled) {\n    if (colorObject) {\n      const ariaLabelValue = getAriaLabelColorValue(colorObject.color);\n      return style ? sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\". 3: The current border style selection e.g. \"solid\".\n      __('Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".'), colorObject.name, ariaLabelValue, style) : sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\".\n      __('Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, ariaLabelValue);\n    }\n    if (colorValue) {\n      const ariaLabelValue = getAriaLabelColorValue(colorValue);\n      return style ? sprintf(\n      // translators: 1: The color's hex code e.g.: \"#f00:\". 2: The current border style selection e.g. \"solid\".\n      __('Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".'), ariaLabelValue, style) : sprintf(\n      // translators: %s: The color's hex code e.g: \"#f00\".\n      __('Border color and style picker. The currently selected color has a value of \"%s\".'), ariaLabelValue);\n    }\n    return __('Border color and style picker.');\n  }\n  if (colorObject) {\n    return sprintf(\n    // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, getAriaLabelColorValue(colorObject.color));\n  }\n  if (colorValue) {\n    return sprintf(\n    // translators: %s: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color has a value of \"%s\".'), getAriaLabelColorValue(colorValue));\n  }\n  return __('Border color picker.');\n};\nconst BorderControlDropdown = (props, forwardedRef) => {\n  const {\n    __experimentalIsRenderedInSidebar,\n    border,\n    colors,\n    disableCustomColors,\n    enableAlpha,\n    enableStyle,\n    indicatorClassName,\n    indicatorWrapperClassName,\n    isStyleSettable,\n    onReset,\n    onColorChange,\n    onStyleChange,\n    popoverContentClassName,\n    popoverControlsClassName,\n    resetButtonWrapperClassName,\n    size,\n    __unstablePopoverProps,\n    onToggle: onToggleProp,\n    // Remove from `otherProps` to avoid type errors (native HTML `onToggle` vs `Dropdown` `onToggle`).\n    ...otherProps\n  } = useBorderControlDropdown(props);\n  const {\n    color,\n    style\n  } = border || {};\n  const colorObject = getColorObject(color, colors);\n  const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle);\n  const enableResetButton = color || style && style !== 'none';\n  const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;\n  const renderToggle = ({\n    onToggle\n  }) => /*#__PURE__*/_jsx(Button, {\n    onClick: onToggle,\n    variant: \"tertiary\",\n    \"aria-label\": toggleAriaLabel,\n    tooltipPosition: dropdownPosition,\n    label: __('Border color and style picker'),\n    showTooltip: true,\n    __next40pxDefaultSize: size === '__unstable-large',\n    children: /*#__PURE__*/_jsx(\"span\", {\n      className: indicatorWrapperClassName,\n      children: /*#__PURE__*/_jsx(ColorIndicator, {\n        className: indicatorClassName,\n        colorValue: color\n      })\n    })\n  });\n  const renderContent = () => /*#__PURE__*/_jsxs(DropdownContentWrapper, {\n    paddingSize: \"medium\",\n    children: [/*#__PURE__*/_jsxs(VStack, {\n      className: popoverControlsClassName,\n      spacing: 6,\n      children: [/*#__PURE__*/_jsx(ColorPalette, {\n        className: popoverContentClassName,\n        value: color,\n        onChange: onColorChange,\n        colors,\n        disableCustomColors,\n        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n        clearable: false,\n        enableAlpha: enableAlpha\n      }), enableStyle && isStyleSettable && /*#__PURE__*/_jsx(BorderControlStylePicker, {\n        label: __('Style'),\n        value: style,\n        onChange: onStyleChange\n      })]\n    }), /*#__PURE__*/_jsx(\"div\", {\n      className: resetButtonWrapperClassName,\n      children: /*#__PURE__*/_jsx(Button, {\n        variant: \"tertiary\",\n        onClick: () => {\n          onReset();\n        },\n        disabled: !enableResetButton,\n        accessibleWhenDisabled: true,\n        __next40pxDefaultSize: true,\n        children: __('Reset')\n      })\n    })]\n  });\n  return /*#__PURE__*/_jsx(Dropdown, {\n    renderToggle: renderToggle,\n    renderContent: renderContent,\n    popoverProps: {\n      ...__unstablePopoverProps\n    },\n    ...otherProps,\n    ref: forwardedRef\n  });\n};\nconst ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown');\nexport default ConnectedBorderControlDropdown;"],
+  "mappings": "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",
   "names": []
 }

package/build-module/box-control/index.mjs

@@ -13,7 +13,6 @@ import { DEFAULT_VALUES, isValueMixed, isValuesDefined, getAllowedSides } from "
 import { useControlledState } from "../utils/hooks/index.mjs";
 import { maybeWarnDeprecated36pxSize } from "../utils/deprecated-36px-size.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { applyValueToSides } from "./utils.mjs";
 var defaultInputProps = {
   min: 0
 };
@@ -141,7 +140,6 @@ function BoxControl({
 }
 var box_control_default = BoxControl;
 export {
-  applyValueToSides,
   box_control_default as default
 };
 //# sourceMappingURL=index.mjs.map

package/build-module/box-control/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/box-control/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport InputControl from './input-control';\nimport LinkedButton from './linked-button';\nimport { Grid } from '../grid';\nimport { InputWrapper, ResetButton, LinkedButtonWrapper } from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport { DEFAULT_VALUES, isValueMixed, isValuesDefined, getAllowedSides } from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst defaultInputProps = {\n  min: 0\n};\nconst noop = () => {};\nfunction useUniqueId(idProp) {\n  const instanceId = useInstanceId(BoxControl, 'inspector-box-control');\n  return idProp || instanceId;\n}\n\n/**\n * A control that lets users set values for top, right, bottom, and left. Can be\n * used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { useState } from 'react';\n * import { BoxControl } from '@wordpress/components';\n *\n * function Example() {\n *   const [ values, setValues ] = useState( {\n *     top: '50px',\n *     left: '10%',\n *     right: '10%',\n *     bottom: '50px',\n *   } );\n *\n *   return (\n *     <BoxControl\n *       __next40pxDefaultSize\n *       values={ values }\n *       onChange={ setValues }\n *     />\n *   );\n * };\n * ```\n */\nfunction BoxControl({\n  __next40pxDefaultSize = false,\n  id: idProp,\n  inputProps = defaultInputProps,\n  onChange = noop,\n  label = __('Box Control'),\n  values: valuesProp,\n  units,\n  sides,\n  splitOnAxis = false,\n  allowReset = true,\n  resetValues = DEFAULT_VALUES,\n  presets,\n  presetKey,\n  onMouseOver,\n  onMouseOut\n}) {\n  const [values, setValues] = useControlledState(valuesProp, {\n    fallback: DEFAULT_VALUES\n  });\n  const inputValues = values || DEFAULT_VALUES;\n  const hasInitialValue = isValuesDefined(valuesProp);\n  const hasOneSide = sides?.length === 1;\n  const [isDirty, setIsDirty] = useState(hasInitialValue);\n  const [isLinked, setIsLinked] = useState(!hasInitialValue || !isValueMixed(inputValues) || hasOneSide);\n\n  // Tracking selected units via internal state allows filtering of CSS unit\n  // only values from being saved while maintaining preexisting unit selection\n  // behaviour. Filtering CSS only values prevents invalid style values.\n  const [selectedUnits, setSelectedUnits] = useState({\n    top: parseQuantityAndUnitFromRawValue(valuesProp?.top)[1],\n    right: parseQuantityAndUnitFromRawValue(valuesProp?.right)[1],\n    bottom: parseQuantityAndUnitFromRawValue(valuesProp?.bottom)[1],\n    left: parseQuantityAndUnitFromRawValue(valuesProp?.left)[1]\n  });\n  const id = useUniqueId(idProp);\n  const headingId = `${id}-heading`;\n  const toggleLinked = () => {\n    setIsLinked(!isLinked);\n  };\n  const handleOnChange = nextValues => {\n    onChange(nextValues);\n    setValues(nextValues);\n    setIsDirty(true);\n  };\n  const handleOnReset = () => {\n    onChange(resetValues);\n    setValues(resetValues);\n    setSelectedUnits(resetValues);\n    setIsDirty(false);\n  };\n  const inputControlProps = {\n    onMouseOver,\n    onMouseOut,\n    ...inputProps,\n    onChange: handleOnChange,\n    isLinked,\n    units,\n    selectedUnits,\n    setSelectedUnits,\n    sides,\n    values: inputValues,\n    __next40pxDefaultSize,\n    presets,\n    presetKey\n  };\n  maybeWarnDeprecated36pxSize({\n    componentName: 'BoxControl',\n    __next40pxDefaultSize,\n    size: undefined\n  });\n  const sidesToRender = getAllowedSides(sides);\n  if (presets && !presetKey || !presets && presetKey) {\n    const definedProp = presets ? 'presets' : 'presetKey';\n    const missingProp = presets ? 'presetKey' : 'presets';\n    globalThis.SCRIPT_DEBUG === true ? warning(`wp.components.BoxControl: the '${missingProp}' prop is required when the '${definedProp}' prop is defined.`) : void 0;\n  }\n  return /*#__PURE__*/_jsxs(Grid, {\n    id: id,\n    columns: 3,\n    templateColumns: \"1fr min-content min-content\",\n    role: \"group\",\n    \"aria-labelledby\": headingId,\n    children: [/*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n      id: headingId,\n      children: label\n    }), isLinked && /*#__PURE__*/_jsx(InputWrapper, {\n      children: /*#__PURE__*/_jsx(InputControl, {\n        side: \"all\",\n        ...inputControlProps\n      })\n    }), !hasOneSide && /*#__PURE__*/_jsx(LinkedButtonWrapper, {\n      children: /*#__PURE__*/_jsx(LinkedButton, {\n        onClick: toggleLinked,\n        isLinked: isLinked\n      })\n    }), !isLinked && splitOnAxis && ['vertical', 'horizontal'].map(axis =>\n    /*#__PURE__*/\n    // Disable reason: the parent component is handling the __next40pxDefaultSize prop\n    // eslint-disable-next-line @wordpress/components-no-missing-40px-size-prop\n    _jsx(InputControl, {\n      side: axis,\n      ...inputControlProps\n    }, axis)), !isLinked && !splitOnAxis && Array.from(sidesToRender).map(axis =>\n    /*#__PURE__*/\n    // Disable reason: the parent component is handling the __next40pxDefaultSize prop\n    // eslint-disable-next-line @wordpress/components-no-missing-40px-size-prop\n    _jsx(InputControl, {\n      side: axis,\n      ...inputControlProps\n    }, axis)), allowReset && /*#__PURE__*/_jsx(ResetButton, {\n      className: \"component-box-control__reset-button\",\n      variant: \"secondary\",\n      size: \"small\",\n      onClick: handleOnReset,\n      disabled: !isDirty,\n      children: __('Reset')\n    })]\n  });\n}\nexport { applyValueToSides } from './utils';\nexport default BoxControl;"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport InputControl from './input-control';\nimport LinkedButton from './linked-button';\nimport { Grid } from '../grid';\nimport { InputWrapper, ResetButton, LinkedButtonWrapper } from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport { DEFAULT_VALUES, isValueMixed, isValuesDefined, getAllowedSides } from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst defaultInputProps = {\n  min: 0\n};\nconst noop = () => {};\nfunction useUniqueId(idProp) {\n  const instanceId = useInstanceId(BoxControl, 'inspector-box-control');\n  return idProp || instanceId;\n}\n\n/**\n * A control that lets users set values for top, right, bottom, and left. Can be\n * used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { useState } from 'react';\n * import { BoxControl } from '@wordpress/components';\n *\n * function Example() {\n *   const [ values, setValues ] = useState( {\n *     top: '50px',\n *     left: '10%',\n *     right: '10%',\n *     bottom: '50px',\n *   } );\n *\n *   return (\n *     <BoxControl\n *       __next40pxDefaultSize\n *       values={ values }\n *       onChange={ setValues }\n *     />\n *   );\n * };\n * ```\n */\nfunction BoxControl({\n  __next40pxDefaultSize = false,\n  id: idProp,\n  inputProps = defaultInputProps,\n  onChange = noop,\n  label = __('Box Control'),\n  values: valuesProp,\n  units,\n  sides,\n  splitOnAxis = false,\n  allowReset = true,\n  resetValues = DEFAULT_VALUES,\n  presets,\n  presetKey,\n  onMouseOver,\n  onMouseOut\n}) {\n  const [values, setValues] = useControlledState(valuesProp, {\n    fallback: DEFAULT_VALUES\n  });\n  const inputValues = values || DEFAULT_VALUES;\n  const hasInitialValue = isValuesDefined(valuesProp);\n  const hasOneSide = sides?.length === 1;\n  const [isDirty, setIsDirty] = useState(hasInitialValue);\n  const [isLinked, setIsLinked] = useState(!hasInitialValue || !isValueMixed(inputValues) || hasOneSide);\n\n  // Tracking selected units via internal state allows filtering of CSS unit\n  // only values from being saved while maintaining preexisting unit selection\n  // behaviour. Filtering CSS only values prevents invalid style values.\n  const [selectedUnits, setSelectedUnits] = useState({\n    top: parseQuantityAndUnitFromRawValue(valuesProp?.top)[1],\n    right: parseQuantityAndUnitFromRawValue(valuesProp?.right)[1],\n    bottom: parseQuantityAndUnitFromRawValue(valuesProp?.bottom)[1],\n    left: parseQuantityAndUnitFromRawValue(valuesProp?.left)[1]\n  });\n  const id = useUniqueId(idProp);\n  const headingId = `${id}-heading`;\n  const toggleLinked = () => {\n    setIsLinked(!isLinked);\n  };\n  const handleOnChange = nextValues => {\n    onChange(nextValues);\n    setValues(nextValues);\n    setIsDirty(true);\n  };\n  const handleOnReset = () => {\n    onChange(resetValues);\n    setValues(resetValues);\n    setSelectedUnits(resetValues);\n    setIsDirty(false);\n  };\n  const inputControlProps = {\n    onMouseOver,\n    onMouseOut,\n    ...inputProps,\n    onChange: handleOnChange,\n    isLinked,\n    units,\n    selectedUnits,\n    setSelectedUnits,\n    sides,\n    values: inputValues,\n    __next40pxDefaultSize,\n    presets,\n    presetKey\n  };\n  maybeWarnDeprecated36pxSize({\n    componentName: 'BoxControl',\n    __next40pxDefaultSize,\n    size: undefined\n  });\n  const sidesToRender = getAllowedSides(sides);\n  if (presets && !presetKey || !presets && presetKey) {\n    const definedProp = presets ? 'presets' : 'presetKey';\n    const missingProp = presets ? 'presetKey' : 'presets';\n    globalThis.SCRIPT_DEBUG === true ? warning(`wp.components.BoxControl: the '${missingProp}' prop is required when the '${definedProp}' prop is defined.`) : void 0;\n  }\n  return /*#__PURE__*/_jsxs(Grid, {\n    id: id,\n    columns: 3,\n    templateColumns: \"1fr min-content min-content\",\n    role: \"group\",\n    \"aria-labelledby\": headingId,\n    children: [/*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n      id: headingId,\n      children: label\n    }), isLinked && /*#__PURE__*/_jsx(InputWrapper, {\n      children: /*#__PURE__*/_jsx(InputControl, {\n        side: \"all\",\n        ...inputControlProps\n      })\n    }), !hasOneSide && /*#__PURE__*/_jsx(LinkedButtonWrapper, {\n      children: /*#__PURE__*/_jsx(LinkedButton, {\n        onClick: toggleLinked,\n        isLinked: isLinked\n      })\n    }), !isLinked && splitOnAxis && ['vertical', 'horizontal'].map(axis =>\n    /*#__PURE__*/\n    // Disable reason: the parent component is handling the __next40pxDefaultSize prop\n    // eslint-disable-next-line @wordpress/components-no-missing-40px-size-prop\n    _jsx(InputControl, {\n      side: axis,\n      ...inputControlProps\n    }, axis)), !isLinked && !splitOnAxis && Array.from(sidesToRender).map(axis =>\n    /*#__PURE__*/\n    // Disable reason: the parent component is handling the __next40pxDefaultSize prop\n    // eslint-disable-next-line @wordpress/components-no-missing-40px-size-prop\n    _jsx(InputControl, {\n      side: axis,\n      ...inputControlProps\n    }, axis)), allowReset && /*#__PURE__*/_jsx(ResetButton, {\n      className: \"component-box-control__reset-button\",\n      variant: \"secondary\",\n      size: \"small\",\n      onClick: handleOnReset,\n      disabled: !isDirty,\n      children: __('Reset')\n    })]\n  });\n}\nexport default BoxControl;"],
+  "mappings": "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",
   "names": []
 }

package/build-module/box-control/utils.mjs

@@ -1,5 +1,4 @@
 // packages/components/src/box-control/utils.ts
-import deprecated from "@wordpress/deprecated";
 import { __ } from "@wordpress/i18n";
 var CUSTOM_VALUE_SETTINGS = {
   px: {
@@ -175,31 +174,6 @@ function normalizeSides(sides) {
   }
   return filteredSides;
 }
-function applyValueToSides(currentValues, newValue, sides) {
-  deprecated("applyValueToSides", {
-    since: "6.8",
-    version: "7.0"
-  });
-  const newValues = {
-    ...currentValues
-  };
-  if (sides?.length) {
-    sides.forEach((side) => {
-      if (side === "vertical") {
-        newValues.top = newValue;
-        newValues.bottom = newValue;
-      } else if (side === "horizontal") {
-        newValues.left = newValue;
-        newValues.right = newValue;
-      } else {
-        newValues[side] = newValue;
-      }
-    });
-  } else {
-    ALL_SIDES.forEach((side) => newValues[side] = newValue);
-  }
-  return newValues;
-}
 function getAllowedSides(sides) {
   const allowedSides = new Set(!sides ? ALL_SIDES : []);
   sides?.forEach((allowedSide) => {
@@ -241,7 +215,6 @@ export {
   CUSTOM_VALUE_SETTINGS,
   DEFAULT_VALUES,
   LABELS,
-  applyValueToSides,
   getAllUnitFallback,
   getAllowedSides,
   getMergedValue,

package/build-module/box-control/utils.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/box-control/utils.ts"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nexport const CUSTOM_VALUE_SETTINGS = {\n  px: {\n    max: 300,\n    step: 1\n  },\n  '%': {\n    max: 100,\n    step: 1\n  },\n  vw: {\n    max: 100,\n    step: 1\n  },\n  vh: {\n    max: 100,\n    step: 1\n  },\n  em: {\n    max: 10,\n    step: 0.1\n  },\n  rm: {\n    max: 10,\n    step: 0.1\n  },\n  svw: {\n    max: 100,\n    step: 1\n  },\n  lvw: {\n    max: 100,\n    step: 1\n  },\n  dvw: {\n    max: 100,\n    step: 1\n  },\n  svh: {\n    max: 100,\n    step: 1\n  },\n  lvh: {\n    max: 100,\n    step: 1\n  },\n  dvh: {\n    max: 100,\n    step: 1\n  },\n  vi: {\n    max: 100,\n    step: 1\n  },\n  svi: {\n    max: 100,\n    step: 1\n  },\n  lvi: {\n    max: 100,\n    step: 1\n  },\n  dvi: {\n    max: 100,\n    step: 1\n  },\n  vb: {\n    max: 100,\n    step: 1\n  },\n  svb: {\n    max: 100,\n    step: 1\n  },\n  lvb: {\n    max: 100,\n    step: 1\n  },\n  dvb: {\n    max: 100,\n    step: 1\n  },\n  vmin: {\n    max: 100,\n    step: 1\n  },\n  svmin: {\n    max: 100,\n    step: 1\n  },\n  lvmin: {\n    max: 100,\n    step: 1\n  },\n  dvmin: {\n    max: 100,\n    step: 1\n  },\n  vmax: {\n    max: 100,\n    step: 1\n  },\n  svmax: {\n    max: 100,\n    step: 1\n  },\n  lvmax: {\n    max: 100,\n    step: 1\n  },\n  dvmax: {\n    max: 100,\n    step: 1\n  }\n};\nexport const LABELS = {\n  all: __('All sides'),\n  top: __('Top side'),\n  bottom: __('Bottom side'),\n  left: __('Left side'),\n  right: __('Right side'),\n  vertical: __('Top and bottom sides'),\n  horizontal: __('Left and right sides')\n};\nexport const DEFAULT_VALUES = {\n  top: undefined,\n  right: undefined,\n  bottom: undefined,\n  left: undefined\n};\nexport const ALL_SIDES = ['top', 'right', 'bottom', 'left'];\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode(arr) {\n  return arr.sort((a, b) => arr.filter(v => v === a).length - arr.filter(v => v === b).length).pop();\n}\n\n/**\n * Gets the merged input value and unit from values data.\n *\n * @param values         Box values.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getMergedValue(values = {}, availableSides = ALL_SIDES) {\n  const sides = normalizeSides(availableSides);\n  if (sides.every(side => values[side] === values[sides[0]])) {\n    return values[sides[0]];\n  }\n  return undefined;\n}\n\n/**\n * Checks if the values are mixed.\n *\n * @param values         Box values.\n * @param availableSides Available box sides to evaluate.\n * @return Whether the values are mixed.\n */\nexport function isValueMixed(values = {}, availableSides = ALL_SIDES) {\n  const sides = normalizeSides(availableSides);\n  return sides.some(side => values[side] !== values[sides[0]]);\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback(selectedUnits) {\n  if (!selectedUnits || typeof selectedUnits !== 'object') {\n    return undefined;\n  }\n  const filteredUnits = Object.values(selectedUnits).filter(Boolean);\n  return mode(filteredUnits);\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined(values) {\n  return values && Object.values(values).filter(\n  // Switching units when input is empty causes values only\n  // containing units. This gives false positive on mixed values\n  // unless filtered.\n  value => !!value && /\\d/.test(value)).length > 0;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides(sides) {\n  const filteredSides = [];\n  if (!sides?.length) {\n    return ALL_SIDES;\n  }\n  if (sides.includes('vertical')) {\n    filteredSides.push(...['top', 'bottom']);\n  } else if (sides.includes('horizontal')) {\n    filteredSides.push(...['left', 'right']);\n  } else {\n    const newSides = ALL_SIDES.filter(side => sides.includes(side));\n    filteredSides.push(...newSides);\n  }\n  return filteredSides;\n}\n\n/**\n * Applies a value to an object representing top, right, bottom and left sides\n * while taking into account any custom side configuration.\n *\n * @deprecated\n *\n * @param currentValues The current values for each side.\n * @param newValue      The value to apply to the sides object.\n * @param sides         Array defining valid sides.\n *\n * @return Object containing the updated values for each side.\n */\nexport function applyValueToSides(currentValues, newValue, sides) {\n  deprecated('applyValueToSides', {\n    since: '6.8',\n    version: '7.0'\n  });\n  const newValues = {\n    ...currentValues\n  };\n  if (sides?.length) {\n    sides.forEach(side => {\n      if (side === 'vertical') {\n        newValues.top = newValue;\n        newValues.bottom = newValue;\n      } else if (side === 'horizontal') {\n        newValues.left = newValue;\n        newValues.right = newValue;\n      } else {\n        newValues[side] = newValue;\n      }\n    });\n  } else {\n    ALL_SIDES.forEach(side => newValues[side] = newValue);\n  }\n  return newValues;\n}\n\n/**\n * Return the allowed sides based on the sides configuration.\n *\n * @param sides Sides configuration.\n * @return Allowed sides.\n */\nexport function getAllowedSides(sides) {\n  const allowedSides = new Set(!sides ? ALL_SIDES : []);\n  sides?.forEach(allowedSide => {\n    if (allowedSide === 'vertical') {\n      allowedSides.add('top');\n      allowedSides.add('bottom');\n    } else if (allowedSide === 'horizontal') {\n      allowedSides.add('right');\n      allowedSides.add('left');\n    } else {\n      allowedSides.add(allowedSide);\n    }\n  });\n  return allowedSides;\n}\n\n/**\n * Checks if a value is a preset value.\n *\n * @param value     The value to check.\n * @param presetKey The preset key to check against.\n * @return Whether the value is a preset value.\n */\nexport function isValuePreset(value, presetKey) {\n  return value.startsWith(`var:preset|${presetKey}|`);\n}\n\n/**\n * Returns the index of the preset value in the presets array.\n *\n * @param value     The value to check.\n * @param presetKey The preset key to check against.\n * @param presets   The array of presets to search.\n * @return The index of the preset value in the presets array.\n */\nexport function getPresetIndexFromValue(value, presetKey, presets) {\n  if (!isValuePreset(value, presetKey)) {\n    return undefined;\n  }\n  const match = value.match(new RegExp(`^var:preset\\\\|${presetKey}\\\\|(.+)$`));\n  if (!match) {\n    return undefined;\n  }\n  const slug = match[1];\n  const index = presets.findIndex(preset => {\n    return preset.slug === slug;\n  });\n  return index !== -1 ? index : undefined;\n}\n\n/**\n * Returns the preset value from the index.\n *\n * @param index     The index of the preset value in the presets array.\n * @param presetKey The preset key to check against.\n * @param presets   The array of presets to search.\n * @return The preset value from the index.\n */\nexport function getPresetValueFromIndex(index, presetKey, presets) {\n  const preset = presets[index];\n  return `var:preset|${presetKey}|${preset.slug}`;\n}"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nexport const CUSTOM_VALUE_SETTINGS = {\n  px: {\n    max: 300,\n    step: 1\n  },\n  '%': {\n    max: 100,\n    step: 1\n  },\n  vw: {\n    max: 100,\n    step: 1\n  },\n  vh: {\n    max: 100,\n    step: 1\n  },\n  em: {\n    max: 10,\n    step: 0.1\n  },\n  rm: {\n    max: 10,\n    step: 0.1\n  },\n  svw: {\n    max: 100,\n    step: 1\n  },\n  lvw: {\n    max: 100,\n    step: 1\n  },\n  dvw: {\n    max: 100,\n    step: 1\n  },\n  svh: {\n    max: 100,\n    step: 1\n  },\n  lvh: {\n    max: 100,\n    step: 1\n  },\n  dvh: {\n    max: 100,\n    step: 1\n  },\n  vi: {\n    max: 100,\n    step: 1\n  },\n  svi: {\n    max: 100,\n    step: 1\n  },\n  lvi: {\n    max: 100,\n    step: 1\n  },\n  dvi: {\n    max: 100,\n    step: 1\n  },\n  vb: {\n    max: 100,\n    step: 1\n  },\n  svb: {\n    max: 100,\n    step: 1\n  },\n  lvb: {\n    max: 100,\n    step: 1\n  },\n  dvb: {\n    max: 100,\n    step: 1\n  },\n  vmin: {\n    max: 100,\n    step: 1\n  },\n  svmin: {\n    max: 100,\n    step: 1\n  },\n  lvmin: {\n    max: 100,\n    step: 1\n  },\n  dvmin: {\n    max: 100,\n    step: 1\n  },\n  vmax: {\n    max: 100,\n    step: 1\n  },\n  svmax: {\n    max: 100,\n    step: 1\n  },\n  lvmax: {\n    max: 100,\n    step: 1\n  },\n  dvmax: {\n    max: 100,\n    step: 1\n  }\n};\nexport const LABELS = {\n  all: __('All sides'),\n  top: __('Top side'),\n  bottom: __('Bottom side'),\n  left: __('Left side'),\n  right: __('Right side'),\n  vertical: __('Top and bottom sides'),\n  horizontal: __('Left and right sides')\n};\nexport const DEFAULT_VALUES = {\n  top: undefined,\n  right: undefined,\n  bottom: undefined,\n  left: undefined\n};\nexport const ALL_SIDES = ['top', 'right', 'bottom', 'left'];\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode(arr) {\n  return arr.sort((a, b) => arr.filter(v => v === a).length - arr.filter(v => v === b).length).pop();\n}\n\n/**\n * Gets the merged input value and unit from values data.\n *\n * @param values         Box values.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getMergedValue(values = {}, availableSides = ALL_SIDES) {\n  const sides = normalizeSides(availableSides);\n  if (sides.every(side => values[side] === values[sides[0]])) {\n    return values[sides[0]];\n  }\n  return undefined;\n}\n\n/**\n * Checks if the values are mixed.\n *\n * @param values         Box values.\n * @param availableSides Available box sides to evaluate.\n * @return Whether the values are mixed.\n */\nexport function isValueMixed(values = {}, availableSides = ALL_SIDES) {\n  const sides = normalizeSides(availableSides);\n  return sides.some(side => values[side] !== values[sides[0]]);\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback(selectedUnits) {\n  if (!selectedUnits || typeof selectedUnits !== 'object') {\n    return undefined;\n  }\n  const filteredUnits = Object.values(selectedUnits).filter(Boolean);\n  return mode(filteredUnits);\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined(values) {\n  return values && Object.values(values).filter(\n  // Switching units when input is empty causes values only\n  // containing units. This gives false positive on mixed values\n  // unless filtered.\n  value => !!value && /\\d/.test(value)).length > 0;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides(sides) {\n  const filteredSides = [];\n  if (!sides?.length) {\n    return ALL_SIDES;\n  }\n  if (sides.includes('vertical')) {\n    filteredSides.push(...['top', 'bottom']);\n  } else if (sides.includes('horizontal')) {\n    filteredSides.push(...['left', 'right']);\n  } else {\n    const newSides = ALL_SIDES.filter(side => sides.includes(side));\n    filteredSides.push(...newSides);\n  }\n  return filteredSides;\n}\n\n/**\n * Return the allowed sides based on the sides configuration.\n *\n * @param sides Sides configuration.\n * @return Allowed sides.\n */\nexport function getAllowedSides(sides) {\n  const allowedSides = new Set(!sides ? ALL_SIDES : []);\n  sides?.forEach(allowedSide => {\n    if (allowedSide === 'vertical') {\n      allowedSides.add('top');\n      allowedSides.add('bottom');\n    } else if (allowedSide === 'horizontal') {\n      allowedSides.add('right');\n      allowedSides.add('left');\n    } else {\n      allowedSides.add(allowedSide);\n    }\n  });\n  return allowedSides;\n}\n\n/**\n * Checks if a value is a preset value.\n *\n * @param value     The value to check.\n * @param presetKey The preset key to check against.\n * @return Whether the value is a preset value.\n */\nexport function isValuePreset(value, presetKey) {\n  return value.startsWith(`var:preset|${presetKey}|`);\n}\n\n/**\n * Returns the index of the preset value in the presets array.\n *\n * @param value     The value to check.\n * @param presetKey The preset key to check against.\n * @param presets   The array of presets to search.\n * @return The index of the preset value in the presets array.\n */\nexport function getPresetIndexFromValue(value, presetKey, presets) {\n  if (!isValuePreset(value, presetKey)) {\n    return undefined;\n  }\n  const match = value.match(new RegExp(`^var:preset\\\\|${presetKey}\\\\|(.+)$`));\n  if (!match) {\n    return undefined;\n  }\n  const slug = match[1];\n  const index = presets.findIndex(preset => {\n    return preset.slug === slug;\n  });\n  return index !== -1 ? index : undefined;\n}\n\n/**\n * Returns the preset value from the index.\n *\n * @param index     The index of the preset value in the presets array.\n * @param presetKey The preset key to check against.\n * @param presets   The array of presets to search.\n * @return The preset value from the index.\n */\nexport function getPresetValueFromIndex(index, presetKey, presets) {\n  const preset = presets[index];\n  return `var:preset|${presetKey}|${preset.slug}`;\n}"],
+  "mappings": "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",
   "names": []
 }

package/build-module/custom-gradient-picker/gradient-bar/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/custom-gradient-picker/gradient-bar/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useReducer } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ControlPoints from './control-points';\nimport { getHorizontalRelativeGradientPosition } from './utils';\nimport { MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst customGradientBarReducer = (state, action) => {\n  switch (action.type) {\n    case 'MOVE_INSERTER':\n      if (state.id === 'IDLE' || state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'MOVING_INSERTER',\n          insertPosition: action.insertPosition\n        };\n      }\n      break;\n    case 'STOP_INSERTER_MOVE':\n      if (state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n    case 'OPEN_INSERTER':\n      if (state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'INSERTING_CONTROL_POINT',\n          insertPosition: state.insertPosition\n        };\n      }\n      break;\n    case 'CLOSE_INSERTER':\n      if (state.id === 'INSERTING_CONTROL_POINT') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n    case 'START_CONTROL_CHANGE':\n      if (state.id === 'IDLE') {\n        return {\n          id: 'MOVING_CONTROL_POINT'\n        };\n      }\n      break;\n    case 'STOP_CONTROL_CHANGE':\n      if (state.id === 'MOVING_CONTROL_POINT') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n  }\n  return state;\n};\nconst customGradientBarReducerInitialState = {\n  id: 'IDLE'\n};\nexport default function CustomGradientBar({\n  background,\n  hasGradient,\n  value: controlPoints,\n  onChange,\n  disableInserter = false,\n  disableAlpha = false,\n  __experimentalIsRenderedInSidebar = false\n}) {\n  const gradientMarkersContainerDomRef = useRef(null);\n  const [gradientBarState, gradientBarStateDispatch] = useReducer(customGradientBarReducer, customGradientBarReducerInitialState);\n  const onMouseEnterAndMove = event => {\n    if (!gradientMarkersContainerDomRef.current) {\n      return;\n    }\n    const insertPosition = getHorizontalRelativeGradientPosition(event.clientX, gradientMarkersContainerDomRef.current);\n\n    // If the insert point is close to an existing control point don't show it.\n    if (controlPoints.some(({\n      position\n    }) => {\n      return Math.abs(insertPosition - position) < MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;\n    })) {\n      if (gradientBarState.id === 'MOVING_INSERTER') {\n        gradientBarStateDispatch({\n          type: 'STOP_INSERTER_MOVE'\n        });\n      }\n      return;\n    }\n    gradientBarStateDispatch({\n      type: 'MOVE_INSERTER',\n      insertPosition\n    });\n  };\n  const onMouseLeave = () => {\n    gradientBarStateDispatch({\n      type: 'STOP_INSERTER_MOVE'\n    });\n  };\n  const isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';\n  const isInsertingControlPoint = gradientBarState.id === 'INSERTING_CONTROL_POINT';\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: clsx('components-custom-gradient-picker__gradient-bar', {\n      'has-gradient': hasGradient\n    }),\n    onMouseEnter: onMouseEnterAndMove,\n    onMouseMove: onMouseEnterAndMove,\n    onMouseLeave: onMouseLeave,\n    children: [/*#__PURE__*/_jsx(\"div\", {\n      className: \"components-custom-gradient-picker__gradient-bar-background\",\n      style: {\n        background,\n        opacity: hasGradient ? 1 : 0.4\n      }\n    }), /*#__PURE__*/_jsxs(\"div\", {\n      ref: gradientMarkersContainerDomRef,\n      className: \"components-custom-gradient-picker__markers-container\",\n      children: [!disableInserter && (isMovingInserter || isInsertingControlPoint) && /*#__PURE__*/_jsx(ControlPoints.InsertPoint, {\n        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n        disableAlpha: disableAlpha,\n        insertPosition: gradientBarState.insertPosition,\n        value: controlPoints,\n        onChange: onChange,\n        onOpenInserter: () => {\n          gradientBarStateDispatch({\n            type: 'OPEN_INSERTER'\n          });\n        },\n        onCloseInserter: () => {\n          gradientBarStateDispatch({\n            type: 'CLOSE_INSERTER'\n          });\n        }\n      }), /*#__PURE__*/_jsx(ControlPoints, {\n        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n        disableAlpha: disableAlpha,\n        disableRemove: disableInserter,\n        gradientPickerDomRef: gradientMarkersContainerDomRef,\n        ignoreMarkerPosition: isInsertingControlPoint ? gradientBarState.insertPosition : undefined,\n        value: controlPoints,\n        onChange: onChange,\n        onStartControlPointChange: () => {\n          gradientBarStateDispatch({\n            type: 'START_CONTROL_CHANGE'\n          });\n        },\n        onStopControlPointChange: () => {\n          gradientBarStateDispatch({\n            type: 'STOP_CONTROL_CHANGE'\n          });\n        }\n      })]\n    })]\n  });\n}"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { useRef, useReducer } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ControlPoints from './control-points';\nimport { getHorizontalRelativeGradientPosition } from './utils';\nimport { MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst customGradientBarReducer = (state, action) => {\n  switch (action.type) {\n    case 'MOVE_INSERTER':\n      if (state.id === 'IDLE' || state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'MOVING_INSERTER',\n          insertPosition: action.insertPosition\n        };\n      }\n      break;\n    case 'STOP_INSERTER_MOVE':\n      if (state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n    case 'OPEN_INSERTER':\n      if (state.id === 'MOVING_INSERTER') {\n        return {\n          id: 'INSERTING_CONTROL_POINT',\n          insertPosition: state.insertPosition\n        };\n      }\n      break;\n    case 'CLOSE_INSERTER':\n      if (state.id === 'INSERTING_CONTROL_POINT') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n    case 'START_CONTROL_CHANGE':\n      if (state.id === 'IDLE') {\n        return {\n          id: 'MOVING_CONTROL_POINT'\n        };\n      }\n      break;\n    case 'STOP_CONTROL_CHANGE':\n      if (state.id === 'MOVING_CONTROL_POINT') {\n        return {\n          id: 'IDLE'\n        };\n      }\n      break;\n  }\n  return state;\n};\nconst customGradientBarReducerInitialState = {\n  id: 'IDLE'\n};\nexport default function CustomGradientBar({\n  background,\n  hasGradient,\n  value: controlPoints,\n  onChange,\n  disableInserter = false,\n  disableAlpha = false,\n  __experimentalIsRenderedInSidebar = false\n}) {\n  const gradientMarkersContainerDomRef = useRef(null);\n  const [gradientBarState, gradientBarStateDispatch] = useReducer(customGradientBarReducer, customGradientBarReducerInitialState);\n  const onMouseEnterAndMove = event => {\n    if (!gradientMarkersContainerDomRef.current) {\n      return;\n    }\n    const insertPosition = getHorizontalRelativeGradientPosition(event.clientX, gradientMarkersContainerDomRef.current);\n\n    // If the insert point is close to an existing control point don't show it.\n    if (controlPoints.some(({\n      position\n    }) => {\n      return Math.abs(insertPosition - position) < MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;\n    })) {\n      if (gradientBarState.id === 'MOVING_INSERTER') {\n        gradientBarStateDispatch({\n          type: 'STOP_INSERTER_MOVE'\n        });\n      }\n      return;\n    }\n    gradientBarStateDispatch({\n      type: 'MOVE_INSERTER',\n      insertPosition\n    });\n  };\n  const onMouseLeave = () => {\n    gradientBarStateDispatch({\n      type: 'STOP_INSERTER_MOVE'\n    });\n  };\n  const isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';\n  const isInsertingControlPoint = gradientBarState.id === 'INSERTING_CONTROL_POINT';\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: clsx('components-custom-gradient-picker__gradient-bar', {\n      'has-gradient': hasGradient\n    }),\n    onMouseEnter: onMouseEnterAndMove,\n    onMouseMove: onMouseEnterAndMove,\n    onMouseLeave: onMouseLeave,\n    children: [/*#__PURE__*/_jsx(\"div\", {\n      className: \"components-custom-gradient-picker__gradient-bar-background\",\n      style: {\n        background,\n        opacity: hasGradient ? 1 : 0.4\n      }\n    }), /*#__PURE__*/_jsxs(\"div\", {\n      ref: gradientMarkersContainerDomRef,\n      className: \"components-custom-gradient-picker__markers-container\",\n      children: [!disableInserter && (isMovingInserter || isInsertingControlPoint) && /*#__PURE__*/_jsx(ControlPoints.InsertPoint, {\n        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n        disableAlpha: disableAlpha,\n        insertPosition: gradientBarState.insertPosition,\n        value: controlPoints,\n        onChange: onChange,\n        onOpenInserter: () => {\n          gradientBarStateDispatch({\n            type: 'OPEN_INSERTER'\n          });\n        },\n        onCloseInserter: () => {\n          gradientBarStateDispatch({\n            type: 'CLOSE_INSERTER'\n          });\n        }\n      }), /*#__PURE__*/_jsx(ControlPoints, {\n        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n        disableAlpha: disableAlpha,\n        disableRemove: disableInserter,\n        gradientPickerDomRef: gradientMarkersContainerDomRef,\n        ignoreMarkerPosition: isInsertingControlPoint ? gradientBarState.insertPosition : undefined,\n        value: controlPoints,\n        onChange: onChange,\n        onStartControlPointChange: () => {\n          gradientBarStateDispatch({\n            type: 'START_CONTROL_CHANGE'\n          });\n        },\n        onStopControlPointChange: () => {\n          gradientBarStateDispatch({\n            type: 'STOP_CONTROL_CHANGE'\n          });\n        }\n      })]\n    })]\n  });\n}"],
+  "mappings": "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",
   "names": []
 }

package/build-module/disabled/index.mjs

@@ -18,7 +18,7 @@ function Disabled({
     value: isDisabled,
     children: /* @__PURE__ */ _jsx("div", {
       // @ts-ignore Reason: inert is a recent HTML attribute
-      inert: isDisabled ? "true" : void 0,
+      inert: isDisabled ? true : void 0,
       className: isDisabled ? cx(disabledStyles, className, "components-disabled") : void 0,
       ...props,
       children

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/disabled/index.tsx"],
-  "sourcesContent": ["import { disabledStyles } from './styles/disabled-styles';\nimport { useCx } from '../utils';\nimport Context from './context';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst {\n  Consumer,\n  Provider\n} = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and\n * prevents pointer interaction.\n *\n * _Note: this component may not behave as expected in browsers that don't\n * support the `inert` HTML attribute. We recommend adding the official WICG\n * polyfill when using this component in your project._\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n *\tlet input = (\n *\t\t<TextControl\n *\t\t\t__next40pxDefaultSize\n *\t\t\tlabel=\"Input\"\n *\t\t\tonChange={ () => {} }\n *\t\t/>\n *\t);\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled({\n  className,\n  children,\n  isDisabled = true,\n  ...props\n}) {\n  const cx = useCx();\n  return /*#__PURE__*/_jsx(Provider, {\n    value: isDisabled,\n    children: /*#__PURE__*/_jsx(\"div\", {\n      // @ts-ignore Reason: inert is a recent HTML attribute\n      inert: isDisabled ? 'true' : undefined,\n      className: isDisabled ? cx(disabledStyles, className, 'components-disabled') : undefined,\n      ...props,\n      children: children\n    })\n  });\n}\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\nexport default Disabled;"],
-  "mappings": ";AAAA,SAAS,sBAAsB;AAC/B,SAAS,aAAa;AACtB,OAAO,aAAa;AACpB,SAAS,OAAO,YAAY;AAC5B,IAAM;AAAA,EACJ;AAAA,EACA;AACF,IAAI;AA6CJ,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,GAAG;AACD,QAAM,KAAK,MAAM;AACjB,SAAoB,qBAAK,UAAU;AAAA,IACjC,OAAO;AAAA,IACP,UAAuB,qBAAK,OAAO;AAAA;AAAA,MAEjC,OAAO,aAAa,SAAS;AAAA,MAC7B,WAAW,aAAa,GAAG,gBAAgB,WAAW,qBAAqB,IAAI;AAAA,MAC/E,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;AACA,SAAS,UAAU;AACnB,SAAS,WAAW;AACpB,IAAO,mBAAQ;",
+  "sourcesContent": ["import { disabledStyles } from './styles/disabled-styles';\nimport { useCx } from '../utils';\nimport Context from './context';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst {\n  Consumer,\n  Provider\n} = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and\n * prevents pointer interaction.\n *\n * _Note: this component may not behave as expected in browsers that don't\n * support the `inert` HTML attribute. We recommend adding the official WICG\n * polyfill when using this component in your project._\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n *\tlet input = (\n *\t\t<TextControl\n *\t\t\t__next40pxDefaultSize\n *\t\t\tlabel=\"Input\"\n *\t\t\tonChange={ () => {} }\n *\t\t/>\n *\t);\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled({\n  className,\n  children,\n  isDisabled = true,\n  ...props\n}) {\n  const cx = useCx();\n  return /*#__PURE__*/_jsx(Provider, {\n    value: isDisabled,\n    children: /*#__PURE__*/_jsx(\"div\", {\n      // @ts-ignore Reason: inert is a recent HTML attribute\n      inert: isDisabled ? true : undefined,\n      className: isDisabled ? cx(disabledStyles, className, 'components-disabled') : undefined,\n      ...props,\n      children: children\n    })\n  });\n}\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\nexport default Disabled;"],
+  "mappings": ";AAAA,SAAS,sBAAsB;AAC/B,SAAS,aAAa;AACtB,OAAO,aAAa;AACpB,SAAS,OAAO,YAAY;AAC5B,IAAM;AAAA,EACJ;AAAA,EACA;AACF,IAAI;AA6CJ,SAAS,SAAS;AAAA,EAChB;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,GAAG;AACD,QAAM,KAAK,MAAM;AACjB,SAAoB,qBAAK,UAAU;AAAA,IACjC,OAAO;AAAA,IACP,UAAuB,qBAAK,OAAO;AAAA;AAAA,MAEjC,OAAO,aAAa,OAAO;AAAA,MAC3B,WAAW,aAAa,GAAG,gBAAgB,WAAW,qBAAqB,IAAI;AAAA,MAC/E,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;AACA,SAAS,UAAU;AACnB,SAAS,WAAW;AACpB,IAAO,mBAAQ;",
   "names": []
 }