UNPKG

@wordpress/editor

Version:
8 lines (7 loc) 9.89 kB
{ "version": 3, "sources": ["../../../src/components/global-styles-sidebar/index.js"], "sourcesContent": ["import { Button } from '@wordpress/components';\nimport { Stack } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\nimport { styles, seen, backup } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { useViewportMatch, usePrevious } from '@wordpress/compose';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport GlobalStylesUI from '../global-styles';\nimport { GlobalStylesActionMenu } from '../global-styles/menu';\nimport { store as editorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport PluginSidebar from '../plugin-sidebar';\nimport WelcomeGuideStyles from './welcome-guide';\n\nexport default function GlobalStylesSidebar() {\n\tconst {\n\t\tshouldResetNavigation,\n\t\tstylesPath,\n\t\tshowStylebook,\n\t\tshowListViewByDefault,\n\t\thasRevisions,\n\t\tactiveComplementaryArea,\n\t\teditorSettings,\n\t\tstyleStateViewport,\n\t\tisDistractionFree,\n\t} = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\tconst {\n\t\t\tgetStylesPath,\n\t\t\tgetShowStylebook,\n\t\t\tgetEditorMode,\n\t\t\tgetEditorSettings,\n\t\t} = unlock( select( editorStore ) );\n\t\tconst _isVisualEditorMode = 'visual' === getEditorMode();\n\t\tconst _showListViewByDefault = get( 'core', 'showListViewByDefault' );\n\t\tconst _isDistractionFree = get( 'core', 'distractionFree' );\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\tstylesPath: getStylesPath(),\n\t\t\tshowStylebook: getShowStylebook(),\n\t\t\tshouldResetNavigation:\n\t\t\t\t'edit-site/global-styles' !==\n\t\t\t\t\tgetActiveComplementaryArea( 'core' ) ||\n\t\t\t\t! _isVisualEditorMode,\n\t\t\tshowListViewByDefault: _showListViewByDefault,\n\t\t\thasRevisions:\n\t\t\t\t!! globalStyles?._links?.[ 'version-history' ]?.[ 0 ]?.count,\n\t\t\tactiveComplementaryArea: getActiveComplementaryArea( 'core' ),\n\t\t\teditorSettings: getEditorSettings(),\n\t\t\tstyleStateViewport: unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t).getStyleStateViewport(),\n\t\t\tisDistractionFree: _isDistractionFree,\n\t\t};\n\t}, [] );\n\tconst { setStylesPath, setShowStylebook, resetStylesNavigation } = unlock(\n\t\tuseDispatch( editorStore )\n\t);\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\t// Derive state from path and showStylebook\n\tconst isRevisionsOpened =\n\t\tstylesPath.startsWith( '/revisions' ) && ! showStylebook;\n\tconst isRevisionsStyleBookOpened =\n\t\tstylesPath.startsWith( '/revisions' ) && showStylebook;\n\n\tconst previousActiveArea = usePrevious( activeComplementaryArea );\n\n\t// Reset navigation when sidebar opens\n\tuseEffect( () => {\n\t\tif (\n\t\t\tactiveComplementaryArea === 'edit-site/global-styles' &&\n\t\t\tpreviousActiveArea !== 'edit-site/global-styles'\n\t\t) {\n\t\t\tresetStylesNavigation();\n\t\t}\n\t}, [ activeComplementaryArea, previousActiveArea, resetStylesNavigation ] );\n\n\tuseEffect( () => {\n\t\tif ( shouldResetNavigation ) {\n\t\t\tresetStylesNavigation();\n\t\t}\n\t}, [ shouldResetNavigation, resetStylesNavigation ] );\n\n\tconst { setIsListViewOpened } = useDispatch( editorStore );\n\n\tconst toggleRevisions = () => {\n\t\tsetIsListViewOpened( false );\n\t\tif ( isRevisionsOpened || isRevisionsStyleBookOpened ) {\n\t\t\t// Close revisions, go back to root\n\t\t\tsetStylesPath( '/' );\n\t\t} else {\n\t\t\t// Open revisions\n\t\t\tsetStylesPath( '/revisions' );\n\t\t}\n\t};\n\tconst toggleStyleBook = () => {\n\t\tsetIsListViewOpened( showStylebook && showListViewByDefault );\n\t\tsetShowStylebook( ! showStylebook );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<PluginSidebar\n\t\t\t\tname=\"global-styles\"\n\t\t\t\tidentifier=\"edit-site/global-styles\"\n\t\t\t\ttitle={ __( 'Styles' ) }\n\t\t\t\ticon={ styles }\n\t\t\t\tisPinnable={ ! isDistractionFree }\n\t\t\t\tcloseLabel={ __( 'Close Styles' ) }\n\t\t\t\tclassName=\"editor-global-styles-sidebar__panel\"\n\t\t\t\t// The sidebar is a flex column so the panel can fill the\n\t\t\t\t// remaining height.\n\t\t\t\trender={ <div className=\"editor-global-styles-sidebar\" /> }\n\t\t\t\theader={\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tclassName=\"editor-global-styles-sidebar__header\"\n\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<h2 className=\"editor-global-styles-sidebar__header-title\">\n\t\t\t\t\t\t\t{ __( 'Styles' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tclassName=\"editor-global-styles-sidebar__header-actions\"\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ! isMobileViewport && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\ticon={ seen }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Style Book' ) }\n\t\t\t\t\t\t\t\t\tisPressed={ showStylebook }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tdisabled={ shouldResetNavigation }\n\t\t\t\t\t\t\t\t\tonClick={ toggleStyleBook }\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tlabel={ __( 'Revisions' ) }\n\t\t\t\t\t\t\t\ticon={ backup }\n\t\t\t\t\t\t\t\tonClick={ toggleRevisions }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tdisabled={ ! hasRevisions }\n\t\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\t\tisRevisionsOpened ||\n\t\t\t\t\t\t\t\t\tisRevisionsStyleBookOpened\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<GlobalStylesActionMenu\n\t\t\t\t\t\t\t\tonChangePath={ setStylesPath }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<GlobalStylesUI\n\t\t\t\t\tpath={ stylesPath }\n\t\t\t\t\tonPathChange={ setStylesPath }\n\t\t\t\t\tsettings={ editorSettings }\n\t\t\t\t\tselectedViewport={ styleStateViewport }\n\t\t\t\t\tshowResponsiveStateControls={ false }\n\t\t\t\t/>\n\t\t\t</PluginSidebar>\n\t\t\t<WelcomeGuideStyles />\n\t\t</>\n\t);\n}\n"], "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAuB;AACvB,gBAAsB;AACtB,kBAAmB;AACnB,mBAAqC;AACrC,kBAAuC;AACvC,qBAA0B;AAC1B,yBAA0C;AAC1C,qBAA8C;AAC9C,uBAAmC;AACnC,uBAAwC;AACxC,0BAA0C;AAC1C,2BAA2B;AAC3B,kBAAuC;AACvC,mBAAqC;AACrC,yBAAuB;AACvB,4BAA0B;AAC1B,2BAA+B;AAkG7B;AAhGa,SAAR,sBAAuC;AAC7C,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,uBAAW,CAAE,WAAY;AAC5B,UAAM,EAAE,IAAI,IAAI,OAAQ,mBAAAA,KAAiB;AACzC,UAAM,EAAE,2BAA2B,IAAI,OAAQ,iBAAAC,KAAe;AAC9D,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD,QAAI,2BAAQ,OAAQ,aAAAC,KAAY,CAAE;AAClC,UAAM,sBAAsB,aAAa,cAAc;AACvD,UAAM,yBAAyB,IAAK,QAAQ,uBAAwB;AACpE,UAAM,qBAAqB,IAAK,QAAQ,iBAAkB;AAC1D,UAAM,EAAE,iBAAiB,uCAAuC,IAC/D,OAAQ,iBAAAC,KAAU;AAEnB,UAAM,iBAAiB,uCAAuC;AAC9D,UAAM,eAAe,iBAClB,gBAAiB,QAAQ,gBAAgB,cAAe,IACxD;AAEH,WAAO;AAAA,MACN,YAAY,cAAc;AAAA,MAC1B,eAAe,iBAAiB;AAAA,MAChC,uBACC,8BACC,2BAA4B,MAAO,KACpC,CAAE;AAAA,MACH,uBAAuB;AAAA,MACvB,cACC,CAAC,CAAE,cAAc,SAAU,iBAAkB,IAAK,CAAE,GAAG;AAAA,MACxD,yBAAyB,2BAA4B,MAAO;AAAA,MAC5D,gBAAgB,kBAAkB;AAAA,MAClC,wBAAoB;AAAA,QACnB,OAAQ,oBAAAC,KAAiB;AAAA,MAC1B,EAAE,sBAAsB;AAAA,MACxB,mBAAmB;AAAA,IACpB;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,EAAE,eAAe,kBAAkB,sBAAsB,QAAI;AAAA,QAClE,yBAAa,aAAAF,KAAY;AAAA,EAC1B;AACA,QAAM,uBAAmB,iCAAkB,UAAU,GAAI;AAGzD,QAAM,oBACL,WAAW,WAAY,YAAa,KAAK,CAAE;AAC5C,QAAM,6BACL,WAAW,WAAY,YAAa,KAAK;AAE1C,QAAM,yBAAqB,4BAAa,uBAAwB;AAGhE,gCAAW,MAAM;AAChB,QACC,4BAA4B,6BAC5B,uBAAuB,2BACtB;AACD,4BAAsB;AAAA,IACvB;AAAA,EACD,GAAG,CAAE,yBAAyB,oBAAoB,qBAAsB,CAAE;AAE1E,gCAAW,MAAM;AAChB,QAAK,uBAAwB;AAC5B,4BAAsB;AAAA,IACvB;AAAA,EACD,GAAG,CAAE,uBAAuB,qBAAsB,CAAE;AAEpD,QAAM,EAAE,oBAAoB,QAAI,yBAAa,aAAAA,KAAY;AAEzD,QAAM,kBAAkB,MAAM;AAC7B,wBAAqB,KAAM;AAC3B,QAAK,qBAAqB,4BAA6B;AAEtD,oBAAe,GAAI;AAAA,IACpB,OAAO;AAEN,oBAAe,YAAa;AAAA,IAC7B;AAAA,EACD;AACA,QAAM,kBAAkB,MAAM;AAC7B,wBAAqB,iBAAiB,qBAAsB;AAC5D,qBAAkB,CAAE,aAAc;AAAA,EACnC;AAEA,SACC,4EACC;AAAA;AAAA,MAAC,sBAAAG;AAAA,MAAA;AAAA,QACA,MAAK;AAAA,QACL,YAAW;AAAA,QACX,WAAQ,gBAAI,QAAS;AAAA,QACrB,MAAO;AAAA,QACP,YAAa,CAAE;AAAA,QACf,gBAAa,gBAAI,cAAe;AAAA,QAChC,WAAU;AAAA,QAGV,QAAS,4CAAC,SAAI,WAAU,gCAA+B;AAAA,QACvD,QACC;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,WAAU;AAAA,YACV,OAAM;AAAA,YACN,KAAI;AAAA,YAEJ;AAAA,0DAAC,QAAG,WAAU,8CACX,8BAAI,QAAS,GAChB;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACA,WAAU;AAAA,kBACV,WAAU;AAAA,kBACV,OAAM;AAAA,kBACN,SAAQ;AAAA,kBACR,KAAI;AAAA,kBAEF;AAAA,qBAAE,oBACH;AAAA,sBAAC;AAAA;AAAA,wBACA,MAAO;AAAA,wBACP,WAAQ,gBAAI,YAAa;AAAA,wBACzB,WAAY;AAAA,wBACZ,wBAAsB;AAAA,wBACtB,UAAW;AAAA,wBACX,SAAU;AAAA,wBACV,MAAK;AAAA;AAAA,oBACN;AAAA,oBAED;AAAA,sBAAC;AAAA;AAAA,wBACA,WAAQ,gBAAI,WAAY;AAAA,wBACxB,MAAO;AAAA,wBACP,SAAU;AAAA,wBACV,wBAAsB;AAAA,wBACtB,UAAW,CAAE;AAAA,wBACb,WACC,qBACA;AAAA,wBAED,MAAK;AAAA;AAAA,oBACN;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACA,cAAe;AAAA;AAAA,oBAChB;AAAA;AAAA;AAAA,cACD;AAAA;AAAA;AAAA,QACD;AAAA,QAGD;AAAA,UAAC,qBAAAC;AAAA,UAAA;AAAA,YACA,MAAO;AAAA,YACP,cAAe;AAAA,YACf,UAAW;AAAA,YACX,kBAAmB;AAAA,YACnB,6BAA8B;AAAA;AAAA,QAC/B;AAAA;AAAA,IACD;AAAA,IACA,4CAAC,qBAAAC,SAAA,EAAmB;AAAA,KACrB;AAEF;", "names": ["preferencesStore", "interfaceStore", "editorStore", "coreStore", "blockEditorStore", "PluginSidebar", "GlobalStylesUI", "WelcomeGuideStyles"] }