npm - @wordpress/interface - Versions diffs - 7.0.0 → 8.1.0 - Mend

@wordpress/interface 7.0.0 → 8.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -2,6 +2,14 @@
 ## Unreleased
+## 8.1.0 (2024-11-16)
+## 8.0.0 (2024-10-30)
+### Breaking Changes
+-   Removed `smallScreenTitle` prop from the `ComplementaryArea` component ([#64474](https://github.com/WordPress/gutenberg/pull/64474)).
 ## 7.0.0 (2024-10-16)
 ### Breaking Changes

package/build/components/complementary-area/index.js CHANGED Viewed

@@ -14,10 +14,10 @@ var _element = require("@wordpress/element");
 var _viewport = require("@wordpress/viewport");
 var _preferences = require("@wordpress/preferences");
 var _compose = require("@wordpress/compose");
+var _plugins = require("@wordpress/plugins");
 var _complementaryAreaHeader = _interopRequireDefault(require("../complementary-area-header"));
 var _complementaryAreaMoreMenuItem = _interopRequireDefault(require("../complementary-area-more-menu-item"));
 var _complementaryAreaToggle = _interopRequireDefault(require("../complementary-area-toggle"));
-var _complementaryAreaContext = _interopRequireDefault(require("../complementary-area-context"));
 var _pinnedItems = _interopRequireDefault(require("../pinned-items"));
 var _store = require("../../store");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -143,19 +143,22 @@ function ComplementaryArea({
   children,
   className,
   closeLabel = (0, _i18n.__)('Close plugin'),
-  identifier,
+  identifier: identifierProp,
   header,
   headerClassName,
-  icon,
+  icon: iconProp,
   isPinnable = true,
   panelClassName,
   scope,
   name,
-  smallScreenTitle,
   title,
   toggleShortcut,
   isActiveByDefault
 }) {
+  const context = (0, _plugins.usePluginContext)();
+  const icon = iconProp || context.icon;
+  const identifier = identifierProp || `${context.name}/${name}`;
   // This state is used to delay the rendering of the Fill
   // until the initial effect runs.
   // This prevents the animation from running on mount if
@@ -189,6 +192,7 @@ function ComplementaryArea({
       showIconLabels: get('core', 'showIconLabels')
     };
   }, [identifier, scope]);
+  const isMobileViewport = (0, _compose.useViewportMatch)('medium', '<');
   useAdjustComplementaryListener(scope, identifier, activeArea, isActive, isSmall);
   const {
     enableComplementaryArea,
@@ -240,10 +244,9 @@ function ComplementaryArea({
         className: headerClassName,
         closeLabel: closeLabel,
         onClose: () => disableComplementaryArea(scope),
-        smallScreenTitle: smallScreenTitle,
         toggleButtonProps: {
           label: closeLabel,
-          size: 'small',
+          size: 'compact',
           shortcut: toggleShortcut,
           scope,
           identifier
@@ -252,7 +255,7 @@ function ComplementaryArea({
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
             className: "interface-complementary-area-header__title",
             children: title
-          }), isPinnable && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+          }), isPinnable && !isMobileViewport && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
             className: "interface-complementary-area__pin-unpin-item",
             icon: isPinned ? _icons.starFilled : _icons.starEmpty,
             label: isPinned ? (0, _i18n.__)('Unpin from toolbar') : (0, _i18n.__)('Pin to toolbar'),
@@ -269,7 +272,6 @@ function ComplementaryArea({
     })]
   });
 }
-const ComplementaryAreaWrapped = (0, _complementaryAreaContext.default)(ComplementaryArea);
-ComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;
-var _default = exports.default = ComplementaryAreaWrapped;
+ComplementaryArea.Slot = ComplementaryAreaSlot;
+var _default = exports.default = ComplementaryArea;
 //# sourceMappingURL=index.js.map

