@wordpress/interface 5.3.2 → 5.4.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.
- package/CHANGELOG.md +2 -0
- package/build/components/complementary-area/index.js +21 -10
- package/build/components/complementary-area/index.js.map +1 -1
- package/build/store/selectors.js +11 -3
- package/build/store/selectors.js.map +1 -1
- package/build-module/components/complementary-area/index.js +21 -10
- package/build-module/components/complementary-area/index.js.map +1 -1
- package/build-module/store/selectors.js +8 -1
- package/build-module/store/selectors.js.map +1 -1
- package/package.json +13 -13
- package/src/components/complementary-area/index.js +40 -24
- package/src/store/selectors.js +13 -1
package/CHANGELOG.md
CHANGED
|
@@ -77,21 +77,24 @@ function useAdjustComplementaryListener(scope, identifier, activeArea, isActive,
|
|
|
77
77
|
disableComplementaryArea
|
|
78
78
|
} = (0, _data.useDispatch)(_store.store);
|
|
79
79
|
(0, _element.useEffect)(() => {
|
|
80
|
-
// If the complementary area is active and the editor is switching from
|
|
80
|
+
// If the complementary area is active and the editor is switching from
|
|
81
|
+
// a big to a small window size.
|
|
81
82
|
if (isActive && isSmall && !previousIsSmall.current) {
|
|
82
|
-
//
|
|
83
|
-
|
|
83
|
+
disableComplementaryArea(scope); // Flag the complementary area to be reopened when the window size
|
|
84
|
+
// goes from small to big.
|
|
84
85
|
|
|
85
86
|
shouldOpenWhenNotSmall.current = true;
|
|
86
|
-
} else if ( // If there is a flag indicating the complementary area should be
|
|
87
|
-
//
|
|
87
|
+
} else if ( // If there is a flag indicating the complementary area should be
|
|
88
|
+
// enabled when we go from small to big window size and we are going
|
|
89
|
+
// from a small to big window size.
|
|
88
90
|
shouldOpenWhenNotSmall.current && !isSmall && previousIsSmall.current) {
|
|
89
|
-
// Remove the flag indicating the complementary area should be
|
|
90
|
-
|
|
91
|
-
|
|
91
|
+
// Remove the flag indicating the complementary area should be
|
|
92
|
+
// enabled.
|
|
93
|
+
shouldOpenWhenNotSmall.current = false;
|
|
92
94
|
enableComplementaryArea(scope, identifier);
|
|
93
|
-
} else if ( // If the flag is indicating the current complementary should be
|
|
94
|
-
//
|
|
95
|
+
} else if ( // If the flag is indicating the current complementary should be
|
|
96
|
+
// reopened but another complementary area becomes active, remove
|
|
97
|
+
// the flag.
|
|
95
98
|
shouldOpenWhenNotSmall.current && activeArea && activeArea !== identifier) {
|
|
96
99
|
shouldOpenWhenNotSmall.current = false;
|
|
97
100
|
}
|
|
@@ -122,6 +125,7 @@ function ComplementaryArea(_ref3) {
|
|
|
122
125
|
showIconLabels = false
|
|
123
126
|
} = _ref3;
|
|
124
127
|
const {
|
|
128
|
+
isLoading,
|
|
125
129
|
isActive,
|
|
126
130
|
isPinned,
|
|
127
131
|
activeArea,
|
|
@@ -130,12 +134,14 @@ function ComplementaryArea(_ref3) {
|
|
|
130
134
|
} = (0, _data.useSelect)(select => {
|
|
131
135
|
const {
|
|
132
136
|
getActiveComplementaryArea,
|
|
137
|
+
isComplementaryAreaLoading,
|
|
133
138
|
isItemPinned
|
|
134
139
|
} = select(_store.store);
|
|
135
140
|
|
|
136
141
|
const _activeArea = getActiveComplementaryArea(scope);
|
|
137
142
|
|
|
138
143
|
return {
|
|
144
|
+
isLoading: isComplementaryAreaLoading(scope),
|
|
139
145
|
isActive: _activeArea === identifier,
|
|
140
146
|
isPinned: isItemPinned(scope, identifier),
|
|
141
147
|
activeArea: _activeArea,
|
|
@@ -151,8 +157,12 @@ function ComplementaryArea(_ref3) {
|
|
|
151
157
|
unpinItem
|
|
152
158
|
} = (0, _data.useDispatch)(_store.store);
|
|
153
159
|
(0, _element.useEffect)(() => {
|
|
160
|
+
// Set initial visibility: For large screens, enable if it's active by
|
|
161
|
+
// default. For small screens, always initially disable.
|
|
154
162
|
if (isActiveByDefault && activeArea === undefined && !isSmall) {
|
|
155
163
|
enableComplementaryArea(scope, identifier);
|
|
164
|
+
} else if (activeArea === undefined && isSmall) {
|
|
165
|
+
disableComplementaryArea(scope, identifier);
|
|
156
166
|
}
|
|
157
167
|
}, [activeArea, isActiveByDefault, scope, identifier, isSmall]);
|
|
158
168
|
return (0, _element.createElement)(_element.Fragment, null, isPinnable && (0, _element.createElement)(_pinnedItems.default, {
|
|
@@ -162,6 +172,7 @@ function ComplementaryArea(_ref3) {
|
|
|
162
172
|
identifier: identifier,
|
|
163
173
|
isPressed: isActive && (!showIconLabels || isLarge),
|
|
164
174
|
"aria-expanded": isActive,
|
|
175
|
+
"aria-disabled": isLoading,
|
|
165
176
|
label: title,
|
|
166
177
|
icon: showIconLabels ? _icons.check : icon,
|
|
167
178
|
showTooltip: !showIconLabels,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"names":["ComplementaryAreaSlot","scope","props","ComplementaryAreaFill","children","className","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","interfaceStore","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","name","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isPinned","isLarge","select","getActiveComplementaryArea","isItemPinned","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","check","label","shortcut","starFilled","starEmpty","ComplementaryAreaWrapped","Slot"],"mappings":"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","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 a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmall.current ) {\n\t\t\t// Disable the complementary area.\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size 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 enabled when we go from small to big window size\n\t\t\t// and we are going 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 enabled.\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t\t// Enable the complementary area.\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 reopened but another complementary area becomes active,\n\t\t\t// remove 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}, [ isActive, isSmall, scope, identifier, activeArea ] );\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 { isActive, isPinned, activeArea, isSmall, isLarge } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getActiveComplementaryArea, isItemPinned } =\n\t\t\t\tselect( interfaceStore );\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\t\t\treturn {\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};\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\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t}\n\t}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] );\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\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"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"names":["ComplementaryAreaSlot","scope","props","ComplementaryAreaFill","children","className","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","interfaceStore","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","name","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","viewportStore","isViewportMatch","pinItem","unpinItem","undefined","check","label","shortcut","starFilled","starEmpty","ComplementaryAreaWrapped","Slot"],"mappings":";;;;;;;;;AAYA;;;;AATA;;AAKA;;AACA;;AACA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAvBA;AACA;AACA;;AAGA;AACA;AACA;;AAQA;AACA;AACA;AAQA,SAASA,qBAAT,OAAsD;AAAA,MAAtB;AAAEC,IAAAA,KAAF;AAAS,OAAGC;AAAZ,GAAsB;AACrD,SAAO,4BAAC,gBAAD;AAAM,IAAA,IAAI,EAAI,qBAAqBD,KAAO;AAA1C,KAAmDC,KAAnD,EAAP;AACA;;AAED,SAASC,qBAAT,QAAiE;AAAA,MAAjC;AAAEF,IAAAA,KAAF;AAASG,IAAAA,QAAT;AAAmBC,IAAAA;AAAnB,GAAiC;AAChE,SACC,4BAAC,gBAAD;AAAM,IAAA,IAAI,EAAI,qBAAqBJ,KAAO;AAA1C,KACC;AAAK,IAAA,SAAS,EAAGI;AAAjB,KAA+BD,QAA/B,CADD,CADD;AAKA;;AAED,SAASE,8BAAT,CACCL,KADD,EAECM,UAFD,EAGCC,UAHD,EAICC,QAJD,EAKCC,OALD,EAME;AACD,QAAMC,eAAe,GAAG,qBAAQ,KAAR,CAAxB;AACA,QAAMC,sBAAsB,GAAG,qBAAQ,KAAR,CAA/B;AACA,QAAM;AAAEC,IAAAA,uBAAF;AAA2BC,IAAAA;AAA3B,MACL,uBAAaC,YAAb,CADD;AAEA,0BAAW,MAAM;AAChB;AACA;AACA,QAAKN,QAAQ,IAAIC,OAAZ,IAAuB,CAAEC,eAAe,CAACK,OAA9C,EAAwD;AACvDF,MAAAA,wBAAwB,CAAEb,KAAF,CAAxB,CADuD,CAEvD;AACA;;AACAW,MAAAA,sBAAsB,CAACI,OAAvB,GAAiC,IAAjC;AACA,KALD,MAKO,KACN;AACA;AACA;AACAJ,IAAAA,sBAAsB,CAACI,OAAvB,IACA,CAAEN,OADF,IAEAC,eAAe,CAACK,OANV,EAOL;AACD;AACA;AACAJ,MAAAA,sBAAsB,CAACI,OAAvB,GAAiC,KAAjC;AACAH,MAAAA,uBAAuB,CAAEZ,KAAF,EAASM,UAAT,CAAvB;AACA,KAZM,MAYA,KACN;AACA;AACA;AACAK,IAAAA,sBAAsB,CAACI,OAAvB,IACAR,UADA,IAEAA,UAAU,KAAKD,UANT,EAOL;AACDK,MAAAA,sBAAsB,CAACI,OAAvB,GAAiC,KAAjC;AACA;;AACD,QAAKN,OAAO,KAAKC,eAAe,CAACK,OAAjC,EAA2C;AAC1CL,MAAAA,eAAe,CAACK,OAAhB,GAA0BN,OAA1B;AACA;AACD,GAjCD,EAiCG,CAAED,QAAF,EAAYC,OAAZ,EAAqBT,KAArB,EAA4BM,UAA5B,EAAwCC,UAAxC,CAjCH;AAkCA;;AAED,SAASS,iBAAT,QAiBI;AAAA,MAjBwB;AAC3Bb,IAAAA,QAD2B;AAE3BC,IAAAA,SAF2B;AAG3Ba,IAAAA,UAAU,GAAG,cAAI,cAAJ,CAHc;AAI3BX,IAAAA,UAJ2B;AAK3BY,IAAAA,MAL2B;AAM3BC,IAAAA,eAN2B;AAO3BC,IAAAA,IAP2B;AAQ3BC,IAAAA,UAAU,GAAG,IARc;AAS3BC,IAAAA,cAT2B;AAU3BtB,IAAAA,KAV2B;AAW3BuB,IAAAA,IAX2B;AAY3BC,IAAAA,gBAZ2B;AAa3BC,IAAAA,KAb2B;AAc3BC,IAAAA,cAd2B;AAe3BC,IAAAA,iBAf2B;AAgB3BC,IAAAA,cAAc,GAAG;AAhBU,GAiBxB;AACH,QAAM;AAAEC,IAAAA,SAAF;AAAarB,IAAAA,QAAb;AAAuBsB,IAAAA,QAAvB;AAAiCvB,IAAAA,UAAjC;AAA6CE,IAAAA,OAA7C;AAAsDsB,IAAAA;AAAtD,MACL,qBACGC,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,0BADK;AAELC,MAAAA,0BAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAElB,YAAF,CAJV;;AAMA,UAAMsB,WAAW,GAAGH,0BAA0B,CAAEjC,KAAF,CAA9C;;AAEA,WAAO;AACN6B,MAAAA,SAAS,EAAEK,0BAA0B,CAAElC,KAAF,CAD/B;AAENQ,MAAAA,QAAQ,EAAE4B,WAAW,KAAK9B,UAFpB;AAGNwB,MAAAA,QAAQ,EAAEK,YAAY,CAAEnC,KAAF,EAASM,UAAT,CAHhB;AAINC,MAAAA,UAAU,EAAE6B,WAJN;AAKN3B,MAAAA,OAAO,EACNuB,MAAM,CAAEK,eAAF,CAAN,CAAwBC,eAAxB,CAAyC,UAAzC,CANK;AAONP,MAAAA,OAAO,EAAEC,MAAM,CAAEK,eAAF,CAAN,CAAwBC,eAAxB,CAAyC,OAAzC;AAPH,KAAP;AASA,GAnBF,EAoBC,CAAEhC,UAAF,EAAcN,KAAd,CApBD,CADD;AAuBAK,EAAAA,8BAA8B,CAC7BL,KAD6B,EAE7BM,UAF6B,EAG7BC,UAH6B,EAI7BC,QAJ6B,EAK7BC,OAL6B,CAA9B;AAOA,QAAM;AACLG,IAAAA,uBADK;AAELC,IAAAA,wBAFK;AAGL0B,IAAAA,OAHK;AAILC,IAAAA;AAJK,MAKF,uBAAa1B,YAAb,CALJ;AAOA,0BAAW,MAAM;AAChB;AACA;AACA,QAAKa,iBAAiB,IAAIpB,UAAU,KAAKkC,SAApC,IAAiD,CAAEhC,OAAxD,EAAkE;AACjEG,MAAAA,uBAAuB,CAAEZ,KAAF,EAASM,UAAT,CAAvB;AACA,KAFD,MAEO,IAAKC,UAAU,KAAKkC,SAAf,IAA4BhC,OAAjC,EAA2C;AACjDI,MAAAA,wBAAwB,CAAEb,KAAF,EAASM,UAAT,CAAxB;AACA;AACD,GARD,EAQG,CAAEC,UAAF,EAAcoB,iBAAd,EAAiC3B,KAAjC,EAAwCM,UAAxC,EAAoDG,OAApD,CARH;AAUA,SACC,qDACGY,UAAU,IACX,4BAAC,oBAAD;AAAa,IAAA,KAAK,EAAGrB;AAArB,KACG8B,QAAQ,IACT,4BAAC,gCAAD;AACC,IAAA,KAAK,EAAG9B,KADT;AAEC,IAAA,UAAU,EAAGM,UAFd;AAGC,IAAA,SAAS,EACRE,QAAQ,KAAM,CAAEoB,cAAF,IAAoBG,OAA1B,CAJV;AAMC,qBAAgBvB,QANjB;AAOC,qBAAgBqB,SAPjB;AAQC,IAAA,KAAK,EAAGJ,KART;AASC,IAAA,IAAI,EAAGG,cAAc,GAAGc,YAAH,GAAWtB,IATjC;AAUC,IAAA,WAAW,EAAG,CAAEQ,cAVjB;AAWC,IAAA,OAAO,EAAGA,cAAc,GAAG,UAAH,GAAgBa;AAXzC,IAFF,CAFF,EAoBGlB,IAAI,IAAIF,UAAR,IACD,4BAAC,sCAAD;AACC,IAAA,MAAM,EAAGE,IADV;AAEC,IAAA,KAAK,EAAGvB,KAFT;AAGC,IAAA,IAAI,EAAGoB;AAHR,KAKGK,KALH,CArBF,EA6BGjB,QAAQ,IACT,4BAAC,qBAAD;AACC,IAAA,SAAS,EAAG,yBACX,8BADW,EAEXJ,SAFW,CADb;AAKC,IAAA,KAAK,EAAGJ;AALT,KAOC,4BAAC,gCAAD;AACC,IAAA,SAAS,EAAGmB,eADb;AAEC,IAAA,UAAU,EAAGF,UAFd;AAGC,IAAA,OAAO,EAAG,MAAMJ,wBAAwB,CAAEb,KAAF,CAHzC;AAIC,IAAA,gBAAgB,EAAGwB,gBAJpB;AAKC,IAAA,iBAAiB,EAAG;AACnBmB,MAAAA,KAAK,EAAE1B,UADY;AAEnB2B,MAAAA,QAAQ,EAAElB,cAFS;AAGnB1B,MAAAA,KAHmB;AAInBM,MAAAA;AAJmB;AALrB,KAYGY,MAAM,IACP,qDACC,4CAAUO,KAAV,CADD,EAEGJ,UAAU,IACX,4BAAC,kBAAD;AACC,IAAA,SAAS,EAAC,8CADX;AAEC,IAAA,IAAI,EACHS,QAAQ,GAAGe,iBAAH,GAAgBC,gBAH1B;AAKC,IAAA,KAAK,EACJhB,QAAQ,GACL,cAAI,oBAAJ,CADK,GAEL,cAAI,gBAAJ,CARL;AAUC,IAAA,OAAO,EAAG,MACT,CAAEA,QAAQ,GAAGU,SAAH,GAAeD,OAAzB,EACCvC,KADD,EAECM,UAFD,CAXF;AAgBC,IAAA,SAAS,EAAGwB,QAhBb;AAiBC,qBAAgBA;AAjBjB,IAHF,CAbF,CAPD,EA8CC,4BAAC,iBAAD;AAAO,IAAA,SAAS,EAAGR;AAAnB,KAAsCnB,QAAtC,CA9CD,CA9BF,CADD;AAkFA;;AAED,MAAM4C,wBAAwB,GAC7B,uCAA8B/B,iBAA9B,CADD;AAGA+B,wBAAwB,CAACC,IAAzB,GAAgCjD,qBAAhC;eAEegD,wB","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}, [ isActive, isSmall, scope, identifier, activeArea ] );\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}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] );\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"]}
|
package/build/store/selectors.js
CHANGED
|
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.isItemPinned = exports.isFeatureActive = exports.getActiveComplementaryArea = void 0;
|
|
8
|
+
exports.isItemPinned = exports.isFeatureActive = exports.isComplementaryAreaLoading = exports.getActiveComplementaryArea = void 0;
|
|
9
9
|
|
|
10
10
|
var _data = require("@wordpress/data");
|
|
11
11
|
|
|
@@ -37,12 +37,20 @@ const getActiveComplementaryArea = (0, _data.createRegistrySelector)(select => (
|
|
|
37
37
|
} // Return `null` to indicate the user hid the complementary area.
|
|
38
38
|
|
|
39
39
|
|
|
40
|
-
if (
|
|
40
|
+
if (isComplementaryAreaVisible === false) {
|
|
41
41
|
return null;
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
return state === null || state === void 0 ? void 0 : (_state$complementaryA = state.complementaryAreas) === null || _state$complementaryA === void 0 ? void 0 : _state$complementaryA[scope];
|
|
45
45
|
});
|
|
46
|
+
exports.getActiveComplementaryArea = getActiveComplementaryArea;
|
|
47
|
+
const isComplementaryAreaLoading = (0, _data.createRegistrySelector)(select => (state, scope) => {
|
|
48
|
+
var _state$complementaryA2;
|
|
49
|
+
|
|
50
|
+
const isVisible = select(_preferences.store).get(scope, 'isComplementaryAreaVisible');
|
|
51
|
+
const identifier = state === null || state === void 0 ? void 0 : (_state$complementaryA2 = state.complementaryAreas) === null || _state$complementaryA2 === void 0 ? void 0 : _state$complementaryA2[scope];
|
|
52
|
+
return isVisible && identifier === undefined;
|
|
53
|
+
});
|
|
46
54
|
/**
|
|
47
55
|
* Returns a boolean indicating if an item is pinned or not.
|
|
48
56
|
*
|
|
@@ -53,7 +61,7 @@ const getActiveComplementaryArea = (0, _data.createRegistrySelector)(select => (
|
|
|
53
61
|
* @return {boolean} True if the item is pinned and false otherwise.
|
|
54
62
|
*/
|
|
55
63
|
|
|
56
|
-
exports.
|
|
64
|
+
exports.isComplementaryAreaLoading = isComplementaryAreaLoading;
|
|
57
65
|
const isItemPinned = (0, _data.createRegistrySelector)(select => (state, scope, item) => {
|
|
58
66
|
var _pinnedItems$item;
|
|
59
67
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/interface/src/store/selectors.js"],"names":["getActiveComplementaryArea","select","state","scope","isComplementaryAreaVisible","preferencesStore","get","undefined","complementaryAreas","isItemPinned","item","pinnedItems","isFeatureActive","featureName","since","alternative"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,0BAA0B,GAAG,kCACvCC,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMC,0BAA0B,GAAGH,MAAM,CAAEI,kBAAF,CAAN,CAA2BC,GAA3B,CAClCH,KADkC,EAElC,4BAFkC,CAAnC,CADiC,CAMjC;AACA;AACA;;AACA,MAAKC,0BAA0B,KAAKG,SAApC,EAAgD;AAC/C,WAAOA,SAAP;AACA,GAXgC,CAajC;;;AACA,
|
|
1
|
+
{"version":3,"sources":["@wordpress/interface/src/store/selectors.js"],"names":["getActiveComplementaryArea","select","state","scope","isComplementaryAreaVisible","preferencesStore","get","undefined","complementaryAreas","isComplementaryAreaLoading","isVisible","identifier","isItemPinned","item","pinnedItems","isFeatureActive","featureName","since","alternative"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,0BAA0B,GAAG,kCACvCC,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMC,0BAA0B,GAAGH,MAAM,CAAEI,kBAAF,CAAN,CAA2BC,GAA3B,CAClCH,KADkC,EAElC,4BAFkC,CAAnC,CADiC,CAMjC;AACA;AACA;;AACA,MAAKC,0BAA0B,KAAKG,SAApC,EAAgD;AAC/C,WAAOA,SAAP;AACA,GAXgC,CAajC;;;AACA,MAAKH,0BAA0B,KAAK,KAApC,EAA4C;AAC3C,WAAO,IAAP;AACA;;AAED,SAAOF,KAAP,aAAOA,KAAP,gDAAOA,KAAK,CAAEM,kBAAd,0DAAO,sBAA6BL,KAA7B,CAAP;AACA,CApBwC,CAAnC;;AAuBA,MAAMM,0BAA0B,GAAG,kCACvCR,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMO,SAAS,GAAGT,MAAM,CAAEI,kBAAF,CAAN,CAA2BC,GAA3B,CACjBH,KADiB,EAEjB,4BAFiB,CAAlB;AAIA,QAAMQ,UAAU,GAAGT,KAAH,aAAGA,KAAH,iDAAGA,KAAK,CAAEM,kBAAV,2DAAG,uBAA6BL,KAA7B,CAAnB;AAEA,SAAOO,SAAS,IAAIC,UAAU,KAAKJ,SAAnC;AACA,CATwC,CAAnC;AAYP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMK,YAAY,GAAG,kCACzBX,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,EAAgBU,IAAhB,KAA0B;AAAA;;AACvC,QAAMC,WAAW,GAAGb,MAAM,CAAEI,kBAAF,CAAN,CAA2BC,GAA3B,CACnBH,KADmB,EAEnB,aAFmB,CAApB;AAIA,8BAAOW,WAAP,aAAOA,WAAP,uBAAOA,WAAW,CAAID,IAAJ,CAAlB,iEAAgC,IAAhC;AACA,CAP0B,CAArB;AAUP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,eAAe,GAAG,kCAC5Bd,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,EAAgBa,WAAhB,KAAiC;AAC9C,2BACE,kEADF,EAEC;AACCC,IAAAA,KAAK,EAAE,KADR;AAECC,IAAAA,WAAW,EAAG;AAFf,GAFD;AAQA,SAAO,CAAC,CAAEjB,MAAM,CAAEI,kBAAF,CAAN,CAA2BC,GAA3B,CAAgCH,KAAhC,EAAuCa,WAAvC,CAAV;AACA,CAX6B,CAAxB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createRegistrySelector } from '@wordpress/data';\nimport deprecated from '@wordpress/deprecated';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Returns the complementary area that is active in a given scope.\n *\n * @param {Object} state Global application state.\n * @param {string} scope Item scope.\n *\n * @return {string | null | undefined} The complementary area that is active in the given scope.\n */\nexport const getActiveComplementaryArea = createRegistrySelector(\n\t( select ) => ( state, scope ) => {\n\t\tconst isComplementaryAreaVisible = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'isComplementaryAreaVisible'\n\t\t);\n\n\t\t// Return `undefined` to indicate that the user has never toggled\n\t\t// visibility, this is the vanilla default. Other code relies on this\n\t\t// nuance in the return value.\n\t\tif ( isComplementaryAreaVisible === undefined ) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\t// Return `null` to indicate the user hid the complementary area.\n\t\tif ( isComplementaryAreaVisible === false ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn state?.complementaryAreas?.[ scope ];\n\t}\n);\n\nexport const isComplementaryAreaLoading = createRegistrySelector(\n\t( select ) => ( state, scope ) => {\n\t\tconst isVisible = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'isComplementaryAreaVisible'\n\t\t);\n\t\tconst identifier = state?.complementaryAreas?.[ scope ];\n\n\t\treturn isVisible && identifier === undefined;\n\t}\n);\n\n/**\n * Returns a boolean indicating if an item is pinned or not.\n *\n * @param {Object} state Global application state.\n * @param {string} scope Scope.\n * @param {string} item Item to check.\n *\n * @return {boolean} True if the item is pinned and false otherwise.\n */\nexport const isItemPinned = createRegistrySelector(\n\t( select ) => ( state, scope, item ) => {\n\t\tconst pinnedItems = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'pinnedItems'\n\t\t);\n\t\treturn pinnedItems?.[ item ] ?? true;\n\t}\n);\n\n/**\n * Returns a boolean indicating whether a feature is active for a particular\n * scope.\n *\n * @param {Object} state The store state.\n * @param {string} scope The scope of the feature (e.g. core/edit-post).\n * @param {string} featureName The name of the feature.\n *\n * @return {boolean} Is the feature enabled?\n */\nexport const isFeatureActive = createRegistrySelector(\n\t( select ) => ( state, scope, featureName ) => {\n\t\tdeprecated(\n\t\t\t`select( 'core/interface' ).isFeatureActive( scope, featureName )`,\n\t\t\t{\n\t\t\t\tsince: '6.0',\n\t\t\t\talternative: `select( 'core/preferences' ).get( scope, featureName )`,\n\t\t\t}\n\t\t);\n\n\t\treturn !! select( preferencesStore ).get( scope, featureName );\n\t}\n);\n"]}
|
|
@@ -57,21 +57,24 @@ function useAdjustComplementaryListener(scope, identifier, activeArea, isActive,
|
|
|
57
57
|
disableComplementaryArea
|
|
58
58
|
} = useDispatch(interfaceStore);
|
|
59
59
|
useEffect(() => {
|
|
60
|
-
// If the complementary area is active and the editor is switching from
|
|
60
|
+
// If the complementary area is active and the editor is switching from
|
|
61
|
+
// a big to a small window size.
|
|
61
62
|
if (isActive && isSmall && !previousIsSmall.current) {
|
|
62
|
-
//
|
|
63
|
-
|
|
63
|
+
disableComplementaryArea(scope); // Flag the complementary area to be reopened when the window size
|
|
64
|
+
// goes from small to big.
|
|
64
65
|
|
|
65
66
|
shouldOpenWhenNotSmall.current = true;
|
|
66
|
-
} else if ( // If there is a flag indicating the complementary area should be
|
|
67
|
-
//
|
|
67
|
+
} else if ( // If there is a flag indicating the complementary area should be
|
|
68
|
+
// enabled when we go from small to big window size and we are going
|
|
69
|
+
// from a small to big window size.
|
|
68
70
|
shouldOpenWhenNotSmall.current && !isSmall && previousIsSmall.current) {
|
|
69
|
-
// Remove the flag indicating the complementary area should be
|
|
70
|
-
|
|
71
|
-
|
|
71
|
+
// Remove the flag indicating the complementary area should be
|
|
72
|
+
// enabled.
|
|
73
|
+
shouldOpenWhenNotSmall.current = false;
|
|
72
74
|
enableComplementaryArea(scope, identifier);
|
|
73
|
-
} else if ( // If the flag is indicating the current complementary should be
|
|
74
|
-
//
|
|
75
|
+
} else if ( // If the flag is indicating the current complementary should be
|
|
76
|
+
// reopened but another complementary area becomes active, remove
|
|
77
|
+
// the flag.
|
|
75
78
|
shouldOpenWhenNotSmall.current && activeArea && activeArea !== identifier) {
|
|
76
79
|
shouldOpenWhenNotSmall.current = false;
|
|
77
80
|
}
|
|
@@ -102,6 +105,7 @@ function ComplementaryArea(_ref3) {
|
|
|
102
105
|
showIconLabels = false
|
|
103
106
|
} = _ref3;
|
|
104
107
|
const {
|
|
108
|
+
isLoading,
|
|
105
109
|
isActive,
|
|
106
110
|
isPinned,
|
|
107
111
|
activeArea,
|
|
@@ -110,12 +114,14 @@ function ComplementaryArea(_ref3) {
|
|
|
110
114
|
} = useSelect(select => {
|
|
111
115
|
const {
|
|
112
116
|
getActiveComplementaryArea,
|
|
117
|
+
isComplementaryAreaLoading,
|
|
113
118
|
isItemPinned
|
|
114
119
|
} = select(interfaceStore);
|
|
115
120
|
|
|
116
121
|
const _activeArea = getActiveComplementaryArea(scope);
|
|
117
122
|
|
|
118
123
|
return {
|
|
124
|
+
isLoading: isComplementaryAreaLoading(scope),
|
|
119
125
|
isActive: _activeArea === identifier,
|
|
120
126
|
isPinned: isItemPinned(scope, identifier),
|
|
121
127
|
activeArea: _activeArea,
|
|
@@ -131,8 +137,12 @@ function ComplementaryArea(_ref3) {
|
|
|
131
137
|
unpinItem
|
|
132
138
|
} = useDispatch(interfaceStore);
|
|
133
139
|
useEffect(() => {
|
|
140
|
+
// Set initial visibility: For large screens, enable if it's active by
|
|
141
|
+
// default. For small screens, always initially disable.
|
|
134
142
|
if (isActiveByDefault && activeArea === undefined && !isSmall) {
|
|
135
143
|
enableComplementaryArea(scope, identifier);
|
|
144
|
+
} else if (activeArea === undefined && isSmall) {
|
|
145
|
+
disableComplementaryArea(scope, identifier);
|
|
136
146
|
}
|
|
137
147
|
}, [activeArea, isActiveByDefault, scope, identifier, isSmall]);
|
|
138
148
|
return createElement(Fragment, null, isPinnable && createElement(PinnedItems, {
|
|
@@ -142,6 +152,7 @@ function ComplementaryArea(_ref3) {
|
|
|
142
152
|
identifier: identifier,
|
|
143
153
|
isPressed: isActive && (!showIconLabels || isLarge),
|
|
144
154
|
"aria-expanded": isActive,
|
|
155
|
+
"aria-disabled": isLoading,
|
|
145
156
|
label: title,
|
|
146
157
|
icon: showIconLabels ? check : icon,
|
|
147
158
|
showTooltip: !showIconLabels,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"names":["classnames","Button","Panel","Slot","Fill","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","store","viewportStore","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","withComplementaryAreaContext","PinnedItems","interfaceStore","ComplementaryAreaSlot","scope","props","ComplementaryAreaFill","children","className","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","name","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isPinned","isLarge","select","getActiveComplementaryArea","isItemPinned","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","label","shortcut","ComplementaryAreaWrapped"],"mappings":"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","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 a big to a small window size.\n\t\tif ( isActive && isSmall && ! previousIsSmall.current ) {\n\t\t\t// Disable the complementary area.\n\t\t\tdisableComplementaryArea( scope );\n\t\t\t// Flag the complementary area to be reopened when the window size 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 enabled when we go from small to big window size\n\t\t\t// and we are going 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 enabled.\n\t\t\tshouldOpenWhenNotSmall.current = false;\n\t\t\t// Enable the complementary area.\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 reopened but another complementary area becomes active,\n\t\t\t// remove 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}, [ isActive, isSmall, scope, identifier, activeArea ] );\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 { isActive, isPinned, activeArea, isSmall, isLarge } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getActiveComplementaryArea, isItemPinned } =\n\t\t\t\tselect( interfaceStore );\n\t\t\tconst _activeArea = getActiveComplementaryArea( scope );\n\t\t\treturn {\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};\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\tif ( isActiveByDefault && activeArea === undefined && ! isSmall ) {\n\t\t\tenableComplementaryArea( scope, identifier );\n\t\t}\n\t}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] );\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\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"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/interface/src/components/complementary-area/index.js"],"names":["classnames","Button","Panel","Slot","Fill","useDispatch","useSelect","__","check","starEmpty","starFilled","useEffect","useRef","store","viewportStore","ComplementaryAreaHeader","ComplementaryAreaMoreMenuItem","ComplementaryAreaToggle","withComplementaryAreaContext","PinnedItems","interfaceStore","ComplementaryAreaSlot","scope","props","ComplementaryAreaFill","children","className","useAdjustComplementaryListener","identifier","activeArea","isActive","isSmall","previousIsSmall","shouldOpenWhenNotSmall","enableComplementaryArea","disableComplementaryArea","current","ComplementaryArea","closeLabel","header","headerClassName","icon","isPinnable","panelClassName","name","smallScreenTitle","title","toggleShortcut","isActiveByDefault","showIconLabels","isLoading","isPinned","isLarge","select","getActiveComplementaryArea","isComplementaryAreaLoading","isItemPinned","_activeArea","isViewportMatch","pinItem","unpinItem","undefined","label","shortcut","ComplementaryAreaWrapped"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,EAAiBC,KAAjB,EAAwBC,IAAxB,EAA8BC,IAA9B,QAA0C,uBAA1C;AACA,SAASC,WAAT,EAAsBC,SAAtB,QAAuC,iBAAvC;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,KAAT,EAAgBC,SAAhB,EAA2BC,UAA3B,QAA6C,kBAA7C;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,KAAK,IAAIC,aAAlB,QAAuC,qBAAvC;AAEA;AACA;AACA;;AACA,OAAOC,uBAAP,MAAoC,8BAApC;AACA,OAAOC,6BAAP,MAA0C,sCAA1C;AACA,OAAOC,uBAAP,MAAoC,8BAApC;AACA,OAAOC,4BAAP,MAAyC,+BAAzC;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,SAASN,KAAK,IAAIO,cAAlB,QAAwC,aAAxC;;AAEA,SAASC,qBAAT,OAAsD;AAAA,MAAtB;AAAEC,IAAAA,KAAF;AAAS,OAAGC;AAAZ,GAAsB;AACrD,SAAO,cAAC,IAAD;AAAM,IAAA,IAAI,EAAI,qBAAqBD,KAAO;AAA1C,KAAmDC,KAAnD,EAAP;AACA;;AAED,SAASC,qBAAT,QAAiE;AAAA,MAAjC;AAAEF,IAAAA,KAAF;AAASG,IAAAA,QAAT;AAAmBC,IAAAA;AAAnB,GAAiC;AAChE,SACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAI,qBAAqBJ,KAAO;AAA1C,KACC;AAAK,IAAA,SAAS,EAAGI;AAAjB,KAA+BD,QAA/B,CADD,CADD;AAKA;;AAED,SAASE,8BAAT,CACCL,KADD,EAECM,UAFD,EAGCC,UAHD,EAICC,QAJD,EAKCC,OALD,EAME;AACD,QAAMC,eAAe,GAAGpB,MAAM,CAAE,KAAF,CAA9B;AACA,QAAMqB,sBAAsB,GAAGrB,MAAM,CAAE,KAAF,CAArC;AACA,QAAM;AAAEsB,IAAAA,uBAAF;AAA2BC,IAAAA;AAA3B,MACL9B,WAAW,CAAEe,cAAF,CADZ;AAEAT,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA;AACA,QAAKmB,QAAQ,IAAIC,OAAZ,IAAuB,CAAEC,eAAe,CAACI,OAA9C,EAAwD;AACvDD,MAAAA,wBAAwB,CAAEb,KAAF,CAAxB,CADuD,CAEvD;AACA;;AACAW,MAAAA,sBAAsB,CAACG,OAAvB,GAAiC,IAAjC;AACA,KALD,MAKO,KACN;AACA;AACA;AACAH,IAAAA,sBAAsB,CAACG,OAAvB,IACA,CAAEL,OADF,IAEAC,eAAe,CAACI,OANV,EAOL;AACD;AACA;AACAH,MAAAA,sBAAsB,CAACG,OAAvB,GAAiC,KAAjC;AACAF,MAAAA,uBAAuB,CAAEZ,KAAF,EAASM,UAAT,CAAvB;AACA,KAZM,MAYA,KACN;AACA;AACA;AACAK,IAAAA,sBAAsB,CAACG,OAAvB,IACAP,UADA,IAEAA,UAAU,KAAKD,UANT,EAOL;AACDK,MAAAA,sBAAsB,CAACG,OAAvB,GAAiC,KAAjC;AACA;;AACD,QAAKL,OAAO,KAAKC,eAAe,CAACI,OAAjC,EAA2C;AAC1CJ,MAAAA,eAAe,CAACI,OAAhB,GAA0BL,OAA1B;AACA;AACD,GAjCQ,EAiCN,CAAED,QAAF,EAAYC,OAAZ,EAAqBT,KAArB,EAA4BM,UAA5B,EAAwCC,UAAxC,CAjCM,CAAT;AAkCA;;AAED,SAASQ,iBAAT,QAiBI;AAAA,MAjBwB;AAC3BZ,IAAAA,QAD2B;AAE3BC,IAAAA,SAF2B;AAG3BY,IAAAA,UAAU,GAAG/B,EAAE,CAAE,cAAF,CAHY;AAI3BqB,IAAAA,UAJ2B;AAK3BW,IAAAA,MAL2B;AAM3BC,IAAAA,eAN2B;AAO3BC,IAAAA,IAP2B;AAQ3BC,IAAAA,UAAU,GAAG,IARc;AAS3BC,IAAAA,cAT2B;AAU3BrB,IAAAA,KAV2B;AAW3BsB,IAAAA,IAX2B;AAY3BC,IAAAA,gBAZ2B;AAa3BC,IAAAA,KAb2B;AAc3BC,IAAAA,cAd2B;AAe3BC,IAAAA,iBAf2B;AAgB3BC,IAAAA,cAAc,GAAG;AAhBU,GAiBxB;AACH,QAAM;AAAEC,IAAAA,SAAF;AAAapB,IAAAA,QAAb;AAAuBqB,IAAAA,QAAvB;AAAiCtB,IAAAA,UAAjC;AAA6CE,IAAAA,OAA7C;AAAsDqB,IAAAA;AAAtD,MACL9C,SAAS,CACN+C,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,0BADK;AAELC,MAAAA,0BAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEjC,cAAF,CAJV;;AAMA,UAAMqC,WAAW,GAAGH,0BAA0B,CAAEhC,KAAF,CAA9C;;AAEA,WAAO;AACN4B,MAAAA,SAAS,EAAEK,0BAA0B,CAAEjC,KAAF,CAD/B;AAENQ,MAAAA,QAAQ,EAAE2B,WAAW,KAAK7B,UAFpB;AAGNuB,MAAAA,QAAQ,EAAEK,YAAY,CAAElC,KAAF,EAASM,UAAT,CAHhB;AAINC,MAAAA,UAAU,EAAE4B,WAJN;AAKN1B,MAAAA,OAAO,EACNsB,MAAM,CAAEvC,aAAF,CAAN,CAAwB4C,eAAxB,CAAyC,UAAzC,CANK;AAONN,MAAAA,OAAO,EAAEC,MAAM,CAAEvC,aAAF,CAAN,CAAwB4C,eAAxB,CAAyC,OAAzC;AAPH,KAAP;AASA,GAnBO,EAoBR,CAAE9B,UAAF,EAAcN,KAAd,CApBQ,CADV;AAuBAK,EAAAA,8BAA8B,CAC7BL,KAD6B,EAE7BM,UAF6B,EAG7BC,UAH6B,EAI7BC,QAJ6B,EAK7BC,OAL6B,CAA9B;AAOA,QAAM;AACLG,IAAAA,uBADK;AAELC,IAAAA,wBAFK;AAGLwB,IAAAA,OAHK;AAILC,IAAAA;AAJK,MAKFvD,WAAW,CAAEe,cAAF,CALf;AAOAT,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA;AACA,QAAKqC,iBAAiB,IAAInB,UAAU,KAAKgC,SAApC,IAAiD,CAAE9B,OAAxD,EAAkE;AACjEG,MAAAA,uBAAuB,CAAEZ,KAAF,EAASM,UAAT,CAAvB;AACA,KAFD,MAEO,IAAKC,UAAU,KAAKgC,SAAf,IAA4B9B,OAAjC,EAA2C;AACjDI,MAAAA,wBAAwB,CAAEb,KAAF,EAASM,UAAT,CAAxB;AACA;AACD,GARQ,EAQN,CAAEC,UAAF,EAAcmB,iBAAd,EAAiC1B,KAAjC,EAAwCM,UAAxC,EAAoDG,OAApD,CARM,CAAT;AAUA,SACC,8BACGW,UAAU,IACX,cAAC,WAAD;AAAa,IAAA,KAAK,EAAGpB;AAArB,KACG6B,QAAQ,IACT,cAAC,uBAAD;AACC,IAAA,KAAK,EAAG7B,KADT;AAEC,IAAA,UAAU,EAAGM,UAFd;AAGC,IAAA,SAAS,EACRE,QAAQ,KAAM,CAAEmB,cAAF,IAAoBG,OAA1B,CAJV;AAMC,qBAAgBtB,QANjB;AAOC,qBAAgBoB,SAPjB;AAQC,IAAA,KAAK,EAAGJ,KART;AASC,IAAA,IAAI,EAAGG,cAAc,GAAGzC,KAAH,GAAWiC,IATjC;AAUC,IAAA,WAAW,EAAG,CAAEQ,cAVjB;AAWC,IAAA,OAAO,EAAGA,cAAc,GAAG,UAAH,GAAgBY;AAXzC,IAFF,CAFF,EAoBGjB,IAAI,IAAIF,UAAR,IACD,cAAC,6BAAD;AACC,IAAA,MAAM,EAAGE,IADV;AAEC,IAAA,KAAK,EAAGtB,KAFT;AAGC,IAAA,IAAI,EAAGmB;AAHR,KAKGK,KALH,CArBF,EA6BGhB,QAAQ,IACT,cAAC,qBAAD;AACC,IAAA,SAAS,EAAG9B,UAAU,CACrB,8BADqB,EAErB0B,SAFqB,CADvB;AAKC,IAAA,KAAK,EAAGJ;AALT,KAOC,cAAC,uBAAD;AACC,IAAA,SAAS,EAAGkB,eADb;AAEC,IAAA,UAAU,EAAGF,UAFd;AAGC,IAAA,OAAO,EAAG,MAAMH,wBAAwB,CAAEb,KAAF,CAHzC;AAIC,IAAA,gBAAgB,EAAGuB,gBAJpB;AAKC,IAAA,iBAAiB,EAAG;AACnBiB,MAAAA,KAAK,EAAExB,UADY;AAEnByB,MAAAA,QAAQ,EAAEhB,cAFS;AAGnBzB,MAAAA,KAHmB;AAInBM,MAAAA;AAJmB;AALrB,KAYGW,MAAM,IACP,8BACC,8BAAUO,KAAV,CADD,EAEGJ,UAAU,IACX,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,8CADX;AAEC,IAAA,IAAI,EACHS,QAAQ,GAAGzC,UAAH,GAAgBD,SAH1B;AAKC,IAAA,KAAK,EACJ0C,QAAQ,GACL5C,EAAE,CAAE,oBAAF,CADG,GAELA,EAAE,CAAE,gBAAF,CARP;AAUC,IAAA,OAAO,EAAG,MACT,CAAE4C,QAAQ,GAAGS,SAAH,GAAeD,OAAzB,EACCrC,KADD,EAECM,UAFD,CAXF;AAgBC,IAAA,SAAS,EAAGuB,QAhBb;AAiBC,qBAAgBA;AAjBjB,IAHF,CAbF,CAPD,EA8CC,cAAC,KAAD;AAAO,IAAA,SAAS,EAAGR;AAAnB,KAAsClB,QAAtC,CA9CD,CA9BF,CADD;AAkFA;;AAED,MAAMuC,wBAAwB,GAC7B9C,4BAA4B,CAAEmB,iBAAF,CAD7B;AAGA2B,wBAAwB,CAAC7D,IAAzB,GAAgCkB,qBAAhC;AAEA,eAAe2C,wBAAf","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}, [ isActive, isSmall, scope, identifier, activeArea ] );\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}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] );\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"]}
|
|
@@ -25,12 +25,19 @@ export const getActiveComplementaryArea = createRegistrySelector(select => (stat
|
|
|
25
25
|
} // Return `null` to indicate the user hid the complementary area.
|
|
26
26
|
|
|
27
27
|
|
|
28
|
-
if (
|
|
28
|
+
if (isComplementaryAreaVisible === false) {
|
|
29
29
|
return null;
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
return state === null || state === void 0 ? void 0 : (_state$complementaryA = state.complementaryAreas) === null || _state$complementaryA === void 0 ? void 0 : _state$complementaryA[scope];
|
|
33
33
|
});
|
|
34
|
+
export const isComplementaryAreaLoading = createRegistrySelector(select => (state, scope) => {
|
|
35
|
+
var _state$complementaryA2;
|
|
36
|
+
|
|
37
|
+
const isVisible = select(preferencesStore).get(scope, 'isComplementaryAreaVisible');
|
|
38
|
+
const identifier = state === null || state === void 0 ? void 0 : (_state$complementaryA2 = state.complementaryAreas) === null || _state$complementaryA2 === void 0 ? void 0 : _state$complementaryA2[scope];
|
|
39
|
+
return isVisible && identifier === undefined;
|
|
40
|
+
});
|
|
34
41
|
/**
|
|
35
42
|
* Returns a boolean indicating if an item is pinned or not.
|
|
36
43
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/interface/src/store/selectors.js"],"names":["createRegistrySelector","deprecated","store","preferencesStore","getActiveComplementaryArea","select","state","scope","isComplementaryAreaVisible","get","undefined","complementaryAreas","isItemPinned","item","pinnedItems","isFeatureActive","featureName","since","alternative"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,sBAAT,QAAuC,iBAAvC;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,wBAA1C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,0BAA0B,GAAGJ,sBAAsB,CAC7DK,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMC,0BAA0B,GAAGH,MAAM,CAAEF,gBAAF,CAAN,CAA2BM,GAA3B,CAClCF,KADkC,EAElC,4BAFkC,CAAnC,CADiC,CAMjC;AACA;AACA;;AACA,MAAKC,0BAA0B,KAAKE,SAApC,EAAgD;AAC/C,WAAOA,SAAP;AACA,GAXgC,CAajC;;;AACA,
|
|
1
|
+
{"version":3,"sources":["@wordpress/interface/src/store/selectors.js"],"names":["createRegistrySelector","deprecated","store","preferencesStore","getActiveComplementaryArea","select","state","scope","isComplementaryAreaVisible","get","undefined","complementaryAreas","isComplementaryAreaLoading","isVisible","identifier","isItemPinned","item","pinnedItems","isFeatureActive","featureName","since","alternative"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,sBAAT,QAAuC,iBAAvC;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,wBAA1C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,0BAA0B,GAAGJ,sBAAsB,CAC7DK,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMC,0BAA0B,GAAGH,MAAM,CAAEF,gBAAF,CAAN,CAA2BM,GAA3B,CAClCF,KADkC,EAElC,4BAFkC,CAAnC,CADiC,CAMjC;AACA;AACA;;AACA,MAAKC,0BAA0B,KAAKE,SAApC,EAAgD;AAC/C,WAAOA,SAAP;AACA,GAXgC,CAajC;;;AACA,MAAKF,0BAA0B,KAAK,KAApC,EAA4C;AAC3C,WAAO,IAAP;AACA;;AAED,SAAOF,KAAP,aAAOA,KAAP,gDAAOA,KAAK,CAAEK,kBAAd,0DAAO,sBAA6BJ,KAA7B,CAAP;AACA,CApB8D,CAAzD;AAuBP,OAAO,MAAMK,0BAA0B,GAAGZ,sBAAsB,CAC7DK,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAAA;;AACjC,QAAMM,SAAS,GAAGR,MAAM,CAAEF,gBAAF,CAAN,CAA2BM,GAA3B,CACjBF,KADiB,EAEjB,4BAFiB,CAAlB;AAIA,QAAMO,UAAU,GAAGR,KAAH,aAAGA,KAAH,iDAAGA,KAAK,CAAEK,kBAAV,2DAAG,uBAA6BJ,KAA7B,CAAnB;AAEA,SAAOM,SAAS,IAAIC,UAAU,KAAKJ,SAAnC;AACA,CAT8D,CAAzD;AAYP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMK,YAAY,GAAGf,sBAAsB,CAC/CK,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,EAAgBS,IAAhB,KAA0B;AAAA;;AACvC,QAAMC,WAAW,GAAGZ,MAAM,CAAEF,gBAAF,CAAN,CAA2BM,GAA3B,CACnBF,KADmB,EAEnB,aAFmB,CAApB;AAIA,8BAAOU,WAAP,aAAOA,WAAP,uBAAOA,WAAW,CAAID,IAAJ,CAAlB,iEAAgC,IAAhC;AACA,CAPgD,CAA3C;AAUP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAME,eAAe,GAAGlB,sBAAsB,CAClDK,MAAF,IAAc,CAAEC,KAAF,EAASC,KAAT,EAAgBY,WAAhB,KAAiC;AAC9ClB,EAAAA,UAAU,CACR,kEADQ,EAET;AACCmB,IAAAA,KAAK,EAAE,KADR;AAECC,IAAAA,WAAW,EAAG;AAFf,GAFS,CAAV;AAQA,SAAO,CAAC,CAAEhB,MAAM,CAAEF,gBAAF,CAAN,CAA2BM,GAA3B,CAAgCF,KAAhC,EAAuCY,WAAvC,CAAV;AACA,CAXmD,CAA9C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createRegistrySelector } from '@wordpress/data';\nimport deprecated from '@wordpress/deprecated';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Returns the complementary area that is active in a given scope.\n *\n * @param {Object} state Global application state.\n * @param {string} scope Item scope.\n *\n * @return {string | null | undefined} The complementary area that is active in the given scope.\n */\nexport const getActiveComplementaryArea = createRegistrySelector(\n\t( select ) => ( state, scope ) => {\n\t\tconst isComplementaryAreaVisible = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'isComplementaryAreaVisible'\n\t\t);\n\n\t\t// Return `undefined` to indicate that the user has never toggled\n\t\t// visibility, this is the vanilla default. Other code relies on this\n\t\t// nuance in the return value.\n\t\tif ( isComplementaryAreaVisible === undefined ) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\t// Return `null` to indicate the user hid the complementary area.\n\t\tif ( isComplementaryAreaVisible === false ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn state?.complementaryAreas?.[ scope ];\n\t}\n);\n\nexport const isComplementaryAreaLoading = createRegistrySelector(\n\t( select ) => ( state, scope ) => {\n\t\tconst isVisible = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'isComplementaryAreaVisible'\n\t\t);\n\t\tconst identifier = state?.complementaryAreas?.[ scope ];\n\n\t\treturn isVisible && identifier === undefined;\n\t}\n);\n\n/**\n * Returns a boolean indicating if an item is pinned or not.\n *\n * @param {Object} state Global application state.\n * @param {string} scope Scope.\n * @param {string} item Item to check.\n *\n * @return {boolean} True if the item is pinned and false otherwise.\n */\nexport const isItemPinned = createRegistrySelector(\n\t( select ) => ( state, scope, item ) => {\n\t\tconst pinnedItems = select( preferencesStore ).get(\n\t\t\tscope,\n\t\t\t'pinnedItems'\n\t\t);\n\t\treturn pinnedItems?.[ item ] ?? true;\n\t}\n);\n\n/**\n * Returns a boolean indicating whether a feature is active for a particular\n * scope.\n *\n * @param {Object} state The store state.\n * @param {string} scope The scope of the feature (e.g. core/edit-post).\n * @param {string} featureName The name of the feature.\n *\n * @return {boolean} Is the feature enabled?\n */\nexport const isFeatureActive = createRegistrySelector(\n\t( select ) => ( state, scope, featureName ) => {\n\t\tdeprecated(\n\t\t\t`select( 'core/interface' ).isFeatureActive( scope, featureName )`,\n\t\t\t{\n\t\t\t\tsince: '6.0',\n\t\t\t\talternative: `select( 'core/preferences' ).get( scope, featureName )`,\n\t\t\t}\n\t\t);\n\n\t\treturn !! select( preferencesStore ).get( scope, featureName );\n\t}\n);\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/interface",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.4.0",
|
|
4
4
|
"description": "Interface module for WordPress. The package contains shared functionality across the modern JavaScript-based WordPress screens.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -32,17 +32,17 @@
|
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@babel/runtime": "^7.16.0",
|
|
35
|
-
"@wordpress/a11y": "^3.
|
|
36
|
-
"@wordpress/components": "^23.
|
|
37
|
-
"@wordpress/compose": "^6.
|
|
38
|
-
"@wordpress/data": "^8.
|
|
39
|
-
"@wordpress/deprecated": "^3.
|
|
40
|
-
"@wordpress/element": "^5.
|
|
41
|
-
"@wordpress/i18n": "^4.
|
|
42
|
-
"@wordpress/icons": "^9.
|
|
43
|
-
"@wordpress/plugins": "^5.
|
|
44
|
-
"@wordpress/preferences": "^3.
|
|
45
|
-
"@wordpress/viewport": "^5.
|
|
35
|
+
"@wordpress/a11y": "^3.27.0",
|
|
36
|
+
"@wordpress/components": "^23.4.0",
|
|
37
|
+
"@wordpress/compose": "^6.4.0",
|
|
38
|
+
"@wordpress/data": "^8.4.0",
|
|
39
|
+
"@wordpress/deprecated": "^3.27.0",
|
|
40
|
+
"@wordpress/element": "^5.4.0",
|
|
41
|
+
"@wordpress/i18n": "^4.27.0",
|
|
42
|
+
"@wordpress/icons": "^9.18.0",
|
|
43
|
+
"@wordpress/plugins": "^5.4.0",
|
|
44
|
+
"@wordpress/preferences": "^3.4.0",
|
|
45
|
+
"@wordpress/viewport": "^5.4.0",
|
|
46
46
|
"classnames": "^2.3.1"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
@@ -52,5 +52,5 @@
|
|
|
52
52
|
"publishConfig": {
|
|
53
53
|
"access": "public"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "c25ff895413bad4354c55c0c2d732552618b0d56"
|
|
56
56
|
}
|
|
@@ -47,26 +47,29 @@ function useAdjustComplementaryListener(
|
|
|
47
47
|
const { enableComplementaryArea, disableComplementaryArea } =
|
|
48
48
|
useDispatch( interfaceStore );
|
|
49
49
|
useEffect( () => {
|
|
50
|
-
// If the complementary area is active and the editor is switching from
|
|
50
|
+
// If the complementary area is active and the editor is switching from
|
|
51
|
+
// a big to a small window size.
|
|
51
52
|
if ( isActive && isSmall && ! previousIsSmall.current ) {
|
|
52
|
-
// Disable the complementary area.
|
|
53
53
|
disableComplementaryArea( scope );
|
|
54
|
-
// Flag the complementary area to be reopened when the window size
|
|
54
|
+
// Flag the complementary area to be reopened when the window size
|
|
55
|
+
// goes from small to big.
|
|
55
56
|
shouldOpenWhenNotSmall.current = true;
|
|
56
57
|
} else if (
|
|
57
|
-
// If there is a flag indicating the complementary area should be
|
|
58
|
-
//
|
|
58
|
+
// If there is a flag indicating the complementary area should be
|
|
59
|
+
// enabled when we go from small to big window size and we are going
|
|
60
|
+
// from a small to big window size.
|
|
59
61
|
shouldOpenWhenNotSmall.current &&
|
|
60
62
|
! isSmall &&
|
|
61
63
|
previousIsSmall.current
|
|
62
64
|
) {
|
|
63
|
-
// Remove the flag indicating the complementary area should be
|
|
65
|
+
// Remove the flag indicating the complementary area should be
|
|
66
|
+
// enabled.
|
|
64
67
|
shouldOpenWhenNotSmall.current = false;
|
|
65
|
-
// Enable the complementary area.
|
|
66
68
|
enableComplementaryArea( scope, identifier );
|
|
67
69
|
} else if (
|
|
68
|
-
// If the flag is indicating the current complementary should be
|
|
69
|
-
//
|
|
70
|
+
// If the flag is indicating the current complementary should be
|
|
71
|
+
// reopened but another complementary area becomes active, remove
|
|
72
|
+
// the flag.
|
|
70
73
|
shouldOpenWhenNotSmall.current &&
|
|
71
74
|
activeArea &&
|
|
72
75
|
activeArea !== identifier
|
|
@@ -97,21 +100,29 @@ function ComplementaryArea( {
|
|
|
97
100
|
isActiveByDefault,
|
|
98
101
|
showIconLabels = false,
|
|
99
102
|
} ) {
|
|
100
|
-
const { isActive, isPinned, activeArea, isSmall, isLarge } =
|
|
101
|
-
(
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
103
|
+
const { isLoading, isActive, isPinned, activeArea, isSmall, isLarge } =
|
|
104
|
+
useSelect(
|
|
105
|
+
( select ) => {
|
|
106
|
+
const {
|
|
107
|
+
getActiveComplementaryArea,
|
|
108
|
+
isComplementaryAreaLoading,
|
|
109
|
+
isItemPinned,
|
|
110
|
+
} = select( interfaceStore );
|
|
111
|
+
|
|
112
|
+
const _activeArea = getActiveComplementaryArea( scope );
|
|
113
|
+
|
|
114
|
+
return {
|
|
115
|
+
isLoading: isComplementaryAreaLoading( scope ),
|
|
116
|
+
isActive: _activeArea === identifier,
|
|
117
|
+
isPinned: isItemPinned( scope, identifier ),
|
|
118
|
+
activeArea: _activeArea,
|
|
119
|
+
isSmall:
|
|
120
|
+
select( viewportStore ).isViewportMatch( '< medium' ),
|
|
121
|
+
isLarge: select( viewportStore ).isViewportMatch( 'large' ),
|
|
122
|
+
};
|
|
123
|
+
},
|
|
124
|
+
[ identifier, scope ]
|
|
125
|
+
);
|
|
115
126
|
useAdjustComplementaryListener(
|
|
116
127
|
scope,
|
|
117
128
|
identifier,
|
|
@@ -127,8 +138,12 @@ function ComplementaryArea( {
|
|
|
127
138
|
} = useDispatch( interfaceStore );
|
|
128
139
|
|
|
129
140
|
useEffect( () => {
|
|
141
|
+
// Set initial visibility: For large screens, enable if it's active by
|
|
142
|
+
// default. For small screens, always initially disable.
|
|
130
143
|
if ( isActiveByDefault && activeArea === undefined && ! isSmall ) {
|
|
131
144
|
enableComplementaryArea( scope, identifier );
|
|
145
|
+
} else if ( activeArea === undefined && isSmall ) {
|
|
146
|
+
disableComplementaryArea( scope, identifier );
|
|
132
147
|
}
|
|
133
148
|
}, [ activeArea, isActiveByDefault, scope, identifier, isSmall ] );
|
|
134
149
|
|
|
@@ -144,6 +159,7 @@ function ComplementaryArea( {
|
|
|
144
159
|
isActive && ( ! showIconLabels || isLarge )
|
|
145
160
|
}
|
|
146
161
|
aria-expanded={ isActive }
|
|
162
|
+
aria-disabled={ isLoading }
|
|
147
163
|
label={ title }
|
|
148
164
|
icon={ showIconLabels ? check : icon }
|
|
149
165
|
showTooltip={ ! showIconLabels }
|
package/src/store/selectors.js
CHANGED
|
@@ -28,7 +28,7 @@ export const getActiveComplementaryArea = createRegistrySelector(
|
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
// Return `null` to indicate the user hid the complementary area.
|
|
31
|
-
if (
|
|
31
|
+
if ( isComplementaryAreaVisible === false ) {
|
|
32
32
|
return null;
|
|
33
33
|
}
|
|
34
34
|
|
|
@@ -36,6 +36,18 @@ export const getActiveComplementaryArea = createRegistrySelector(
|
|
|
36
36
|
}
|
|
37
37
|
);
|
|
38
38
|
|
|
39
|
+
export const isComplementaryAreaLoading = createRegistrySelector(
|
|
40
|
+
( select ) => ( state, scope ) => {
|
|
41
|
+
const isVisible = select( preferencesStore ).get(
|
|
42
|
+
scope,
|
|
43
|
+
'isComplementaryAreaVisible'
|
|
44
|
+
);
|
|
45
|
+
const identifier = state?.complementaryAreas?.[ scope ];
|
|
46
|
+
|
|
47
|
+
return isVisible && identifier === undefined;
|
|
48
|
+
}
|
|
49
|
+
);
|
|
50
|
+
|
|
39
51
|
/**
|
|
40
52
|
* Returns a boolean indicating if an item is pinned or not.
|
|
41
53
|
*
|