Skip to content

Commit 32d4995

Browse files
Patterns: Rename Library to Patterns (#52102)
1 parent 908fbff commit 32d4995

File tree

31 files changed

+81
-148
lines changed

31 files changed

+81
-148
lines changed

packages/core-commands/src/site-editor-navigation-commands.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,7 @@ function useSiteEditorBasicNavigationCommands() {
203203
icon: symbolFilled,
204204
callback: ( { close } ) => {
205205
const args = {
206-
path: '/library',
206+
path: '/patterns',
207207
};
208208
const targetUrl = addQueryArgs( 'site-editor.php', args );
209209
if ( isSiteEditor ) {

packages/edit-site/src/components/create-pattern-modal/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { useDispatch } from '@wordpress/data';
1818
/**
1919
* Internal dependencies
2020
*/
21-
import { SYNC_TYPES, USER_PATTERN_CATEGORY } from '../page-library/utils';
21+
import { SYNC_TYPES, USER_PATTERN_CATEGORY } from '../page-patterns/utils';
2222

2323
export default function CreatePatternModal( {
2424
closeModal,

packages/edit-site/src/components/page-main/index.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
66
/**
77
* Internal dependencies
88
*/
9-
import PageLibrary from '../page-library';
9+
import PagePatterns from '../page-patterns';
1010
import PageTemplateParts from '../page-template-parts';
1111
import PageTemplates from '../page-templates';
1212
import { unlock } from '../../lock-unlock';
@@ -22,8 +22,8 @@ export default function PageMain() {
2222
return <PageTemplates />;
2323
} else if ( path === '/wp_template_part/all' ) {
2424
return <PageTemplateParts />;
25-
} else if ( path === '/library' ) {
26-
return <PageLibrary />;
25+
} else if ( path === '/patterns' ) {
26+
return <PagePatterns />;
2727
}
2828

2929
return null;

packages/edit-site/src/components/page-library/grid-item.js packages/edit-site/src/components/page-patterns/grid-item.js

+7-7
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ import { useLink } from '../routes/link';
3939

4040
export default function GridItem( { categoryId, composite, icon, item } ) {
4141
const instanceId = useInstanceId( GridItem );
42-
const descriptionId = `edit-site-library__pattern-description-${ instanceId }`;
42+
const descriptionId = `edit-site-patterns__pattern-description-${ instanceId }`;
4343
const [ isDeleteDialogOpen, setIsDeleteDialogOpen ] = useState( false );
4444

4545
const { __experimentalDeleteReusableBlock } =
@@ -61,10 +61,10 @@ export default function GridItem( { categoryId, composite, icon, item } ) {
6161
};
6262

6363
const isEmpty = ! item.blocks?.length;
64-
const patternClassNames = classnames( 'edit-site-library__pattern', {
64+
const patternClassNames = classnames( 'edit-site-patterns__pattern', {
6565
'is-placeholder': isEmpty,
6666
} );
67-
const previewClassNames = classnames( 'edit-site-library__preview', {
67+
const previewClassNames = classnames( 'edit-site-patterns__preview', {
6868
'is-inactive': item.type === PATTERNS,
6969
} );
7070

@@ -132,14 +132,14 @@ export default function GridItem( { categoryId, composite, icon, item } ) {
132132
) }
133133
<HStack
134134
aria-hidden="true"
135-
className="edit-site-library__footer"
135+
className="edit-site-patterns__footer"
136136
justify="space-between"
137137
>
138138
<HStack
139139
alignment="center"
140140
justify="left"
141141
spacing={ 3 }
142-
className="edit-site-library__pattern-title"
142+
className="edit-site-patterns__pattern-title"
143143
>
144144
{ icon && <Icon icon={ itemIcon } /> }
145145
<Heading level={ 5 }>{ item.title }</Heading>
@@ -148,10 +148,10 @@ export default function GridItem( { categoryId, composite, icon, item } ) {
148148
<DropdownMenu
149149
icon={ moreHorizontal }
150150
label={ __( 'Actions' ) }
151-
className="edit-site-library__dropdown"
151+
className="edit-site-patterns__dropdown"
152152
popoverProps={ { placement: 'bottom-end' } }
153153
toggleProps={ {
154-
className: 'edit-site-library__button',
154+
className: 'edit-site-patterns__button',
155155
isSmall: true,
156156
describedBy: sprintf(
157157
/* translators: %s: pattern name */

packages/edit-site/src/components/page-library/grid.js packages/edit-site/src/components/page-patterns/grid.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export default function Grid( { categoryId, label, icon, items } ) {
2222
<Composite
2323
{ ...composite }
2424
role="listbox"
25-
className="edit-site-library__grid"
25+
className="edit-site-patterns__grid"
2626
aria-label={ label }
2727
>
2828
{ items.map( ( item ) => (

packages/edit-site/src/components/page-library/index.js packages/edit-site/src/components/page-patterns/index.js

+5-5
Original file line numberDiff line numberDiff line change
@@ -11,25 +11,25 @@ import { getQueryArgs } from '@wordpress/url';
1111
import { DEFAULT_CATEGORY, DEFAULT_TYPE } from './utils';
1212
import Page from '../page';
1313
import PatternsList from './patterns-list';
14-
import useLibrarySettings from './use-library-settings';
14+
import usePatternSettings from './use-pattern-settings';
1515
import { unlock } from '../../lock-unlock';
1616

1717
const { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis );
1818

19-
export default function PageLibrary() {
19+
export default function PagePatterns() {
2020
const { categoryType, categoryId } = getQueryArgs( window.location.href );
2121
const type = categoryType || DEFAULT_TYPE;
2222
const category = categoryId || DEFAULT_CATEGORY;
23-
const settings = useLibrarySettings();
23+
const settings = usePatternSettings();
2424

2525
// Wrap everything in a block editor provider.
2626
// This ensures 'styles' that are needed for the previews are synced
2727
// from the site editor store to the block editor store.
2828
return (
2929
<ExperimentalBlockEditorProvider settings={ settings }>
3030
<Page
31-
className="edit-site-library"
32-
title={ __( 'Library content' ) }
31+
className="edit-site-patterns"
32+
title={ __( 'Patterns content' ) }
3333
hideTitleFromUI
3434
>
3535
<PatternsList type={ type } categoryId={ category } />

packages/edit-site/src/components/page-library/no-patterns.js packages/edit-site/src/components/page-patterns/no-patterns.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { __ } from '@wordpress/i18n';
55

66
export default function NoPatterns() {
77
return (
8-
<div className="edit-site-library__no-results">
8+
<div className="edit-site-patterns__no-results">
99
{ __( 'No patterns found.' ) }
1010
</div>
1111
);

packages/edit-site/src/components/page-library/patterns-list.js packages/edit-site/src/components/page-patterns/patterns-list.js

+6-6
Original file line numberDiff line numberDiff line change
@@ -51,19 +51,19 @@ export default function PatternsList( { categoryId, type } ) {
5151
icon={ isRTL() ? chevronRight : chevronLeft }
5252
label={ __( 'Back' ) }
5353
onClick={ () => {
54-
// Go back in history if we came from the library page.
54+
// Go back in history if we came from the Patterns page.
5555
// Otherwise push a stack onto the history.
56-
if ( location.state?.backPath === '/library' ) {
56+
if ( location.state?.backPath === '/patterns' ) {
5757
history.back();
5858
} else {
59-
history.push( { path: '/library' } );
59+
history.push( { path: '/patterns' } );
6060
}
6161
} }
6262
/>
6363
) }
6464
<FlexBlock>
6565
<SearchControl
66-
className="edit-site-library__search"
66+
className="edit-site-patterns__search"
6767
onChange={ ( value ) => setFilterValue( value ) }
6868
placeholder={ __( 'Search patterns' ) }
6969
label={ __( 'Search patterns' ) }
@@ -75,7 +75,7 @@ export default function PatternsList( { categoryId, type } ) {
7575
{ isResolving && __( 'Loading' ) }
7676
{ ! isResolving && !! syncedPatterns.length && (
7777
<>
78-
<VStack className="edit-site-library__section-header">
78+
<VStack className="edit-site-patterns__section-header">
7979
<Heading level={ 4 }>{ __( 'Synced' ) }</Heading>
8080
<Text variant="muted" as="p">
8181
{ __(
@@ -93,7 +93,7 @@ export default function PatternsList( { categoryId, type } ) {
9393
) }
9494
{ ! isResolving && !! unsyncedPatterns.length && (
9595
<>
96-
<VStack className="edit-site-library__section-header">
96+
<VStack className="edit-site-patterns__section-header">
9797
<Heading level={ 4 }>{ __( 'Standard' ) }</Heading>
9898
<Text variant="muted" as="p">
9999
{ __(

packages/edit-site/src/components/page-library/style.scss packages/edit-site/src/components/page-patterns/style.scss

+11-11
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
.edit-site-library {
1+
.edit-site-patterns {
22
background: rgba(0, 0, 0, 0.05);
33
margin: $header-height 0 0;
44
.components-text {
@@ -14,7 +14,7 @@
1414
}
1515
}
1616

17-
.edit-site-library__grid {
17+
.edit-site-patterns__grid {
1818
column-gap: $grid-unit-30;
1919
@include break-large() {
2020
column-count: 2;
@@ -25,13 +25,13 @@
2525
padding-top: $border-width-focus-fallback;
2626
margin-bottom: $grid-unit-40;
2727

28-
.edit-site-library__pattern {
28+
.edit-site-patterns__pattern {
2929
break-inside: avoid-column;
3030
display: flex;
3131
flex-direction: column;
3232
margin-bottom: $grid-unit-60;
3333

34-
.edit-site-library__preview {
34+
.edit-site-patterns__preview {
3535
border-radius: $radius-block-ui;
3636
cursor: pointer;
3737
overflow: hidden;
@@ -48,12 +48,12 @@
4848
}
4949
}
5050

51-
.edit-site-library__footer,
52-
.edit-site-library__button {
51+
.edit-site-patterns__footer,
52+
.edit-site-patterns__button {
5353
color: $gray-600;
5454
}
5555

56-
&.is-placeholder .edit-site-library__preview {
56+
&.is-placeholder .edit-site-patterns__preview {
5757
min-height: $grid-unit-80;
5858
color: $gray-600;
5959
border: 1px dashed $gray-800;
@@ -67,15 +67,15 @@
6767
}
6868
}
6969

70-
.edit-site-library__preview {
70+
.edit-site-patterns__preview {
7171
flex: 1;
7272
margin-bottom: $grid-unit-20;
7373
}
7474
}
7575

7676
// The increased specificity here is to overcome component styles
7777
// without relying on internal component class names.
78-
.edit-site-library__search {
78+
.edit-site-patterns__search {
7979
&#{&} input[type="search"] {
8080
background: $gray-800;
8181
color: $gray-200;
@@ -90,7 +90,7 @@
9090
}
9191
}
9292

93-
.edit-site-library__pattern-title {
93+
.edit-site-patterns__pattern-title {
9494
color: $gray-600;
9595

9696
svg {
@@ -100,6 +100,6 @@
100100
}
101101
}
102102

103-
.edit-site-library__no-results {
103+
.edit-site-patterns__no-results {
104104
color: $gray-600;
105105
}

packages/edit-site/src/components/page-library/use-library-settings.js packages/edit-site/src/components/page-patterns/use-pattern-settings.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { unlock } from '../../lock-unlock';
1212
import { store as editSiteStore } from '../../store';
1313
import { filterOutDuplicatesByName } from './utils';
1414

15-
export default function useLibrarySettings() {
15+
export default function usePatternSettings() {
1616
const storedSettings = useSelect( ( select ) => {
1717
const { getSettings } = unlock( select( editSiteStore ) );
1818
return getSettings();

packages/edit-site/src/components/sidebar-navigation-screen-library/style.scss

-3
This file was deleted.

packages/edit-site/src/components/sidebar-navigation-screen-main/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -75,11 +75,11 @@ export default function SidebarNavigationScreenMain() {
7575
</NavigatorButton>
7676
<NavigatorButton
7777
as={ SidebarNavigationItem }
78-
path="/library"
78+
path="/patterns"
7979
withChevron
8080
icon={ symbol }
8181
>
82-
{ __( 'Library' ) }
82+
{ __( 'Patterns' ) }
8383
</NavigatorButton>
8484
</ItemGroup>
8585
}

packages/edit-site/src/components/sidebar-navigation-screen-pattern/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export default function SidebarNavigationScreenPattern() {
3333
const backPath =
3434
! categoryType && postType === 'wp_template_part'
3535
? '/wp_template_part/all'
36-
: '/library';
36+
: '/patterns';
3737

3838
return (
3939
<SidebarNavigationScreen

packages/edit-site/src/components/sidebar-navigation-screen-library/category-item.js packages/edit-site/src/components/sidebar-navigation-screen-patterns/category-item.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,15 @@ export default function CategoryItem( {
1414
} ) {
1515
const linkInfo = useLink(
1616
{
17-
path: '/library',
17+
path: '/patterns',
1818
categoryType: type,
1919
categoryId: id,
2020
},
2121
{
2222
// Keep a record of where we came from in state so we can
23-
// use the browser's back button to go back to the library.
23+
// use the browser's back button to go back to Patterns.
2424
// See the implementation of the back button in patterns-list.
25-
backPath: '/library',
25+
backPath: '/patterns',
2626
}
2727
);
2828

packages/edit-site/src/components/sidebar-navigation-screen-library/index.js packages/edit-site/src/components/sidebar-navigation-screen-patterns/index.js

+8-8
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import AddNewPattern from '../add-new-pattern';
1919
import SidebarNavigationItem from '../sidebar-navigation-item';
2020
import SidebarNavigationScreen from '../sidebar-navigation-screen';
2121
import CategoryItem from './category-item';
22-
import { DEFAULT_CATEGORY, DEFAULT_TYPE } from '../page-library/utils';
22+
import { DEFAULT_CATEGORY, DEFAULT_TYPE } from '../page-patterns/utils';
2323
import { store as editSiteStore } from '../../store';
2424
import { useLink } from '../routes/link';
2525
import usePatternCategories from './use-pattern-categories';
@@ -33,7 +33,7 @@ const templatePartAreaLabels = {
3333
uncategorized: __( 'Uncategorized' ),
3434
};
3535

36-
export default function SidebarNavigationScreenLibrary() {
36+
export default function SidebarNavigationScreenPatterns() {
3737
const isMobileViewport = useViewportMatch( 'medium', '<' );
3838
const { categoryType, categoryId } = getQueryArgs( window.location.href );
3939
const currentCategory = categoryId || DEFAULT_CATEGORY;
@@ -68,19 +68,19 @@ export default function SidebarNavigationScreenLibrary() {
6868
return (
6969
<SidebarNavigationScreen
7070
isRoot={ isTemplatePartsMode }
71-
title={ __( 'Library' ) }
71+
title={ __( 'Patterns' ) }
7272
description={ __(
7373
'Manage what patterns are available when editing your site.'
7474
) }
7575
actions={ <AddNewPattern /> }
7676
footer={ footer }
7777
content={
7878
<>
79-
{ isLoading && __( 'Loading library' ) }
79+
{ isLoading && __( 'Loading patterns' ) }
8080
{ ! isLoading && (
8181
<>
8282
{ ! hasTemplateParts && ! hasPatterns && (
83-
<ItemGroup className="edit-site-sidebar-navigation-screen-library__group">
83+
<ItemGroup className="edit-site-sidebar-navigation-screen-patterns__group">
8484
<Item>
8585
{ __(
8686
'No template parts or patterns found'
@@ -89,7 +89,7 @@ export default function SidebarNavigationScreenLibrary() {
8989
</ItemGroup>
9090
) }
9191
{ hasMyPatterns && (
92-
<ItemGroup className="edit-site-sidebar-navigation-screen-library__group">
92+
<ItemGroup className="edit-site-sidebar-navigation-screen-patterns__group">
9393
<CategoryItem
9494
key={ myPatterns.name }
9595
count={ myPatterns.count }
@@ -106,7 +106,7 @@ export default function SidebarNavigationScreenLibrary() {
106106
</ItemGroup>
107107
) }
108108
{ hasTemplateParts && (
109-
<ItemGroup className="edit-site-sidebar-navigation-screen-library__group">
109+
<ItemGroup className="edit-site-sidebar-navigation-screen-patterns__group">
110110
{ Object.entries( templatePartAreas ).map(
111111
( [ area, parts ] ) => (
112112
<CategoryItem
@@ -133,7 +133,7 @@ export default function SidebarNavigationScreenLibrary() {
133133
</ItemGroup>
134134
) }
135135
{ hasPatterns && (
136-
<ItemGroup className="edit-site-sidebar-navigation-screen-library__group">
136+
<ItemGroup className="edit-site-sidebar-navigation-screen-patterns__group">
137137
{ patternCategories.map( ( category ) => (
138138
<CategoryItem
139139
key={ category.name }
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.edit-site-sidebar-navigation-screen-patterns__group {
2+
margin-bottom: $grid-unit-30;
3+
}

packages/edit-site/src/components/sidebar-navigation-screen-library/use-theme-patterns.js packages/edit-site/src/components/sidebar-navigation-screen-patterns/use-theme-patterns.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { useMemo } from '@wordpress/element';
1111
import {
1212
CORE_PATTERN_SOURCES,
1313
filterOutDuplicatesByName,
14-
} from '../page-library/utils';
14+
} from '../page-patterns/utils';
1515
import { unlock } from '../../lock-unlock';
1616
import { store as editSiteStore } from '../../store';
1717

0 commit comments

Comments
 (0)