package/build/components/complementary-area/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_data","_i18n","_icons","_element","_viewport","_preferences","_compose","_complementaryAreaHeader","_complementaryAreaMoreMenuItem","_complementaryAreaToggle","_complementaryAreaContext","_pinnedItems","_store","_jsxRuntime","ANIMATION_DURATION","ComplementaryAreaSlot","scope","props","jsx","Slot","name","SIDEBAR_WIDTH","variants","open","width","closed","mobileOpen","ComplementaryAreaFill","activeArea","isActive","children","className","id","disableMotion","useReducedMotion","isMobileViewport","useViewportMatch","previousActiveArea","usePrevious","previousIsActive","setState","useState","useEffect","transition","type","duration","ease","Fill","__unstableAnimatePresence","initial","__unstableMotion","div","animate","exit","style","useAdjustComplementaryListener","identifier","isSmall","previousIsSmallRef","useRef","shouldOpenWhenNotSmallRef","enableComplementaryArea","disableComplementaryArea","useDispatch","interfaceStore","current","ComplementaryArea","closeLabel","__","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","isReady","setIsReady","isLoading","isPinned","isLarge","showIconLabels","useSelect","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","get","preferencesStore","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","jsxs","Fragment","default","isPressed","label","check","showTooltip","variant","size","shortcut","target","clsx","replace","onClose","toggleButtonProps","Button","starFilled","starEmpty","onClick","Panel","ComplementaryAreaWrapped","withComplementaryAreaContext","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport {\n\tButton,\n\tPanel,\n\tSlot,\n\tFill,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tusePrevious,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaHeader from '../complementary-area-header';\nimport ComplementaryAreaMoreMenuItem from '../complementary-area-more-menu-item';\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\nimport withComplementaryAreaContext from '../complementary-area-context';\nimport PinnedItems from '../pinned-items';\nimport { store as interfaceStore } from '../../store';\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nconst SIDEBAR_WIDTH = 280;\nconst variants = {\n\topen: { width: SIDEBAR_WIDTH },\n\tclosed: { width: 0 },\n\tmobileOpen: { width: '100vw' },\n};\n\nfunction ComplementaryAreaFill( {\n\tactiveArea,\n\tisActive,\n\tscope,\n\tchildren,\n\tclassName,\n\tid,\n} ) {\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\t// This is used to delay the exit animation to the next tick.\n\t// The reason this is done is to allow us to apply the right transition properties\n\t// When we switch from an open sidebar to another open sidebar.\n\t// we don't want to animate in this case.\n\tconst previousActiveArea = usePrevious( activeArea );\n\tconst previousIsActive = usePrevious( isActive );\n\tconst [ , setState ] = useState( {} );\n\tuseEffect( () => {\n\t\tsetState( {} );\n\t}, [ isActive ] );\n\tconst transition = {\n\t\ttype: 'tween',\n\t\tduration:\n\t\t\tdisableMotion \|\|\n\t\t\tisMobileViewport \|\|\n\t\t\t( !! previousActiveArea &&\n\t\t\t\t!! activeArea &&\n\t\t\t\tactiveArea !== previousActiveArea )\n\t\t\t\t? 0\n\t\t\t\t: ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ ( previousIsActive \|\| isActive ) && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ variants }\n\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\tanimate={ isMobileViewport ? 'mobileOpen' : 'open' }\n\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\ttransition={ transition }\n\t\t\t\t\t\tclassName=\"interface-complementary-area__fill\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t: SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmallRef = useRef( false );\n\tconst shouldOpenWhenNotSmallRef = useRef( false );\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\tuseEffect( () => {\n\t\t// If the complementary area is active and the editor is switching from\n\t\t// a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmallRef.current ) {\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size\n\t\t\t// goes from small to big.\n\t\t\tshouldOpenWhenNotSmallRef.current = true;\n\t\t} else if (\n\t\t\t// If there is a flag indicating the complementary area should be\n\t\t\t// enabled when we go from small to big window size and we are going\n\t\t\t// from a small to big window size.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmallRef.current\n\t\t) {\n\t\t\t// Remove the flag indicating the complementary area should be\n\t\t\t// enabled.\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if (\n\t\t\t// If the flag is indicating the current complementary should be\n\t\t\t// reopened but another complementary area becomes active, remove\n\t\t\t// the flag.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmallRef.current ) {\n\t\t\tpreviousIsSmallRef.current = isSmall;\n\t\t}\n\t}, [\n\t\tisActive,\n\t\tisSmall,\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tdisableComplementaryArea,\n\t\tenableComplementaryArea,\n\t] );\n}\n\nfunction ComplementaryArea( {\n\tchildren,\n\tclassName,\n\tcloseLabel = __( 'Close plugin' ),\n\tidentifier,\n\theader,\n\theaderClassName,\n\ticon,\n\tisPinnable = true,\n\tpanelClassName,\n\tscope,\n\tname,\n\tsmallScreenTitle,\n\ttitle,\n\ttoggleShortcut,\n\tisActiveByDefault,\n} ) {\n\t// This state is used to delay the rendering of the Fill\n\t// until the initial effect runs.\n\t// This prevents the animation from running on mount if\n\t// the complementary area is active by default.\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\tisLoading,\n\t\tisActive,\n\t\tisPinned,\n\t\tactiveArea,\n\t\tisSmall,\n\t\tisLarge,\n\t\tshowIconLabels,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\tisItemPinned,\n\t\t\t} = select( interfaceStore );\n\t\t\tconst { get } = select( preferencesStore );\n\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\treturn {\n\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\tactiveArea: _activeArea,\n\t\t\t\tisSmall: select( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\t};\n\t\t},\n\t\t[ identifier, scope ]\n\t);\n\tuseAdjustComplementaryListener(\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tisActive,\n\t\tisSmall\n\t);\n\tconst {\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t\tpinItem,\n\t\tunpinItem,\n\t} = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\t// Set initial visibility: For large screens, enable if it's active by\n\t\t// default. For small screens, always initially disable.\n\t\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if ( activeArea === undefined && isSmall ) {\n\t\t\tdisableComplementaryArea( scope, identifier );\n\t\t}\n\t\tsetIsReady( true );\n\t}, [\n\t\tactiveArea,\n\t\tisActiveByDefault,\n\t\tscope,\n\t\tidentifier,\n\t\tisSmall,\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t] );\n\n\tif ( ! isReady ) {\n\t\treturn;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isPinnable && (\n\t\t\t\t<PinnedItems scope={ scope }>\n\t\t\t\t\t{ isPinned && (\n\t\t\t\t\t\t<ComplementaryAreaToggle\n\t\t\t\t\t\t\tscope={ scope }\n\t\t\t\t\t\t\tidentifier={ identifier }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisActive && ( ! showIconLabels \|\| isLarge )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-expanded={ isActive }\n\t\t\t\t\t\t\taria-disabled={ isLoading }\n\t\t\t\t\t\t\tlabel={ title }\n\t\t\t\t\t\t\ticon={ showIconLabels ? check : icon }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\tshortcut={ toggleShortcut }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</PinnedItems>\n\t\t\t) }\n\t\t\t{ name && isPinnable && (\n\t\t\t\t<ComplementaryAreaMoreMenuItem\n\t\t\t\t\ttarget={ name }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ComplementaryAreaMoreMenuItem>\n\t\t\t) }\n\t\t\t<ComplementaryAreaFill\n\t\t\t\tactiveArea={ activeArea }\n\t\t\t\tisActive={ isActive }\n\t\t\t\tclassName={ clsx( 'interface-complementary-area', className ) }\n\t\t\t\tscope={ scope }\n\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t>\n\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\tscope,\n\t\t\t\t\t\tidentifier,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\ticon={ isPinned ? starFilled : starEmpty }\n\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\tisPinned\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Unpin from toolbar' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</ComplementaryAreaHeader>\n\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t</ComplementaryAreaFill>\n\t\t</>\n\t);\n}\n\nconst ComplementaryAreaWrapped =\n\twithComplementaryAreaContext( ComplementaryArea );\n\nComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryAreaWrapped;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_components","_data","_i18n","_icons","_element","_viewport","_preferences","_compose","_plugins","_complementaryAreaHeader","_complementaryAreaMoreMenuItem","_complementaryAreaToggle","_pinnedItems","_store","_jsxRuntime","ANIMATION_DURATION","ComplementaryAreaSlot","scope","props","jsx","Slot","name","SIDEBAR_WIDTH","variants","open","width","closed","mobileOpen","ComplementaryAreaFill","activeArea","isActive","children","className","id","disableMotion","useReducedMotion","isMobileViewport","useViewportMatch","previousActiveArea","usePrevious","previousIsActive","setState","useState","useEffect","transition","type","duration","ease","Fill","__unstableAnimatePresence","initial","__unstableMotion","div","animate","exit","style","useAdjustComplementaryListener","identifier","isSmall","previousIsSmallRef","useRef","shouldOpenWhenNotSmallRef","enableComplementaryArea","disableComplementaryArea","useDispatch","interfaceStore","current","ComplementaryArea","closeLabel","__","identifierProp","header","headerClassName","icon","iconProp","isPinnable","panelClassName","title","toggleShortcut","isActiveByDefault","context","usePluginContext","isReady","setIsReady","isLoading","isPinned","isLarge","showIconLabels","useSelect","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","get","preferencesStore","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","jsxs","Fragment","default","isPressed","label","check","showTooltip","variant","size","shortcut","target","clsx","replace","onClose","toggleButtonProps","Button","starFilled","starEmpty","onClick","Panel","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport {\n\tButton,\n\tPanel,\n\tSlot,\n\tFill,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tusePrevious,\n} from '@wordpress/compose';\nimport { usePluginContext } from '@wordpress/plugins';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaHeader from '../complementary-area-header';\nimport ComplementaryAreaMoreMenuItem from '../complementary-area-more-menu-item';\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\nimport PinnedItems from '../pinned-items';\nimport { store as interfaceStore } from '../../store';\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nconst SIDEBAR_WIDTH = 280;\nconst variants = {\n\topen: { width: SIDEBAR_WIDTH },\n\tclosed: { width: 0 },\n\tmobileOpen: { width: '100vw' },\n};\n\nfunction ComplementaryAreaFill( {\n\tactiveArea,\n\tisActive,\n\tscope,\n\tchildren,\n\tclassName,\n\tid,\n} ) {\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\t// This is used to delay the exit animation to the next tick.\n\t// The reason this is done is to allow us to apply the right transition properties\n\t// When we switch from an open sidebar to another open sidebar.\n\t// we don't want to animate in this case.\n\tconst previousActiveArea = usePrevious( activeArea );\n\tconst previousIsActive = usePrevious( isActive );\n\tconst [ , setState ] = useState( {} );\n\tuseEffect( () => {\n\t\tsetState( {} );\n\t}, [ isActive ] );\n\tconst transition = {\n\t\ttype: 'tween',\n\t\tduration:\n\t\t\tdisableMotion \|\|\n\t\t\tisMobileViewport \|\|\n\t\t\t( !! previousActiveArea &&\n\t\t\t\t!! activeArea &&\n\t\t\t\tactiveArea !== previousActiveArea )\n\t\t\t\t? 0\n\t\t\t\t: ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ ( previousIsActive \|\| isActive ) && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ variants }\n\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\tanimate={ isMobileViewport ? 'mobileOpen' : 'open' }\n\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\ttransition={ transition }\n\t\t\t\t\t\tclassName=\"interface-complementary-area__fill\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t: SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmallRef = useRef( false );\n\tconst shouldOpenWhenNotSmallRef = useRef( false );\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\tuseEffect( () => {\n\t\t// If the complementary area is active and the editor is switching from\n\t\t// a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmallRef.current ) {\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size\n\t\t\t// goes from small to big.\n\t\t\tshouldOpenWhenNotSmallRef.current = true;\n\t\t} else if (\n\t\t\t// If there is a flag indicating the complementary area should be\n\t\t\t// enabled when we go from small to big window size and we are going\n\t\t\t// from a small to big window size.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmallRef.current\n\t\t) {\n\t\t\t// Remove the flag indicating the complementary area should be\n\t\t\t// enabled.\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if (\n\t\t\t// If the flag is indicating the current complementary should be\n\t\t\t// reopened but another complementary area becomes active, remove\n\t\t\t// the flag.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmallRef.current ) {\n\t\t\tpreviousIsSmallRef.current = isSmall;\n\t\t}\n\t}, [\n\t\tisActive,\n\t\tisSmall,\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tdisableComplementaryArea,\n\t\tenableComplementaryArea,\n\t] );\n}\n\nfunction ComplementaryArea( {\n\tchildren,\n\tclassName,\n\tcloseLabel = __( 'Close plugin' ),\n\tidentifier: identifierProp,\n\theader,\n\theaderClassName,\n\ticon: iconProp,\n\tisPinnable = true,\n\tpanelClassName,\n\tscope,\n\tname,\n\ttitle,\n\ttoggleShortcut,\n\tisActiveByDefault,\n} ) {\n\tconst context = usePluginContext();\n\tconst icon = iconProp \|\| context.icon;\n\tconst identifier = identifierProp \|\| `${ context.name }/${ name }`;\n\n\t// This state is used to delay the rendering of the Fill\n\t// until the initial effect runs.\n\t// This prevents the animation from running on mount if\n\t// the complementary area is active by default.\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\tisLoading,\n\t\tisActive,\n\t\tisPinned,\n\t\tactiveArea,\n\t\tisSmall,\n\t\tisLarge,\n\t\tshowIconLabels,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\tisItemPinned,\n\t\t\t} = select( interfaceStore );\n\t\t\tconst { get } = select( preferencesStore );\n\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\treturn {\n\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\tactiveArea: _activeArea,\n\t\t\t\tisSmall: select( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\t};\n\t\t},\n\t\t[ identifier, scope ]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tuseAdjustComplementaryListener(\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tisActive,\n\t\tisSmall\n\t);\n\tconst {\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t\tpinItem,\n\t\tunpinItem,\n\t} = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\t// Set initial visibility: For large screens, enable if it's active by\n\t\t// default. For small screens, always initially disable.\n\t\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if ( activeArea === undefined && isSmall ) {\n\t\t\tdisableComplementaryArea( scope, identifier );\n\t\t}\n\t\tsetIsReady( true );\n\t}, [\n\t\tactiveArea,\n\t\tisActiveByDefault,\n\t\tscope,\n\t\tidentifier,\n\t\tisSmall,\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t] );\n\n\tif ( ! isReady ) {\n\t\treturn;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isPinnable && (\n\t\t\t\t<PinnedItems scope={ scope }>\n\t\t\t\t\t{ isPinned && (\n\t\t\t\t\t\t<ComplementaryAreaToggle\n\t\t\t\t\t\t\tscope={ scope }\n\t\t\t\t\t\t\tidentifier={ identifier }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisActive && ( ! showIconLabels \|\| isLarge )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-expanded={ isActive }\n\t\t\t\t\t\t\taria-disabled={ isLoading }\n\t\t\t\t\t\t\tlabel={ title }\n\t\t\t\t\t\t\ticon={ showIconLabels ? check : icon }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\tshortcut={ toggleShortcut }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</PinnedItems>\n\t\t\t) }\n\t\t\t{ name && isPinnable && (\n\t\t\t\t<ComplementaryAreaMoreMenuItem\n\t\t\t\t\ttarget={ name }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ComplementaryAreaMoreMenuItem>\n\t\t\t) }\n\t\t\t<ComplementaryAreaFill\n\t\t\t\tactiveArea={ activeArea }\n\t\t\t\tisActive={ isActive }\n\t\t\t\tclassName={ clsx( 'interface-complementary-area', className ) }\n\t\t\t\tscope={ scope }\n\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t>\n\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\tsize: 'compact',\n\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\tscope,\n\t\t\t\t\t\tidentifier,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t{ isPinnable && ! isMobileViewport && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\ticon={ isPinned ? starFilled : starEmpty }\n\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\tisPinned\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Unpin from toolbar' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</ComplementaryAreaHeader>\n\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t</ComplementaryAreaFill>\n\t\t</>\n\t);\n}\n\nComplementaryArea.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryArea;\n"],"mappings":"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","ignoreList":[]}

package/build/components/complementary-area-header/index.js CHANGED Viewed

@@ -22,7 +22,6 @@ var _jsxRuntime = require("react/jsx-runtime");
  */
 const ComplementaryAreaHeader = ({
-  smallScreenTitle,
   children,
   className,
   toggleButtonProps
@@ -31,18 +30,10 @@ const ComplementaryAreaHeader = ({
     icon: _icons.closeSmall,
     ...toggleButtonProps
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "components-panel__header interface-complementary-area-header__small",
-      children: [smallScreenTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
-        className: "interface-complementary-area-header__small-title",
-        children: smallScreenTitle
-      }), toggleButton]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _clsx.default)('components-panel__header', 'interface-complementary-area-header', className),
-      tabIndex: -1,
-      children: [children, toggleButton]
-    })]
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _clsx.default)('components-panel__header', 'interface-complementary-area-header', className),
+    tabIndex: -1,
+    children: [children, toggleButton]
   });
 };
 var _default = exports.default = ComplementaryAreaHeader;

