npm - @wordpress/interface - Versions diffs - 5.18.1-next.5a1d1283.0 → 5.19.0 - Mend

@wordpress/interface 5.18.1-next.5a1d1283.0 → 5.19.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 (15) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -2,6 +2,8 @@
 ## Unreleased
+## 5.19.0 (2023-09-20)
 ## 5.18.0 (2023-08-31)
 ## 5.17.0 (2023-08-16)

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

@@ -42,11 +42,13 @@ function ComplementaryAreaSlot({
 function ComplementaryAreaFill({
   scope,
   children,
-  className
+  className,
+  id
 }) {
   return (0, _element.createElement)(_components.Fill, {
     name: `ComplementaryArea/${scope}`
   }, (0, _element.createElement)("div", {
+    id: id,
     className: className
   }, children));
 }
@@ -161,7 +163,8 @@ function ComplementaryArea({
     icon: icon
   }, title), isActive && (0, _element.createElement)(ComplementaryAreaFill, {
     className: (0, _classnames.default)('interface-complementary-area', className),
-    scope: scope
+    scope: scope,
+    id: identifier.replace('/', ':')
   }, (0, _element.createElement)(_complementaryAreaHeader.default, {
     className: headerClassName,
     closeLabel: closeLabel,

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_components","_data","_i18n","_icons","_viewport","_complementaryAreaHeader","_complementaryAreaMoreMenuItem","_complementaryAreaToggle","_complementaryAreaContext","_pinnedItems","_store","ComplementaryAreaSlot","scope","props","createElement","Slot","name","ComplementaryAreaFill","children","className","Fill","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","useRef","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","useDispatch","interfaceStore","useEffect","current","ComplementaryArea","closeLabel","__","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","useSelect","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","Fragment","default","isPressed","label","check","showTooltip","variant","target","classnames","onClose","toggleButtonProps","shortcut","Button","starFilled","starEmpty","onClick","Panel","ComplementaryAreaWrapped","withComplementaryAreaContext","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Button, Panel, Slot, Fill } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\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\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nfunction ComplementaryAreaFill( { scope, children, className } ) {\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<div className={ className }>{ children }</div>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmall = useRef( false );\n\tconst shouldOpenWhenNotSmall = 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 && ! previousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmall.current ) {\n\t\t\tpreviousIsSmall.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\tshowIconLabels = false,\n} ) {\n\tconst { isLoading, isActive, isPinned, activeArea, isSmall, isLarge } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\t\tisItemPinned,\n\t\t\t\t} = select( interfaceStore );\n\n\t\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\t\treturn {\n\t\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\t\tactiveArea: _activeArea,\n\t\t\t\t\tisSmall:\n\t\t\t\t\t\tselect( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ identifier, scope ]\n\t\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}, [\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\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/>\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{ isActive && (\n\t\t\t\t<ComplementaryAreaFill\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'interface-complementary-area',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t>\n\t\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\tidentifier,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<strong>{ title }</strong>\n\t\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisPinned ? starFilled : starEmpty\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tisPinned\n\t\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\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\t/>\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</ComplementaryAreaHeader>\n\t\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t\t</ComplementaryAreaFill>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nconst ComplementaryAreaWrapped =\n\twithComplementaryAreaContext( ComplementaryArea );\n\nComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryAreaWrapped;\n"],"mappings":";;;;;;;AAYA,IAAAA,QAAA,GAAAC,OAAA;AATA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAKA,IAAAG,WAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,MAAA,GAAAN,OAAA;AAEA,IAAAO,SAAA,GAAAP,OAAA;AAKA,IAAAQ,wBAAA,GAAAN,sBAAA,CAAAF,OAAA;AACA,IAAAS,8BAAA,GAAAP,sBAAA,CAAAF,OAAA;AACA,IAAAU,wBAAA,GAAAR,sBAAA,CAAAF,OAAA;AACA,IAAAW,yBAAA,GAAAT,sBAAA,CAAAF,OAAA;AACA,IAAAY,YAAA,GAAAV,sBAAA,CAAAF,OAAA;AACA,IAAAa,MAAA,GAAAb,OAAA;AAvBA;AACA;AACA;;AAGA;AACA;AACA;;AAQA;AACA;AACA;;AAQA,SAASc,qBAAqBA,CAAE;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAG;EACrD,OAAO,IAAAjB,QAAA,CAAAkB,aAAA,EAACd,WAAA,CAAAe,IAAI;IAACC,IAAI,EAAI,qBAAqBJ,KAAO,EAAG;IAAA,GAAMC;EAAK,CAAI,CAAC;AACrE;AAEA,SAASI,qBAAqBA,CAAE;EAAEL,KAAK;EAAEM,QAAQ;EAAEC;AAAU,CAAC,EAAG;EAChE,OACC,IAAAvB,QAAA,CAAAkB,aAAA,EAACd,WAAA,CAAAoB,IAAI;IAACJ,IAAI,EAAI,qBAAqBJ,KAAO;EAAG,GAC5C,IAAAhB,QAAA,CAAAkB,aAAA;IAAKK,SAAS,EAAGA;EAAW,GAAGD,QAAe,CACzC,CAAC;AAET;AAEA,SAASG,8BAA8BA,CACtCT,KAAK,EACLU,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,OAAO,EACN;EACD,MAAMC,eAAe,GAAG,IAAAC,eAAM,EAAE,KAAM,CAAC;EACvC,MAAMC,sBAAsB,GAAG,IAAAD,eAAM,EAAE,KAAM,CAAC;EAC9C,MAAM;IAAEE,uBAAuB;IAAEC;EAAyB,CAAC,GAC1D,IAAAC,iBAAW,EAAEC,YAAe,CAAC;EAC9B,IAAAC,kBAAS,EAAE,MAAM;IAChB;IACA;IACA,IAAKT,QAAQ,IAAIC,OAAO,IAAI,CAAEC,eAAe,CAACQ,OAAO,EAAG;MACvDJ,wBAAwB,CAAElB,KAAM,CAAC;MACjC;MACA;MACAgB,sBAAsB,CAACM,OAAO,GAAG,IAAI;IACtC,CAAC,MAAM;IACN;IACA;IACA;IACAN,sBAAsB,CAACM,OAAO,IAC9B,CAAET,OAAO,IACTC,eAAe,CAACQ,OAAO,EACtB;MACD;MACA;MACAN,sBAAsB,CAACM,OAAO,GAAG,KAAK;MACtCL,uBAAuB,CAAEjB,KAAK,EAAEU,UAAW,CAAC;IAC7C,CAAC,MAAM;IACN;IACA;IACA;IACAM,sBAAsB,CAACM,OAAO,IAC9BX,UAAU,IACVA,UAAU,KAAKD,UAAU,EACxB;MACDM,sBAAsB,CAACM,OAAO,GAAG,KAAK;IACvC;IACA,IAAKT,OAAO,KAAKC,eAAe,CAACQ,OAAO,EAAG;MAC1CR,eAAe,CAACQ,OAAO,GAAGT,OAAO;IAClC;EACD,CAAC,EAAE,CACFD,QAAQ,EACRC,OAAO,EACPb,KAAK,EACLU,UAAU,EACVC,UAAU,EACVO,wBAAwB,EACxBD,uBAAuB,CACtB,CAAC;AACJ;AAEA,SAASM,iBAAiBA,CAAE;EAC3BjB,QAAQ;EACRC,SAAS;EACTiB,UAAU,GAAG,IAAAC,QAAE,EAAE,cAAe,CAAC;EACjCf,UAAU;EACVgB,MAAM;EACNC,eAAe;EACfC,IAAI;EACJC,UAAU,GAAG,IAAI;EACjBC,cAAc;EACd9B,KAAK;EACLI,IAAI;EACJ2B,gBAAgB;EAChBC,KAAK;EACLC,cAAc;EACdC,iBAAiB;EACjBC,cAAc,GAAG;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC,SAAS;IAAExB,QAAQ;IAAEyB,QAAQ;IAAE1B,UAAU;IAAEE,OAAO;IAAEyB;EAAQ,CAAC,GACpE,IAAAC,eAAS,EACNC,MAAM,IAAM;IACb,MAAM;MACLC,0BAA0B;MAC1BC,0BAA0B;MAC1BC;IACD,CAAC,GAAGH,MAAM,CAAEpB,YAAe,CAAC;IAE5B,MAAMwB,WAAW,GAAGH,0BAA0B,CAAEzC,KAAM,CAAC;IAEvD,OAAO;MACNoC,SAAS,EAAEM,0BAA0B,CAAE1C,KAAM,CAAC;MAC9CY,QAAQ,EAAEgC,WAAW,KAAKlC,UAAU;MACpC2B,QAAQ,EAAEM,YAAY,CAAE3C,KAAK,EAAEU,UAAW,CAAC;MAC3CC,UAAU,EAAEiC,WAAW;MACvB/B,OAAO,EACN2B,MAAM,CAAEK,eAAc,CAAC,CAACC,eAAe,CAAE,UAAW,CAAC;MACtDR,OAAO,EAAEE,MAAM,CAAEK,eAAc,CAAC,CAACC,eAAe,CAAE,OAAQ;IAC3D,CAAC;EACF,CAAC,EACD,CAAEpC,UAAU,EAAEV,KAAK,CACpB,CAAC;EACFS,8BAA8B,CAC7BT,KAAK,EACLU,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,OACD,CAAC;EACD,MAAM;IACLI,uBAAuB;IACvBC,wBAAwB;IACxB6B,OAAO;IACPC;EACD,CAAC,GAAG,IAAA7B,iBAAW,EAAEC,YAAe,CAAC;EAEjC,IAAAC,kBAAS,EAAE,MAAM;IAChB;IACA;IACA,IAAKa,iBAAiB,IAAIvB,UAAU,KAAKsC,SAAS,IAAI,CAAEpC,OAAO,EAAG;MACjEI,uBAAuB,CAAEjB,KAAK,EAAEU,UAAW,CAAC;IAC7C,CAAC,MAAM,IAAKC,UAAU,KAAKsC,SAAS,IAAIpC,OAAO,EAAG;MACjDK,wBAAwB,CAAElB,KAAK,EAAEU,UAAW,CAAC;IAC9C;EACD,CAAC,EAAE,CACFC,UAAU,EACVuB,iBAAiB,EACjBlC,KAAK,EACLU,UAAU,EACVG,OAAO,EACPI,uBAAuB,EACvBC,wBAAwB,CACvB,CAAC;EAEH,OACC,IAAAlC,QAAA,CAAAkB,aAAA,EAAAlB,QAAA,CAAAkE,QAAA,QACGrB,UAAU,IACX,IAAA7C,QAAA,CAAAkB,aAAA,EAACL,YAAA,CAAAsD,OAAW;IAACnD,KAAK,EAAGA;EAAO,GACzBqC,QAAQ,IACT,IAAArD,QAAA,CAAAkB,aAAA,EAACP,wBAAA,CAAAwD,OAAuB;IACvBnD,KAAK,EAAGA,KAAO;IACfU,UAAU,EAAGA,UAAY;IACzB0C,SAAS,EACRxC,QAAQ,KAAM,CAAEuB,cAAc,IAAIG,OAAO,CACzC;IACD,iBAAgB1B,QAAU;IAC1B,iBAAgBwB,SAAW;IAC3BiB,KAAK,EAAGrB,KAAO;IACfJ,IAAI,EAAGO,cAAc,GAAGmB,YAAK,GAAG1B,IAAM;IACtC2B,WAAW,EAAG,CAAEpB,cAAgB;IAChCqB,OAAO,EAAGrB,cAAc,GAAG,UAAU,GAAGc;EAAW,CACnD,CAEU,CACb,EACC7C,IAAI,IAAIyB,UAAU,IACnB,IAAA7C,QAAA,CAAAkB,aAAA,EAACR,8BAAA,CAAAyD,OAA6B;IAC7BM,MAAM,EAAGrD,IAAM;IACfJ,KAAK,EAAGA,KAAO;IACf4B,IAAI,EAAGA;EAAM,GAEXI,KAC4B,CAC/B,EACCpB,QAAQ,IACT,IAAA5B,QAAA,CAAAkB,aAAA,EAACG,qBAAqB;IACrBE,SAAS,EAAG,IAAAmD,mBAAU,EACrB,8BAA8B,EAC9BnD,SACD,CAAG;IACHP,KAAK,EAAGA;EAAO,GAEf,IAAAhB,QAAA,CAAAkB,aAAA,EAACT,wBAAA,CAAA0D,OAAuB;IACvB5C,SAAS,EAAGoB,eAAiB;IAC7BH,UAAU,EAAGA,UAAY;IACzBmC,OAAO,EAAGA,CAAA,KAAMzC,wBAAwB,CAAElB,KAAM,CAAG;IACnD+B,gBAAgB,EAAGA,gBAAkB;IACrC6B,iBAAiB,EAAG;MACnBP,KAAK,EAAE7B,UAAU;MACjBqC,QAAQ,EAAE5B,cAAc;MACxBjC,KAAK;MACLU;IACD;EAAG,GAEDgB,MAAM,IACP,IAAA1C,QAAA,CAAAkB,aAAA,EAAAlB,QAAA,CAAAkE,QAAA,QACC,IAAAlE,QAAA,CAAAkB,aAAA,kBAAU8B,KAAe,CAAC,EACxBH,UAAU,IACX,IAAA7C,QAAA,CAAAkB,aAAA,EAACd,WAAA,CAAA0E,MAAM;IACNvD,SAAS,EAAC,8CAA8C;IACxDqB,IAAI,EACHS,QAAQ,GAAG0B,iBAAU,GAAGC,gBACxB;IACDX,KAAK,EACJhB,QAAQ,GACL,IAAAZ,QAAE,EAAE,oBAAqB,CAAC,GAC1B,IAAAA,QAAE,EAAE,gBAAiB,CACxB;IACDwC,OAAO,EAAGA,CAAA,KACT,CAAE5B,QAAQ,GAAGW,SAAS,GAAGD,OAAO,EAC/B/C,KAAK,EACLU,UACD,CACA;IACD0C,SAAS,EAAGf,QAAU;IACtB,iBAAgBA;EAAU,CAC1B,CAED,CAEqB,CAAC,EAC1B,IAAArD,QAAA,CAAAkB,aAAA,EAACd,WAAA,CAAA8E,KAAK;IAAC3D,SAAS,EAAGuB;EAAgB,GAAGxB,QAAiB,CACjC,CAEvB,CAAC;AAEL;AAEA,MAAM6D,wBAAwB,GAC7B,IAAAC,iCAA4B,EAAE7C,iBAAkB,CAAC;AAElD4C,wBAAwB,CAAChE,IAAI,GAAGJ,qBAAqB;AAAC,IAAAsE,QAAA,GAEvCF,wBAAwB;AAAAG,OAAA,CAAAnB,OAAA,GAAAkB,QAAA"}
1	+ {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_components","_data","_i18n","_icons","_viewport","_complementaryAreaHeader","_complementaryAreaMoreMenuItem","_complementaryAreaToggle","_complementaryAreaContext","_pinnedItems","_store","ComplementaryAreaSlot","scope","props","createElement","Slot","name","ComplementaryAreaFill","children","className","id","Fill","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","useRef","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","useDispatch","interfaceStore","useEffect","current","ComplementaryArea","closeLabel","__","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","useSelect","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","Fragment","default","isPressed","label","check","showTooltip","variant","target","classnames","replace","onClose","toggleButtonProps","shortcut","Button","starFilled","starEmpty","onClick","Panel","ComplementaryAreaWrapped","withComplementaryAreaContext","_default","exports"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Button, Panel, Slot, Fill } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\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\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nfunction ComplementaryAreaFill( { scope, children, className, id } ) {\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<div id={ id } className={ className }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmall = useRef( false );\n\tconst shouldOpenWhenNotSmall = 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 && ! previousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmall.current ) {\n\t\t\tpreviousIsSmall.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\tshowIconLabels = false,\n} ) {\n\tconst { isLoading, isActive, isPinned, activeArea, isSmall, isLarge } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\t\tisItemPinned,\n\t\t\t\t} = select( interfaceStore );\n\n\t\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\t\treturn {\n\t\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\t\tactiveArea: _activeArea,\n\t\t\t\t\tisSmall:\n\t\t\t\t\t\tselect( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ identifier, scope ]\n\t\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}, [\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\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/>\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{ isActive && (\n\t\t\t\t<ComplementaryAreaFill\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'interface-complementary-area',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t\t>\n\t\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\tidentifier,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<strong>{ title }</strong>\n\t\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisPinned ? starFilled : starEmpty\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tisPinned\n\t\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\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\t/>\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</ComplementaryAreaHeader>\n\t\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t\t</ComplementaryAreaFill>\n\t\t\t) }\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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"}

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

@@ -35,6 +35,7 @@ function ComplementaryAreaToggle({
   } = (0, _data.useDispatch)(_store.store);
   return (0, _element.createElement)(ComponentToUse, {
     icon: selectedIcon && isSelected ? selectedIcon : icon,
+    "aria-controls": identifier.replace('/', ':'),
     onClick: () => {
       if (isSelected) {
         disableComplementaryArea(scope);

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_components","require","_data","_store","_complementaryAreaContext","_interopRequireDefault","ComplementaryAreaToggle","as","Button","scope","identifier","icon","selectedIcon","name","props","ComponentToUse","isSelected","useSelect","select","interfaceStore","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","useDispatch","_element","createElement","onClick","_default","complementaryAreaContext","exports","default"],"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\nfunction ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier,\n\ticon,\n\tselectedIcon,\n\tname,\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\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\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\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;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA,SAASK,uBAAuBA,CAAE;EACjCC,EAAE,GAAGC,kBAAM;EACXC,KAAK;EACLC,UAAU;EACVC,IAAI;EACJC,YAAY;EACZC,IAAI;EACJ,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGR,EAAE;EACzB,MAAMS,UAAU,GAAG,IAAAC,eAAS,EACzBC,MAAM,IACPA,MAAM,CAAEC,YAAe,CAAC,CAACC,0BAA0B,CAAEX,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EACD,MAAM;IAAEY,uBAAuB;IAAEC;EAAyB,CAAC,GAC1D,IAAAC,iBAAW,EAAEJ,YAAe,CAAC;EAC9B,OACC,IAAAK,QAAA,CAAAC,aAAA,EAACV,cAAc;IACdJ,IAAI,EAAGC,YAAY,IAAII,UAAU,GAAGJ,YAAY,GAAGD,IAAM;~~IACzDe~~,OAAO,EAAGA,CAAA,KAAM;MACf,~~IAAKV~~,UAAU,EAAG;QACjBM,wBAAwB,CAAEb,KAAM,CAAC;MAClC,CAAC,MAAM;QACNY,uBAAuB,CAAEZ,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;IAAA,GACEI;EAAK,CACV,CAAC;AAEJ;AAAC,~~IAAAa~~,QAAA,GAEc,IAAAC,iCAAwB,~~EAAEtB~~,uBAAwB,CAAC;~~AAAAuB~~,OAAA,CAAAC,OAAA,GAAAH,QAAA"}
1	+ {"version":3,"names":["_components","require","_data","_store","_complementaryAreaContext","_interopRequireDefault","ComplementaryAreaToggle","as","Button","scope","identifier","icon","selectedIcon","name","props","ComponentToUse","isSelected","useSelect","select","interfaceStore","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","useDispatch","_element","createElement","replace","onClick","_default","complementaryAreaContext","exports","default"],"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\nfunction ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier,\n\ticon,\n\tselectedIcon,\n\tname,\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\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\n\t\t\taria-controls={ identifier.replace( '/', ':' ) }\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\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;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA,SAASK,uBAAuBA,CAAE;EACjCC,EAAE,GAAGC,kBAAM;EACXC,KAAK;EACLC,UAAU;EACVC,IAAI;EACJC,YAAY;EACZC,IAAI;EACJ,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGR,EAAE;EACzB,MAAMS,UAAU,GAAG,IAAAC,eAAS,EACzBC,MAAM,IACPA,MAAM,CAAEC,YAAe,CAAC,CAACC,0BAA0B,CAAEX,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EACD,MAAM;IAAEY,uBAAuB;IAAEC;EAAyB,CAAC,GAC1D,IAAAC,iBAAW,EAAEJ,YAAe,CAAC;EAC9B,OACC,IAAAK,QAAA,CAAAC,aAAA,EAACV,cAAc;IACdJ,IAAI,EAAGC,YAAY,IAAII,UAAU,GAAGJ,YAAY,GAAGD,IAAM;IACzD,iBAAgBD,UAAU,CAACgB,OAAO,CAAE,GAAG,EAAE,GAAI,CAAG;IAChDC,OAAO,EAAGA,CAAA,KAAM;MACf,IAAKX,UAAU,EAAG;QACjBM,wBAAwB,CAAEb,KAAM,CAAC;MAClC,CAAC,MAAM;QACNY,uBAAuB,CAAEZ,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;IAAA,GACEI;EAAK,CACV,CAAC;AAEJ;AAAC,IAAAc,QAAA,GAEc,IAAAC,iCAAwB,EAAEvB,uBAAwB,CAAC;AAAAwB,OAAA,CAAAC,OAAA,GAAAH,QAAA"}

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

@@ -35,11 +35,13 @@ function ComplementaryAreaSlot({
 function ComplementaryAreaFill({
   scope,
   children,
-  className
+  className,
+  id
 }) {
   return createElement(Fill, {
     name: `ComplementaryArea/${scope}`
   }, createElement("div", {
+    id: id,
     className: className
   }, children));
 }
@@ -154,7 +156,8 @@ function ComplementaryArea({
     icon: icon
   }, title), isActive && createElement(ComplementaryAreaFill, {
     className: classnames('interface-complementary-area', className),
-    scope: scope
+    scope: scope,
+    id: identifier.replace('/', ':')
   }, createElement(ComplementaryAreaHeader, {
     className: headerClassName,
     closeLabel: closeLabel,

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

	@@ -1 +1 @@
1	- {"version":3,"names":["classnames","Button","Panel","Slot","Fill","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","store","viewportStore","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","withComplementaryAreaContext","PinnedItems","interfaceStore","ComplementaryAreaSlot","scope","props","createElement","name","ComplementaryAreaFill","children","className","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","Fragment","isPressed","label","showTooltip","variant","target","onClose","toggleButtonProps","shortcut","onClick","ComplementaryAreaWrapped"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Button, Panel, Slot, Fill } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\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\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nfunction ComplementaryAreaFill( { scope, children, className } ) {\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<div className={ className }>{ children }</div>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmall = useRef( false );\n\tconst shouldOpenWhenNotSmall = 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 && ! previousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmall.current ) {\n\t\t\tpreviousIsSmall.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\tshowIconLabels = false,\n} ) {\n\tconst { isLoading, isActive, isPinned, activeArea, isSmall, isLarge } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\t\tisItemPinned,\n\t\t\t\t} = select( interfaceStore );\n\n\t\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\t\treturn {\n\t\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\t\tactiveArea: _activeArea,\n\t\t\t\t\tisSmall:\n\t\t\t\t\t\tselect( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ identifier, scope ]\n\t\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}, [\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\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/>\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{ isActive && (\n\t\t\t\t<ComplementaryAreaFill\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'interface-complementary-area',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t>\n\t\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\tidentifier,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<strong>{ title }</strong>\n\t\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisPinned ? starFilled : starEmpty\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tisPinned\n\t\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\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\t/>\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</ComplementaryAreaHeader>\n\t\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t\t</ComplementaryAreaFill>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nconst ComplementaryAreaWrapped =\n\twithComplementaryAreaContext( ComplementaryArea );\n\nComplementaryAreaWrapped.Slot = ComplementaryAreaSlot;\n\nexport default ComplementaryAreaWrapped;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,MAAM,EAAEC,KAAK,EAAEC,IAAI,EAAEC,IAAI,QAAQ,uBAAuB;AACjE,SAASC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;AACxD,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,KAAK,EAAEC,SAAS,EAAEC,UAAU,QAAQ,kBAAkB;AAC/D,SAASC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AACtD,SAASC,KAAK,IAAIC,aAAa,QAAQ,qBAAqB;;AAE5D;AACA;AACA;AACA,OAAOC,uBAAuB,MAAM,8BAA8B;AAClE,OAAOC,6BAA6B,MAAM,sCAAsC;AAChF,OAAOC,uBAAuB,MAAM,8BAA8B;AAClE,OAAOC,4BAA4B,MAAM,+BAA+B;AACxE,OAAOC,WAAW,MAAM,iBAAiB;AACzC,SAASN,KAAK,IAAIO,cAAc,QAAQ,aAAa;AAErD,SAASC,qBAAqBA,CAAE;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAG;EACrD,OAAOC,aAAA,CAACrB,IAAI;IAACsB,IAAI,EAAI,qBAAqBH,KAAO,EAAG;IAAA,GAAMC;EAAK,CAAI,CAAC;AACrE;AAEA,SAASG,qBAAqBA,CAAE;EAAEJ,KAAK;EAAEK,QAAQ;EAAEC;AAAU,CAAC,EAAG;EAChE,OACCJ,aAAA,CAACpB,IAAI;IAACqB,IAAI,EAAI,qBAAqBH,KAAO;EAAG,GAC5CE,aAAA;IAAKI,SAAS,EAAGA;EAAW,GAAGD,QAAe,CACzC,CAAC;AAET;AAEA,SAASE,8BAA8BA,CACtCP,KAAK,EACLQ,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,OAAO,EACN;EACD,MAAMC,eAAe,GAAGtB,MAAM,CAAE,KAAM,CAAC;EACvC,MAAMuB,sBAAsB,GAAGvB,MAAM,CAAE,KAAM,CAAC;EAC9C,MAAM;IAAEwB,uBAAuB;IAAEC;EAAyB,CAAC,GAC1DhC,WAAW,CAAEe,cAAe,CAAC;EAC9BT,SAAS,CAAE,MAAM;IAChB;IACA;IACA,IAAKqB,QAAQ,IAAIC,OAAO,IAAI,CAAEC,eAAe,CAACI,OAAO,EAAG;MACvDD,wBAAwB,CAAEf,KAAM,CAAC;MACjC;MACA;MACAa,sBAAsB,CAACG,OAAO,GAAG,IAAI;IACtC,CAAC,MAAM;IACN;IACA;IACA;IACAH,sBAAsB,CAACG,OAAO,IAC9B,CAAEL,OAAO,IACTC,eAAe,CAACI,OAAO,EACtB;MACD;MACA;MACAH,sBAAsB,CAACG,OAAO,GAAG,KAAK;MACtCF,uBAAuB,CAAEd,KAAK,EAAEQ,UAAW,CAAC;IAC7C,CAAC,MAAM;IACN;IACA;IACA;IACAK,sBAAsB,CAACG,OAAO,IAC9BP,UAAU,IACVA,UAAU,KAAKD,UAAU,EACxB;MACDK,sBAAsB,CAACG,OAAO,GAAG,KAAK;IACvC;IACA,IAAKL,OAAO,KAAKC,eAAe,CAACI,OAAO,EAAG;MAC1CJ,eAAe,CAACI,OAAO,GAAGL,OAAO;IAClC;EACD,CAAC,EAAE,CACFD,QAAQ,EACRC,OAAO,EACPX,KAAK,EACLQ,UAAU,EACVC,UAAU,EACVM,wBAAwB,EACxBD,uBAAuB,CACtB,CAAC;AACJ;AAEA,SAASG,iBAAiBA,CAAE;EAC3BZ,QAAQ;EACRC,SAAS;EACTY,UAAU,GAAGjC,EAAE,CAAE,cAAe,CAAC;EACjCuB,UAAU;EACVW,MAAM;EACNC,eAAe;EACfC,IAAI;EACJC,UAAU,GAAG,IAAI;EACjBC,cAAc;EACdvB,KAAK;EACLG,IAAI;EACJqB,gBAAgB;EAChBC,KAAK;EACLC,cAAc;EACdC,iBAAiB;EACjBC,cAAc,GAAG;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC,SAAS;IAAEnB,QAAQ;IAAEoB,QAAQ;IAAErB,UAAU;IAAEE,OAAO;IAAEoB;EAAQ,CAAC,GACpE/C,SAAS,CACNgD,MAAM,IAAM;IACb,MAAM;MACLC,0BAA0B;MAC1BC,0BAA0B;MAC1BC;IACD,CAAC,GAAGH,MAAM,CAAElC,cAAe,CAAC;IAE5B,MAAMsC,WAAW,GAAGH,0BAA0B,CAAEjC,KAAM,CAAC;IAEvD,OAAO;MACN6B,SAAS,EAAEK,0BAA0B,CAAElC,KAAM,CAAC;MAC9CU,QAAQ,EAAE0B,WAAW,KAAK5B,UAAU;MACpCsB,QAAQ,EAAEK,YAAY,CAAEnC,KAAK,EAAEQ,UAAW,CAAC;MAC3CC,UAAU,EAAE2B,WAAW;MACvBzB,OAAO,EACNqB,MAAM,CAAExC,aAAc,CAAC,CAAC6C,eAAe,CAAE,UAAW,CAAC;MACtDN,OAAO,EAAEC,MAAM,CAAExC,aAAc,CAAC,CAAC6C,eAAe,CAAE,OAAQ;IAC3D,CAAC;EACF,CAAC,EACD,CAAE7B,UAAU,EAAER,KAAK,CACpB,CAAC;EACFO,8BAA8B,CAC7BP,KAAK,EACLQ,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,OACD,CAAC;EACD,MAAM;IACLG,uBAAuB;IACvBC,wBAAwB;IACxBuB,OAAO;IACPC;EACD,CAAC,GAAGxD,WAAW,CAAEe,cAAe,CAAC;EAEjCT,SAAS,CAAE,MAAM;IAChB;IACA;IACA,IAAKsC,iBAAiB,IAAIlB,UAAU,KAAK+B,SAAS,IAAI,CAAE7B,OAAO,EAAG;MACjEG,uBAAuB,CAAEd,KAAK,EAAEQ,UAAW,CAAC;IAC7C,CAAC,MAAM,IAAKC,UAAU,KAAK+B,SAAS,IAAI7B,OAAO,EAAG;MACjDI,wBAAwB,CAAEf,KAAK,EAAEQ,UAAW,CAAC;IAC9C;EACD,CAAC,EAAE,CACFC,UAAU,EACVkB,iBAAiB,EACjB3B,KAAK,EACLQ,UAAU,EACVG,OAAO,EACPG,uBAAuB,EACvBC,wBAAwB,CACvB,CAAC;EAEH,OACCb,aAAA,CAAAuC,QAAA,QACGnB,UAAU,IACXpB,aAAA,CAACL,WAAW;IAACG,KAAK,EAAGA;EAAO,GACzB8B,QAAQ,IACT5B,aAAA,CAACP,uBAAuB;IACvBK,KAAK,EAAGA,KAAO;IACfQ,UAAU,EAAGA,UAAY;IACzBkC,SAAS,EACRhC,QAAQ,KAAM,CAAEkB,cAAc,IAAIG,OAAO,CACzC;IACD,iBAAgBrB,QAAU;IAC1B,iBAAgBmB,SAAW;IAC3Bc,KAAK,EAAGlB,KAAO;IACfJ,IAAI,EAAGO,cAAc,GAAG1C,KAAK,GAAGmC,IAAM;IACtCuB,WAAW,EAAG,CAAEhB,cAAgB;IAChCiB,OAAO,EAAGjB,cAAc,GAAG,UAAU,GAAGY;EAAW,CACnD,CAEU,CACb,EACCrC,IAAI,IAAImB,UAAU,IACnBpB,aAAA,CAACR,6BAA6B;IAC7BoD,MAAM,EAAG3C,IAAM;IACfH,KAAK,EAAGA,KAAO;IACfqB,IAAI,EAAGA;EAAM,GAEXI,KAC4B,CAC/B,EACCf,QAAQ,IACTR,aAAA,CAACE,qBAAqB;IACrBE,SAAS,EAAG5B,UAAU,CACrB,8BAA8B,EAC9B4B,SACD,CAAG;IACHN,KAAK,EAAGA;EAAO,GAEfE,aAAA,CAACT,uBAAuB;IACvBa,SAAS,EAAGc,eAAiB;IAC7BF,UAAU,EAAGA,UAAY;IACzB6B,OAAO,EAAGA,CAAA,KAAMhC,wBAAwB,CAAEf,KAAM,CAAG;IACnDwB,gBAAgB,EAAGA,gBAAkB;IACrCwB,iBAAiB,EAAG;MACnBL,KAAK,EAAEzB,UAAU;MACjB+B,QAAQ,EAAEvB,cAAc;MACxB1B,KAAK;MACLQ;IACD;EAAG,GAEDW,MAAM,IACPjB,aAAA,CAAAuC,QAAA,QACCvC,aAAA,iBAAUuB,KAAe,CAAC,EACxBH,UAAU,IACXpB,aAAA,CAACvB,MAAM;IACN2B,SAAS,EAAC,8CAA8C;IACxDe,IAAI,EACHS,QAAQ,GAAG1C,UAAU,GAAGD,SACxB;IACDwD,KAAK,EACJb,QAAQ,GACL7C,EAAE,CAAE,oBAAqB,CAAC,GAC1BA,EAAE,CAAE,gBAAiB,CACxB;IACDiE,OAAO,EAAGA,CAAA,KACT,CAAEpB,QAAQ,GAAGS,SAAS,GAAGD,OAAO,EAC/BtC,KAAK,EACLQ,UACD,CACA;IACDkC,SAAS,EAAGZ,QAAU;IACtB,iBAAgBA;EAAU,CAC1B,CAED,CAEqB,CAAC,EAC1B5B,aAAA,CAACtB,KAAK;IAAC0B,SAAS,EAAGiB;EAAgB,GAAGlB,QAAiB,CACjC,CAEvB,CAAC;AAEL;AAEA,MAAM8C,wBAAwB,GAC7BvD,4BAA4B,CAAEqB,iBAAkB,CAAC;AAElDkC,wBAAwB,CAACtE,IAAI,GAAGkB,qBAAqB;AAErD,eAAeoD,wBAAwB"}
1	+ {"version":3,"names":["classnames","Button","Panel","Slot","Fill","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","store","viewportStore","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","withComplementaryAreaContext","PinnedItems","interfaceStore","ComplementaryAreaSlot","scope","props","createElement","name","ComplementaryAreaFill","children","className","id","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","Fragment","isPressed","label","showTooltip","variant","target","replace","onClose","toggleButtonProps","shortcut","onClick","ComplementaryAreaWrapped"],"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Button, Panel, Slot, Fill } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { check, starEmpty, starFilled } from '@wordpress/icons';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { store as viewportStore } from '@wordpress/viewport';\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\nfunction ComplementaryAreaSlot( { scope, ...props } ) {\n\treturn <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;\n}\n\nfunction ComplementaryAreaFill( { scope, children, className, id } ) {\n\treturn (\n\t\t<Fill name={ `ComplementaryArea/${ scope }` }>\n\t\t\t<div id={ id } className={ className }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</Fill>\n\t);\n}\n\nfunction useAdjustComplementaryListener(\n\tscope,\n\tidentifier,\n\tactiveArea,\n\tisActive,\n\tisSmall\n) {\n\tconst previousIsSmall = useRef( false );\n\tconst shouldOpenWhenNotSmall = 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 && ! previousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\t! isSmall &&\n\t\t\tpreviousIsSmall.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\tshouldOpenWhenNotSmall.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\tshouldOpenWhenNotSmall.current &&\n\t\t\tactiveArea &&\n\t\t\tactiveArea !== identifier\n\t\t) {\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t}\n\t\tif ( isSmall !== previousIsSmall.current ) {\n\t\t\tpreviousIsSmall.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\tshowIconLabels = false,\n} ) {\n\tconst { isLoading, isActive, isPinned, activeArea, isSmall, isLarge } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst {\n\t\t\t\t\tgetActiveComplementaryArea,\n\t\t\t\t\tisComplementaryAreaLoading,\n\t\t\t\t\tisItemPinned,\n\t\t\t\t} = select( interfaceStore );\n\n\t\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\n\t\t\t\treturn {\n\t\t\t\t\tisLoading: isComplementaryAreaLoading( scope ),\n\t\t\t\t\tisActive: _activeArea === identifier,\n\t\t\t\t\tisPinned: isItemPinned( scope, identifier ),\n\t\t\t\t\tactiveArea: _activeArea,\n\t\t\t\t\tisSmall:\n\t\t\t\t\t\tselect( viewportStore ).isViewportMatch( '< medium' ),\n\t\t\t\t\tisLarge: select( viewportStore ).isViewportMatch( 'large' ),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ identifier, scope ]\n\t\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}, [\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\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/>\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{ isActive && (\n\t\t\t\t<ComplementaryAreaFill\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'interface-complementary-area',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tscope={ scope }\n\t\t\t\t\tid={ identifier.replace( '/', ':' ) }\n\t\t\t\t>\n\t\t\t\t\t<ComplementaryAreaHeader\n\t\t\t\t\t\tclassName={ headerClassName }\n\t\t\t\t\t\tcloseLabel={ closeLabel }\n\t\t\t\t\t\tonClose={ () => disableComplementaryArea( scope ) }\n\t\t\t\t\t\tsmallScreenTitle={ smallScreenTitle }\n\t\t\t\t\t\ttoggleButtonProps={ {\n\t\t\t\t\t\t\tlabel: closeLabel,\n\t\t\t\t\t\t\tshortcut: toggleShortcut,\n\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\tidentifier,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ header \|\| (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<strong>{ title }</strong>\n\t\t\t\t\t\t\t\t{ isPinnable && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"interface-complementary-area__pin-unpin-item\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisPinned ? starFilled : starEmpty\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tisPinned\n\t\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\t: __( 'Pin to toolbar' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\t( isPinned ? unpinItem : pinItem )(\n\t\t\t\t\t\t\t\t\t\t\t\tscope,\n\t\t\t\t\t\t\t\t\t\t\t\tidentifier\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isPinned }\n\t\t\t\t\t\t\t\t\t\taria-expanded={ isPinned }\n\t\t\t\t\t\t\t\t\t/>\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</ComplementaryAreaHeader>\n\t\t\t\t\t<Panel className={ panelClassName }>{ children }</Panel>\n\t\t\t\t</ComplementaryAreaFill>\n\t\t\t) }\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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"}

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

@@ -27,6 +27,7 @@ function ComplementaryAreaToggle({
   } = useDispatch(interfaceStore);
   return createElement(ComponentToUse, {
     icon: selectedIcon && isSelected ? selectedIcon : icon,
+    "aria-controls": identifier.replace('/', ':'),
     onClick: () => {
       if (isSelected) {
         disableComplementaryArea(scope);

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

	@@ -1 +1 @@
1	- {"version":3,"names":["Button","useDispatch","useSelect","store","interfaceStore","complementaryAreaContext","ComplementaryAreaToggle","as","scope","identifier","icon","selectedIcon","name","props","ComponentToUse","isSelected","select","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","createElement","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';\n\n/\n Internal dependencies\n */\nimport { store as interfaceStore } from '../../store';\nimport complementaryAreaContext from '../complementary-area-context';\n\nfunction ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier,\n\ticon,\n\tselectedIcon,\n\tname,\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\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\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\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default complementaryAreaContext( ComplementaryAreaToggle );\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;;AAExD;AACA;AACA;AACA,SAASC,KAAK,IAAIC,cAAc,QAAQ,aAAa;AACrD,OAAOC,wBAAwB,MAAM,+BAA+B;AAEpE,SAASC,uBAAuBA,CAAE;EACjCC,EAAE,GAAGP,MAAM;EACXQ,KAAK;EACLC,UAAU;EACVC,IAAI;EACJC,YAAY;EACZC,IAAI;EACJ,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGP,EAAE;EACzB,MAAMQ,UAAU,GAAGb,SAAS,CACzBc,MAAM,IACPA,MAAM,CAAEZ,cAAe,CAAC,CAACa,0BAA0B,CAAET,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EACD,MAAM;IAAEU,uBAAuB;IAAEC;EAAyB,CAAC,GAC1DlB,WAAW,CAAEG,cAAe,CAAC;EAC9B,OACCgB,aAAA,CAACN,cAAc;IACdJ,IAAI,EAAGC,YAAY,IAAII,UAAU,GAAGJ,YAAY,GAAGD,IAAM;~~IACzDW~~,OAAO,EAAGA,CAAA,KAAM;MACf,~~IAAKN~~,UAAU,EAAG;QACjBI,wBAAwB,CAAEX,KAAM,CAAC;MAClC,CAAC,MAAM;QACNU,uBAAuB,CAAEV,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;IAAA,GACEI;EAAK,CACV,CAAC;AAEJ;AAEA,eAAeR,wBAAwB,CAAEC,uBAAwB,CAAC"}
1	+ {"version":3,"names":["Button","useDispatch","useSelect","store","interfaceStore","complementaryAreaContext","ComplementaryAreaToggle","as","scope","identifier","icon","selectedIcon","name","props","ComponentToUse","isSelected","select","getActiveComplementaryArea","enableComplementaryArea","disableComplementaryArea","createElement","replace","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';\n\n/\n Internal dependencies\n */\nimport { store as interfaceStore } from '../../store';\nimport complementaryAreaContext from '../complementary-area-context';\n\nfunction ComplementaryAreaToggle( {\n\tas = Button,\n\tscope,\n\tidentifier,\n\ticon,\n\tselectedIcon,\n\tname,\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\tconst { enableComplementaryArea, disableComplementaryArea } =\n\t\tuseDispatch( interfaceStore );\n\treturn (\n\t\t<ComponentToUse\n\t\t\ticon={ selectedIcon && isSelected ? selectedIcon : icon }\n\t\t\taria-controls={ identifier.replace( '/', ':' ) }\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\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default complementaryAreaContext( ComplementaryAreaToggle );\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;;AAExD;AACA;AACA;AACA,SAASC,KAAK,IAAIC,cAAc,QAAQ,aAAa;AACrD,OAAOC,wBAAwB,MAAM,+BAA+B;AAEpE,SAASC,uBAAuBA,CAAE;EACjCC,EAAE,GAAGP,MAAM;EACXQ,KAAK;EACLC,UAAU;EACVC,IAAI;EACJC,YAAY;EACZC,IAAI;EACJ,GAAGC;AACJ,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGP,EAAE;EACzB,MAAMQ,UAAU,GAAGb,SAAS,CACzBc,MAAM,IACPA,MAAM,CAAEZ,cAAe,CAAC,CAACa,0BAA0B,CAAET,KAAM,CAAC,KAC5DC,UAAU,EACX,CAAEA,UAAU,EAAED,KAAK,CACpB,CAAC;EACD,MAAM;IAAEU,uBAAuB;IAAEC;EAAyB,CAAC,GAC1DlB,WAAW,CAAEG,cAAe,CAAC;EAC9B,OACCgB,aAAA,CAACN,cAAc;IACdJ,IAAI,EAAGC,YAAY,IAAII,UAAU,GAAGJ,YAAY,GAAGD,IAAM;IACzD,iBAAgBD,UAAU,CAACY,OAAO,CAAE,GAAG,EAAE,GAAI,CAAG;IAChDC,OAAO,EAAGA,CAAA,KAAM;MACf,IAAKP,UAAU,EAAG;QACjBI,wBAAwB,CAAEX,KAAM,CAAC;MAClC,CAAC,MAAM;QACNU,uBAAuB,CAAEV,KAAK,EAAEC,UAAW,CAAC;MAC7C;IACD,CAAG;IAAA,GACEI;EAAK,CACV,CAAC;AAEJ;AAEA,eAAeR,wBAAwB,CAAEC,uBAAwB,CAAC"}

package/build-style/style-rtl.css CHANGED Viewed

@@ -475,7 +475,7 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   display: none;
   margin: 0;
 }
-.interface-pinned-items .components-button:nth-last-child(1), .interface-pinned-items .components-button:nth-last-child(2) {
+.interface-pinned-items .components-button[aria-controls="edit-post:document"], .interface-pinned-items .components-button[aria-controls="edit-post:block"], .interface-pinned-items .components-button[aria-controls="edit-site:template"], .interface-pinned-items .components-button[aria-controls="edit-site:block-inspector"], .interface-pinned-items .components-button[aria-controls="edit-site:global-styles"] {
   display: flex;
 }
 .interface-pinned-items .components-button svg {

package/build-style/style.css CHANGED Viewed

@@ -475,7 +475,7 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   display: none;
   margin: 0;
 }
-.interface-pinned-items .components-button:nth-last-child(1), .interface-pinned-items .components-button:nth-last-child(2) {
+.interface-pinned-items .components-button[aria-controls="edit-post:document"], .interface-pinned-items .components-button[aria-controls="edit-post:block"], .interface-pinned-items .components-button[aria-controls="edit-site:template"], .interface-pinned-items .components-button[aria-controls="edit-site:block-inspector"], .interface-pinned-items .components-button[aria-controls="edit-site:global-styles"] {
   display: flex;
 }
 .interface-pinned-items .components-button svg {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/interface",
-	"version": "5.18.1-next.5a1d1283.0",
+	"version": "5.19.0",
 	"description": "Interface module for WordPress. The package contains shared functionality across the modern JavaScript-based WordPress screens.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -32,17 +32,17 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.41.1-next.5a1d1283.0",
-		"@wordpress/components": "^26.0.1-next.5a1d1283.0",
-		"@wordpress/compose": "^6.18.1-next.5a1d1283.0",
-		"@wordpress/data": "^9.11.1-next.5a1d1283.0",
-		"@wordpress/deprecated": "^3.41.1-next.5a1d1283.0",
-		"@wordpress/element": "^5.18.1-next.5a1d1283.0",
-		"@wordpress/i18n": "^4.41.1-next.5a1d1283.0",
-		"@wordpress/icons": "^9.32.1-next.5a1d1283.0",
-		"@wordpress/plugins": "^6.9.1-next.5a1d1283.0",
-		"@wordpress/preferences": "^3.18.1-next.5a1d1283.0",
-		"@wordpress/viewport": "^5.18.1-next.5a1d1283.0",
+		"@wordpress/a11y": "^3.42.0",
+		"@wordpress/components": "^25.8.0",
+		"@wordpress/compose": "^6.19.0",
+		"@wordpress/data": "^9.12.0",
+		"@wordpress/deprecated": "^3.42.0",
+		"@wordpress/element": "^5.19.0",
+		"@wordpress/i18n": "^4.42.0",
+		"@wordpress/icons": "^9.33.0",
+		"@wordpress/plugins": "^6.10.0",
+		"@wordpress/preferences": "^3.19.0",
+		"@wordpress/viewport": "^5.19.0",
 		"classnames": "^2.3.1"
 	},
 	"peerDependencies": {
@@ -52,5 +52,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "fa0b66987dab5a15f38663e06036d09bccffaa4b"
+	"gitHead": "cc35f517ed017ab7131319af3e87c359e8de175d"
 }

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

@@ -27,10 +27,12 @@ function ComplementaryAreaSlot( { scope, ...props } ) {
 	return <Slot name={ `ComplementaryArea/${ scope }` } { ...props } />;
 }
-function ComplementaryAreaFill( { scope, children, className } ) {
+function ComplementaryAreaFill( { scope, children, className, id } ) {
 	return (
 		<Fill name={ `ComplementaryArea/${ scope }` }>
-			<div className={ className }>{ children }</div>
+			<div id={ id } className={ className }>
+				{ children }
+			</div>
 		</Fill>
 	);
 }
@@ -200,6 +202,7 @@ function ComplementaryArea( {
 						className
 					) }
 					scope={ scope }
+					id={ identifier.replace( '/', ':' ) }
 				>
 					<ComplementaryAreaHeader
 						className={ headerClassName }

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

@@ -31,6 +31,7 @@ function ComplementaryAreaToggle( {
 	return (
 		<ComponentToUse
 			icon={ selectedIcon && isSelected ? selectedIcon : icon }
+			aria-controls={ identifier.replace( '/', ':' ) }
 			onClick={ () => {
 				if ( isSelected ) {
 					disableComplementaryArea( scope );

package/src/components/pinned-items/style.scss CHANGED Viewed

@@ -7,8 +7,11 @@
 		display: none;
 		margin: 0;
-		&:nth-last-child(1),
-		&:nth-last-child(2) {
+		&[aria-controls="edit-post:document"],
+		&[aria-controls="edit-post:block"],
+		&[aria-controls="edit-site:template"],
+		&[aria-controls="edit-site:block-inspector"],
+		&[aria-controls="edit-site:global-styles"] {
 			display: flex;
 		}