@wordpress/components 28.3.0 → 28.5.0

package/build/tabs/tablist.js

@@ -11,6 +11,8 @@ var _element = require("@wordpress/element");
 var _context = require("./context");
 var _styles = require("./styles");
 var _clsx = _interopRequireDefault(require("clsx"));
+var _elementRect = require("../utils/element-rect");
+var _useOnValueUpdate = require("../utils/hooks/use-on-value-update");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -26,202 +28,15 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * Internal dependencies
  */
 
-// TODO: move these into a separate utility file, for use in other components
-// such as ToggleGroupControl.
-
-/**
- * Any function.
- */
-
-/**
- * Creates a stable callback function that has access to the latest state and
- * can be used within event handlers and effect callbacks. Throws when used in
- * the render phase.
- *
- * @example
- *
- * ```tsx
- * function Component(props) {
- *   const onClick = useEvent(props.onClick);
- *   React.useEffect(() => {}, [onClick]);
- * }
- * ```
- */
-function useEvent(callback) {
-  const ref = (0, _element.useRef)(() => {
-    throw new Error('Cannot call an event handler while rendering.');
-  });
-  (0, _element.useInsertionEffect)(() => {
-    ref.current = callback;
-  });
-  return (0, _element.useCallback)((...args) => ref.current?.(...args), []);
-}
-
-/**
- * `useResizeObserver` options.
- */
-
-/**
- * Fires `onResize` when the target element is resized.
- *
- * **The element must not be stored in a ref**, else it won't be observed
- * or updated. Instead, it should be stored in a React state or equivalent.
- *
- * It sets up a `ResizeObserver` that tracks the element under the hood. The
- * target element can be changed dynamically, and the observer will be
- * updated accordingly.
- *
- * By default, `onResize` is called when the observer is set up, in addition
- * to when the element is resized. This behavior can be disabled with the
- * `fireOnObserve` option.
- *
- * @example
- *
- * ```tsx
- * const [ targetElement, setTargetElement ] = useState< HTMLElement | null >();
- *
- * useResizeObserver( targetElement, ( element ) => {
- *   console.log( 'Element resized:', element );
- * } );
- *
- * <div ref={ setTargetElement } />;
- * ```
- */
-function useResizeObserver(
-/**
- * The target element to observe. It can be changed dynamically.
- */
-targetElement,
-/**
- * Callback to fire when the element is resized. It will also be
- * called when the observer is set up, unless `fireOnObserve` is
- * set to `false`.
- */
-onResize, {
-  fireOnObserve = true
-} = {}) {
-  const onResizeEvent = useEvent(onResize);
-  const observedElementRef = (0, _element.useRef)();
-  const resizeObserverRef = (0, _element.useRef)();
-  (0, _element.useEffect)(() => {
-    if (targetElement === observedElementRef.current) {
-      return;
-    }
-    observedElementRef.current = targetElement;
-
-    // Set up a ResizeObserver.
-    if (!resizeObserverRef.current) {
-      resizeObserverRef.current = new ResizeObserver(() => {
-        if (observedElementRef.current) {
-          onResizeEvent(observedElementRef.current);
-        }
-      });
-    }
-    const {
-      current: resizeObserver
-    } = resizeObserverRef;
-
-    // Observe new element.
-    if (targetElement) {
-      if (fireOnObserve) {
-        onResizeEvent(targetElement);
-      }
-      resizeObserver.observe(targetElement);
-    }
-    return () => {
-      // Unobserve previous element.
-      if (observedElementRef.current) {
-        resizeObserver.unobserve(observedElementRef.current);
-      }
-    };
-  }, [fireOnObserve, onResizeEvent, targetElement]);
-}
-
-/**
- * The position and dimensions of an element, relative to its offset parent.
- */
-
-/**
- * An `ElementOffsetRect` object with all values set to zero.
- */
-const NULL_ELEMENT_OFFSET_RECT = {
-  left: 0,
-  top: 0,
-  width: 0,
-  height: 0
-};
-
-/**
- * Returns the position and dimensions of an element, relative to its offset
- * parent. This is useful in contexts where `getBoundingClientRect` is not
- * suitable, such as when the element is transformed.
- *
- * **Note:** the `left` and `right` values are adjusted due to a limitation
- * in the way the browser calculates the offset position of the element,
- * which can cause unwanted scrollbars to appear. This adjustment makes the
- * values potentially inaccurate within a range of 1 pixel.
- */
-function getElementOffsetRect(element) {
-  return {
-    // The adjustments mentioned in the documentation above are necessary
-    // because `offsetLeft` and `offsetTop` are rounded to the nearest pixel,
-    // which can result in a position mismatch that causes unwanted overflow.
-    // For context, see: https://github.com/WordPress/gutenberg/pull/61979
-    left: Math.max(element.offsetLeft - 1, 0),
-    top: Math.max(element.offsetTop - 1, 0),
-    // This is a workaround to obtain these values with a sub-pixel precision,
-    // since `offsetWidth` and `offsetHeight` are rounded to the nearest pixel.
-    width: parseFloat(getComputedStyle(element).width),
-    height: parseFloat(getComputedStyle(element).height)
-  };
-}
-
-/**
- * Tracks the position and dimensions of an element, relative to its offset
- * parent. The element can be changed dynamically.
- */
-function useTrackElementOffsetRect(targetElement) {
-  const [indicatorPosition, setIndicatorPosition] = (0, _element.useState)(NULL_ELEMENT_OFFSET_RECT);
-  useResizeObserver(targetElement, element => setIndicatorPosition(getElementOffsetRect(element)));
-  return indicatorPosition;
-}
-
-/**
- * Context object for the `onUpdate` callback of `useOnValueUpdate`.
- */
-
-/**
- * Calls the `onUpdate` callback when the `value` changes.
- */
-function useOnValueUpdate(
-/**
- * The value to watch for changes.
- */
-value,
-/**
- * Callback to fire when the value changes.
- */
-onUpdate) {
-  const previousValueRef = (0, _element.useRef)(value);
-  const updateCallbackEvent = useEvent(onUpdate);
-  (0, _element.useEffect)(() => {
-    if (previousValueRef.current !== value) {
-      updateCallbackEvent({
-        previousValue: previousValueRef.current
-      });
-      previousValueRef.current = value;
-    }
-  }, [updateCallbackEvent, value]);
-}
 const TabList = exports.TabList = (0, _element.forwardRef)(function TabList({
   children,
   ...otherProps
 }, ref) {
   const context = (0, _context.useTabsContext)();
   const selectedId = context?.store.useState('selectedId');
-  const indicatorPosition = useTrackElementOffsetRect(context?.store.item(selectedId)?.element);
+  const indicatorPosition = (0, _elementRect.useTrackElementOffsetRect)(context?.store.item(selectedId)?.element);
   const [animationEnabled, setAnimationEnabled] = (0, _element.useState)(false);
-  useOnValueUpdate(selectedId, ({
+  (0, _useOnValueUpdate.useOnValueUpdate)(selectedId, ({
     previousValue
   }) => previousValue && setAnimationEnabled(true));
   if (!context) {

package/build/tabs/tablist.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_warning","_interopRequireDefault","_element","_context","_styles","_clsx","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","useEvent","callback","ref","useRef","Error","useInsertionEffect","current","useCallback","args","useResizeObserver","targetElement","onResize","fireOnObserve","onResizeEvent","observedElementRef","resizeObserverRef","useEffect","ResizeObserver","resizeObserver","observe","unobserve","NULL_ELEMENT_OFFSET_RECT","left","top","width","height","getElementOffsetRect","element","Math","max","offsetLeft","offsetTop","parseFloat","getComputedStyle","useTrackElementOffsetRect","indicatorPosition","setIndicatorPosition","useState","useOnValueUpdate","value","onUpdate","previousValueRef","updateCallbackEvent","previousValue","TabList","exports","forwardRef","children","otherProps","context","useTabsContext","selectedId","store","item","animationEnabled","setAnimationEnabled","globalThis","SCRIPT_DEBUG","warning","activeId","selectOnMove","setActiveId","onBlur","jsx","render","TabListWrapper","onTransitionEnd","event","pseudoElement","style","className","clsx"],"sources":["@wordpress/components/src/tabs/tablist.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport warning from '@wordpress/warning';\nimport {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseInsertionEffect,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabListProps } from './types';\nimport { useTabsContext } from './context';\nimport { TabListWrapper } from './styles';\nimport type { WordPressComponentProps } from '../context';\nimport clsx from 'clsx';\n\n// TODO: move these into a separate utility file, for use in other components\n// such as ToggleGroupControl.\n\n/**\n * Any function.\n */\ntype AnyFunction = ( ...args: any ) => any;\n\n/**\n * Creates a stable callback function that has access to the latest state and\n * can be used within event handlers and effect callbacks. Throws when used in\n * the render phase.\n *\n * @example\n *\n * ```tsx\n * function Component(props) {\n *   const onClick = useEvent(props.onClick);\n *   React.useEffect(() => {}, [onClick]);\n * }\n * ```\n */\nfunction useEvent< T extends AnyFunction >( callback?: T ) {\n\tconst ref = useRef< AnyFunction | undefined >( () => {\n\t\tthrow new Error( 'Cannot call an event handler while rendering.' );\n\t} );\n\tuseInsertionEffect( () => {\n\t\tref.current = callback;\n\t} );\n\treturn useCallback< AnyFunction >(\n\t\t( ...args ) => ref.current?.( ...args ),\n\t\t[]\n\t) as T;\n}\n\n/**\n * `useResizeObserver` options.\n */\ntype UseResizeObserverOptions = {\n\t/**\n\t * Whether to trigger the callback when an element's ResizeObserver is\n\t * first set up.\n\t *\n\t * @default true\n\t */\n\tfireOnObserve?: boolean;\n};\n\n/**\n * Fires `onResize` when the target element is resized.\n *\n * **The element must not be stored in a ref**, else it won't be observed\n * or updated. Instead, it should be stored in a React state or equivalent.\n *\n * It sets up a `ResizeObserver` that tracks the element under the hood. The\n * target element can be changed dynamically, and the observer will be\n * updated accordingly.\n *\n * By default, `onResize` is called when the observer is set up, in addition\n * to when the element is resized. This behavior can be disabled with the\n * `fireOnObserve` option.\n *\n * @example\n *\n * ```tsx\n * const [ targetElement, setTargetElement ] = useState< HTMLElement | null >();\n *\n * useResizeObserver( targetElement, ( element ) => {\n *   console.log( 'Element resized:', element );\n * } );\n *\n * <div ref={ setTargetElement } />;\n * ```\n */\nfunction useResizeObserver(\n\t/**\n\t * The target element to observe. It can be changed dynamically.\n\t */\n\ttargetElement: HTMLElement | undefined | null,\n\n\t/**\n\t * Callback to fire when the element is resized. It will also be\n\t * called when the observer is set up, unless `fireOnObserve` is\n\t * set to `false`.\n\t */\n\tonResize: ( element: HTMLElement ) => void,\n\t{ fireOnObserve = true }: UseResizeObserverOptions = {}\n) {\n\tconst onResizeEvent = useEvent( onResize );\n\n\tconst observedElementRef = useRef< HTMLElement | null >();\n\tconst resizeObserverRef = useRef< ResizeObserver >();\n\n\tuseEffect( () => {\n\t\tif ( targetElement === observedElementRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tobservedElementRef.current = targetElement;\n\n\t\t// Set up a ResizeObserver.\n\t\tif ( ! resizeObserverRef.current ) {\n\t\t\tresizeObserverRef.current = new ResizeObserver( () => {\n\t\t\t\tif ( observedElementRef.current ) {\n\t\t\t\t\tonResizeEvent( observedElementRef.current );\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\t\tconst { current: resizeObserver } = resizeObserverRef;\n\n\t\t// Observe new element.\n\t\tif ( targetElement ) {\n\t\t\tif ( fireOnObserve ) {\n\t\t\t\tonResizeEvent( targetElement );\n\t\t\t}\n\t\t\tresizeObserver.observe( targetElement );\n\t\t}\n\n\t\treturn () => {\n\t\t\t// Unobserve previous element.\n\t\t\tif ( observedElementRef.current ) {\n\t\t\t\tresizeObserver.unobserve( observedElementRef.current );\n\t\t\t}\n\t\t};\n\t}, [ fireOnObserve, onResizeEvent, targetElement ] );\n}\n\n/**\n * The position and dimensions of an element, relative to its offset parent.\n */\ntype ElementOffsetRect = {\n\t/**\n\t * The distance from the left edge of the offset parent to the left edge of\n\t * the element.\n\t */\n\tleft: number;\n\t/**\n\t * The distance from the top edge of the offset parent to the top edge of\n\t * the element.\n\t */\n\ttop: number;\n\t/**\n\t * The width of the element.\n\t */\n\twidth: number;\n\t/**\n\t * The height of the element.\n\t */\n\theight: number;\n};\n\n/**\n * An `ElementOffsetRect` object with all values set to zero.\n */\nconst NULL_ELEMENT_OFFSET_RECT = {\n\tleft: 0,\n\ttop: 0,\n\twidth: 0,\n\theight: 0,\n} satisfies ElementOffsetRect;\n\n/**\n * Returns the position and dimensions of an element, relative to its offset\n * parent. This is useful in contexts where `getBoundingClientRect` is not\n * suitable, such as when the element is transformed.\n *\n * **Note:** the `left` and `right` values are adjusted due to a limitation\n * in the way the browser calculates the offset position of the element,\n * which can cause unwanted scrollbars to appear. This adjustment makes the\n * values potentially inaccurate within a range of 1 pixel.\n */\nfunction getElementOffsetRect( element: HTMLElement ): ElementOffsetRect {\n\treturn {\n\t\t// The adjustments mentioned in the documentation above are necessary\n\t\t// because `offsetLeft` and `offsetTop` are rounded to the nearest pixel,\n\t\t// which can result in a position mismatch that causes unwanted overflow.\n\t\t// For context, see: https://github.com/WordPress/gutenberg/pull/61979\n\t\tleft: Math.max( element.offsetLeft - 1, 0 ),\n\t\ttop: Math.max( element.offsetTop - 1, 0 ),\n\t\t// This is a workaround to obtain these values with a sub-pixel precision,\n\t\t// since `offsetWidth` and `offsetHeight` are rounded to the nearest pixel.\n\t\twidth: parseFloat( getComputedStyle( element ).width ),\n\t\theight: parseFloat( getComputedStyle( element ).height ),\n\t};\n}\n\n/**\n * Tracks the position and dimensions of an element, relative to its offset\n * parent. The element can be changed dynamically.\n */\nfunction useTrackElementOffsetRect(\n\ttargetElement: HTMLElement | undefined | null\n) {\n\tconst [ indicatorPosition, setIndicatorPosition ] =\n\t\tuseState< ElementOffsetRect >( NULL_ELEMENT_OFFSET_RECT );\n\n\tuseResizeObserver( targetElement, ( element ) =>\n\t\tsetIndicatorPosition( getElementOffsetRect( element ) )\n\t);\n\n\treturn indicatorPosition;\n}\n\n/**\n * Context object for the `onUpdate` callback of `useOnValueUpdate`.\n */\ntype ValueUpdateContext< T > = {\n\tpreviousValue: T;\n};\n\n/**\n * Calls the `onUpdate` callback when the `value` changes.\n */\nfunction useOnValueUpdate< T >(\n\t/**\n\t * The value to watch for changes.\n\t */\n\tvalue: T,\n\t/**\n\t * Callback to fire when the value changes.\n\t */\n\tonUpdate: ( context: ValueUpdateContext< T > ) => void\n) {\n\tconst previousValueRef = useRef( value );\n\tconst updateCallbackEvent = useEvent( onUpdate );\n\tuseEffect( () => {\n\t\tif ( previousValueRef.current !== value ) {\n\t\t\tupdateCallbackEvent( {\n\t\t\t\tpreviousValue: previousValueRef.current,\n\t\t\t} );\n\t\t\tpreviousValueRef.current = value;\n\t\t}\n\t}, [ updateCallbackEvent, value ] );\n}\n\nexport const TabList = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< TabListProps, 'div', false >\n>( function TabList( { children, ...otherProps }, ref ) {\n\tconst context = useTabsContext();\n\n\tconst selectedId = context?.store.useState( 'selectedId' );\n\tconst indicatorPosition = useTrackElementOffsetRect(\n\t\tcontext?.store.item( selectedId )?.element\n\t);\n\n\tconst [ animationEnabled, setAnimationEnabled ] = useState( false );\n\tuseOnValueUpdate(\n\t\tselectedId,\n\t\t( { previousValue } ) => previousValue && setAnimationEnabled( true )\n\t);\n\n\tif ( ! context ) {\n\t\twarning( '`Tabs.TabList` must be wrapped in a `Tabs` component.' );\n\t\treturn null;\n\t}\n\tconst { store } = context;\n\n\tconst { activeId, selectOnMove } = store.useState();\n\tconst { setActiveId } = store;\n\n\tconst onBlur = () => {\n\t\tif ( ! selectOnMove ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// When automatic tab selection is on, make sure that the active tab is up\n\t\t// to date with the selected tab when leaving the tablist. This makes sure\n\t\t// that the selected tab will receive keyboard focus when tabbing back into\n\t\t// the tablist.\n\t\tif ( selectedId !== activeId ) {\n\t\t\tsetActiveId( selectedId );\n\t\t}\n\t};\n\n\treturn (\n\t\t<Ariakit.TabList\n\t\t\tref={ ref }\n\t\t\tstore={ store }\n\t\t\trender={\n\t\t\t\t<TabListWrapper\n\t\t\t\t\tonTransitionEnd={ ( event ) => {\n\t\t\t\t\t\tif ( event.pseudoElement === '::after' ) {\n\t\t\t\t\t\t\tsetAnimationEnabled( false );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t}\n\t\t\tonBlur={ onBlur }\n\t\t\t{ ...otherProps }\n\t\t\tstyle={ {\n\t\t\t\t'--indicator-left': `${ indicatorPosition.left }px`,\n\t\t\t\t'--indicator-top': `${ indicatorPosition.top }px`,\n\t\t\t\t'--indicator-width': `${ indicatorPosition.width }px`,\n\t\t\t\t'--indicator-height': `${ indicatorPosition.height }px`,\n\t\t\t\t...otherProps.style,\n\t\t\t} }\n\t\t\tclassName={ clsx(\n\t\t\t\tanimationEnabled ? 'is-animation-enabled' : '',\n\t\t\t\totherProps.className\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</Ariakit.TabList>\n\t);\n} );\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAaA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AAEA,IAAAM,KAAA,GAAAJ,sBAAA,CAAAF,OAAA;AAAwB,IAAAO,WAAA,GAAAP,OAAA;AAAA,SAAAQ,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAV,wBAAAU,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAzBxB;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;;AAOA;AACA;;AAEA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASW,QAAQA,CAA2BC,QAAY,EAAG;EAC1D,MAAMC,GAAG,GAAG,IAAAC,eAAM,EAA6B,MAAM;IACpD,MAAM,IAAIC,KAAK,CAAE,+CAAgD,CAAC;EACnE,CAAE,CAAC;EACH,IAAAC,2BAAkB,EAAE,MAAM;IACzBH,GAAG,CAACI,OAAO,GAAGL,QAAQ;EACvB,CAAE,CAAC;EACH,OAAO,IAAAM,oBAAW,EACjB,CAAE,GAAGC,IAAI,KAAMN,GAAG,CAACI,OAAO,GAAI,GAAGE,IAAK,CAAC,EACvC,EACD,CAAC;AACF;;AAEA;AACA;AACA;;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,iBAAiBA;AACzB;AACD;AACA;AACCC,aAA6C;AAE7C;AACD;AACA;AACA;AACA;AACCC,QAA0C,EAC1C;EAAEC,aAAa,GAAG;AAA+B,CAAC,GAAG,CAAC,CAAC,EACtD;EACD,MAAMC,aAAa,GAAGb,QAAQ,CAAEW,QAAS,CAAC;EAE1C,MAAMG,kBAAkB,GAAG,IAAAX,eAAM,EAAuB,CAAC;EACzD,MAAMY,iBAAiB,GAAG,IAAAZ,eAAM,EAAmB,CAAC;EAEpD,IAAAa,kBAAS,EAAE,MAAM;IAChB,IAAKN,aAAa,KAAKI,kBAAkB,CAACR,OAAO,EAAG;MACnD;IACD;IAEAQ,kBAAkB,CAACR,OAAO,GAAGI,aAAa;;IAE1C;IACA,IAAK,CAAEK,iBAAiB,CAACT,OAAO,EAAG;MAClCS,iBAAiB,CAACT,OAAO,GAAG,IAAIW,cAAc,CAAE,MAAM;QACrD,IAAKH,kBAAkB,CAACR,OAAO,EAAG;UACjCO,aAAa,CAAEC,kBAAkB,CAACR,OAAQ,CAAC;QAC5C;MACD,CAAE,CAAC;IACJ;IACA,MAAM;MAAEA,OAAO,EAAEY;IAAe,CAAC,GAAGH,iBAAiB;;IAErD;IACA,IAAKL,aAAa,EAAG;MACpB,IAAKE,aAAa,EAAG;QACpBC,aAAa,CAAEH,aAAc,CAAC;MAC/B;MACAQ,cAAc,CAACC,OAAO,CAAET,aAAc,CAAC;IACxC;IAEA,OAAO,MAAM;MACZ;MACA,IAAKI,kBAAkB,CAACR,OAAO,EAAG;QACjCY,cAAc,CAACE,SAAS,CAAEN,kBAAkB,CAACR,OAAQ,CAAC;MACvD;IACD,CAAC;EACF,CAAC,EAAE,CAAEM,aAAa,EAAEC,aAAa,EAAEH,aAAa,CAAG,CAAC;AACrD;;AAEA;AACA;AACA;;AAsBA;AACA;AACA;AACA,MAAMW,wBAAwB,GAAG;EAChCC,IAAI,EAAE,CAAC;EACPC,GAAG,EAAE,CAAC;EACNC,KAAK,EAAE,CAAC;EACRC,MAAM,EAAE;AACT,CAA6B;;AAE7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,oBAAoBA,CAAEC,OAAoB,EAAsB;EACxE,OAAO;IACN;IACA;IACA;IACA;IACAL,IAAI,EAAEM,IAAI,CAACC,GAAG,CAAEF,OAAO,CAACG,UAAU,GAAG,CAAC,EAAE,CAAE,CAAC;IAC3CP,GAAG,EAAEK,IAAI,CAACC,GAAG,CAAEF,OAAO,CAACI,SAAS,GAAG,CAAC,EAAE,CAAE,CAAC;IACzC;IACA;IACAP,KAAK,EAAEQ,UAAU,CAAEC,gBAAgB,CAAEN,OAAQ,CAAC,CAACH,KAAM,CAAC;IACtDC,MAAM,EAAEO,UAAU,CAAEC,gBAAgB,CAAEN,OAAQ,CAAC,CAACF,MAAO;EACxD,CAAC;AACF;;AAEA;AACA;AACA;AACA;AACA,SAASS,yBAAyBA,CACjCxB,aAA6C,EAC5C;EACD,MAAM,CAAEyB,iBAAiB,EAAEC,oBAAoB,CAAE,GAChD,IAAAC,iBAAQ,EAAuBhB,wBAAyB,CAAC;EAE1DZ,iBAAiB,CAAEC,aAAa,EAAIiB,OAAO,IAC1CS,oBAAoB,CAAEV,oBAAoB,CAAEC,OAAQ,CAAE,CACvD,CAAC;EAED,OAAOQ,iBAAiB;AACzB;;AAEA;AACA;AACA;;AAKA;AACA;AACA;AACA,SAASG,gBAAgBA;AACxB;AACD;AACA;AACCC,KAAQ;AACR;AACD;AACA;AACCC,QAAsD,EACrD;EACD,MAAMC,gBAAgB,GAAG,IAAAtC,eAAM,EAAEoC,KAAM,CAAC;EACxC,MAAMG,mBAAmB,GAAG1C,QAAQ,CAAEwC,QAAS,CAAC;EAChD,IAAAxB,kBAAS,EAAE,MAAM;IAChB,IAAKyB,gBAAgB,CAACnC,OAAO,KAAKiC,KAAK,EAAG;MACzCG,mBAAmB,CAAE;QACpBC,aAAa,EAAEF,gBAAgB,CAACnC;MACjC,CAAE,CAAC;MACHmC,gBAAgB,CAACnC,OAAO,GAAGiC,KAAK;IACjC;EACD,CAAC,EAAE,CAAEG,mBAAmB,EAAEH,KAAK,CAAG,CAAC;AACpC;AAEO,MAAMK,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,IAAAE,mBAAU,EAG9B,SAASF,OAAOA,CAAE;EAAEG,QAAQ;EAAE,GAAGC;AAAW,CAAC,EAAE9C,GAAG,EAAG;EACvD,MAAM+C,OAAO,GAAG,IAAAC,uBAAc,EAAC,CAAC;EAEhC,MAAMC,UAAU,GAAGF,OAAO,EAAEG,KAAK,CAACf,QAAQ,CAAE,YAAa,CAAC;EAC1D,MAAMF,iBAAiB,GAAGD,yBAAyB,CAClDe,OAAO,EAAEG,KAAK,CAACC,IAAI,CAAEF,UAAW,CAAC,EAAExB,OACpC,CAAC;EAED,MAAM,CAAE2B,gBAAgB,EAAEC,mBAAmB,CAAE,GAAG,IAAAlB,iBAAQ,EAAE,KAAM,CAAC;EACnEC,gBAAgB,CACfa,UAAU,EACV,CAAE;IAAER;EAAc,CAAC,KAAMA,aAAa,IAAIY,mBAAmB,CAAE,IAAK,CACrE,CAAC;EAED,IAAK,CAAEN,OAAO,EAAG;IAChBO,UAAA,CAAAC,YAAA,gBAAAC,gBAAO,EAAE,uDAAwD,CAAC;IAClE,OAAO,IAAI;EACZ;EACA,MAAM;IAAEN;EAAM,CAAC,GAAGH,OAAO;EAEzB,MAAM;IAAEU,QAAQ;IAAEC;EAAa,CAAC,GAAGR,KAAK,CAACf,QAAQ,CAAC,CAAC;EACnD,MAAM;IAAEwB;EAAY,CAAC,GAAGT,KAAK;EAE7B,MAAMU,MAAM,GAAGA,CAAA,KAAM;IACpB,IAAK,CAAEF,YAAY,EAAG;MACrB;IACD;;IAEA;IACA;IACA;IACA;IACA,IAAKT,UAAU,KAAKQ,QAAQ,EAAG;MAC9BE,WAAW,CAAEV,UAAW,CAAC;IAC1B;EACD,CAAC;EAED,oBACC,IAAAxE,WAAA,CAAAoF,GAAA,EAAC7F,OAAO,CAAC0E,OAAO;IACf1C,GAAG,EAAGA,GAAK;IACXkD,KAAK,EAAGA,KAAO;IACfY,MAAM,eACL,IAAArF,WAAA,CAAAoF,GAAA,EAACtF,OAAA,CAAAwF,cAAc;MACdC,eAAe,EAAKC,KAAK,IAAM;QAC9B,IAAKA,KAAK,CAACC,aAAa,KAAK,SAAS,EAAG;UACxCb,mBAAmB,CAAE,KAAM,CAAC;QAC7B;MACD;IAAG,CACH,CACD;IACDO,MAAM,EAAGA,MAAQ;IAAA,GACZd,UAAU;IACfqB,KAAK,EAAG;MACP,kBAAkB,EAAG,GAAGlC,iBAAiB,CAACb,IAAM,IAAG;MACnD,iBAAiB,EAAG,GAAGa,iBAAiB,CAACZ,GAAK,IAAG;MACjD,mBAAmB,EAAG,GAAGY,iBAAiB,CAACX,KAAO,IAAG;MACrD,oBAAoB,EAAG,GAAGW,iBAAiB,CAACV,MAAQ,IAAG;MACvD,GAAGuB,UAAU,CAACqB;IACf,CAAG;IACHC,SAAS,EAAG,IAAAC,aAAI,EACfjB,gBAAgB,GAAG,sBAAsB,GAAG,EAAE,EAC9CN,UAAU,CAACsB,SACZ,CAAG;IAAAvB,QAAA,EAEDA;EAAQ,CACM,CAAC;AAEpB,CAAE,CAAC","ignoreList":[]}
+{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_warning","_interopRequireDefault","_element","_context","_styles","_clsx","_elementRect","_useOnValueUpdate","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TabList","exports","forwardRef","children","otherProps","ref","context","useTabsContext","selectedId","store","useState","indicatorPosition","useTrackElementOffsetRect","item","element","animationEnabled","setAnimationEnabled","useOnValueUpdate","previousValue","globalThis","SCRIPT_DEBUG","warning","activeId","selectOnMove","setActiveId","onBlur","jsx","render","TabListWrapper","onTransitionEnd","event","pseudoElement","style","left","top","width","height","className","clsx"],"sources":["@wordpress/components/src/tabs/tablist.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport warning from '@wordpress/warning';\nimport { forwardRef, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabListProps } from './types';\nimport { useTabsContext } from './context';\nimport { TabListWrapper } from './styles';\nimport type { WordPressComponentProps } from '../context';\nimport clsx from 'clsx';\nimport { useTrackElementOffsetRect } from '../utils/element-rect';\nimport { useOnValueUpdate } from '../utils/hooks/use-on-value-update';\n\nexport const TabList = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< TabListProps, 'div', false >\n>( function TabList( { children, ...otherProps }, ref ) {\n\tconst context = useTabsContext();\n\n\tconst selectedId = context?.store.useState( 'selectedId' );\n\tconst indicatorPosition = useTrackElementOffsetRect(\n\t\tcontext?.store.item( selectedId )?.element\n\t);\n\n\tconst [ animationEnabled, setAnimationEnabled ] = useState( false );\n\tuseOnValueUpdate(\n\t\tselectedId,\n\t\t( { previousValue } ) => previousValue && setAnimationEnabled( true )\n\t);\n\n\tif ( ! context ) {\n\t\twarning( '`Tabs.TabList` must be wrapped in a `Tabs` component.' );\n\t\treturn null;\n\t}\n\tconst { store } = context;\n\n\tconst { activeId, selectOnMove } = store.useState();\n\tconst { setActiveId } = store;\n\n\tconst onBlur = () => {\n\t\tif ( ! selectOnMove ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// When automatic tab selection is on, make sure that the active tab is up\n\t\t// to date with the selected tab when leaving the tablist. This makes sure\n\t\t// that the selected tab will receive keyboard focus when tabbing back into\n\t\t// the tablist.\n\t\tif ( selectedId !== activeId ) {\n\t\t\tsetActiveId( selectedId );\n\t\t}\n\t};\n\n\treturn (\n\t\t<Ariakit.TabList\n\t\t\tref={ ref }\n\t\t\tstore={ store }\n\t\t\trender={\n\t\t\t\t<TabListWrapper\n\t\t\t\t\tonTransitionEnd={ ( event ) => {\n\t\t\t\t\t\tif ( event.pseudoElement === '::after' ) {\n\t\t\t\t\t\t\tsetAnimationEnabled( false );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t}\n\t\t\tonBlur={ onBlur }\n\t\t\t{ ...otherProps }\n\t\t\tstyle={ {\n\t\t\t\t'--indicator-left': `${ indicatorPosition.left }px`,\n\t\t\t\t'--indicator-top': `${ indicatorPosition.top }px`,\n\t\t\t\t'--indicator-width': `${ indicatorPosition.width }px`,\n\t\t\t\t'--indicator-height': `${ indicatorPosition.height }px`,\n\t\t\t\t...otherProps.style,\n\t\t\t} }\n\t\t\tclassName={ clsx(\n\t\t\t\tanimationEnabled ? 'is-animation-enabled' : '',\n\t\t\t\totherProps.className\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</Ariakit.TabList>\n\t);\n} );\n"],"mappings":"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","ignoreList":[]}

package/build/text-control/index.js

@@ -72,6 +72,7 @@ function UnforwardedTextControl(props, ref) {
  *
  *   return (
  *     <TextControl
+ *       __nextHasNoMarginBottom
  *       label="Additional CSS Class"
  *       value={ className }
  *       onChange={ ( value ) => setClassName( value ) }

package/build/text-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_compose","_element","_baseControl","_jsxRuntime","UnforwardedTextControl","props","ref","__nextHasNoMarginBottom","__next40pxDefaultSize","label","hideLabelFromVision","value","help","id","idProp","className","onChange","type","additionalProps","useInstanceId","TextControl","onChangeValue","event","target","jsx","default","children","clsx","undefined","exports","forwardRef","_default"],"sources":["@wordpress/components/src/text-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ForwardedRef } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../context';\nimport type { TextControlProps } from './types';\n\nfunction UnforwardedTextControl(\n\tprops: WordPressComponentProps< TextControlProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom,\n\t\t__next40pxDefaultSize = false,\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tid: idProp,\n\t\tclassName,\n\t\tonChange,\n\t\ttype = 'text',\n\t\t...additionalProps\n\t} = props;\n\tconst id = useInstanceId( TextControl, 'inspector-text-control', idProp );\n\tconst onChangeValue = ( event: ChangeEvent< HTMLInputElement > ) =>\n\t\tonChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<input\n\t\t\t\tclassName={ clsx( 'components-text-control__input', {\n\t\t\t\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t\t\t} ) }\n\t\t\t\ttype={ type }\n\t\t\t\tid={ id }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * TextControl components let users enter and edit text.\n *\n * ```jsx\n * import { TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTextControl = () => {\n *   const [ className, setClassName ] = useState( '' );\n *\n *   return (\n *     <TextControl\n *       label=\"Additional CSS Class\"\n *       value={ className }\n *       onChange={ ( value ) => setClassName( value ) }\n *     />\n *   );\n * };\n * ```\n */\nexport const TextControl = forwardRef( UnforwardedTextControl );\n\nexport default TextControl;\n"],"mappings":";;;;;;;AAIA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,YAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA0C,IAAAI,WAAA,GAAAJ,OAAA;AAf1C;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;;AAKA,SAASK,sBAAsBA,CAC9BC,KAAkE,EAClEC,GAAqC,EACpC;EACD,MAAM;IACLC,uBAAuB;IACvBC,qBAAqB,GAAG,KAAK;IAC7BC,KAAK;IACLC,mBAAmB;IACnBC,KAAK;IACLC,IAAI;IACJC,EAAE,EAAEC,MAAM;IACVC,SAAS;IACTC,QAAQ;IACRC,IAAI,GAAG,MAAM;IACb,GAAGC;EACJ,CAAC,GAAGb,KAAK;EACT,MAAMQ,EAAE,GAAG,IAAAM,sBAAa,EAAEC,WAAW,EAAE,wBAAwB,EAAEN,MAAO,CAAC;EACzE,MAAMO,aAAa,GAAKC,KAAsC,IAC7DN,QAAQ,CAAEM,KAAK,CAACC,MAAM,CAACZ,KAAM,CAAC;EAE/B,oBACC,IAAAR,WAAA,CAAAqB,GAAA,EAACtB,YAAA,CAAAuB,OAAW;IACXlB,uBAAuB,EAAGA,uBAAyB;IACnDE,KAAK,EAAGA,KAAO;IACfC,mBAAmB,EAAGA,mBAAqB;IAC3CG,EAAE,EAAGA,EAAI;IACTD,IAAI,EAAGA,IAAM;IACbG,SAAS,EAAGA,SAAW;IAAAW,QAAA,eAEvB,IAAAvB,WAAA,CAAAqB,GAAA;MACCT,SAAS,EAAG,IAAAY,aAAI,EAAE,gCAAgC,EAAE;QACnD,2BAA2B,EAAEnB;MAC9B,CAAE,CAAG;MACLS,IAAI,EAAGA,IAAM;MACbJ,EAAE,EAAGA,EAAI;MACTF,KAAK,EAAGA,KAAO;MACfK,QAAQ,EAAGK,aAAe;MAC1B,oBAAmB,CAAC,CAAET,IAAI,GAAGC,EAAE,GAAG,QAAQ,GAAGe,SAAW;MACxDtB,GAAG,EAAGA,GAAK;MAAA,GACNY;IAAe,CACpB;EAAC,CACU,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAME,WAAW,GAAAS,OAAA,CAAAT,WAAA,GAAG,IAAAU,mBAAU,EAAE1B,sBAAuB,CAAC;AAAC,IAAA2B,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAEjDL,WAAW","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_compose","_element","_baseControl","_jsxRuntime","UnforwardedTextControl","props","ref","__nextHasNoMarginBottom","__next40pxDefaultSize","label","hideLabelFromVision","value","help","id","idProp","className","onChange","type","additionalProps","useInstanceId","TextControl","onChangeValue","event","target","jsx","default","children","clsx","undefined","exports","forwardRef","_default"],"sources":["@wordpress/components/src/text-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ForwardedRef } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../context';\nimport type { TextControlProps } from './types';\n\nfunction UnforwardedTextControl(\n\tprops: WordPressComponentProps< TextControlProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom,\n\t\t__next40pxDefaultSize = false,\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tid: idProp,\n\t\tclassName,\n\t\tonChange,\n\t\ttype = 'text',\n\t\t...additionalProps\n\t} = props;\n\tconst id = useInstanceId( TextControl, 'inspector-text-control', idProp );\n\tconst onChangeValue = ( event: ChangeEvent< HTMLInputElement > ) =>\n\t\tonChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<input\n\t\t\t\tclassName={ clsx( 'components-text-control__input', {\n\t\t\t\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t\t\t} ) }\n\t\t\t\ttype={ type }\n\t\t\t\tid={ id }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * TextControl components let users enter and edit text.\n *\n * ```jsx\n * import { TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTextControl = () => {\n *   const [ className, setClassName ] = useState( '' );\n *\n *   return (\n *     <TextControl\n *       __nextHasNoMarginBottom\n *       label=\"Additional CSS Class\"\n *       value={ className }\n *       onChange={ ( value ) => setClassName( value ) }\n *     />\n *   );\n * };\n * ```\n */\nexport const TextControl = forwardRef( UnforwardedTextControl );\n\nexport default TextControl;\n"],"mappings":";;;;;;;AAIA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,YAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA0C,IAAAI,WAAA,GAAAJ,OAAA;AAf1C;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;;AAKA,SAASK,sBAAsBA,CAC9BC,KAAkE,EAClEC,GAAqC,EACpC;EACD,MAAM;IACLC,uBAAuB;IACvBC,qBAAqB,GAAG,KAAK;IAC7BC,KAAK;IACLC,mBAAmB;IACnBC,KAAK;IACLC,IAAI;IACJC,EAAE,EAAEC,MAAM;IACVC,SAAS;IACTC,QAAQ;IACRC,IAAI,GAAG,MAAM;IACb,GAAGC;EACJ,CAAC,GAAGb,KAAK;EACT,MAAMQ,EAAE,GAAG,IAAAM,sBAAa,EAAEC,WAAW,EAAE,wBAAwB,EAAEN,MAAO,CAAC;EACzE,MAAMO,aAAa,GAAKC,KAAsC,IAC7DN,QAAQ,CAAEM,KAAK,CAACC,MAAM,CAACZ,KAAM,CAAC;EAE/B,oBACC,IAAAR,WAAA,CAAAqB,GAAA,EAACtB,YAAA,CAAAuB,OAAW;IACXlB,uBAAuB,EAAGA,uBAAyB;IACnDE,KAAK,EAAGA,KAAO;IACfC,mBAAmB,EAAGA,mBAAqB;IAC3CG,EAAE,EAAGA,EAAI;IACTD,IAAI,EAAGA,IAAM;IACbG,SAAS,EAAGA,SAAW;IAAAW,QAAA,eAEvB,IAAAvB,WAAA,CAAAqB,GAAA;MACCT,SAAS,EAAG,IAAAY,aAAI,EAAE,gCAAgC,EAAE;QACnD,2BAA2B,EAAEnB;MAC9B,CAAE,CAAG;MACLS,IAAI,EAAGA,IAAM;MACbJ,EAAE,EAAGA,EAAI;MACTF,KAAK,EAAGA,KAAO;MACfK,QAAQ,EAAGK,aAAe;MAC1B,oBAAmB,CAAC,CAAET,IAAI,GAAGC,EAAE,GAAG,QAAQ,GAAGe,SAAW;MACxDtB,GAAG,EAAGA,GAAK;MAAA,GACNY;IAAe,CACpB;EAAC,CACU,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAME,WAAW,GAAAS,OAAA,CAAAT,WAAA,GAAG,IAAAU,mBAAU,EAAE1B,sBAAuB,CAAC;AAAC,IAAA2B,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAEjDL,WAAW","ignoreList":[]}

package/build/textarea-control/index.js

@@ -67,6 +67,7 @@ function UnforwardedTextareaControl(props, ref) {
  *
  *   return (
  *     <TextareaControl
+ *       __nextHasNoMarginBottom
  *       label="Text"
  *       help="Enter some text"
  *       value={ text }

package/build/textarea-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_compose","require","_element","_baseControl","_interopRequireDefault","_textareaControlStyles","_jsxRuntime","UnforwardedTextareaControl","props","ref","__nextHasNoMarginBottom","label","hideLabelFromVision","value","help","onChange","rows","className","additionalProps","instanceId","useInstanceId","TextareaControl","id","onChangeValue","event","target","jsx","default","children","StyledTextarea","undefined","exports","forwardRef","_default"],"sources":["@wordpress/components/src/textarea-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport { StyledTextarea } from './styles/textarea-control-styles';\nimport type { TextareaControlProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\nfunction UnforwardedTextareaControl(\n\tprops: WordPressComponentProps< TextareaControlProps, 'textarea', false >,\n\tref: React.ForwardedRef< HTMLTextAreaElement >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom,\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tonChange,\n\t\trows = 4,\n\t\tclassName,\n\t\t...additionalProps\n\t} = props;\n\tconst instanceId = useInstanceId( TextareaControl );\n\tconst id = `inspector-textarea-control-${ instanceId }`;\n\tconst onChangeValue = ( event: React.ChangeEvent< HTMLTextAreaElement > ) =>\n\t\tonChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<StyledTextarea\n\t\t\t\tclassName=\"components-textarea-control__input\"\n\t\t\t\tid={ id }\n\t\t\t\trows={ rows }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tvalue={ value }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * TextareaControls are TextControls that allow for multiple lines of text, and\n * wrap overflow text onto a new line. They are a fixed height and scroll\n * vertically when the cursor reaches the bottom of the field.\n *\n * ```jsx\n * import { TextareaControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTextareaControl = () => {\n *   const [ text, setText ] = useState( '' );\n *\n *   return (\n *     <TextareaControl\n *       label=\"Text\"\n *       help=\"Enter some text\"\n *       value={ text }\n *       onChange={ ( value ) => setText( value ) }\n *     />\n *   );\n * };\n * ```\n */\nexport const TextareaControl = forwardRef( UnforwardedTextareaControl );\n\nexport default TextareaControl;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,YAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,sBAAA,GAAAJ,OAAA;AAAkE,IAAAK,WAAA,GAAAL,OAAA;AAVlE;AACA;AACA;;AAIA;AACA;AACA;;AAMA,SAASM,0BAA0BA,CAClCC,KAAyE,EACzEC,GAA8C,EAC7C;EACD,MAAM;IACLC,uBAAuB;IACvBC,KAAK;IACLC,mBAAmB;IACnBC,KAAK;IACLC,IAAI;IACJC,QAAQ;IACRC,IAAI,GAAG,CAAC;IACRC,SAAS;IACT,GAAGC;EACJ,CAAC,GAAGV,KAAK;EACT,MAAMW,UAAU,GAAG,IAAAC,sBAAa,EAAEC,eAAgB,CAAC;EACnD,MAAMC,EAAE,GAAI,8BAA8BH,UAAY,EAAC;EACvD,MAAMI,aAAa,GAAKC,KAA+C,IACtET,QAAQ,CAAES,KAAK,CAACC,MAAM,CAACZ,KAAM,CAAC;EAE/B,oBACC,IAAAP,WAAA,CAAAoB,GAAA,EAACvB,YAAA,CAAAwB,OAAW;IACXjB,uBAAuB,EAAGA,uBAAyB;IACnDC,KAAK,EAAGA,KAAO;IACfC,mBAAmB,EAAGA,mBAAqB;IAC3CU,EAAE,EAAGA,EAAI;IACTR,IAAI,EAAGA,IAAM;IACbG,SAAS,EAAGA,SAAW;IAAAW,QAAA,eAEvB,IAAAtB,WAAA,CAAAoB,GAAA,EAACrB,sBAAA,CAAAwB,cAAc;MACdZ,SAAS,EAAC,oCAAoC;MAC9CK,EAAE,EAAGA,EAAI;MACTN,IAAI,EAAGA,IAAM;MACbD,QAAQ,EAAGQ,aAAe;MAC1B,oBAAmB,CAAC,CAAET,IAAI,GAAGQ,EAAE,GAAG,QAAQ,GAAGQ,SAAW;MACxDjB,KAAK,EAAGA,KAAO;MACfJ,GAAG,EAAGA,GAAK;MAAA,GACNS;IAAe,CACpB;EAAC,CACU,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,eAAe,GAAAU,OAAA,CAAAV,eAAA,GAAG,IAAAW,mBAAU,EAAEzB,0BAA2B,CAAC;AAAC,IAAA0B,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAEzDN,eAAe","ignoreList":[]}
+{"version":3,"names":["_compose","require","_element","_baseControl","_interopRequireDefault","_textareaControlStyles","_jsxRuntime","UnforwardedTextareaControl","props","ref","__nextHasNoMarginBottom","label","hideLabelFromVision","value","help","onChange","rows","className","additionalProps","instanceId","useInstanceId","TextareaControl","id","onChangeValue","event","target","jsx","default","children","StyledTextarea","undefined","exports","forwardRef","_default"],"sources":["@wordpress/components/src/textarea-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport { StyledTextarea } from './styles/textarea-control-styles';\nimport type { TextareaControlProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\nfunction UnforwardedTextareaControl(\n\tprops: WordPressComponentProps< TextareaControlProps, 'textarea', false >,\n\tref: React.ForwardedRef< HTMLTextAreaElement >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom,\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tonChange,\n\t\trows = 4,\n\t\tclassName,\n\t\t...additionalProps\n\t} = props;\n\tconst instanceId = useInstanceId( TextareaControl );\n\tconst id = `inspector-textarea-control-${ instanceId }`;\n\tconst onChangeValue = ( event: React.ChangeEvent< HTMLTextAreaElement > ) =>\n\t\tonChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<StyledTextarea\n\t\t\t\tclassName=\"components-textarea-control__input\"\n\t\t\t\tid={ id }\n\t\t\t\trows={ rows }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tvalue={ value }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * TextareaControls are TextControls that allow for multiple lines of text, and\n * wrap overflow text onto a new line. They are a fixed height and scroll\n * vertically when the cursor reaches the bottom of the field.\n *\n * ```jsx\n * import { TextareaControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTextareaControl = () => {\n *   const [ text, setText ] = useState( '' );\n *\n *   return (\n *     <TextareaControl\n *       __nextHasNoMarginBottom\n *       label=\"Text\"\n *       help=\"Enter some text\"\n *       value={ text }\n *       onChange={ ( value ) => setText( value ) }\n *     />\n *   );\n * };\n * ```\n */\nexport const TextareaControl = forwardRef( UnforwardedTextareaControl );\n\nexport default TextareaControl;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,YAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,sBAAA,GAAAJ,OAAA;AAAkE,IAAAK,WAAA,GAAAL,OAAA;AAVlE;AACA;AACA;;AAIA;AACA;AACA;;AAMA,SAASM,0BAA0BA,CAClCC,KAAyE,EACzEC,GAA8C,EAC7C;EACD,MAAM;IACLC,uBAAuB;IACvBC,KAAK;IACLC,mBAAmB;IACnBC,KAAK;IACLC,IAAI;IACJC,QAAQ;IACRC,IAAI,GAAG,CAAC;IACRC,SAAS;IACT,GAAGC;EACJ,CAAC,GAAGV,KAAK;EACT,MAAMW,UAAU,GAAG,IAAAC,sBAAa,EAAEC,eAAgB,CAAC;EACnD,MAAMC,EAAE,GAAI,8BAA8BH,UAAY,EAAC;EACvD,MAAMI,aAAa,GAAKC,KAA+C,IACtET,QAAQ,CAAES,KAAK,CAACC,MAAM,CAACZ,KAAM,CAAC;EAE/B,oBACC,IAAAP,WAAA,CAAAoB,GAAA,EAACvB,YAAA,CAAAwB,OAAW;IACXjB,uBAAuB,EAAGA,uBAAyB;IACnDC,KAAK,EAAGA,KAAO;IACfC,mBAAmB,EAAGA,mBAAqB;IAC3CU,EAAE,EAAGA,EAAI;IACTR,IAAI,EAAGA,IAAM;IACbG,SAAS,EAAGA,SAAW;IAAAW,QAAA,eAEvB,IAAAtB,WAAA,CAAAoB,GAAA,EAACrB,sBAAA,CAAAwB,cAAc;MACdZ,SAAS,EAAC,oCAAoC;MAC9CK,EAAE,EAAGA,EAAI;MACTN,IAAI,EAAGA,IAAM;MACbD,QAAQ,EAAGQ,aAAe;MAC1B,oBAAmB,CAAC,CAAET,IAAI,GAAGQ,EAAE,GAAG,QAAQ,GAAGQ,SAAW;MACxDjB,KAAK,EAAGA,KAAO;MACfJ,GAAG,EAAGA,GAAK;MAAA,GACNS;IAAe,CACpB;EAAC,CACU,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,eAAe,GAAAU,OAAA,CAAAV,eAAA,GAAG,IAAAW,mBAAU,EAAEzB,0BAA2B,CAAC;AAAC,IAAA0B,QAAA,GAAAF,OAAA,CAAAJ,OAAA,GAEzDN,eAAe","ignoreList":[]}

package/build/toggle-control/index.js

@@ -4,9 +4,9 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ToggleControl = ToggleControl;
-exports.default = void 0;
+exports.default = exports.ToggleControl = void 0;
 var _react = require("@emotion/react");
+var _clsx = _interopRequireDefault(require("clsx"));
 var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
 var _flex = require("../flex");
@@ -28,27 +28,7 @@ var _jsxRuntime = require("react/jsx-runtime");
  * Internal dependencies
  */
 
-/**
- * ToggleControl is used to generate a toggle user interface.
- *
- * ```jsx
- * import { ToggleControl } from '@wordpress/components';
- * import { useState } from '@wordpress/element';
- *
- * const MyToggleControl = () => {
- *   const [ value, setValue ] = useState( false );
- *
- *   return (
- *     <ToggleControl
- *       label="Fixed Background"
- *       checked={ value }
- *       onChange={ () => setValue( ( state ) => ! state ) }
- *     />
- *   );
- * };
- * ```
- */
-function ToggleControl({
+function UnforwardedToggleControl({
   __nextHasNoMarginBottom,
   label,
   checked,
@@ -65,7 +45,7 @@ function ToggleControl({
   const cx = (0, _utils.useCx)();
   const classes = cx('components-toggle-control', className, !__nextHasNoMarginBottom && /*#__PURE__*/(0, _react.css)({
     marginBottom: (0, _space.space)(3)
-  }, process.env.NODE_ENV === "production" ? "" : ";label:classes;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdG9nZ2xlLWNvbnRyb2wvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtFK0IiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy90b2dnbGUtY29udHJvbC9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgdHlwZSB7IENoYW5nZUV2ZW50LCBGb3J3YXJkZWRSZWYgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBmb3J3YXJkUmVmIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcbmltcG9ydCB7IHVzZUluc3RhbmNlSWQgfSBmcm9tICdAd29yZHByZXNzL2NvbXBvc2UnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4QmxvY2sgfSBmcm9tICcuLi9mbGV4JztcbmltcG9ydCBGb3JtVG9nZ2xlIGZyb20gJy4uL2Zvcm0tdG9nZ2xlJztcbmltcG9ydCBCYXNlQ29udHJvbCBmcm9tICcuLi9iYXNlLWNvbnRyb2wnO1xuaW1wb3J0IHR5cGUgeyBXb3JkUHJlc3NDb21wb25lbnRQcm9wcyB9IGZyb20gJy4uL2NvbnRleHQvd29yZHByZXNzLWNvbXBvbmVudCc7XG5pbXBvcnQgdHlwZSB7IFRvZ2dsZUNvbnRyb2xQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuaW1wb3J0IHsgSFN0YWNrIH0gZnJvbSAnLi4vaC1zdGFjayc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdXRpbHMvc3BhY2UnO1xuXG4vKipcbiAqIFRvZ2dsZUNvbnRyb2wgaXMgdXNlZCB0byBnZW5lcmF0ZSBhIHRvZ2dsZSB1c2VyIGludGVyZmFjZS5cbiAqXG4gKiBgYGBqc3hcbiAqIGltcG9ydCB7IFRvZ2dsZUNvbnRyb2wgfSBmcm9tICdAd29yZHByZXNzL2NvbXBvbmVudHMnO1xuICogaW1wb3J0IHsgdXNlU3RhdGUgfSBmcm9tICdAd29yZHByZXNzL2VsZW1lbnQnO1xuICpcbiAqIGNvbnN0IE15VG9nZ2xlQ29udHJvbCA9ICgpID0+IHtcbiAqICAgY29uc3QgWyB2YWx1ZSwgc2V0VmFsdWUgXSA9IHVzZVN0YXRlKCBmYWxzZSApO1xuICpcbiAqICAgcmV0dXJuIChcbiAqICAgICA8VG9nZ2xlQ29udHJvbFxuICogICAgICAgbGFiZWw9XCJGaXhlZCBCYWNrZ3JvdW5kXCJcbiAqICAgICAgIGNoZWNrZWQ9eyB2YWx1ZSB9XG4gKiAgICAgICBvbkNoYW5nZT17ICgpID0+IHNldFZhbHVlKCAoIHN0YXRlICkgPT4gISBzdGF0ZSApIH1cbiAqICAgICAvPlxuICogICApO1xuICogfTtcbiAqIGBgYFxuICovXG5leHBvcnQgZnVuY3Rpb24gVG9nZ2xlQ29udHJvbChcblx0e1xuXHRcdF9fbmV4dEhhc05vTWFyZ2luQm90dG9tLFxuXHRcdGxhYmVsLFxuXHRcdGNoZWNrZWQsXG5cdFx0aGVscCxcblx0XHRjbGFzc05hbWUsXG5cdFx0b25DaGFuZ2UsXG5cdFx0ZGlzYWJsZWQsXG5cdH06IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBUb2dnbGVDb250cm9sUHJvcHMsICdpbnB1dCcsIGZhbHNlID4sXG5cdHJlZjogRm9yd2FyZGVkUmVmPCBIVE1MSW5wdXRFbGVtZW50ID5cbikge1xuXHRmdW5jdGlvbiBvbkNoYW5nZVRvZ2dsZSggZXZlbnQ6IENoYW5nZUV2ZW50PCBIVE1MSW5wdXRFbGVtZW50ID4gKSB7XG5cdFx0b25DaGFuZ2UoIGV2ZW50LnRhcmdldC5jaGVja2VkICk7XG5cdH1cblx0Y29uc3QgaW5zdGFuY2VJZCA9IHVzZUluc3RhbmNlSWQoIFRvZ2dsZUNvbnRyb2wgKTtcblx0Y29uc3QgaWQgPSBgaW5zcGVjdG9yLXRvZ2dsZS1jb250cm9sLSR7IGluc3RhbmNlSWQgfWA7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXHRjb25zdCBjbGFzc2VzID0gY3goXG5cdFx0J2NvbXBvbmVudHMtdG9nZ2xlLWNvbnRyb2wnLFxuXHRcdGNsYXNzTmFtZSxcblx0XHQhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tICYmIGNzcyggeyBtYXJnaW5Cb3R0b206IHNwYWNlKCAzICkgfSApXG5cdCk7XG5cblx0bGV0IGRlc2NyaWJlZEJ5LCBoZWxwTGFiZWw7XG5cdGlmICggaGVscCApIHtcblx0XHRpZiAoIHR5cGVvZiBoZWxwID09PSAnZnVuY3Rpb24nICkge1xuXHRcdFx0Ly8gYGhlbHBgIGFzIGEgZnVuY3Rpb24gd29ya3Mgb25seSBmb3IgY29udHJvbGxlZCBjb21wb25lbnRzIHdoZXJlXG5cdFx0XHQvLyBgY2hlY2tlZGAgaXMgcGFzc2VkIGRvd24gZnJvbSBwYXJlbnQgY29tcG9uZW50LiBVbmNvbnRyb2xsZWRcblx0XHRcdC8vIGNvbXBvbmVudCBjYW4gc2hvdyBvbmx5IGEgc3RhdGljIGhlbHAgbGFiZWwuXG5cdFx0XHRpZiAoIGNoZWNrZWQgIT09IHVuZGVmaW5lZCApIHtcblx0XHRcdFx0aGVscExhYmVsID0gaGVscCggY2hlY2tlZCApO1xuXHRcdFx0fVxuXHRcdH0gZWxzZSB7XG5cdFx0XHRoZWxwTGFiZWwgPSBoZWxwO1xuXHRcdH1cblx0XHRpZiAoIGhlbHBMYWJlbCApIHtcblx0XHRcdGRlc2NyaWJlZEJ5ID0gaWQgKyAnX19oZWxwJztcblx0XHR9XG5cdH1cblxuXHRyZXR1cm4gKFxuXHRcdDxCYXNlQ29udHJvbFxuXHRcdFx0aWQ9eyBpZCB9XG5cdFx0XHRoZWxwPXsgaGVscExhYmVsIH1cblx0XHRcdGNsYXNzTmFtZT17IGNsYXNzZXMgfVxuXHRcdFx0X19uZXh0SGFzTm9NYXJnaW5Cb3R0b21cblx0XHQ+XG5cdFx0XHQ8SFN0YWNrIGp1c3RpZnk9XCJmbGV4LXN0YXJ0XCIgc3BhY2luZz17IDMgfT5cblx0XHRcdFx0PEZvcm1Ub2dnbGVcblx0XHRcdFx0XHRpZD17IGlkIH1cblx0XHRcdFx0XHRjaGVja2VkPXsgY2hlY2tlZCB9XG5cdFx0XHRcdFx0b25DaGFuZ2U9eyBvbkNoYW5nZVRvZ2dsZSB9XG5cdFx0XHRcdFx0YXJpYS1kZXNjcmliZWRieT17IGRlc2NyaWJlZEJ5IH1cblx0XHRcdFx0XHRkaXNhYmxlZD17IGRpc2FibGVkIH1cblx0XHRcdFx0XHRyZWY9eyByZWYgfVxuXHRcdFx0XHQvPlxuXHRcdFx0XHQ8RmxleEJsb2NrXG5cdFx0XHRcdFx0YXM9XCJsYWJlbFwiXG5cdFx0XHRcdFx0aHRtbEZvcj17IGlkIH1cblx0XHRcdFx0XHRjbGFzc05hbWU9XCJjb21wb25lbnRzLXRvZ2dsZS1jb250cm9sX19sYWJlbFwiXG5cdFx0XHRcdD5cblx0XHRcdFx0XHR7IGxhYmVsIH1cblx0XHRcdFx0PC9GbGV4QmxvY2s+XG5cdFx0XHQ8L0hTdGFjaz5cblx0XHQ8L0Jhc2VDb250cm9sPlxuXHQpO1xufVxuXG5leHBvcnQgZGVmYXVsdCBmb3J3YXJkUmVmKCBUb2dnbGVDb250cm9sICk7XG4iXX0= */"));
+  }, process.env.NODE_ENV === "production" ? "" : ";label:classes;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdG9nZ2xlLWNvbnRyb2wvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStDK0IiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy90b2dnbGUtY29udHJvbC9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgdHlwZSB7IENoYW5nZUV2ZW50LCBGb3J3YXJkZWRSZWYgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgY2xzeCBmcm9tICdjbHN4JztcblxuLyoqXG4gKiBXb3JkUHJlc3MgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGZvcndhcmRSZWYgfSBmcm9tICdAd29yZHByZXNzL2VsZW1lbnQnO1xuaW1wb3J0IHsgdXNlSW5zdGFuY2VJZCB9IGZyb20gJ0B3b3JkcHJlc3MvY29tcG9zZSc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IEZsZXhCbG9jayB9IGZyb20gJy4uL2ZsZXgnO1xuaW1wb3J0IEZvcm1Ub2dnbGUgZnJvbSAnLi4vZm9ybS10b2dnbGUnO1xuaW1wb3J0IEJhc2VDb250cm9sIGZyb20gJy4uL2Jhc2UtY29udHJvbCc7XG5pbXBvcnQgdHlwZSB7IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzIH0gZnJvbSAnLi4vY29udGV4dC93b3JkcHJlc3MtY29tcG9uZW50JztcbmltcG9ydCB0eXBlIHsgVG9nZ2xlQ29udHJvbFByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5pbXBvcnQgeyBIU3RhY2sgfSBmcm9tICcuLi9oLXN0YWNrJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5cbmZ1bmN0aW9uIFVuZm9yd2FyZGVkVG9nZ2xlQ29udHJvbChcblx0e1xuXHRcdF9fbmV4dEhhc05vTWFyZ2luQm90dG9tLFxuXHRcdGxhYmVsLFxuXHRcdGNoZWNrZWQsXG5cdFx0aGVscCxcblx0XHRjbGFzc05hbWUsXG5cdFx0b25DaGFuZ2UsXG5cdFx0ZGlzYWJsZWQsXG5cdH06IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBUb2dnbGVDb250cm9sUHJvcHMsICdpbnB1dCcsIGZhbHNlID4sXG5cdHJlZjogRm9yd2FyZGVkUmVmPCBIVE1MSW5wdXRFbGVtZW50ID5cbikge1xuXHRmdW5jdGlvbiBvbkNoYW5nZVRvZ2dsZSggZXZlbnQ6IENoYW5nZUV2ZW50PCBIVE1MSW5wdXRFbGVtZW50ID4gKSB7XG5cdFx0b25DaGFuZ2UoIGV2ZW50LnRhcmdldC5jaGVja2VkICk7XG5cdH1cblx0Y29uc3QgaW5zdGFuY2VJZCA9IHVzZUluc3RhbmNlSWQoIFRvZ2dsZUNvbnRyb2wgKTtcblx0Y29uc3QgaWQgPSBgaW5zcGVjdG9yLXRvZ2dsZS1jb250cm9sLSR7IGluc3RhbmNlSWQgfWA7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXHRjb25zdCBjbGFzc2VzID0gY3goXG5cdFx0J2NvbXBvbmVudHMtdG9nZ2xlLWNvbnRyb2wnLFxuXHRcdGNsYXNzTmFtZSxcblx0XHQhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tICYmIGNzcyggeyBtYXJnaW5Cb3R0b206IHNwYWNlKCAzICkgfSApXG5cdCk7XG5cblx0bGV0IGRlc2NyaWJlZEJ5LCBoZWxwTGFiZWw7XG5cdGlmICggaGVscCApIHtcblx0XHRpZiAoIHR5cGVvZiBoZWxwID09PSAnZnVuY3Rpb24nICkge1xuXHRcdFx0Ly8gYGhlbHBgIGFzIGEgZnVuY3Rpb24gd29ya3Mgb25seSBmb3IgY29udHJvbGxlZCBjb21wb25lbnRzIHdoZXJlXG5cdFx0XHQvLyBgY2hlY2tlZGAgaXMgcGFzc2VkIGRvd24gZnJvbSBwYXJlbnQgY29tcG9uZW50LiBVbmNvbnRyb2xsZWRcblx0XHRcdC8vIGNvbXBvbmVudCBjYW4gc2hvdyBvbmx5IGEgc3RhdGljIGhlbHAgbGFiZWwuXG5cdFx0XHRpZiAoIGNoZWNrZWQgIT09IHVuZGVmaW5lZCApIHtcblx0XHRcdFx0aGVscExhYmVsID0gaGVscCggY2hlY2tlZCApO1xuXHRcdFx0fVxuXHRcdH0gZWxzZSB7XG5cdFx0XHRoZWxwTGFiZWwgPSBoZWxwO1xuXHRcdH1cblx0XHRpZiAoIGhlbHBMYWJlbCApIHtcblx0XHRcdGRlc2NyaWJlZEJ5ID0gaWQgKyAnX19oZWxwJztcblx0XHR9XG5cdH1cblxuXHRyZXR1cm4gKFxuXHRcdDxCYXNlQ29udHJvbFxuXHRcdFx0aWQ9eyBpZCB9XG5cdFx0XHRoZWxwPXtcblx0XHRcdFx0aGVscExhYmVsICYmIChcblx0XHRcdFx0XHQ8c3BhbiBjbGFzc05hbWU9XCJjb21wb25lbnRzLXRvZ2dsZS1jb250cm9sX19oZWxwXCI+XG5cdFx0XHRcdFx0XHR7IGhlbHBMYWJlbCB9XG5cdFx0XHRcdFx0PC9zcGFuPlxuXHRcdFx0XHQpXG5cdFx0XHR9XG5cdFx0XHRjbGFzc05hbWU9eyBjbGFzc2VzIH1cblx0XHRcdF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PlxuXHRcdFx0PEhTdGFjayBqdXN0aWZ5PVwiZmxleC1zdGFydFwiIHNwYWNpbmc9eyAyIH0+XG5cdFx0XHRcdDxGb3JtVG9nZ2xlXG5cdFx0XHRcdFx0aWQ9eyBpZCB9XG5cdFx0XHRcdFx0Y2hlY2tlZD17IGNoZWNrZWQgfVxuXHRcdFx0XHRcdG9uQ2hhbmdlPXsgb25DaGFuZ2VUb2dnbGUgfVxuXHRcdFx0XHRcdGFyaWEtZGVzY3JpYmVkYnk9eyBkZXNjcmliZWRCeSB9XG5cdFx0XHRcdFx0ZGlzYWJsZWQ9eyBkaXNhYmxlZCB9XG5cdFx0XHRcdFx0cmVmPXsgcmVmIH1cblx0XHRcdFx0Lz5cblx0XHRcdFx0PEZsZXhCbG9ja1xuXHRcdFx0XHRcdGFzPVwibGFiZWxcIlxuXHRcdFx0XHRcdGh0bWxGb3I9eyBpZCB9XG5cdFx0XHRcdFx0Y2xhc3NOYW1lPXsgY2xzeCggJ2NvbXBvbmVudHMtdG9nZ2xlLWNvbnRyb2xfX2xhYmVsJywge1xuXHRcdFx0XHRcdFx0J2lzLWRpc2FibGVkJzogZGlzYWJsZWQsXG5cdFx0XHRcdFx0fSApIH1cblx0XHRcdFx0PlxuXHRcdFx0XHRcdHsgbGFiZWwgfVxuXHRcdFx0XHQ8L0ZsZXhCbG9jaz5cblx0XHRcdDwvSFN0YWNrPlxuXHRcdDwvQmFzZUNvbnRyb2w+XG5cdCk7XG59XG5cbi8qKlxuICogVG9nZ2xlQ29udHJvbCBpcyB1c2VkIHRvIGdlbmVyYXRlIGEgdG9nZ2xlIHVzZXIgaW50ZXJmYWNlLlxuICpcbiAqIGBgYGpzeFxuICogaW1wb3J0IHsgVG9nZ2xlQ29udHJvbCB9IGZyb20gJ0B3b3JkcHJlc3MvY29tcG9uZW50cyc7XG4gKiBpbXBvcnQgeyB1c2VTdGF0ZSB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG4gKlxuICogY29uc3QgTXlUb2dnbGVDb250cm9sID0gKCkgPT4ge1xuICogICBjb25zdCBbIHZhbHVlLCBzZXRWYWx1ZSBdID0gdXNlU3RhdGUoIGZhbHNlICk7XG4gKlxuICogICByZXR1cm4gKFxuICogICAgIDxUb2dnbGVDb250cm9sXG4gKiAgICAgICBfX25leHRIYXNOb01hcmdpbkJvdHRvbVxuICogICAgICAgbGFiZWw9XCJGaXhlZCBCYWNrZ3JvdW5kXCJcbiAqICAgICAgIGNoZWNrZWQ9eyB2YWx1ZSB9XG4gKiAgICAgICBvbkNoYW5nZT17ICgpID0+IHNldFZhbHVlKCAoIHN0YXRlICkgPT4gISBzdGF0ZSApIH1cbiAqICAgICAvPlxuICogICApO1xuICogfTtcbiAqIGBgYFxuICovXG5leHBvcnQgY29uc3QgVG9nZ2xlQ29udHJvbCA9IGZvcndhcmRSZWYoIFVuZm9yd2FyZGVkVG9nZ2xlQ29udHJvbCApO1xuXG5leHBvcnQgZGVmYXVsdCBUb2dnbGVDb250cm9sO1xuIl19 */"));
   let describedBy, helpLabel;
   if (help) {
     if (typeof help === 'function') {
@@ -84,12 +64,15 @@ function ToggleControl({
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_baseControl.default, {
     id: id,
-    help: helpLabel,
+    help: helpLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "components-toggle-control__help",
+      children: helpLabel
+    }),
     className: classes,
     __nextHasNoMarginBottom: true,
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_hStack.HStack, {
       justify: "flex-start",
-      spacing: 3,
+      spacing: 2,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_formToggle.default, {
         id: id,
         checked: checked,
@@ -100,11 +83,36 @@ function ToggleControl({
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_flex.FlexBlock, {
         as: "label",
         htmlFor: id,
-        className: "components-toggle-control__label",
+        className: (0, _clsx.default)('components-toggle-control__label', {
+          'is-disabled': disabled
+        }),
         children: label
       })]
     })
   });
 }
-var _default = exports.default = (0, _element.forwardRef)(ToggleControl);
+
+/**
+ * ToggleControl is used to generate a toggle user interface.
+ *
+ * ```jsx
+ * import { ToggleControl } from '@wordpress/components';
+ * import { useState } from '@wordpress/element';
+ *
+ * const MyToggleControl = () => {
+ *   const [ value, setValue ] = useState( false );
+ *
+ *   return (
+ *     <ToggleControl
+ *       __nextHasNoMarginBottom
+ *       label="Fixed Background"
+ *       checked={ value }
+ *       onChange={ () => setValue( ( state ) => ! state ) }
+ *     />
+ *   );
+ * };
+ * ```
+ */
+const ToggleControl = exports.ToggleControl = (0, _element.forwardRef)(UnforwardedToggleControl);
+var _default = exports.default = ToggleControl;
 //# sourceMappingURL=index.js.map

package/build/toggle-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_element","_compose","_flex","_formToggle","_interopRequireDefault","_baseControl","_hStack","_utils","_space","_jsxRuntime","ToggleControl","__nextHasNoMarginBottom","label","checked","help","className","onChange","disabled","ref","onChangeToggle","event","target","instanceId","useInstanceId","id","cx","useCx","classes","css","marginBottom","space","process","env","NODE_ENV","describedBy","helpLabel","undefined","jsx","default","children","jsxs","HStack","justify","spacing","FlexBlock","as","htmlFor","_default","exports","forwardRef"],"sources":["@wordpress/components/src/toggle-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ForwardedRef } from 'react';\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { FlexBlock } from '../flex';\nimport FormToggle from '../form-toggle';\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\nimport type { ToggleControlProps } from './types';\nimport { HStack } from '../h-stack';\nimport { useCx } from '../utils';\nimport { space } from '../utils/space';\n\n/**\n * ToggleControl is used to generate a toggle user interface.\n *\n * ```jsx\n * import { ToggleControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyToggleControl = () => {\n *   const [ value, setValue ] = useState( false );\n *\n *   return (\n *     <ToggleControl\n *       label=\"Fixed Background\"\n *       checked={ value }\n *       onChange={ () => setValue( ( state ) => ! state ) }\n *     />\n *   );\n * };\n * ```\n */\nexport function ToggleControl(\n\t{\n\t\t__nextHasNoMarginBottom,\n\t\tlabel,\n\t\tchecked,\n\t\thelp,\n\t\tclassName,\n\t\tonChange,\n\t\tdisabled,\n\t}: WordPressComponentProps< ToggleControlProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tfunction onChangeToggle( event: ChangeEvent< HTMLInputElement > ) {\n\t\tonChange( event.target.checked );\n\t}\n\tconst instanceId = useInstanceId( ToggleControl );\n\tconst id = `inspector-toggle-control-${ instanceId }`;\n\n\tconst cx = useCx();\n\tconst classes = cx(\n\t\t'components-toggle-control',\n\t\tclassName,\n\t\t! __nextHasNoMarginBottom && css( { marginBottom: space( 3 ) } )\n\t);\n\n\tlet describedBy, helpLabel;\n\tif ( help ) {\n\t\tif ( typeof help === 'function' ) {\n\t\t\t// `help` as a function works only for controlled components where\n\t\t\t// `checked` is passed down from parent component. Uncontrolled\n\t\t\t// component can show only a static help label.\n\t\t\tif ( checked !== undefined ) {\n\t\t\t\thelpLabel = help( checked );\n\t\t\t}\n\t\t} else {\n\t\t\thelpLabel = help;\n\t\t}\n\t\tif ( helpLabel ) {\n\t\t\tdescribedBy = id + '__help';\n\t\t}\n\t}\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\thelp={ helpLabel }\n\t\t\tclassName={ classes }\n\t\t\t__nextHasNoMarginBottom\n\t\t>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 3 }>\n\t\t\t\t<FormToggle\n\t\t\t\t\tid={ id }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\tonChange={ onChangeToggle }\n\t\t\t\t\taria-describedby={ describedBy }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tref={ ref }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock\n\t\t\t\t\tas=\"label\"\n\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\tclassName=\"components-toggle-control__label\"\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t</BaseControl>\n\t);\n}\n\nexport default forwardRef( ToggleControl );\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","require","_clsx","_interopRequireDefault","_element","_compose","_flex","_formToggle","_baseControl","_hStack","_utils","_space","_jsxRuntime","UnforwardedToggleControl","__nextHasNoMarginBottom","label","checked","help","className","onChange","disabled","ref","onChangeToggle","event","target","instanceId","useInstanceId","ToggleControl","id","cx","useCx","classes","css","marginBottom","space","process","env","NODE_ENV","describedBy","helpLabel","undefined","jsx","default","children","jsxs","HStack","justify","spacing","FlexBlock","as","htmlFor","clsx","exports","forwardRef","_default"],"sources":["@wordpress/components/src/toggle-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ForwardedRef } from 'react';\nimport { css } from '@emotion/react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { FlexBlock } from '../flex';\nimport FormToggle from '../form-toggle';\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\nimport type { ToggleControlProps } from './types';\nimport { HStack } from '../h-stack';\nimport { useCx } from '../utils';\nimport { space } from '../utils/space';\n\nfunction UnforwardedToggleControl(\n\t{\n\t\t__nextHasNoMarginBottom,\n\t\tlabel,\n\t\tchecked,\n\t\thelp,\n\t\tclassName,\n\t\tonChange,\n\t\tdisabled,\n\t}: WordPressComponentProps< ToggleControlProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tfunction onChangeToggle( event: ChangeEvent< HTMLInputElement > ) {\n\t\tonChange( event.target.checked );\n\t}\n\tconst instanceId = useInstanceId( ToggleControl );\n\tconst id = `inspector-toggle-control-${ instanceId }`;\n\n\tconst cx = useCx();\n\tconst classes = cx(\n\t\t'components-toggle-control',\n\t\tclassName,\n\t\t! __nextHasNoMarginBottom && css( { marginBottom: space( 3 ) } )\n\t);\n\n\tlet describedBy, helpLabel;\n\tif ( help ) {\n\t\tif ( typeof help === 'function' ) {\n\t\t\t// `help` as a function works only for controlled components where\n\t\t\t// `checked` is passed down from parent component. Uncontrolled\n\t\t\t// component can show only a static help label.\n\t\t\tif ( checked !== undefined ) {\n\t\t\t\thelpLabel = help( checked );\n\t\t\t}\n\t\t} else {\n\t\t\thelpLabel = help;\n\t\t}\n\t\tif ( helpLabel ) {\n\t\t\tdescribedBy = id + '__help';\n\t\t}\n\t}\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\thelp={\n\t\t\t\thelpLabel && (\n\t\t\t\t\t<span className=\"components-toggle-control__help\">\n\t\t\t\t\t\t{ helpLabel }\n\t\t\t\t\t</span>\n\t\t\t\t)\n\t\t\t}\n\t\t\tclassName={ classes }\n\t\t\t__nextHasNoMarginBottom\n\t\t>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 2 }>\n\t\t\t\t<FormToggle\n\t\t\t\t\tid={ id }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\tonChange={ onChangeToggle }\n\t\t\t\t\taria-describedby={ describedBy }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tref={ ref }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock\n\t\t\t\t\tas=\"label\"\n\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\tclassName={ clsx( 'components-toggle-control__label', {\n\t\t\t\t\t\t'is-disabled': disabled,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * ToggleControl is used to generate a toggle user interface.\n *\n * ```jsx\n * import { ToggleControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyToggleControl = () => {\n *   const [ value, setValue ] = useState( false );\n *\n *   return (\n *     <ToggleControl\n *       __nextHasNoMarginBottom\n *       label=\"Fixed Background\"\n *       checked={ value }\n *       onChange={ () => setValue( ( state ) => ! state ) }\n *     />\n *   );\n * };\n * ```\n */\nexport const ToggleControl = forwardRef( UnforwardedToggleControl );\n\nexport default ToggleControl;\n"],"mappings":"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","ignoreList":[]}

package/build/toggle-group-control/toggle-group-control/component.js

@@ -101,7 +101,12 @@ function UnconnectedToggleGroupControl(props, forwardedRef) {
  *
  * function Example() {
  *   return (
- *     <ToggleGroupControl label="my label" value="vertical" isBlock>
+ *     <ToggleGroupControl
+ *       label="my label"
+ *       value="vertical"
+ *       isBlock
+ *       __nextHasNoMarginBottom
+ *     >
  *       <ToggleGroupControlOption value="horizontal" label="Horizontal" />
  *       <ToggleGroupControlOption value="vertical" label="Vertical" />
  *     </ToggleGroupControl>

package/build/toggle-group-control/toggle-group-control/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["_framerMotion","require","_compose","_element","_context","_hooks","_baseControl","_interopRequireDefault","_styles","_interopRequireWildcard","styles","_asRadioGroup","_asButtonGroup","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","useContextSystem","baseId","useInstanceId","ToggleGroupControl","normalizedSize","cx","useCx","classes","useMemo","toggleGroupControl","block","MainControl","ToggleGroupControlAsButtonGroup","ToggleGroupControlAsRadioGroup","jsxs","jsx","VisualLabelWrapper","VisualLabel","ref","LayoutGroup","id","exports","contextConnect","_default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { LayoutGroup } from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst baseId = useInstanceId( ToggleGroupControl, 'toggle-group-control' );\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.toggleGroupControl( {\n\t\t\t\t\tisBlock,\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tsize: normalizedSize,\n\t\t\t\t} ),\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, isDeselectable, normalizedSize ]\n\t);\n\n\tconst MainControl = isDeselectable\n\t\t? ToggleGroupControlAsButtonGroup\n\t\t: ToggleGroupControlAsRadioGroup;\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t>\n\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t<BaseControl.VisualLabel>{ label }</BaseControl.VisualLabel>\n\t\t\t\t</VisualLabelWrapper>\n\t\t\t) }\n\t\t\t<MainControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tclassName={ classes }\n\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\tlabel={ label }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ normalizedSize }\n\t\t\t\tvalue={ value }\n\t\t\t>\n\t\t\t\t<LayoutGroup id={ baseId }>{ children }</LayoutGroup>\n\t\t\t</MainControl>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_framerMotion","require","_compose","_element","_context","_hooks","_baseControl","_interopRequireDefault","_styles","_interopRequireWildcard","styles","_asRadioGroup","_asButtonGroup","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","useContextSystem","baseId","useInstanceId","ToggleGroupControl","normalizedSize","cx","useCx","classes","useMemo","toggleGroupControl","block","MainControl","ToggleGroupControlAsButtonGroup","ToggleGroupControlAsRadioGroup","jsxs","jsx","VisualLabelWrapper","VisualLabel","ref","LayoutGroup","id","exports","contextConnect","_default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { LayoutGroup } from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst baseId = useInstanceId( ToggleGroupControl, 'toggle-group-control' );\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.toggleGroupControl( {\n\t\t\t\t\tisBlock,\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tsize: normalizedSize,\n\t\t\t\t} ),\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, isDeselectable, normalizedSize ]\n\t);\n\n\tconst MainControl = isDeselectable\n\t\t? ToggleGroupControlAsButtonGroup\n\t\t: ToggleGroupControlAsRadioGroup;\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t>\n\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t<BaseControl.VisualLabel>{ label }</BaseControl.VisualLabel>\n\t\t\t\t</VisualLabelWrapper>\n\t\t\t) }\n\t\t\t<MainControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tclassName={ classes }\n\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\tlabel={ label }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ normalizedSize }\n\t\t\t\tvalue={ value }\n\t\t\t>\n\t\t\t\t<LayoutGroup id={ baseId }>{ children }</LayoutGroup>\n\t\t\t</MainControl>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl\n *       label=\"my label\"\n *       value=\"vertical\"\n *       isBlock\n *       __nextHasNoMarginBottom\n *     >\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"],"mappings":"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","ignoreList":[]}

package/build/toggle-group-control/toggle-group-control-option/component.js

@@ -45,7 +45,12 @@ function UnforwardedToggleGroupControlOption(props, ref) {
  *
  * function Example() {
  *   return (
- *     <ToggleGroupControl label="my label" value="vertical" isBlock>
+ *     <ToggleGroupControl
+ *       label="my label"
+ *       value="vertical"
+ *       isBlock
+ *       __nextHasNoMarginBottom
+ *     >
  *       <ToggleGroupControlOption value="horizontal" label="Horizontal" />
  *       <ToggleGroupControlOption value="vertical" label="Vertical" />
  *     </ToggleGroupControl>

package/build/toggle-group-control/toggle-group-control-option/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_toggleGroupControlOptionBase","_jsxRuntime","UnforwardedToggleGroupControlOption","props","ref","label","restProps","optionLabel","jsx","ToggleGroupControlOptionBase","children","ToggleGroupControlOption","exports","forwardRef","_default","default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport type { ToggleGroupControlOptionProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\n\nfunction UnforwardedToggleGroupControlOption(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionProps,\n\t\t'button',\n\t\tfalse\n\t>,\n\tref: ForwardedRef< any >\n) {\n\tconst { label, ...restProps } = props;\n\tconst optionLabel = restProps[ 'aria-label' ] || label;\n\treturn (\n\t\t<ToggleGroupControlOptionBase\n\t\t\t{ ...restProps }\n\t\t\taria-label={ optionLabel }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ label }\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOption` is a form component and is meant to be used as a\n * child of `ToggleGroupControl`.\n *\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nexport const ToggleGroupControlOption = forwardRef(\n\tUnforwardedToggleGroupControlOption\n);\n\nexport default ToggleGroupControlOption;\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAOA,IAAAC,6BAAA,GAAAD,OAAA;AAAmF,IAAAE,WAAA,GAAAF,OAAA;AAfnF;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAKA,SAASG,mCAAmCA,CAC3CC,KAIC,EACDC,GAAwB,EACvB;EACD,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGH,KAAK;EACrC,MAAMI,WAAW,GAAGD,SAAS,CAAE,YAAY,CAAE,IAAID,KAAK;EACtD,oBACC,IAAAJ,WAAA,CAAAO,GAAA,EAACR,6BAAA,CAAAS,4BAA4B;IAAA,GACvBH,SAAS;IACd,cAAaC,WAAa;IAC1BH,GAAG,EAAGA,GAAK;IAAAM,QAAA,EAETL;EAAK,CACsB,CAAC;AAEjC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMM,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,mBAAU,EACjDX,mCACD,CAAC;AAAC,IAAAY,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAEaJ,wBAAwB","ignoreList":[]}
+{"version":3,"names":["_element","require","_toggleGroupControlOptionBase","_jsxRuntime","UnforwardedToggleGroupControlOption","props","ref","label","restProps","optionLabel","jsx","ToggleGroupControlOptionBase","children","ToggleGroupControlOption","exports","forwardRef","_default","default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport type { ToggleGroupControlOptionProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\n\nfunction UnforwardedToggleGroupControlOption(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionProps,\n\t\t'button',\n\t\tfalse\n\t>,\n\tref: ForwardedRef< any >\n) {\n\tconst { label, ...restProps } = props;\n\tconst optionLabel = restProps[ 'aria-label' ] || label;\n\treturn (\n\t\t<ToggleGroupControlOptionBase\n\t\t\t{ ...restProps }\n\t\t\taria-label={ optionLabel }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ label }\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOption` is a form component and is meant to be used as a\n * child of `ToggleGroupControl`.\n *\n * ```jsx\n * import {\n *   __experimentalToggleGroupControl as ToggleGroupControl,\n *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n *   return (\n *     <ToggleGroupControl\n *       label=\"my label\"\n *       value=\"vertical\"\n *       isBlock\n *       __nextHasNoMarginBottom\n *     >\n *       <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n *       <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n *     </ToggleGroupControl>\n *   );\n * }\n * ```\n */\nexport const ToggleGroupControlOption = forwardRef(\n\tUnforwardedToggleGroupControlOption\n);\n\nexport default ToggleGroupControlOption;\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAOA,IAAAC,6BAAA,GAAAD,OAAA;AAAmF,IAAAE,WAAA,GAAAF,OAAA;AAfnF;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAKA,SAASG,mCAAmCA,CAC3CC,KAIC,EACDC,GAAwB,EACvB;EACD,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAU,CAAC,GAAGH,KAAK;EACrC,MAAMI,WAAW,GAAGD,SAAS,CAAE,YAAY,CAAE,IAAID,KAAK;EACtD,oBACC,IAAAJ,WAAA,CAAAO,GAAA,EAACR,6BAAA,CAAAS,4BAA4B;IAAA,GACvBH,SAAS;IACd,cAAaC,WAAa;IAC1BH,GAAG,EAAGA,GAAK;IAAAM,QAAA,EAETL;EAAK,CACsB,CAAC;AAEjC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMM,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,mBAAU,EACjDX,mCACD,CAAC;AAAC,IAAAY,QAAA,GAAAF,OAAA,CAAAG,OAAA,GAEaJ,wBAAwB","ignoreList":[]}

package/build/toggle-group-control/toggle-group-control-option-base/component.js

@@ -73,6 +73,7 @@ function ToggleGroupControlOptionBase(props, forwardedRef) {
     children,
     showTooltip = false,
     onFocus: onFocusProp,
+    disabled,
     ...otherButtonProps
   } = buttonProps;
   const isPressed = toggleGroupControlContext.value === value;
@@ -105,6 +106,7 @@ function ToggleGroupControlOptionBase(props, forwardedRef) {
       text: otherButtonProps['aria-label'],
       children: isDeselectable ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         ...commonProps,
+        disabled: disabled,
         onFocus: onFocusProp,
         "aria-pressed": isPressed,
         type: "button",
@@ -113,6 +115,7 @@ function ToggleGroupControlOptionBase(props, forwardedRef) {
           children: children
         })
       }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Ariakit.Radio, {
+        disabled: disabled,
         render: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
           type: "button",
           ...commonProps,