package/build/components/complementary-area-header/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_clsx","_interopRequireDefault","require","_icons","_complementaryAreaToggle","_jsxRuntime","ComplementaryAreaHeader","~~smallScreenTitle","~~children","className","toggleButtonProps","toggleButton","jsx","default","icon","closeSmall","jsxs","~~Fragment","~~clsx","tabIndex","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area-header/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { closeSmall } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\n\nconst ComplementaryAreaHeader = ( {\n\~~tsmallScreenTitle,\n\~~tchildren,\n\tclassName,\n\ttoggleButtonProps,\n} ) => {\n\tconst toggleButton = (\n\t\t<ComplementaryAreaToggle icon={ closeSmall } { ...toggleButtonProps } />\n\t);\n\treturn (\n\t\t~~<>\n\t\t\t~~<div ~~className=\"components-panel__header interface-complementary-area-header__small~~\~~">\~~n\t\t\t\t{ smallScreenTitle && (\n\t\t\t\t\t<h2 className=\"interface-complementary-area-header__small-title\">\n\t\t\t\t\t\t{ smallScreenTitle }\n\t\t\t\t\t</h2>\n\t\t\t\t) }\n\t\t\t\t{ toggleButton }\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'components-panel__header',\n\t\t\t\t\t'interface-complementary-area-header',\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t{ toggleButton }\n\t\t\t</div>\n\t~~\t</>\n\t~~);\n};\n\nexport default ComplementaryAreaHeader;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AAKA,IAAAE,wBAAA,GAAAH,sBAAA,CAAAC,OAAA;AAAmE,IAAAG,WAAA,GAAAH,OAAA;AAbnE;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMI,uBAAuB,GAAGA,CAAE;EACjCC,~~gBAAgB;EAChBC,~~QAAQ;EACRC,SAAS;EACTC;AACD,CAAC,KAAM;EACN,MAAMC,YAAY,gBACjB,~~IAAAN~~,WAAA,~~CAAAO~~,GAAA,~~EAACR~~,wBAAA,~~CAAAS~~,OAAuB;IAACC,IAAI,EAAGC,iBAAY;IAAA,GAAML;EAAiB,CAAI,CACvE;EACD,oBACC,~~IAAAL~~,WAAA,~~CAAAW~~,IAAA~~,EAAAX,WAAA,CAAAY,QAAA~~;~~IAAAT~~,~~QAAA,gBACC,IAAAH,WAAA,CAAAW,IAAA;MAAKP,~~SAAS,~~EAAC,qEAAqE;MAAAD,QAAA,GACjFD,gBAAgB,iBACjB,IAAAF,WAAA,CAAAO,GAAA;QAAIH,SAAS,EAAC,kDAAkD;QAAAD,QAAA,EAC7DD;MAAgB,CACf,CACJ,EACCI,YAAY;IAAA,CACV,CAAC,eACN,IAAAN,WAAA,CAAAW,IAAA;MACCP,SAAS,~~EAAG,~~IAAAS~~,aAAI,EACf,0BAA0B,EAC1B,qCAAqC,~~EACrCT~~,SACD,CAAG;~~MACHU~~,QAAQ,EAAG,CAAC,CAAG;~~MAAAX~~,QAAA,GAEbA,QAAQ,EACRG,YAAY;~~IAAA~~,CACV,CAAC;~~EAAA~~,~~CACL,~~CAAC;~~AAEL,CAAC;~~AAAC,~~IAAAS~~,QAAA,GAAAC,OAAA,~~CAAAR~~,OAAA,~~GAEaP~~,uBAAuB","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_icons","_complementaryAreaToggle","_jsxRuntime","ComplementaryAreaHeader","children","className","toggleButtonProps","toggleButton","jsx","default","icon","closeSmall","jsxs","clsx","tabIndex","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area-header/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { closeSmall } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\n\nconst ComplementaryAreaHeader = ( {\n\tchildren,\n\tclassName,\n\ttoggleButtonProps,\n} ) => {\n\tconst toggleButton = (\n\t\t<ComplementaryAreaToggle icon={ closeSmall } { ...toggleButtonProps } />\n\t);\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-panel__header',\n\t\t\t\t'interface-complementary-area-header',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\ttabIndex={ -1 }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ toggleButton }\n\t\t</div>\n\t);\n};\n\nexport default ComplementaryAreaHeader;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AAKA,IAAAE,wBAAA,GAAAH,sBAAA,CAAAC,OAAA;AAAmE,IAAAG,WAAA,GAAAH,OAAA;AAbnE;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMI,uBAAuB,GAAGA,CAAE;EACjCC,QAAQ;EACRC,SAAS;EACTC;AACD,CAAC,KAAM;EACN,MAAMC,YAAY,gBACjB,IAAAL,WAAA,CAAAM,GAAA,EAACP,wBAAA,CAAAQ,OAAuB;IAACC,IAAI,EAAGC,iBAAY;IAAA,GAAML;EAAiB,CAAI,CACvE;EACD,oBACC,IAAAJ,WAAA,CAAAU,IAAA;IACCP,SAAS,EAAG,IAAAQ,aAAI,EACf,0BAA0B,EAC1B,qCAAqC,EACrCR,SACD,CAAG;IACHS,QAAQ,EAAG,CAAC,CAAG;IAAAV,QAAA,GAEbA,QAAQ,EACRG,YAAY;EAAA,CACV,CAAC;AAER,CAAC;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAP,OAAA,GAEaN,uBAAuB","ignoreList":[]}

package/build/components/complementary-area-toggle/index.js CHANGED Viewed

@@ -1,14 +1,13 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = ComplementaryAreaToggle;
 var _components = require("@wordpress/components");
 var _data = require("@wordpress/data");
+var _plugins = require("@wordpress/plugins");
 var _store = require("../../store");
-var _complementaryAreaContext = _interopRequireDefault(require("../complementary-area-context"));
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
@@ -30,14 +29,17 @@ var _jsxRuntime = require("react/jsx-runtime");
 function ComplementaryAreaToggle({
   as = _components.Button,
   scope,
-  identifier,
-  icon,
+  identifier: identifierProp,
+  icon: iconProp,
   selectedIcon,
   name,
   shortcut,
   ...props
 }) {
   const ComponentToUse = as;
+  const context = (0, _plugins.usePluginContext)();
+  const icon = iconProp || context.icon;
+  const identifier = identifierProp || `${context.name}/${name}`;
   const isSelected = (0, _data.useSelect)(select => select(_store.store).getActiveComplementaryArea(scope) === identifier, [identifier, scope]);
   const {
     enableComplementaryArea,
@@ -60,5 +62,4 @@ function ComplementaryAreaToggle({
     ...props
   });
 }
-var _default = exports.default = (0, _complementaryAreaContext.default)(ComplementaryAreaToggle);
 //# sourceMappingURL=index.js.map

package/build/components/complementary-area-toggle/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_components","require","_data","~~_store~~","~~_complementaryAreaContext~~","~~_interopRequireDefault","~~_jsxRuntime","roleSupportsCheckedState","role","includes","ComplementaryAreaToggle","as","Button","scope","identifier","icon","selectedIcon","name","shortcut","props","ComponentToUse","isSelected","useSelect","select","interfaceStore","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","useDispatch","jsx","replace","undefined","onClick"~~,"_default","exports","default","complementaryAreaContext"~~],"sources":["@wordpress/interface/src/components/complementary-area-toggle/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { Button } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/\n Internal dependencies\n /\nimport { store as interfaceStore } from '../../store';\~~nimport complementaryAreaContext from '../complementary-area-context';\~~n\n/\n Whether the role supports checked state.\n \n @param {import('react').AriaRole} role Role.\n * @return {boolean} Whether the role supports checked state.\n * @see https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n */\nfunction roleSupportsCheckedState( role ) {\n\treturn [\n\t\t'checkbox',\n\t\t'option',\n\t\t'radio',\n\t\t'switch',\n\t\t'menuitemcheckbox',\n\t\t'menuitemradio',\n\t\t'treeitem',\n\t].includes( role );\n}\n\~~nfunction~~ ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier,\n\ticon,\n\tselectedIcon,\n\tname,\n\tshortcut,\n\t...props\n} ) {\n\tconst ComponentToUse = as;\n\tconst isSelected = useSelect(\n\t\t( select ) =>\n\t\t\tselect( interfaceStore ).getActiveComplementaryArea( scope ) ===\n\t\t\tidentifier,\n\t\t[ identifier, scope ]\n\t);\n\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\n\t\t\taria-controls={ identifier.replace( '/', ':' ) }\n\t\t\t// Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n\t\t\taria-checked={\n\t\t\t\troleSupportsCheckedState( props.role ) ? isSelected : undefined\n\t\t\t}\n\t\t\tonClick={ () => {\n\t\t\t\tif ( isSelected ) {\n\t\t\t\t\tdisableComplementaryArea( scope );\n\t\t\t\t} else {\n\t\t\t\t\tenableComplementaryArea( scope, identifier );\n\t\t\t\t}\n\t\t\t} }\n\t\t\tshortcut={ shortcut }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n~~\nexport default complementaryAreaContext( ComplementaryAreaToggle );\n~~"],"mappings":"~~;;;;;;;~~AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;~~AAKA~~,IAAAE,~~MAAA~~,GAAAF,OAAA;~~AACA~~,IAAAG,~~yBAAA~~,~~GAAAC~~,~~sBAAA,CAAAJ,~~OAAA;~~AAAqE~~,~~IAAAK~~,WAAA,~~GAAAL~~,OAAA;~~AAVrE~~;AACA;AACA;;~~AAIA~~;AACA;AACA;;~~AAIA~~;AACA;AACA;AACA;AACA;AACA;AACA,GACA,~~SAASM~~,wBAAwBA,CAAEC,IAAI,EAAG;EACzC,OAAO,CACN,UAAU,EACV,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,kBAAkB,EAClB,eAAe,EACf,UAAU,CACV,CAACC,QAAQ,CAAED,IAAK,CAAC;AACnB;~~AAEA~~,SAASE,uBAAuBA,CAAE;~~EACjCC~~,EAAE,GAAGC,kBAAM;EACXC,KAAK;EACLC,UAAU;~~EACVC~~,IAAI;~~EACJC~~,YAAY;EACZC,IAAI;EACJC,QAAQ;EACR,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,~~GAAGT~~,EAAE;EACzB,~~MAAMU~~,UAAU,GAAG,IAAAC,eAAS,EACzBC,MAAM,IACPA,MAAM,CAAEC,YAAe,CAAC,CAACC,0BAA0B,~~CAAEZ~~,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EAED,MAAM;~~IAAEa~~,uBAAuB;IAAEC;EAAyB,CAAC,GAC1D,IAAAC,iBAAW,EAAEJ,YAAe,CAAC;EAE9B,oBACC,~~IAAAlB~~,WAAA,~~CAAAuB~~,GAAA,~~EAACT~~,cAAc;~~IACdL~~,IAAI,~~EAAGC~~,YAAY,~~IAAIK~~,UAAU,~~GAAGL~~,YAAY,~~GAAGD~~,IAAM;IACzD,~~iBAAgBD~~,UAAU,~~CAACgB~~,OAAO,CAAE,GAAG,EAAE,GAAI;IAC7C;IAAA;IACA,~~gBACCvB~~,wBAAwB,~~CAAEY~~,KAAK,~~CAACX~~,IAAK,CAAC,~~GAAGa~~,UAAU,GAAGU,SACtD;IACDC,OAAO,EAAGA,CAAA,KAAM;MACf,IAAKX,UAAU,EAAG;QACjBM,wBAAwB,~~CAAEd~~,KAAM,CAAC;MAClC,CAAC,MAAM;~~QACNa~~,uBAAuB,~~CAAEb~~,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;~~IACHI~~,QAAQ,EAAGA,QAAU;IAAA,GAChBC;EAAK,CACV,CAAC;AAEJ~~;AAAC,IAAAc,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc,IAAAC,iCAAwB,EAAE1B,uBAAwB,CAAC~~","ignoreList":[]}
1	+ {"version":3,"names":["_components","require","_data","_plugins","_store","_jsxRuntime","roleSupportsCheckedState","role","includes","ComplementaryAreaToggle","as","Button","scope","identifier","identifierProp","icon","iconProp","selectedIcon","name","shortcut","props","ComponentToUse","context","usePluginContext","isSelected","useSelect","select","interfaceStore","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","useDispatch","jsx","replace","undefined","onClick"],"sources":["@wordpress/interface/src/components/complementary-area-toggle/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { Button } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { usePluginContext } from '@wordpress/plugins';\n\n/\n Internal dependencies\n /\nimport { store as interfaceStore } from '../../store';\n\n/\n Whether the role supports checked state.\n \n @param {import('react').AriaRole} role Role.\n * @return {boolean} Whether the role supports checked state.\n * @see https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n */\nfunction roleSupportsCheckedState( role ) {\n\treturn [\n\t\t'checkbox',\n\t\t'option',\n\t\t'radio',\n\t\t'switch',\n\t\t'menuitemcheckbox',\n\t\t'menuitemradio',\n\t\t'treeitem',\n\t].includes( role );\n}\n\nexport default function ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier: identifierProp,\n\ticon: iconProp,\n\tselectedIcon,\n\tname,\n\tshortcut,\n\t...props\n} ) {\n\tconst ComponentToUse = as;\n\tconst context = usePluginContext();\n\tconst icon = iconProp \|\| context.icon;\n\tconst identifier = identifierProp \|\| `${ context.name }/${ name }`;\n\tconst isSelected = useSelect(\n\t\t( select ) =>\n\t\t\tselect( interfaceStore ).getActiveComplementaryArea( scope ) ===\n\t\t\tidentifier,\n\t\t[ identifier, scope ]\n\t);\n\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\n\t\t\taria-controls={ identifier.replace( '/', ':' ) }\n\t\t\t// Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n\t\t\taria-checked={\n\t\t\t\troleSupportsCheckedState( props.role ) ? isSelected : undefined\n\t\t\t}\n\t\t\tonClick={ () => {\n\t\t\t\tif ( isSelected ) {\n\t\t\t\t\tdisableComplementaryArea( scope );\n\t\t\t\t} else {\n\t\t\t\t\tenableComplementaryArea( scope, identifier );\n\t\t\t\t}\n\t\t\t} }\n\t\t\tshortcut={ shortcut }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,MAAA,GAAAH,OAAA;AAAsD,IAAAI,WAAA,GAAAJ,OAAA;AAVtD;AACA;AACA;;AAKA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASK,wBAAwBA,CAAEC,IAAI,EAAG;EACzC,OAAO,CACN,UAAU,EACV,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,kBAAkB,EAClB,eAAe,EACf,UAAU,CACV,CAACC,QAAQ,CAAED,IAAK,CAAC;AACnB;AAEe,SAASE,uBAAuBA,CAAE;EAChDC,EAAE,GAAGC,kBAAM;EACXC,KAAK;EACLC,UAAU,EAAEC,cAAc;EAC1BC,IAAI,EAAEC,QAAQ;EACdC,YAAY;EACZC,IAAI;EACJC,QAAQ;EACR,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGX,EAAE;EACzB,MAAMY,OAAO,GAAG,IAAAC,yBAAgB,EAAC,CAAC;EAClC,MAAMR,IAAI,GAAGC,QAAQ,IAAIM,OAAO,CAACP,IAAI;EACrC,MAAMF,UAAU,GAAGC,cAAc,IAAI,GAAIQ,OAAO,CAACJ,IAAI,IAAMA,IAAI,EAAG;EAClE,MAAMM,UAAU,GAAG,IAAAC,eAAS,EACzBC,MAAM,IACPA,MAAM,CAAEC,YAAe,CAAC,CAACC,0BAA0B,CAAEhB,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EAED,MAAM;IAAEiB,uBAAuB;IAAEC;EAAyB,CAAC,GAC1D,IAAAC,iBAAW,EAAEJ,YAAe,CAAC;EAE9B,oBACC,IAAAtB,WAAA,CAAA2B,GAAA,EAACX,cAAc;IACdN,IAAI,EAAGE,YAAY,IAAIO,UAAU,GAAGP,YAAY,GAAGF,IAAM;IACzD,iBAAgBF,UAAU,CAACoB,OAAO,CAAE,GAAG,EAAE,GAAI;IAC7C;IAAA;IACA,gBACC3B,wBAAwB,CAAEc,KAAK,CAACb,IAAK,CAAC,GAAGiB,UAAU,GAAGU,SACtD;IACDC,OAAO,EAAGA,CAAA,KAAM;MACf,IAAKX,UAAU,EAAG;QACjBM,wBAAwB,CAAElB,KAAM,CAAC;MAClC,CAAC,MAAM;QACNiB,uBAAuB,CAAEjB,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;IACHM,QAAQ,EAAGA,QAAU;IAAA,GAChBC;EAAK,CACV,CAAC;AAEJ","ignoreList":[]}

package/build/components/interface-skeleton/index.js CHANGED Viewed

@@ -103,7 +103,7 @@ function InterfaceSkeleton({
     /* translators: accessibility text for the secondary sidebar landmark region. */
     secondarySidebar: (0, _i18n.__)('Block Library'),
     /* translators: accessibility text for the settings landmark region. */
-    sidebar: (0, _i18n.__)('Settings'),
+    sidebar: (0, _i18n._x)('Settings', 'settings landmark area'),
     /* translators: accessibility text for the publish landmark region. */
     actions: (0, _i18n.__)('Publish'),
     /* translators: accessibility text for the footer landmark region. */

package/build/components/interface-skeleton/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_components","_i18n","_compose","_navigableRegion","_jsxRuntime","ANIMATION_DURATION","commonTransition","type","duration","ease","useHTMLClass","className","useEffect","element","document","querySelector","classList","toggle","headerVariants","hidden","opacity","marginTop","visible","distractionFreeHover","transition","delay","delayChildren","distractionFreeHidden","distractionFreeDisabled","InterfaceSkeleton","isDistractionFree","footer","header","editorNotices","sidebar","secondarySidebar","content","actions","labels","ref","secondarySidebarResizeListener","secondarySidebarSize","useResizeObserver","isMobileViewport","useViewportMatch","disableMotion","useReducedMotion","defaultTransition","defaultLabels","_x","body","__","mergedLabels","jsxs","clsx","children","jsx","__unstableAnimatePresence","initial","default","as","motion","div","whileHover","animate","exit","variants","ariaLabel","open","width","closed","__unstableMotion","style","position","height","left","x","_default","exports","forwardRef"],"sources":["@wordpress/interface/src/components/interface-skeleton/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { forwardRef, useEffect } from '@wordpress/element';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport NavigableRegion from '../navigable-region';\n\nconst ANIMATION_DURATION = 0.25;\nconst commonTransition = {\n\ttype: 'tween',\n\tduration: ANIMATION_DURATION,\n\tease: [ 0.6, 0, 0.4, 1 ],\n};\n\nfunction useHTMLClass( className ) {\n\tuseEffect( () => {\n\t\tconst element =\n\t\t\tdocument && document.querySelector( `html:not(.${ className })` );\n\t\tif ( ! element ) {\n\t\t\treturn;\n\t\t}\n\t\telement.classList.toggle( className );\n\t\treturn () => {\n\t\t\telement.classList.toggle( className );\n\t\t};\n\t}, [ className ] );\n}\n\nconst headerVariants = {\n\thidden: { opacity: 1, marginTop: -60 },\n\tvisible: { opacity: 1, marginTop: 0 },\n\tdistractionFreeHover: {\n\t\topacity: 1,\n\t\tmarginTop: 0,\n\t\ttransition: {\n\t\t\t...commonTransition,\n\t\t\tdelay: 0.2,\n\t\t\tdelayChildren: 0.2,\n\t\t},\n\t},\n\tdistractionFreeHidden: {\n\t\topacity: 0,\n\t\tmarginTop: -60,\n\t},\n\tdistractionFreeDisabled: {\n\t\topacity: 0,\n\t\tmarginTop: 0,\n\t\ttransition: {\n\t\t\t...commonTransition,\n\t\t\tdelay: 0.8,\n\t\t\tdelayChildren: 0.8,\n\t\t},\n\t},\n};\n\nfunction InterfaceSkeleton(\n\t{\n\t\tisDistractionFree,\n\t\tfooter,\n\t\theader,\n\t\teditorNotices,\n\t\tsidebar,\n\t\tsecondarySidebar,\n\t\tcontent,\n\t\tactions,\n\t\tlabels,\n\t\tclassName,\n\t},\n\tref\n) {\n\tconst [ secondarySidebarResizeListener, secondarySidebarSize ] =\n\t\tuseResizeObserver();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst disableMotion = useReducedMotion();\n\tconst defaultTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\tuseHTMLClass( 'interface-interface-skeleton__html-container' );\n\n\tconst defaultLabels = {\n\t\t/ translators: accessibility text for the top bar landmark region. /\n\t\theader: _x( 'Header', 'header landmark area' ),\n\t\t/ translators: accessibility text for the content landmark region. /\n\t\tbody: __( 'Content' ),\n\t\t/ translators: accessibility text for the secondary sidebar landmark region. /\n\t\tsecondarySidebar: __( 'Block Library' ),\n\t\t/ translators: accessibility text for the settings landmark region. /\n\t\tsidebar: __( 'Settings' ),\n\t\t/ translators: accessibility text for the publish landmark region. /\n\t\tactions: __( 'Publish' ),\n\t\t/ translators: accessibility text for the footer landmark region. */\n\t\tfooter: __( 'Footer' ),\n\t};\n\n\tconst mergedLabels = { ...defaultLabels, ...labels };\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'interface-interface-skeleton',\n\t\t\t\t!! footer && 'has-footer'\n\t\t\t) }\n\t\t>\n\t\t\t<div className=\"interface-interface-skeleton__editor\">\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ !! header && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__header\"\n\t\t\t\t\t\t\taria-label={ mergedLabels.header }\n\t\t\t\t\t\t\tinitial={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHidden'\n\t\t\t\t\t\t\t\t\t: 'hidden'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twhileHover={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHover'\n\t\t\t\t\t\t\t\t\t: 'visible'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeDisabled'\n\t\t\t\t\t\t\t\t\t: 'visible'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\texit={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHidden'\n\t\t\t\t\t\t\t\t\t: 'hidden'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvariants={ headerVariants }\n\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ header }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\t\t\t\t{ isDistractionFree && (\n\t\t\t\t\t<div className=\"interface-interface-skeleton__header\">\n\t\t\t\t\t\t{ editorNotices }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<div className=\"interface-interface-skeleton__body\">\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ !! secondarySidebar && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__secondary-sidebar\"\n\t\t\t\t\t\t\t\tariaLabel={ mergedLabels.secondarySidebar }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\t\t\tanimate=\"open\"\n\t\t\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\topen: { width: secondarySidebarSize.width },\n\t\t\t\t\t\t\t\t\tclosed: { width: 0 },\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t\t\t: 'fit-content',\n\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\t\topen: { x: 0 },\n\t\t\t\t\t\t\t\t\t\tclosed: { x: '-100%' },\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ secondarySidebarResizeListener }\n\t\t\t\t\t\t\t\t\t{ secondarySidebar }\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\tclassName=\"interface-interface-skeleton__content\"\n\t\t\t\t\t\tariaLabel={ mergedLabels.body }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ content }\n\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t{ !! sidebar && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__sidebar\"\n\t\t\t\t\t\t\tariaLabel={ mergedLabels.sidebar }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ sidebar }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t\t{ !! actions && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__actions\"\n\t\t\t\t\t\t\tariaLabel={ mergedLabels.actions }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ actions }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{ !! footer && (\n\t\t\t\t<NavigableRegion\n\t\t\t\t\tclassName=\"interface-interface-skeleton__footer\"\n\t\t\t\t\tariaLabel={ mergedLabels.footer }\n\t\t\t\t>\n\t\t\t\t\t{ footer }\n\t\t\t\t</NavigableRegion>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default forwardRef( InterfaceSkeleton );\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_components","_i18n","_compose","_navigableRegion","_jsxRuntime","ANIMATION_DURATION","commonTransition","type","duration","ease","useHTMLClass","className","useEffect","element","document","querySelector","classList","toggle","headerVariants","hidden","opacity","marginTop","visible","distractionFreeHover","transition","delay","delayChildren","distractionFreeHidden","distractionFreeDisabled","InterfaceSkeleton","isDistractionFree","footer","header","editorNotices","sidebar","secondarySidebar","content","actions","labels","ref","secondarySidebarResizeListener","secondarySidebarSize","useResizeObserver","isMobileViewport","useViewportMatch","disableMotion","useReducedMotion","defaultTransition","defaultLabels","_x","body","__","mergedLabels","jsxs","clsx","children","jsx","__unstableAnimatePresence","initial","default","as","motion","div","whileHover","animate","exit","variants","ariaLabel","open","width","closed","__unstableMotion","style","position","height","left","x","_default","exports","forwardRef"],"sources":["@wordpress/interface/src/components/interface-skeleton/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { forwardRef, useEffect } from '@wordpress/element';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport NavigableRegion from '../navigable-region';\n\nconst ANIMATION_DURATION = 0.25;\nconst commonTransition = {\n\ttype: 'tween',\n\tduration: ANIMATION_DURATION,\n\tease: [ 0.6, 0, 0.4, 1 ],\n};\n\nfunction useHTMLClass( className ) {\n\tuseEffect( () => {\n\t\tconst element =\n\t\t\tdocument && document.querySelector( `html:not(.${ className })` );\n\t\tif ( ! element ) {\n\t\t\treturn;\n\t\t}\n\t\telement.classList.toggle( className );\n\t\treturn () => {\n\t\t\telement.classList.toggle( className );\n\t\t};\n\t}, [ className ] );\n}\n\nconst headerVariants = {\n\thidden: { opacity: 1, marginTop: -60 },\n\tvisible: { opacity: 1, marginTop: 0 },\n\tdistractionFreeHover: {\n\t\topacity: 1,\n\t\tmarginTop: 0,\n\t\ttransition: {\n\t\t\t...commonTransition,\n\t\t\tdelay: 0.2,\n\t\t\tdelayChildren: 0.2,\n\t\t},\n\t},\n\tdistractionFreeHidden: {\n\t\topacity: 0,\n\t\tmarginTop: -60,\n\t},\n\tdistractionFreeDisabled: {\n\t\topacity: 0,\n\t\tmarginTop: 0,\n\t\ttransition: {\n\t\t\t...commonTransition,\n\t\t\tdelay: 0.8,\n\t\t\tdelayChildren: 0.8,\n\t\t},\n\t},\n};\n\nfunction InterfaceSkeleton(\n\t{\n\t\tisDistractionFree,\n\t\tfooter,\n\t\theader,\n\t\teditorNotices,\n\t\tsidebar,\n\t\tsecondarySidebar,\n\t\tcontent,\n\t\tactions,\n\t\tlabels,\n\t\tclassName,\n\t},\n\tref\n) {\n\tconst [ secondarySidebarResizeListener, secondarySidebarSize ] =\n\t\tuseResizeObserver();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst disableMotion = useReducedMotion();\n\tconst defaultTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\tuseHTMLClass( 'interface-interface-skeleton__html-container' );\n\n\tconst defaultLabels = {\n\t\t/ translators: accessibility text for the top bar landmark region. /\n\t\theader: _x( 'Header', 'header landmark area' ),\n\t\t/ translators: accessibility text for the content landmark region. /\n\t\tbody: __( 'Content' ),\n\t\t/ translators: accessibility text for the secondary sidebar landmark region. /\n\t\tsecondarySidebar: __( 'Block Library' ),\n\t\t/ translators: accessibility text for the settings landmark region. /\n\t\tsidebar: _x( 'Settings', 'settings landmark area' ),\n\t\t/ translators: accessibility text for the publish landmark region. /\n\t\tactions: __( 'Publish' ),\n\t\t/ translators: accessibility text for the footer landmark region. */\n\t\tfooter: __( 'Footer' ),\n\t};\n\n\tconst mergedLabels = { ...defaultLabels, ...labels };\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tclassName,\n\t\t\t\t'interface-interface-skeleton',\n\t\t\t\t!! footer && 'has-footer'\n\t\t\t) }\n\t\t>\n\t\t\t<div className=\"interface-interface-skeleton__editor\">\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ !! header && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__header\"\n\t\t\t\t\t\t\taria-label={ mergedLabels.header }\n\t\t\t\t\t\t\tinitial={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHidden'\n\t\t\t\t\t\t\t\t\t: 'hidden'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twhileHover={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHover'\n\t\t\t\t\t\t\t\t\t: 'visible'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeDisabled'\n\t\t\t\t\t\t\t\t\t: 'visible'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\texit={\n\t\t\t\t\t\t\t\tisDistractionFree && ! isMobileViewport\n\t\t\t\t\t\t\t\t\t? 'distractionFreeHidden'\n\t\t\t\t\t\t\t\t\t: 'hidden'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvariants={ headerVariants }\n\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ header }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\t\t\t\t{ isDistractionFree && (\n\t\t\t\t\t<div className=\"interface-interface-skeleton__header\">\n\t\t\t\t\t\t{ editorNotices }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<div className=\"interface-interface-skeleton__body\">\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ !! secondarySidebar && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__secondary-sidebar\"\n\t\t\t\t\t\t\t\tariaLabel={ mergedLabels.secondarySidebar }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\t\t\tanimate=\"open\"\n\t\t\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\topen: { width: secondarySidebarSize.width },\n\t\t\t\t\t\t\t\t\tclosed: { width: 0 },\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t\t\t: 'fit-content',\n\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\t\topen: { x: 0 },\n\t\t\t\t\t\t\t\t\t\tclosed: { x: '-100%' },\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ secondarySidebarResizeListener }\n\t\t\t\t\t\t\t\t\t{ secondarySidebar }\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\tclassName=\"interface-interface-skeleton__content\"\n\t\t\t\t\t\tariaLabel={ mergedLabels.body }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ content }\n\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t{ !! sidebar && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__sidebar\"\n\t\t\t\t\t\t\tariaLabel={ mergedLabels.sidebar }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ sidebar }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t\t{ !! actions && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tclassName=\"interface-interface-skeleton__actions\"\n\t\t\t\t\t\t\tariaLabel={ mergedLabels.actions }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ actions }\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{ !! footer && (\n\t\t\t\t<NavigableRegion\n\t\t\t\t\tclassName=\"interface-interface-skeleton__footer\"\n\t\t\t\t\tariaLabel={ mergedLabels.footer }\n\t\t\t\t>\n\t\t\t\t\t{ footer }\n\t\t\t\t</NavigableRegion>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default forwardRef( InterfaceSkeleton );\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/complementary-area/index.js CHANGED Viewed

@@ -14,6 +14,7 @@ import { useEffect, useRef, useState } from '@wordpress/element';
 import { store as viewportStore } from '@wordpress/viewport';
 import { store as preferencesStore } from '@wordpress/preferences';
 import { useReducedMotion, useViewportMatch, usePrevious } from '@wordpress/compose';
+import { usePluginContext } from '@wordpress/plugins';
 /**
  * Internal dependencies
@@ -21,7 +22,6 @@ import { useReducedMotion, useViewportMatch, usePrevious } from '@wordpress/comp
 import ComplementaryAreaHeader from '../complementary-area-header';
 import ComplementaryAreaMoreMenuItem from '../complementary-area-more-menu-item';
 import ComplementaryAreaToggle from '../complementary-area-toggle';
-import withComplementaryAreaContext from '../complementary-area-context';
 import PinnedItems from '../pinned-items';
 import { store as interfaceStore } from '../../store';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
@@ -135,19 +135,22 @@ function ComplementaryArea({
   children,
   className,
   closeLabel = __('Close plugin'),
-  identifier,
+  identifier: identifierProp,
   header,
   headerClassName,
-  icon,
+  icon: iconProp,
   isPinnable = true,
   panelClassName,
   scope,
   name,
-  smallScreenTitle,
   title,
   toggleShortcut,
   isActiveByDefault
 }) {
+  const context = usePluginContext();
+  const icon = iconProp || context.icon;
+  const identifier = identifierProp || `${context.name}/${name}`;
   // This state is used to delay the rendering of the Fill
   // until the initial effect runs.
   // This prevents the animation from running on mount if
@@ -181,6 +184,7 @@ function ComplementaryArea({
       showIconLabels: get('core', 'showIconLabels')
     };
   }, [identifier, scope]);
+  const isMobileViewport = useViewportMatch('medium', '<');
   useAdjustComplementaryListener(scope, identifier, activeArea, isActive, isSmall);
   const {
     enableComplementaryArea,
@@ -232,10 +236,9 @@ function ComplementaryArea({
         className: headerClassName,
         closeLabel: closeLabel,
         onClose: () => disableComplementaryArea(scope),
-        smallScreenTitle: smallScreenTitle,
         toggleButtonProps: {
           label: closeLabel,
-          size: 'small',
+          size: 'compact',
           shortcut: toggleShortcut,
           scope,
           identifier
@@ -244,7 +247,7 @@ function ComplementaryArea({
           children: [/*#__PURE__*/_jsx("h2", {
             className: "interface-complementary-area-header__title",
             children: title
-          }), isPinnable && /*#__PURE__*/_jsx(Button, {
+          }), isPinnable && !isMobileViewport && /*#__PURE__*/_jsx(Button, {
             className: "interface-complementary-area__pin-unpin-item",
             icon: isPinned ? starFilled : starEmpty,
             label: isPinned ? __('Unpin from toolbar') : __('Pin to toolbar'),
@@ -261,7 +264,6 @@ function ComplementaryArea({
     })]
   });
 }
-const ComplementaryAreaWrapped = withComplementaryAreaContext(ComplementaryArea);
-ComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;
-export default ComplementaryAreaWrapped;
+ComplementaryArea.Slot = ComplementaryAreaSlot;
+export default ComplementaryArea;
 //# sourceMappingURL=index.js.map

package/build-module/components/complementary-area/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["clsx","Button","Panel","Slot","Fill","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","useState","store","viewportStore","preferencesStore","useReducedMotion","useViewportMatch","usePrevious","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","withComplementaryAreaContext","PinnedItems","interfaceStore","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ANIMATION_DURATION","ComplementaryAreaSlot","scope","props","name","SIDEBAR_WIDTH","variants","open","width","closed","mobileOpen","ComplementaryAreaFill","activeArea","isActive","children","className","id","disableMotion","isMobileViewport","previousActiveArea","previousIsActive","setState","transition","type","duration","ease","initial","div","animate","exit","style","useAdjustComplementaryListener","identifier","isSmall","previousIsSmallRef","shouldOpenWhenNotSmallRef","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","isReady","setIsReady","isLoading","isPinned","isLarge","showIconLabels","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","get","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","isPressed","label","showTooltip","variant","size","shortcut","target","replace","onClose","toggleButtonProps","onClick","ComplementaryAreaWrapped"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport {\n\tButton,\n\tPanel,\n\tSlot,\n\tFill,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tusePrevious,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaHeader from '../complementary-area-header';\nimport ComplementaryAreaMoreMenuItem from '../complementary-area-more-menu-item';\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\nimport withComplementaryAreaContext from '../complementary-area-context';\nimport PinnedItems from '../pinned-items';\nimport { store as interfaceStore } from '../../store';\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nconst SIDEBAR_WIDTH = 280;\nconst variants = {\n\topen: { width: SIDEBAR_WIDTH },\n\tclosed: { width: 0 },\n\tmobileOpen: { width: '100vw' },\n};\n\nfunction ComplementaryAreaFill( {\n\tactiveArea,\n\tisActive,\n\tscope,\n\tchildren,\n\tclassName,\n\tid,\n} ) {\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\t// This is used to delay the exit animation to the next tick.\n\t// The reason this is done is to allow us to apply the right transition properties\n\t// When we switch from an open sidebar to another open sidebar.\n\t// we don't want to animate in this case.\n\tconst previousActiveArea = usePrevious( activeArea );\n\tconst previousIsActive = usePrevious( isActive );\n\tconst [ , setState ] = useState( {} );\n\tuseEffect( () => {\n\t\tsetState( {} );\n\t}, [ isActive ] );\n\tconst transition = {\n\t\ttype: 'tween',\n\t\tduration:\n\t\t\tdisableMotion \|\|\n\t\t\tisMobileViewport \|\|\n\t\t\t( !! previousActiveArea &&\n\t\t\t\t!! activeArea &&\n\t\t\t\tactiveArea !== previousActiveArea )\n\t\t\t\t? 0\n\t\t\t\t: ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ ( previousIsActive \|\| isActive ) && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ variants }\n\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\tanimate={ isMobileViewport ? 'mobileOpen' : 'open' }\n\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\ttransition={ transition }\n\t\t\t\t\t\tclassName=\"interface-complementary-area__fill\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t: SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmallRef = useRef( false );\n\tconst shouldOpenWhenNotSmallRef = useRef( false );\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\tuseEffect( () => {\n\t\t// If the complementary area is active and the editor is switching from\n\t\t// a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmallRef.current ) {\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size\n\t\t\t// goes from small to big.\n\t\t\tshouldOpenWhenNotSmallRef.current = true;\n\t\t} else if (\n\t\t\t// If there is a flag indicating the complementary area should be\n\t\t\t// enabled when we go from small to big window size and we are going\n\t\t\t// from a small to big window size.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmallRef.current\n\t\t) {\n\t\t\t// Remove the flag indicating the complementary area should be\n\t\t\t// enabled.\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if (\n\t\t\t// If the flag is indicating the current complementary should be\n\t\t\t// reopened but another complementary area becomes active, remove\n\t\t\t// the flag.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmallRef.current ) {\n\t\t\tpreviousIsSmallRef.current = isSmall;\n\t\t}\n\t}, [\n\t\tisActive,\n\t\tisSmall,\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tdisableComplementaryArea,\n\t\tenableComplementaryArea,\n\t] );\n}\n\nfunction ComplementaryArea( {\n\tchildren,\n\tclassName,\n\tcloseLabel = __( 'Close plugin' ),\n\tidentifier,\n\theader,\n\theaderClassName,\n\ticon,\n\tisPinnable = true,\n\tpanelClassName,\n\tscope,\n\tname,\n\tsmallScreenTitle,\n\ttitle,\n\ttoggleShortcut,\n\tisActiveByDefault,\n} ) {\n\t// This state is used to delay the rendering of the Fill\n\t// until the initial effect runs.\n\t// This prevents the animation from running on mount if\n\t// the complementary area is active by default.\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\tisLoading,\n\t\tisActive,\n\t\tisPinned,\n\t\tactiveArea,\n\t\tisSmall,\n\t\tisLarge,\n\t\tshowIconLabels,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\tisItemPinned,\n\t\t\t} = select( interfaceStore );\n\t\t\tconst { get } = select( preferencesStore );\n\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\treturn {\n\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\tactiveArea: _activeArea,\n\t\t\t\tisSmall: select( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\t};\n\t\t},\n\t\t[ identifier, scope ]\n\t);\n\tuseAdjustComplementaryListener(\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tisActive,\n\t\tisSmall\n\t);\n\tconst {\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t\tpinItem,\n\t\tunpinItem,\n\t} = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\t// Set initial visibility: For large screens, enable if it's active by\n\t\t// default. For small screens, always initially disable.\n\t\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if ( activeArea === undefined && isSmall ) {\n\t\t\tdisableComplementaryArea( scope, identifier );\n\t\t}\n\t\tsetIsReady( true );\n\t}, [\n\t\tactiveArea,\n\t\tisActiveByDefault,\n\t\tscope,\n\t\tidentifier,\n\t\tisSmall,\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t] );\n\n\tif ( ! isReady ) {\n\t\treturn;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isPinnable && (\n\t\t\t\t<PinnedItems scope={ scope }>\n\t\t\t\t\t{ isPinned && (\n\t\t\t\t\t\t<ComplementaryAreaToggle\n\t\t\t\t\t\t\tscope={ scope }\n\t\t\t\t\t\t\tidentifier={ identifier }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisActive && ( ! showIconLabels \|\| isLarge )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-expanded={ isActive }\n\t\t\t\t\t\t\taria-disabled={ isLoading }\n\t\t\t\t\t\t\tlabel={ title }\n\t\t\t\t\t\t\ticon={ showIconLabels ? check : icon }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\tshortcut={ toggleShortcut }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</PinnedItems>\n\t\t\t) }\n\t\t\t{ name && isPinnable && (\n\t\t\t\t<ComplementaryAreaMoreMenuItem\n\t\t\t\t\ttarget={ name }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ComplementaryAreaMoreMenuItem>\n\t\t\t) }\n\t\t\t<ComplementaryAreaFill\n\t\t\t\tactiveArea={ activeArea }\n\t\t\t\tisActive={ isActive }\n\t\t\t\tclassName={ clsx( 'interface-complementary-area', className ) }\n\t\t\t\tscope={ scope }\n\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t>\n\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\tscope,\n\t\t\t\t\t\tidentifier,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\ticon={ isPinned ? starFilled : starEmpty }\n\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\tisPinned\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Unpin from toolbar' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</ComplementaryAreaHeader>\n\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t</ComplementaryAreaFill>\n\t\t</>\n\t);\n}\n\nconst ComplementaryAreaWrapped =\n\twithComplementaryAreaContext( ComplementaryArea );\n\nComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryAreaWrapped;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["clsx","Button","Panel","Slot","Fill","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","useState","store","viewportStore","preferencesStore","useReducedMotion","useViewportMatch","usePrevious","usePluginContext","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","PinnedItems","interfaceStore","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ANIMATION_DURATION","ComplementaryAreaSlot","scope","props","name","SIDEBAR_WIDTH","variants","open","width","closed","mobileOpen","ComplementaryAreaFill","activeArea","isActive","children","className","id","disableMotion","isMobileViewport","previousActiveArea","previousIsActive","setState","transition","type","duration","ease","initial","div","animate","exit","style","useAdjustComplementaryListener","identifier","isSmall","previousIsSmallRef","shouldOpenWhenNotSmallRef","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","identifierProp","header","headerClassName","icon","iconProp","isPinnable","panelClassName","title","toggleShortcut","isActiveByDefault","context","isReady","setIsReady","isLoading","isPinned","isLarge","showIconLabels","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","get","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","isPressed","label","showTooltip","variant","size","shortcut","target","replace","onClose","toggleButtonProps","onClick"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport {\n\tButton,\n\tPanel,\n\tSlot,\n\tFill,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tusePrevious,\n} from '@wordpress/compose';\nimport { usePluginContext } from '@wordpress/plugins';\n\n/\n Internal dependencies\n */\nimport ComplementaryAreaHeader from '../complementary-area-header';\nimport ComplementaryAreaMoreMenuItem from '../complementary-area-more-menu-item';\nimport ComplementaryAreaToggle from '../complementary-area-toggle';\nimport PinnedItems from '../pinned-items';\nimport { store as interfaceStore } from '../../store';\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nconst SIDEBAR_WIDTH = 280;\nconst variants = {\n\topen: { width: SIDEBAR_WIDTH },\n\tclosed: { width: 0 },\n\tmobileOpen: { width: '100vw' },\n};\n\nfunction ComplementaryAreaFill( {\n\tactiveArea,\n\tisActive,\n\tscope,\n\tchildren,\n\tclassName,\n\tid,\n} ) {\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\t// This is used to delay the exit animation to the next tick.\n\t// The reason this is done is to allow us to apply the right transition properties\n\t// When we switch from an open sidebar to another open sidebar.\n\t// we don't want to animate in this case.\n\tconst previousActiveArea = usePrevious( activeArea );\n\tconst previousIsActive = usePrevious( isActive );\n\tconst [ , setState ] = useState( {} );\n\tuseEffect( () => {\n\t\tsetState( {} );\n\t}, [ isActive ] );\n\tconst transition = {\n\t\ttype: 'tween',\n\t\tduration:\n\t\t\tdisableMotion \|\|\n\t\t\tisMobileViewport \|\|\n\t\t\t( !! previousActiveArea &&\n\t\t\t\t!! activeArea &&\n\t\t\t\tactiveArea !== previousActiveArea )\n\t\t\t\t? 0\n\t\t\t\t: ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ ( previousIsActive \|\| isActive ) && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ variants }\n\t\t\t\t\t\tinitial=\"closed\"\n\t\t\t\t\t\tanimate={ isMobileViewport ? 'mobileOpen' : 'open' }\n\t\t\t\t\t\texit=\"closed\"\n\t\t\t\t\t\ttransition={ transition }\n\t\t\t\t\t\tclassName=\"interface-complementary-area__fill\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\twidth: isMobileViewport\n\t\t\t\t\t\t\t\t\t? '100vw'\n\t\t\t\t\t\t\t\t\t: SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmallRef = useRef( false );\n\tconst shouldOpenWhenNotSmallRef = useRef( false );\n\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\tuseEffect( () => {\n\t\t// If the complementary area is active and the editor is switching from\n\t\t// a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmallRef.current ) {\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size\n\t\t\t// goes from small to big.\n\t\t\tshouldOpenWhenNotSmallRef.current = true;\n\t\t} else if (\n\t\t\t// If there is a flag indicating the complementary area should be\n\t\t\t// enabled when we go from small to big window size and we are going\n\t\t\t// from a small to big window size.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmallRef.current\n\t\t) {\n\t\t\t// Remove the flag indicating the complementary area should be\n\t\t\t// enabled.\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if (\n\t\t\t// If the flag is indicating the current complementary should be\n\t\t\t// reopened but another complementary area becomes active, remove\n\t\t\t// the flag.\n\t\t\tshouldOpenWhenNotSmallRef.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmallRef.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmallRef.current ) {\n\t\t\tpreviousIsSmallRef.current = isSmall;\n\t\t}\n\t}, [\n\t\tisActive,\n\t\tisSmall,\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tdisableComplementaryArea,\n\t\tenableComplementaryArea,\n\t] );\n}\n\nfunction ComplementaryArea( {\n\tchildren,\n\tclassName,\n\tcloseLabel = __( 'Close plugin' ),\n\tidentifier: identifierProp,\n\theader,\n\theaderClassName,\n\ticon: iconProp,\n\tisPinnable = true,\n\tpanelClassName,\n\tscope,\n\tname,\n\ttitle,\n\ttoggleShortcut,\n\tisActiveByDefault,\n} ) {\n\tconst context = usePluginContext();\n\tconst icon = iconProp \|\| context.icon;\n\tconst identifier = identifierProp \|\| `${ context.name }/${ name }`;\n\n\t// This state is used to delay the rendering of the Fill\n\t// until the initial effect runs.\n\t// This prevents the animation from running on mount if\n\t// the complementary area is active by default.\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\tisLoading,\n\t\tisActive,\n\t\tisPinned,\n\t\tactiveArea,\n\t\tisSmall,\n\t\tisLarge,\n\t\tshowIconLabels,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\tisItemPinned,\n\t\t\t} = select( interfaceStore );\n\t\t\tconst { get } = select( preferencesStore );\n\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\treturn {\n\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\tactiveArea: _activeArea,\n\t\t\t\tisSmall: select( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\t};\n\t\t},\n\t\t[ identifier, scope ]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tuseAdjustComplementaryListener(\n\t\tscope,\n\t\tidentifier,\n\t\tactiveArea,\n\t\tisActive,\n\t\tisSmall\n\t);\n\tconst {\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t\tpinItem,\n\t\tunpinItem,\n\t} = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\t// Set initial visibility: For large screens, enable if it's active by\n\t\t// default. For small screens, always initially disable.\n\t\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t} else if ( activeArea === undefined && isSmall ) {\n\t\t\tdisableComplementaryArea( scope, identifier );\n\t\t}\n\t\tsetIsReady( true );\n\t}, [\n\t\tactiveArea,\n\t\tisActiveByDefault,\n\t\tscope,\n\t\tidentifier,\n\t\tisSmall,\n\t\tenableComplementaryArea,\n\t\tdisableComplementaryArea,\n\t] );\n\n\tif ( ! isReady ) {\n\t\treturn;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isPinnable && (\n\t\t\t\t<PinnedItems scope={ scope }>\n\t\t\t\t\t{ isPinned && (\n\t\t\t\t\t\t<ComplementaryAreaToggle\n\t\t\t\t\t\t\tscope={ scope }\n\t\t\t\t\t\t\tidentifier={ identifier }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisActive && ( ! showIconLabels \|\| isLarge )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-expanded={ isActive }\n\t\t\t\t\t\t\taria-disabled={ isLoading }\n\t\t\t\t\t\t\tlabel={ title }\n\t\t\t\t\t\t\ticon={ showIconLabels ? check : icon }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\tshortcut={ toggleShortcut }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</PinnedItems>\n\t\t\t) }\n\t\t\t{ name && isPinnable && (\n\t\t\t\t<ComplementaryAreaMoreMenuItem\n\t\t\t\t\ttarget={ name }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ComplementaryAreaMoreMenuItem>\n\t\t\t) }\n\t\t\t<ComplementaryAreaFill\n\t\t\t\tactiveArea={ activeArea }\n\t\t\t\tisActive={ isActive }\n\t\t\t\tclassName={ clsx( 'interface-complementary-area', className ) }\n\t\t\t\tscope={ scope }\n\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t>\n\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\tsize: 'compact',\n\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\tscope,\n\t\t\t\t\t\tidentifier,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t{ isPinnable && ! isMobileViewport && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\ticon={ isPinned ? starFilled : starEmpty }\n\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\tisPinned\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Unpin from toolbar' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</ComplementaryAreaHeader>\n\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t</ComplementaryAreaFill>\n\t\t</>\n\t);\n}\n\nComplementaryArea.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryArea;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/complementary-area-header/index.js CHANGED Viewed

@@ -12,9 +12,8 @@ import { closeSmall } from '@wordpress/icons';
  * Internal dependencies
  */
 import ComplementaryAreaToggle from '../complementary-area-toggle';
-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";
 const ComplementaryAreaHeader = ({
-  smallScreenTitle,
   children,
   className,
   toggleButtonProps
@@ -23,18 +22,10 @@ const ComplementaryAreaHeader = ({
     icon: closeSmall,
     ...toggleButtonProps
   });
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsxs("div", {
-      className: "components-panel__header interface-complementary-area-header__small",
-      children: [smallScreenTitle && /*#__PURE__*/_jsx("h2", {
-        className: "interface-complementary-area-header__small-title",
-        children: smallScreenTitle
-      }), toggleButton]
-    }), /*#__PURE__*/_jsxs("div", {
-      className: clsx('components-panel__header', 'interface-complementary-area-header', className),
-      tabIndex: -1,
-      children: [children, toggleButton]
-    })]
+  return /*#__PURE__*/_jsxs("div", {
+    className: clsx('components-panel__header', 'interface-complementary-area-header', className),
+    tabIndex: -1,
+    children: [children, toggleButton]
   });
 };
 export default ComplementaryAreaHeader;