@wordpress/patterns 1.3.2 → 1.3.4
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/build/components/category-selector.js +16 -31
- package/build/components/category-selector.js.map +1 -1
- package/build/components/create-pattern-modal.js +44 -4
- package/build/components/create-pattern-modal.js.map +1 -1
- package/build-module/components/category-selector.js +17 -32
- package/build-module/components/category-selector.js.map +1 -1
- package/build-module/components/create-pattern-modal.js +46 -6
- package/build-module/components/create-pattern-modal.js.map +1 -1
- package/build-style/style-rtl.css +22 -2
- package/build-style/style.css +22 -2
- package/package.json +15 -15
- package/src/components/category-selector.js +28 -42
- package/src/components/create-pattern-modal.js +47 -4
- package/src/components/style.scss +28 -2
|
@@ -8,8 +8,6 @@ exports.default = CategorySelector;
|
|
|
8
8
|
var _element = require("@wordpress/element");
|
|
9
9
|
var _i18n = require("@wordpress/i18n");
|
|
10
10
|
var _components = require("@wordpress/components");
|
|
11
|
-
var _data = require("@wordpress/data");
|
|
12
|
-
var _coreData = require("@wordpress/core-data");
|
|
13
11
|
var _compose = require("@wordpress/compose");
|
|
14
12
|
var _htmlEntities = require("@wordpress/html-entities");
|
|
15
13
|
/**
|
|
@@ -19,37 +17,23 @@ var _htmlEntities = require("@wordpress/html-entities");
|
|
|
19
17
|
const unescapeString = arg => {
|
|
20
18
|
return (0, _htmlEntities.decodeEntities)(arg);
|
|
21
19
|
};
|
|
22
|
-
const EMPTY_ARRAY = [];
|
|
23
|
-
const MAX_TERMS_SUGGESTIONS = 20;
|
|
24
|
-
const DEFAULT_QUERY = {
|
|
25
|
-
per_page: MAX_TERMS_SUGGESTIONS,
|
|
26
|
-
_fields: 'id,name',
|
|
27
|
-
context: 'view'
|
|
28
|
-
};
|
|
29
20
|
const CATEGORY_SLUG = 'wp_pattern_category';
|
|
30
21
|
exports.CATEGORY_SLUG = CATEGORY_SLUG;
|
|
31
22
|
function CategorySelector({
|
|
32
|
-
|
|
33
|
-
onChange
|
|
23
|
+
categoryTerms,
|
|
24
|
+
onChange,
|
|
25
|
+
categoryMap
|
|
34
26
|
}) {
|
|
35
27
|
const [search, setSearch] = (0, _element.useState)('');
|
|
36
28
|
const debouncedSearch = (0, _compose.useDebounce)(setSearch, 500);
|
|
37
|
-
const {
|
|
38
|
-
searchResults
|
|
39
|
-
} = (0, _data.useSelect)(select => {
|
|
40
|
-
const {
|
|
41
|
-
getEntityRecords
|
|
42
|
-
} = select(_coreData.store);
|
|
43
|
-
return {
|
|
44
|
-
searchResults: !!search ? getEntityRecords('taxonomy', CATEGORY_SLUG, {
|
|
45
|
-
...DEFAULT_QUERY,
|
|
46
|
-
search
|
|
47
|
-
}) : EMPTY_ARRAY
|
|
48
|
-
};
|
|
49
|
-
}, [search]);
|
|
50
29
|
const suggestions = (0, _element.useMemo)(() => {
|
|
51
|
-
return (
|
|
52
|
-
|
|
30
|
+
return Array.from(categoryMap.values()).map(category => unescapeString(category.label)).filter(category => {
|
|
31
|
+
if (search !== '') {
|
|
32
|
+
return category.toLowerCase().includes(search.toLowerCase());
|
|
33
|
+
}
|
|
34
|
+
return true;
|
|
35
|
+
}).sort((a, b) => a.localeCompare(b));
|
|
36
|
+
}, [search, categoryMap]);
|
|
53
37
|
function handleChange(termNames) {
|
|
54
38
|
const uniqueTerms = termNames.reduce((terms, newTerm) => {
|
|
55
39
|
if (!terms.some(term => term.toLowerCase() === newTerm.toLowerCase())) {
|
|
@@ -59,15 +43,16 @@ function CategorySelector({
|
|
|
59
43
|
}, []);
|
|
60
44
|
onChange(uniqueTerms);
|
|
61
45
|
}
|
|
62
|
-
return (0, _element.createElement)(
|
|
46
|
+
return (0, _element.createElement)(_components.FormTokenField, {
|
|
63
47
|
className: "patterns-menu-items__convert-modal-categories",
|
|
64
|
-
value:
|
|
48
|
+
value: categoryTerms,
|
|
65
49
|
suggestions: suggestions,
|
|
66
50
|
onChange: handleChange,
|
|
67
51
|
onInputChange: debouncedSearch,
|
|
68
|
-
maxSuggestions: MAX_TERMS_SUGGESTIONS,
|
|
69
52
|
label: (0, _i18n.__)('Categories'),
|
|
70
|
-
tokenizeOnBlur: true
|
|
71
|
-
|
|
53
|
+
tokenizeOnBlur: true,
|
|
54
|
+
__experimentalExpandOnFocus: true,
|
|
55
|
+
__next40pxDefaultSize: true
|
|
56
|
+
});
|
|
72
57
|
}
|
|
73
58
|
//# sourceMappingURL=category-selector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_element","require","_i18n","_components","
|
|
1
|
+
{"version":3,"names":["_element","require","_i18n","_components","_compose","_htmlEntities","unescapeString","arg","decodeEntities","CATEGORY_SLUG","exports","CategorySelector","categoryTerms","onChange","categoryMap","search","setSearch","useState","debouncedSearch","useDebounce","suggestions","useMemo","Array","from","values","map","category","label","filter","toLowerCase","includes","sort","a","b","localeCompare","handleChange","termNames","uniqueTerms","reduce","terms","newTerm","some","term","push","createElement","FormTokenField","className","value","onInputChange","__","tokenizeOnBlur","__experimentalExpandOnFocus","__next40pxDefaultSize"],"sources":["@wordpress/patterns/src/components/category-selector.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { FormTokenField } from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\n\nconst unescapeString = ( arg ) => {\n\treturn decodeEntities( arg );\n};\n\nexport const CATEGORY_SLUG = 'wp_pattern_category';\n\nexport default function CategorySelector( {\n\tcategoryTerms,\n\tonChange,\n\tcategoryMap,\n} ) {\n\tconst [ search, setSearch ] = useState( '' );\n\tconst debouncedSearch = useDebounce( setSearch, 500 );\n\n\tconst suggestions = useMemo( () => {\n\t\treturn Array.from( categoryMap.values() )\n\t\t\t.map( ( category ) => unescapeString( category.label ) )\n\t\t\t.filter( ( category ) => {\n\t\t\t\tif ( search !== '' ) {\n\t\t\t\t\treturn category\n\t\t\t\t\t\t.toLowerCase()\n\t\t\t\t\t\t.includes( search.toLowerCase() );\n\t\t\t\t}\n\t\t\t\treturn true;\n\t\t\t} )\n\t\t\t.sort( ( a, b ) => a.localeCompare( b ) );\n\t}, [ search, categoryMap ] );\n\n\tfunction handleChange( termNames ) {\n\t\tconst uniqueTerms = termNames.reduce( ( terms, newTerm ) => {\n\t\t\tif (\n\t\t\t\t! terms.some(\n\t\t\t\t\t( term ) => term.toLowerCase() === newTerm.toLowerCase()\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tterms.push( newTerm );\n\t\t\t}\n\t\t\treturn terms;\n\t\t}, [] );\n\n\t\tonChange( uniqueTerms );\n\t}\n\n\treturn (\n\t\t<FormTokenField\n\t\t\tclassName=\"patterns-menu-items__convert-modal-categories\"\n\t\t\tvalue={ categoryTerms }\n\t\t\tsuggestions={ suggestions }\n\t\t\tonChange={ handleChange }\n\t\t\tonInputChange={ debouncedSearch }\n\t\t\tlabel={ __( 'Categories' ) }\n\t\t\ttokenizeOnBlur\n\t\t\t__experimentalExpandOnFocus\n\t\t\t__next40pxDefaultSize\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;AAIA,IAAAA,QAAA,GAAAC,OAAA;AADA,IAAAC,KAAA,GAAAD,OAAA;AAEA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AAPA;AACA;AACA;;AAOA,MAAMK,cAAc,GAAKC,GAAG,IAAM;EACjC,OAAO,IAAAC,4BAAc,EAAED,GAAI,CAAC;AAC7B,CAAC;AAEM,MAAME,aAAa,GAAG,qBAAqB;AAACC,OAAA,CAAAD,aAAA,GAAAA,aAAA;AAEpC,SAASE,gBAAgBA,CAAE;EACzCC,aAAa;EACbC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAG,IAAAC,iBAAQ,EAAE,EAAG,CAAC;EAC5C,MAAMC,eAAe,GAAG,IAAAC,oBAAW,EAAEH,SAAS,EAAE,GAAI,CAAC;EAErD,MAAMI,WAAW,GAAG,IAAAC,gBAAO,EAAE,MAAM;IAClC,OAAOC,KAAK,CAACC,IAAI,CAAET,WAAW,CAACU,MAAM,CAAC,CAAE,CAAC,CACvCC,GAAG,CAAIC,QAAQ,IAAMpB,cAAc,CAAEoB,QAAQ,CAACC,KAAM,CAAE,CAAC,CACvDC,MAAM,CAAIF,QAAQ,IAAM;MACxB,IAAKX,MAAM,KAAK,EAAE,EAAG;QACpB,OAAOW,QAAQ,CACbG,WAAW,CAAC,CAAC,CACbC,QAAQ,CAAEf,MAAM,CAACc,WAAW,CAAC,CAAE,CAAC;MACnC;MACA,OAAO,IAAI;IACZ,CAAE,CAAC,CACFE,IAAI,CAAE,CAAEC,CAAC,EAAEC,CAAC,KAAMD,CAAC,CAACE,aAAa,CAAED,CAAE,CAAE,CAAC;EAC3C,CAAC,EAAE,CAAElB,MAAM,EAAED,WAAW,CAAG,CAAC;EAE5B,SAASqB,YAAYA,CAAEC,SAAS,EAAG;IAClC,MAAMC,WAAW,GAAGD,SAAS,CAACE,MAAM,CAAE,CAAEC,KAAK,EAAEC,OAAO,KAAM;MAC3D,IACC,CAAED,KAAK,CAACE,IAAI,CACTC,IAAI,IAAMA,IAAI,CAACb,WAAW,CAAC,CAAC,KAAKW,OAAO,CAACX,WAAW,CAAC,CACxD,CAAC,EACA;QACDU,KAAK,CAACI,IAAI,CAAEH,OAAQ,CAAC;MACtB;MACA,OAAOD,KAAK;IACb,CAAC,EAAE,EAAG,CAAC;IAEP1B,QAAQ,CAAEwB,WAAY,CAAC;EACxB;EAEA,OACC,IAAArC,QAAA,CAAA4C,aAAA,EAACzC,WAAA,CAAA0C,cAAc;IACdC,SAAS,EAAC,+CAA+C;IACzDC,KAAK,EAAGnC,aAAe;IACvBQ,WAAW,EAAGA,WAAa;IAC3BP,QAAQ,EAAGsB,YAAc;IACzBa,aAAa,EAAG9B,eAAiB;IACjCS,KAAK,EAAG,IAAAsB,QAAE,EAAE,YAAa,CAAG;IAC5BC,cAAc;IACdC,2BAA2B;IAC3BC,qBAAqB;EAAA,CACrB,CAAC;AAEJ"}
|
|
@@ -49,6 +49,38 @@ function CreatePatternModal({
|
|
|
49
49
|
const {
|
|
50
50
|
createErrorNotice
|
|
51
51
|
} = (0, _data.useDispatch)(_notices.store);
|
|
52
|
+
const {
|
|
53
|
+
corePatternCategories,
|
|
54
|
+
userPatternCategories
|
|
55
|
+
} = (0, _data.useSelect)(select => {
|
|
56
|
+
const {
|
|
57
|
+
getUserPatternCategories,
|
|
58
|
+
getBlockPatternCategories
|
|
59
|
+
} = select(_coreData.store);
|
|
60
|
+
return {
|
|
61
|
+
corePatternCategories: getBlockPatternCategories(),
|
|
62
|
+
userPatternCategories: getUserPatternCategories()
|
|
63
|
+
};
|
|
64
|
+
});
|
|
65
|
+
const categoryMap = (0, _element.useMemo)(() => {
|
|
66
|
+
// Merge the user and core pattern categories and remove any duplicates.
|
|
67
|
+
const uniqueCategories = new Map();
|
|
68
|
+
[...userPatternCategories, ...corePatternCategories].forEach(category => {
|
|
69
|
+
if (!uniqueCategories.has(category.label) &&
|
|
70
|
+
// There are two core categories with `Post` label so explicitly remove the one with
|
|
71
|
+
// the `query` slug to avoid any confusion.
|
|
72
|
+
category.name !== 'query') {
|
|
73
|
+
// We need to store the name separately as this is used as the slug in the
|
|
74
|
+
// taxonomy and may vary from the label.
|
|
75
|
+
uniqueCategories.set(category.label, {
|
|
76
|
+
label: category.label,
|
|
77
|
+
value: category.label,
|
|
78
|
+
name: category.name
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
return uniqueCategories;
|
|
83
|
+
}, [userPatternCategories, corePatternCategories]);
|
|
52
84
|
async function onCreate(patternTitle, sync) {
|
|
53
85
|
if (!title || isSaving) {
|
|
54
86
|
return;
|
|
@@ -80,9 +112,16 @@ function CreatePatternModal({
|
|
|
80
112
|
*/
|
|
81
113
|
async function findOrCreateTerm(term) {
|
|
82
114
|
try {
|
|
83
|
-
|
|
115
|
+
// We need to match any existing term to the correct slug to prevent duplicates, eg.
|
|
116
|
+
// the core `Headers` category uses the singular `header` as the slug.
|
|
117
|
+
const existingTerm = categoryMap.get(term);
|
|
118
|
+
const termData = existingTerm ? {
|
|
119
|
+
name: existingTerm.label,
|
|
120
|
+
slug: existingTerm.name
|
|
121
|
+
} : {
|
|
84
122
|
name: term
|
|
85
|
-
}
|
|
123
|
+
};
|
|
124
|
+
const newTerm = await saveEntityRecord('taxonomy', _categorySelector.CATEGORY_SLUG, termData, {
|
|
86
125
|
throwOnError: true
|
|
87
126
|
});
|
|
88
127
|
invalidateResolution('getUserPatternCategories');
|
|
@@ -116,8 +155,9 @@ function CreatePatternModal({
|
|
|
116
155
|
placeholder: (0, _i18n.__)('My pattern'),
|
|
117
156
|
className: "patterns-create-modal__name-input"
|
|
118
157
|
}), (0, _element.createElement)(_categorySelector.default, {
|
|
119
|
-
|
|
120
|
-
onChange: setCategoryTerms
|
|
158
|
+
categoryTerms: categoryTerms,
|
|
159
|
+
onChange: setCategoryTerms,
|
|
160
|
+
categoryMap: categoryMap
|
|
121
161
|
}), (0, _element.createElement)(_components.ToggleControl, {
|
|
122
162
|
label: (0, _i18n.__)('Synced'),
|
|
123
163
|
help: (0, _i18n.__)('Editing the pattern will update it anywhere it is used.'),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_element","require","_components","_i18n","_data","_notices","_coreData","_constants","_store","_categorySelector","_interopRequireWildcard","_lockUnlock","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","CreatePatternModal","onSuccess","onError","content","onClose","className","syncType","setSyncType","useState","PATTERN_SYNC_TYPES","full","categoryTerms","setCategoryTerms","title","setTitle","isSaving","setIsSaving","createPattern","unlock","useDispatch","patternsStore","saveEntityRecord","invalidateResolution","coreStore","createErrorNotice","noticesStore","onCreate","patternTitle","sync","categories","Promise","all","map","termName","findOrCreateTerm","newPattern","pattern","categoryId","PATTERN_DEFAULT_CATEGORY","error","message","type","id","term","newTerm","CATEGORY_SLUG","name","throwOnError","code","data","term_id","createElement","Modal","__","onRequestClose","overlayClassName","onSubmit","event","preventDefault","__experimentalVStack","spacing","TextControl","__nextHasNoMarginBottom","label","value","onChange","placeholder","values","ToggleControl","help","checked","unsynced","__experimentalHStack","justify","Button","variant","onClick","isBusy"],"sources":["@wordpress/patterns/src/components/create-pattern-modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tModal,\n\tButton,\n\tTextControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tToggleControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { PATTERN_DEFAULT_CATEGORY, PATTERN_SYNC_TYPES } from '../constants';\n\n/**\n * Internal dependencies\n */\nimport { store as patternsStore } from '../store';\nimport CategorySelector, { CATEGORY_SLUG } from './category-selector';\nimport { unlock } from '../lock-unlock';\n\nexport default function CreatePatternModal( {\n\tonSuccess,\n\tonError,\n\tcontent,\n\tonClose,\n\tclassName = 'patterns-menu-items__convert-modal',\n} ) {\n\tconst [ syncType, setSyncType ] = useState( PATTERN_SYNC_TYPES.full );\n\tconst [ categoryTerms, setCategoryTerms ] = useState( [] );\n\tconst [ title, setTitle ] = useState( '' );\n\tconst [ isSaving, setIsSaving ] = useState( false );\n\tconst { createPattern } = unlock( useDispatch( patternsStore ) );\n\tconst { saveEntityRecord, invalidateResolution } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tasync function onCreate( patternTitle, sync ) {\n\t\tif ( ! title || isSaving ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSaving( true );\n\t\t\tconst categories = await Promise.all(\n\t\t\t\tcategoryTerms.map( ( termName ) =>\n\t\t\t\t\tfindOrCreateTerm( termName )\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tconst newPattern = await createPattern(\n\t\t\t\tpatternTitle,\n\t\t\t\tsync,\n\t\t\t\ttypeof content === 'function' ? content() : content,\n\t\t\t\tcategories\n\t\t\t);\n\t\t\tonSuccess( {\n\t\t\t\tpattern: newPattern,\n\t\t\t\tcategoryId: PATTERN_DEFAULT_CATEGORY,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tcreateErrorNotice( error.message, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'convert-to-pattern-error',\n\t\t\t} );\n\t\t\tonError();\n\t\t} finally {\n\t\t\tsetIsSaving( false );\n\t\t\tsetCategoryTerms( [] );\n\t\t\tsetTitle( '' );\n\t\t}\n\t}\n\n\t/**\n\t * @param {string} term\n\t * @return {Promise<number>} The pattern category id.\n\t */\n\tasync function findOrCreateTerm( term ) {\n\t\ttry {\n\t\t\tconst newTerm = await saveEntityRecord(\n\t\t\t\t'taxonomy',\n\t\t\t\tCATEGORY_SLUG,\n\t\t\t\t{ name: term },\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tinvalidateResolution( 'getUserPatternCategories' );\n\t\t\treturn newTerm.id;\n\t\t} catch ( error ) {\n\t\t\tif ( error.code !== 'term_exists' ) {\n\t\t\t\tthrow error;\n\t\t\t}\n\n\t\t\treturn error.data.term_id;\n\t\t}\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Create pattern' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tonClose();\n\t\t\t\tsetTitle( '' );\n\t\t\t} }\n\t\t\toverlayClassName={ className }\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tonCreate( title, syncType );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<VStack spacing=\"5\">\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\t\tvalue={ title }\n\t\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\t\tplaceholder={ __( 'My pattern' ) }\n\t\t\t\t\t\tclassName=\"patterns-create-modal__name-input\"\n\t\t\t\t\t/>\n\t\t\t\t\t<CategorySelector\n\t\t\t\t\t\tvalues={ categoryTerms }\n\t\t\t\t\t\tonChange={ setCategoryTerms }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Synced' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Editing the pattern will update it anywhere it is used.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ syncType === PATTERN_SYNC_TYPES.full }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tsetSyncType(\n\t\t\t\t\t\t\t\tsyncType === PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t\t\t? PATTERN_SYNC_TYPES.unsynced\n\t\t\t\t\t\t\t\t\t: PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\tsetTitle( '' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\taria-disabled={ ! title || isSaving }\n\t\t\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Create' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\t\t\t\t</VStack>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["_element","require","_components","_i18n","_data","_notices","_coreData","_constants","_store","_categorySelector","_interopRequireWildcard","_lockUnlock","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","CreatePatternModal","onSuccess","onError","content","onClose","className","syncType","setSyncType","useState","PATTERN_SYNC_TYPES","full","categoryTerms","setCategoryTerms","title","setTitle","isSaving","setIsSaving","createPattern","unlock","useDispatch","patternsStore","saveEntityRecord","invalidateResolution","coreStore","createErrorNotice","noticesStore","corePatternCategories","userPatternCategories","useSelect","select","getUserPatternCategories","getBlockPatternCategories","categoryMap","useMemo","uniqueCategories","Map","forEach","category","label","name","value","onCreate","patternTitle","sync","categories","Promise","all","map","termName","findOrCreateTerm","newPattern","pattern","categoryId","PATTERN_DEFAULT_CATEGORY","error","message","type","id","term","existingTerm","termData","slug","newTerm","CATEGORY_SLUG","throwOnError","code","data","term_id","createElement","Modal","__","onRequestClose","overlayClassName","onSubmit","event","preventDefault","__experimentalVStack","spacing","TextControl","__nextHasNoMarginBottom","onChange","placeholder","ToggleControl","help","checked","unsynced","__experimentalHStack","justify","Button","variant","onClick","isBusy"],"sources":["@wordpress/patterns/src/components/create-pattern-modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tModal,\n\tButton,\n\tTextControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tToggleControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { PATTERN_DEFAULT_CATEGORY, PATTERN_SYNC_TYPES } from '../constants';\n\n/**\n * Internal dependencies\n */\nimport { store as patternsStore } from '../store';\nimport CategorySelector, { CATEGORY_SLUG } from './category-selector';\nimport { unlock } from '../lock-unlock';\n\nexport default function CreatePatternModal( {\n\tonSuccess,\n\tonError,\n\tcontent,\n\tonClose,\n\tclassName = 'patterns-menu-items__convert-modal',\n} ) {\n\tconst [ syncType, setSyncType ] = useState( PATTERN_SYNC_TYPES.full );\n\tconst [ categoryTerms, setCategoryTerms ] = useState( [] );\n\tconst [ title, setTitle ] = useState( '' );\n\tconst [ isSaving, setIsSaving ] = useState( false );\n\tconst { createPattern } = unlock( useDispatch( patternsStore ) );\n\tconst { saveEntityRecord, invalidateResolution } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tconst { corePatternCategories, userPatternCategories } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getUserPatternCategories, getBlockPatternCategories } =\n\t\t\t\tselect( coreStore );\n\n\t\t\treturn {\n\t\t\t\tcorePatternCategories: getBlockPatternCategories(),\n\t\t\t\tuserPatternCategories: getUserPatternCategories(),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst categoryMap = useMemo( () => {\n\t\t// Merge the user and core pattern categories and remove any duplicates.\n\t\tconst uniqueCategories = new Map();\n\t\t[ ...userPatternCategories, ...corePatternCategories ].forEach(\n\t\t\t( category ) => {\n\t\t\t\tif (\n\t\t\t\t\t! uniqueCategories.has( category.label ) &&\n\t\t\t\t\t// There are two core categories with `Post` label so explicitly remove the one with\n\t\t\t\t\t// the `query` slug to avoid any confusion.\n\t\t\t\t\tcategory.name !== 'query'\n\t\t\t\t) {\n\t\t\t\t\t// We need to store the name separately as this is used as the slug in the\n\t\t\t\t\t// taxonomy and may vary from the label.\n\t\t\t\t\tuniqueCategories.set( category.label, {\n\t\t\t\t\t\tlabel: category.label,\n\t\t\t\t\t\tvalue: category.label,\n\t\t\t\t\t\tname: category.name,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t\treturn uniqueCategories;\n\t}, [ userPatternCategories, corePatternCategories ] );\n\n\tasync function onCreate( patternTitle, sync ) {\n\t\tif ( ! title || isSaving ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSaving( true );\n\t\t\tconst categories = await Promise.all(\n\t\t\t\tcategoryTerms.map( ( termName ) =>\n\t\t\t\t\tfindOrCreateTerm( termName )\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tconst newPattern = await createPattern(\n\t\t\t\tpatternTitle,\n\t\t\t\tsync,\n\t\t\t\ttypeof content === 'function' ? content() : content,\n\t\t\t\tcategories\n\t\t\t);\n\t\t\tonSuccess( {\n\t\t\t\tpattern: newPattern,\n\t\t\t\tcategoryId: PATTERN_DEFAULT_CATEGORY,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tcreateErrorNotice( error.message, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'convert-to-pattern-error',\n\t\t\t} );\n\t\t\tonError();\n\t\t} finally {\n\t\t\tsetIsSaving( false );\n\t\t\tsetCategoryTerms( [] );\n\t\t\tsetTitle( '' );\n\t\t}\n\t}\n\n\t/**\n\t * @param {string} term\n\t * @return {Promise<number>} The pattern category id.\n\t */\n\tasync function findOrCreateTerm( term ) {\n\t\ttry {\n\t\t\t// We need to match any existing term to the correct slug to prevent duplicates, eg.\n\t\t\t// the core `Headers` category uses the singular `header` as the slug.\n\t\t\tconst existingTerm = categoryMap.get( term );\n\t\t\tconst termData = existingTerm\n\t\t\t\t? { name: existingTerm.label, slug: existingTerm.name }\n\t\t\t\t: { name: term };\n\t\t\tconst newTerm = await saveEntityRecord(\n\t\t\t\t'taxonomy',\n\t\t\t\tCATEGORY_SLUG,\n\t\t\t\ttermData,\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tinvalidateResolution( 'getUserPatternCategories' );\n\t\t\treturn newTerm.id;\n\t\t} catch ( error ) {\n\t\t\tif ( error.code !== 'term_exists' ) {\n\t\t\t\tthrow error;\n\t\t\t}\n\n\t\t\treturn error.data.term_id;\n\t\t}\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Create pattern' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tonClose();\n\t\t\t\tsetTitle( '' );\n\t\t\t} }\n\t\t\toverlayClassName={ className }\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tonCreate( title, syncType );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<VStack spacing=\"5\">\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\t\tvalue={ title }\n\t\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\t\tplaceholder={ __( 'My pattern' ) }\n\t\t\t\t\t\tclassName=\"patterns-create-modal__name-input\"\n\t\t\t\t\t/>\n\t\t\t\t\t<CategorySelector\n\t\t\t\t\t\tcategoryTerms={ categoryTerms }\n\t\t\t\t\t\tonChange={ setCategoryTerms }\n\t\t\t\t\t\tcategoryMap={ categoryMap }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Synced' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Editing the pattern will update it anywhere it is used.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ syncType === PATTERN_SYNC_TYPES.full }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tsetSyncType(\n\t\t\t\t\t\t\t\tsyncType === PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t\t\t? PATTERN_SYNC_TYPES.unsynced\n\t\t\t\t\t\t\t\t\t: PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\tsetTitle( '' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\taria-disabled={ ! title || isSaving }\n\t\t\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Create' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\t\t\t\t</VStack>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}
|
|
@@ -1,47 +1,31 @@
|
|
|
1
|
-
import { createElement
|
|
1
|
+
import { createElement } from "@wordpress/element";
|
|
2
2
|
/**
|
|
3
3
|
* WordPress dependencies
|
|
4
4
|
*/
|
|
5
5
|
import { __ } from '@wordpress/i18n';
|
|
6
6
|
import { useMemo, useState } from '@wordpress/element';
|
|
7
7
|
import { FormTokenField } from '@wordpress/components';
|
|
8
|
-
import { useSelect } from '@wordpress/data';
|
|
9
|
-
import { store as coreStore } from '@wordpress/core-data';
|
|
10
8
|
import { useDebounce } from '@wordpress/compose';
|
|
11
9
|
import { decodeEntities } from '@wordpress/html-entities';
|
|
12
10
|
const unescapeString = arg => {
|
|
13
11
|
return decodeEntities(arg);
|
|
14
12
|
};
|
|
15
|
-
const EMPTY_ARRAY = [];
|
|
16
|
-
const MAX_TERMS_SUGGESTIONS = 20;
|
|
17
|
-
const DEFAULT_QUERY = {
|
|
18
|
-
per_page: MAX_TERMS_SUGGESTIONS,
|
|
19
|
-
_fields: 'id,name',
|
|
20
|
-
context: 'view'
|
|
21
|
-
};
|
|
22
13
|
export const CATEGORY_SLUG = 'wp_pattern_category';
|
|
23
14
|
export default function CategorySelector({
|
|
24
|
-
|
|
25
|
-
onChange
|
|
15
|
+
categoryTerms,
|
|
16
|
+
onChange,
|
|
17
|
+
categoryMap
|
|
26
18
|
}) {
|
|
27
19
|
const [search, setSearch] = useState('');
|
|
28
20
|
const debouncedSearch = useDebounce(setSearch, 500);
|
|
29
|
-
const {
|
|
30
|
-
searchResults
|
|
31
|
-
} = useSelect(select => {
|
|
32
|
-
const {
|
|
33
|
-
getEntityRecords
|
|
34
|
-
} = select(coreStore);
|
|
35
|
-
return {
|
|
36
|
-
searchResults: !!search ? getEntityRecords('taxonomy', CATEGORY_SLUG, {
|
|
37
|
-
...DEFAULT_QUERY,
|
|
38
|
-
search
|
|
39
|
-
}) : EMPTY_ARRAY
|
|
40
|
-
};
|
|
41
|
-
}, [search]);
|
|
42
21
|
const suggestions = useMemo(() => {
|
|
43
|
-
return (
|
|
44
|
-
|
|
22
|
+
return Array.from(categoryMap.values()).map(category => unescapeString(category.label)).filter(category => {
|
|
23
|
+
if (search !== '') {
|
|
24
|
+
return category.toLowerCase().includes(search.toLowerCase());
|
|
25
|
+
}
|
|
26
|
+
return true;
|
|
27
|
+
}).sort((a, b) => a.localeCompare(b));
|
|
28
|
+
}, [search, categoryMap]);
|
|
45
29
|
function handleChange(termNames) {
|
|
46
30
|
const uniqueTerms = termNames.reduce((terms, newTerm) => {
|
|
47
31
|
if (!terms.some(term => term.toLowerCase() === newTerm.toLowerCase())) {
|
|
@@ -51,15 +35,16 @@ export default function CategorySelector({
|
|
|
51
35
|
}, []);
|
|
52
36
|
onChange(uniqueTerms);
|
|
53
37
|
}
|
|
54
|
-
return createElement(
|
|
38
|
+
return createElement(FormTokenField, {
|
|
55
39
|
className: "patterns-menu-items__convert-modal-categories",
|
|
56
|
-
value:
|
|
40
|
+
value: categoryTerms,
|
|
57
41
|
suggestions: suggestions,
|
|
58
42
|
onChange: handleChange,
|
|
59
43
|
onInputChange: debouncedSearch,
|
|
60
|
-
maxSuggestions: MAX_TERMS_SUGGESTIONS,
|
|
61
44
|
label: __('Categories'),
|
|
62
|
-
tokenizeOnBlur: true
|
|
63
|
-
|
|
45
|
+
tokenizeOnBlur: true,
|
|
46
|
+
__experimentalExpandOnFocus: true,
|
|
47
|
+
__next40pxDefaultSize: true
|
|
48
|
+
});
|
|
64
49
|
}
|
|
65
50
|
//# sourceMappingURL=category-selector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__","useMemo","useState","FormTokenField","
|
|
1
|
+
{"version":3,"names":["__","useMemo","useState","FormTokenField","useDebounce","decodeEntities","unescapeString","arg","CATEGORY_SLUG","CategorySelector","categoryTerms","onChange","categoryMap","search","setSearch","debouncedSearch","suggestions","Array","from","values","map","category","label","filter","toLowerCase","includes","sort","a","b","localeCompare","handleChange","termNames","uniqueTerms","reduce","terms","newTerm","some","term","push","createElement","className","value","onInputChange","tokenizeOnBlur","__experimentalExpandOnFocus","__next40pxDefaultSize"],"sources":["@wordpress/patterns/src/components/category-selector.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { FormTokenField } from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\n\nconst unescapeString = ( arg ) => {\n\treturn decodeEntities( arg );\n};\n\nexport const CATEGORY_SLUG = 'wp_pattern_category';\n\nexport default function CategorySelector( {\n\tcategoryTerms,\n\tonChange,\n\tcategoryMap,\n} ) {\n\tconst [ search, setSearch ] = useState( '' );\n\tconst debouncedSearch = useDebounce( setSearch, 500 );\n\n\tconst suggestions = useMemo( () => {\n\t\treturn Array.from( categoryMap.values() )\n\t\t\t.map( ( category ) => unescapeString( category.label ) )\n\t\t\t.filter( ( category ) => {\n\t\t\t\tif ( search !== '' ) {\n\t\t\t\t\treturn category\n\t\t\t\t\t\t.toLowerCase()\n\t\t\t\t\t\t.includes( search.toLowerCase() );\n\t\t\t\t}\n\t\t\t\treturn true;\n\t\t\t} )\n\t\t\t.sort( ( a, b ) => a.localeCompare( b ) );\n\t}, [ search, categoryMap ] );\n\n\tfunction handleChange( termNames ) {\n\t\tconst uniqueTerms = termNames.reduce( ( terms, newTerm ) => {\n\t\t\tif (\n\t\t\t\t! terms.some(\n\t\t\t\t\t( term ) => term.toLowerCase() === newTerm.toLowerCase()\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tterms.push( newTerm );\n\t\t\t}\n\t\t\treturn terms;\n\t\t}, [] );\n\n\t\tonChange( uniqueTerms );\n\t}\n\n\treturn (\n\t\t<FormTokenField\n\t\t\tclassName=\"patterns-menu-items__convert-modal-categories\"\n\t\t\tvalue={ categoryTerms }\n\t\t\tsuggestions={ suggestions }\n\t\t\tonChange={ handleChange }\n\t\t\tonInputChange={ debouncedSearch }\n\t\t\tlabel={ __( 'Categories' ) }\n\t\t\ttokenizeOnBlur\n\t\t\t__experimentalExpandOnFocus\n\t\t\t__next40pxDefaultSize\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,OAAO,EAAEC,QAAQ,QAAQ,oBAAoB;AACtD,SAASC,cAAc,QAAQ,uBAAuB;AACtD,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,cAAc,QAAQ,0BAA0B;AAEzD,MAAMC,cAAc,GAAKC,GAAG,IAAM;EACjC,OAAOF,cAAc,CAAEE,GAAI,CAAC;AAC7B,CAAC;AAED,OAAO,MAAMC,aAAa,GAAG,qBAAqB;AAElD,eAAe,SAASC,gBAAgBA,CAAE;EACzCC,aAAa;EACbC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAGZ,QAAQ,CAAE,EAAG,CAAC;EAC5C,MAAMa,eAAe,GAAGX,WAAW,CAAEU,SAAS,EAAE,GAAI,CAAC;EAErD,MAAME,WAAW,GAAGf,OAAO,CAAE,MAAM;IAClC,OAAOgB,KAAK,CAACC,IAAI,CAAEN,WAAW,CAACO,MAAM,CAAC,CAAE,CAAC,CACvCC,GAAG,CAAIC,QAAQ,IAAMf,cAAc,CAAEe,QAAQ,CAACC,KAAM,CAAE,CAAC,CACvDC,MAAM,CAAIF,QAAQ,IAAM;MACxB,IAAKR,MAAM,KAAK,EAAE,EAAG;QACpB,OAAOQ,QAAQ,CACbG,WAAW,CAAC,CAAC,CACbC,QAAQ,CAAEZ,MAAM,CAACW,WAAW,CAAC,CAAE,CAAC;MACnC;MACA,OAAO,IAAI;IACZ,CAAE,CAAC,CACFE,IAAI,CAAE,CAAEC,CAAC,EAAEC,CAAC,KAAMD,CAAC,CAACE,aAAa,CAAED,CAAE,CAAE,CAAC;EAC3C,CAAC,EAAE,CAAEf,MAAM,EAAED,WAAW,CAAG,CAAC;EAE5B,SAASkB,YAAYA,CAAEC,SAAS,EAAG;IAClC,MAAMC,WAAW,GAAGD,SAAS,CAACE,MAAM,CAAE,CAAEC,KAAK,EAAEC,OAAO,KAAM;MAC3D,IACC,CAAED,KAAK,CAACE,IAAI,CACTC,IAAI,IAAMA,IAAI,CAACb,WAAW,CAAC,CAAC,KAAKW,OAAO,CAACX,WAAW,CAAC,CACxD,CAAC,EACA;QACDU,KAAK,CAACI,IAAI,CAAEH,OAAQ,CAAC;MACtB;MACA,OAAOD,KAAK;IACb,CAAC,EAAE,EAAG,CAAC;IAEPvB,QAAQ,CAAEqB,WAAY,CAAC;EACxB;EAEA,OACCO,aAAA,CAACpC,cAAc;IACdqC,SAAS,EAAC,+CAA+C;IACzDC,KAAK,EAAG/B,aAAe;IACvBM,WAAW,EAAGA,WAAa;IAC3BL,QAAQ,EAAGmB,YAAc;IACzBY,aAAa,EAAG3B,eAAiB;IACjCO,KAAK,EAAGtB,EAAE,CAAE,YAAa,CAAG;IAC5B2C,cAAc;IACdC,2BAA2B;IAC3BC,qBAAqB;EAAA,CACrB,CAAC;AAEJ"}
|
|
@@ -4,8 +4,8 @@ import { createElement } from "@wordpress/element";
|
|
|
4
4
|
*/
|
|
5
5
|
import { Modal, Button, TextControl, __experimentalHStack as HStack, __experimentalVStack as VStack, ToggleControl } from '@wordpress/components';
|
|
6
6
|
import { __ } from '@wordpress/i18n';
|
|
7
|
-
import { useState } from '@wordpress/element';
|
|
8
|
-
import { useDispatch } from '@wordpress/data';
|
|
7
|
+
import { useState, useMemo } from '@wordpress/element';
|
|
8
|
+
import { useDispatch, useSelect } from '@wordpress/data';
|
|
9
9
|
import { store as noticesStore } from '@wordpress/notices';
|
|
10
10
|
import { store as coreStore } from '@wordpress/core-data';
|
|
11
11
|
|
|
@@ -41,6 +41,38 @@ export default function CreatePatternModal({
|
|
|
41
41
|
const {
|
|
42
42
|
createErrorNotice
|
|
43
43
|
} = useDispatch(noticesStore);
|
|
44
|
+
const {
|
|
45
|
+
corePatternCategories,
|
|
46
|
+
userPatternCategories
|
|
47
|
+
} = useSelect(select => {
|
|
48
|
+
const {
|
|
49
|
+
getUserPatternCategories,
|
|
50
|
+
getBlockPatternCategories
|
|
51
|
+
} = select(coreStore);
|
|
52
|
+
return {
|
|
53
|
+
corePatternCategories: getBlockPatternCategories(),
|
|
54
|
+
userPatternCategories: getUserPatternCategories()
|
|
55
|
+
};
|
|
56
|
+
});
|
|
57
|
+
const categoryMap = useMemo(() => {
|
|
58
|
+
// Merge the user and core pattern categories and remove any duplicates.
|
|
59
|
+
const uniqueCategories = new Map();
|
|
60
|
+
[...userPatternCategories, ...corePatternCategories].forEach(category => {
|
|
61
|
+
if (!uniqueCategories.has(category.label) &&
|
|
62
|
+
// There are two core categories with `Post` label so explicitly remove the one with
|
|
63
|
+
// the `query` slug to avoid any confusion.
|
|
64
|
+
category.name !== 'query') {
|
|
65
|
+
// We need to store the name separately as this is used as the slug in the
|
|
66
|
+
// taxonomy and may vary from the label.
|
|
67
|
+
uniqueCategories.set(category.label, {
|
|
68
|
+
label: category.label,
|
|
69
|
+
value: category.label,
|
|
70
|
+
name: category.name
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
return uniqueCategories;
|
|
75
|
+
}, [userPatternCategories, corePatternCategories]);
|
|
44
76
|
async function onCreate(patternTitle, sync) {
|
|
45
77
|
if (!title || isSaving) {
|
|
46
78
|
return;
|
|
@@ -72,9 +104,16 @@ export default function CreatePatternModal({
|
|
|
72
104
|
*/
|
|
73
105
|
async function findOrCreateTerm(term) {
|
|
74
106
|
try {
|
|
75
|
-
|
|
107
|
+
// We need to match any existing term to the correct slug to prevent duplicates, eg.
|
|
108
|
+
// the core `Headers` category uses the singular `header` as the slug.
|
|
109
|
+
const existingTerm = categoryMap.get(term);
|
|
110
|
+
const termData = existingTerm ? {
|
|
111
|
+
name: existingTerm.label,
|
|
112
|
+
slug: existingTerm.name
|
|
113
|
+
} : {
|
|
76
114
|
name: term
|
|
77
|
-
}
|
|
115
|
+
};
|
|
116
|
+
const newTerm = await saveEntityRecord('taxonomy', CATEGORY_SLUG, termData, {
|
|
78
117
|
throwOnError: true
|
|
79
118
|
});
|
|
80
119
|
invalidateResolution('getUserPatternCategories');
|
|
@@ -108,8 +147,9 @@ export default function CreatePatternModal({
|
|
|
108
147
|
placeholder: __('My pattern'),
|
|
109
148
|
className: "patterns-create-modal__name-input"
|
|
110
149
|
}), createElement(CategorySelector, {
|
|
111
|
-
|
|
112
|
-
onChange: setCategoryTerms
|
|
150
|
+
categoryTerms: categoryTerms,
|
|
151
|
+
onChange: setCategoryTerms,
|
|
152
|
+
categoryMap: categoryMap
|
|
113
153
|
}), createElement(ToggleControl, {
|
|
114
154
|
label: __('Synced'),
|
|
115
155
|
help: __('Editing the pattern will update it anywhere it is used.'),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Modal","Button","TextControl","__experimentalHStack","HStack","__experimentalVStack","VStack","ToggleControl","__","useState","useDispatch","store","noticesStore","coreStore","PATTERN_DEFAULT_CATEGORY","PATTERN_SYNC_TYPES","patternsStore","CategorySelector","CATEGORY_SLUG","unlock","CreatePatternModal","onSuccess","onError","content","onClose","className","syncType","setSyncType","full","categoryTerms","setCategoryTerms","title","setTitle","isSaving","setIsSaving","createPattern","saveEntityRecord","invalidateResolution","createErrorNotice","onCreate","patternTitle","sync","categories","Promise","all","map","termName","findOrCreateTerm","newPattern","pattern","categoryId","error","message","type","id","term","newTerm","name","throwOnError","code","data","term_id","createElement","onRequestClose","overlayClassName","onSubmit","event","preventDefault","spacing","__nextHasNoMarginBottom","label","value","onChange","placeholder","values","help","checked","unsynced","justify","variant","onClick","isBusy"],"sources":["@wordpress/patterns/src/components/create-pattern-modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tModal,\n\tButton,\n\tTextControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tToggleControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { PATTERN_DEFAULT_CATEGORY, PATTERN_SYNC_TYPES } from '../constants';\n\n/**\n * Internal dependencies\n */\nimport { store as patternsStore } from '../store';\nimport CategorySelector, { CATEGORY_SLUG } from './category-selector';\nimport { unlock } from '../lock-unlock';\n\nexport default function CreatePatternModal( {\n\tonSuccess,\n\tonError,\n\tcontent,\n\tonClose,\n\tclassName = 'patterns-menu-items__convert-modal',\n} ) {\n\tconst [ syncType, setSyncType ] = useState( PATTERN_SYNC_TYPES.full );\n\tconst [ categoryTerms, setCategoryTerms ] = useState( [] );\n\tconst [ title, setTitle ] = useState( '' );\n\tconst [ isSaving, setIsSaving ] = useState( false );\n\tconst { createPattern } = unlock( useDispatch( patternsStore ) );\n\tconst { saveEntityRecord, invalidateResolution } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tasync function onCreate( patternTitle, sync ) {\n\t\tif ( ! title || isSaving ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSaving( true );\n\t\t\tconst categories = await Promise.all(\n\t\t\t\tcategoryTerms.map( ( termName ) =>\n\t\t\t\t\tfindOrCreateTerm( termName )\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tconst newPattern = await createPattern(\n\t\t\t\tpatternTitle,\n\t\t\t\tsync,\n\t\t\t\ttypeof content === 'function' ? content() : content,\n\t\t\t\tcategories\n\t\t\t);\n\t\t\tonSuccess( {\n\t\t\t\tpattern: newPattern,\n\t\t\t\tcategoryId: PATTERN_DEFAULT_CATEGORY,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tcreateErrorNotice( error.message, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'convert-to-pattern-error',\n\t\t\t} );\n\t\t\tonError();\n\t\t} finally {\n\t\t\tsetIsSaving( false );\n\t\t\tsetCategoryTerms( [] );\n\t\t\tsetTitle( '' );\n\t\t}\n\t}\n\n\t/**\n\t * @param {string} term\n\t * @return {Promise<number>} The pattern category id.\n\t */\n\tasync function findOrCreateTerm( term ) {\n\t\ttry {\n\t\t\tconst newTerm = await saveEntityRecord(\n\t\t\t\t'taxonomy',\n\t\t\t\tCATEGORY_SLUG,\n\t\t\t\t{ name: term },\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tinvalidateResolution( 'getUserPatternCategories' );\n\t\t\treturn newTerm.id;\n\t\t} catch ( error ) {\n\t\t\tif ( error.code !== 'term_exists' ) {\n\t\t\t\tthrow error;\n\t\t\t}\n\n\t\t\treturn error.data.term_id;\n\t\t}\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Create pattern' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tonClose();\n\t\t\t\tsetTitle( '' );\n\t\t\t} }\n\t\t\toverlayClassName={ className }\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tonCreate( title, syncType );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<VStack spacing=\"5\">\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\t\tvalue={ title }\n\t\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\t\tplaceholder={ __( 'My pattern' ) }\n\t\t\t\t\t\tclassName=\"patterns-create-modal__name-input\"\n\t\t\t\t\t/>\n\t\t\t\t\t<CategorySelector\n\t\t\t\t\t\tvalues={ categoryTerms }\n\t\t\t\t\t\tonChange={ setCategoryTerms }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Synced' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Editing the pattern will update it anywhere it is used.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ syncType === PATTERN_SYNC_TYPES.full }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tsetSyncType(\n\t\t\t\t\t\t\t\tsyncType === PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t\t\t? PATTERN_SYNC_TYPES.unsynced\n\t\t\t\t\t\t\t\t\t: PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\tsetTitle( '' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\taria-disabled={ ! title || isSaving }\n\t\t\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Create' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\t\t\t\t</VStack>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["Modal","Button","TextControl","__experimentalHStack","HStack","__experimentalVStack","VStack","ToggleControl","__","useState","useMemo","useDispatch","useSelect","store","noticesStore","coreStore","PATTERN_DEFAULT_CATEGORY","PATTERN_SYNC_TYPES","patternsStore","CategorySelector","CATEGORY_SLUG","unlock","CreatePatternModal","onSuccess","onError","content","onClose","className","syncType","setSyncType","full","categoryTerms","setCategoryTerms","title","setTitle","isSaving","setIsSaving","createPattern","saveEntityRecord","invalidateResolution","createErrorNotice","corePatternCategories","userPatternCategories","select","getUserPatternCategories","getBlockPatternCategories","categoryMap","uniqueCategories","Map","forEach","category","has","label","name","set","value","onCreate","patternTitle","sync","categories","Promise","all","map","termName","findOrCreateTerm","newPattern","pattern","categoryId","error","message","type","id","term","existingTerm","get","termData","slug","newTerm","throwOnError","code","data","term_id","createElement","onRequestClose","overlayClassName","onSubmit","event","preventDefault","spacing","__nextHasNoMarginBottom","onChange","placeholder","help","checked","unsynced","justify","variant","onClick","isBusy"],"sources":["@wordpress/patterns/src/components/create-pattern-modal.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tModal,\n\tButton,\n\tTextControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tToggleControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { PATTERN_DEFAULT_CATEGORY, PATTERN_SYNC_TYPES } from '../constants';\n\n/**\n * Internal dependencies\n */\nimport { store as patternsStore } from '../store';\nimport CategorySelector, { CATEGORY_SLUG } from './category-selector';\nimport { unlock } from '../lock-unlock';\n\nexport default function CreatePatternModal( {\n\tonSuccess,\n\tonError,\n\tcontent,\n\tonClose,\n\tclassName = 'patterns-menu-items__convert-modal',\n} ) {\n\tconst [ syncType, setSyncType ] = useState( PATTERN_SYNC_TYPES.full );\n\tconst [ categoryTerms, setCategoryTerms ] = useState( [] );\n\tconst [ title, setTitle ] = useState( '' );\n\tconst [ isSaving, setIsSaving ] = useState( false );\n\tconst { createPattern } = unlock( useDispatch( patternsStore ) );\n\tconst { saveEntityRecord, invalidateResolution } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tconst { corePatternCategories, userPatternCategories } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getUserPatternCategories, getBlockPatternCategories } =\n\t\t\t\tselect( coreStore );\n\n\t\t\treturn {\n\t\t\t\tcorePatternCategories: getBlockPatternCategories(),\n\t\t\t\tuserPatternCategories: getUserPatternCategories(),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst categoryMap = useMemo( () => {\n\t\t// Merge the user and core pattern categories and remove any duplicates.\n\t\tconst uniqueCategories = new Map();\n\t\t[ ...userPatternCategories, ...corePatternCategories ].forEach(\n\t\t\t( category ) => {\n\t\t\t\tif (\n\t\t\t\t\t! uniqueCategories.has( category.label ) &&\n\t\t\t\t\t// There are two core categories with `Post` label so explicitly remove the one with\n\t\t\t\t\t// the `query` slug to avoid any confusion.\n\t\t\t\t\tcategory.name !== 'query'\n\t\t\t\t) {\n\t\t\t\t\t// We need to store the name separately as this is used as the slug in the\n\t\t\t\t\t// taxonomy and may vary from the label.\n\t\t\t\t\tuniqueCategories.set( category.label, {\n\t\t\t\t\t\tlabel: category.label,\n\t\t\t\t\t\tvalue: category.label,\n\t\t\t\t\t\tname: category.name,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t\treturn uniqueCategories;\n\t}, [ userPatternCategories, corePatternCategories ] );\n\n\tasync function onCreate( patternTitle, sync ) {\n\t\tif ( ! title || isSaving ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSaving( true );\n\t\t\tconst categories = await Promise.all(\n\t\t\t\tcategoryTerms.map( ( termName ) =>\n\t\t\t\t\tfindOrCreateTerm( termName )\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tconst newPattern = await createPattern(\n\t\t\t\tpatternTitle,\n\t\t\t\tsync,\n\t\t\t\ttypeof content === 'function' ? content() : content,\n\t\t\t\tcategories\n\t\t\t);\n\t\t\tonSuccess( {\n\t\t\t\tpattern: newPattern,\n\t\t\t\tcategoryId: PATTERN_DEFAULT_CATEGORY,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tcreateErrorNotice( error.message, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'convert-to-pattern-error',\n\t\t\t} );\n\t\t\tonError();\n\t\t} finally {\n\t\t\tsetIsSaving( false );\n\t\t\tsetCategoryTerms( [] );\n\t\t\tsetTitle( '' );\n\t\t}\n\t}\n\n\t/**\n\t * @param {string} term\n\t * @return {Promise<number>} The pattern category id.\n\t */\n\tasync function findOrCreateTerm( term ) {\n\t\ttry {\n\t\t\t// We need to match any existing term to the correct slug to prevent duplicates, eg.\n\t\t\t// the core `Headers` category uses the singular `header` as the slug.\n\t\t\tconst existingTerm = categoryMap.get( term );\n\t\t\tconst termData = existingTerm\n\t\t\t\t? { name: existingTerm.label, slug: existingTerm.name }\n\t\t\t\t: { name: term };\n\t\t\tconst newTerm = await saveEntityRecord(\n\t\t\t\t'taxonomy',\n\t\t\t\tCATEGORY_SLUG,\n\t\t\t\ttermData,\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tinvalidateResolution( 'getUserPatternCategories' );\n\t\t\treturn newTerm.id;\n\t\t} catch ( error ) {\n\t\t\tif ( error.code !== 'term_exists' ) {\n\t\t\t\tthrow error;\n\t\t\t}\n\n\t\t\treturn error.data.term_id;\n\t\t}\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Create pattern' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tonClose();\n\t\t\t\tsetTitle( '' );\n\t\t\t} }\n\t\t\toverlayClassName={ className }\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tonCreate( title, syncType );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<VStack spacing=\"5\">\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\t\tvalue={ title }\n\t\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\t\tplaceholder={ __( 'My pattern' ) }\n\t\t\t\t\t\tclassName=\"patterns-create-modal__name-input\"\n\t\t\t\t\t/>\n\t\t\t\t\t<CategorySelector\n\t\t\t\t\t\tcategoryTerms={ categoryTerms }\n\t\t\t\t\t\tonChange={ setCategoryTerms }\n\t\t\t\t\t\tcategoryMap={ categoryMap }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Synced' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Editing the pattern will update it anywhere it is used.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ syncType === PATTERN_SYNC_TYPES.full }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tsetSyncType(\n\t\t\t\t\t\t\t\tsyncType === PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t\t\t? PATTERN_SYNC_TYPES.unsynced\n\t\t\t\t\t\t\t\t\t: PATTERN_SYNC_TYPES.full\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\tsetTitle( '' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\taria-disabled={ ! title || isSaving }\n\t\t\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Create' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\t\t\t\t</VStack>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}
|
|
@@ -106,10 +106,30 @@
|
|
|
106
106
|
.patterns-menu-items__convert-modal {
|
|
107
107
|
z-index: 1000001;
|
|
108
108
|
}
|
|
109
|
+
.patterns-menu-items__convert-modal [role=dialog] > [role=document] {
|
|
110
|
+
width: 350px;
|
|
111
|
+
}
|
|
109
112
|
.patterns-menu-items__convert-modal .patterns-menu-items__convert-modal-categories {
|
|
110
|
-
|
|
113
|
+
width: 100%;
|
|
114
|
+
position: relative;
|
|
115
|
+
min-height: 40px;
|
|
116
|
+
}
|
|
117
|
+
.patterns-menu-items__convert-modal .components-form-token-field__suggestions-list {
|
|
118
|
+
position: absolute;
|
|
119
|
+
box-sizing: border-box;
|
|
120
|
+
z-index: 1;
|
|
121
|
+
background-color: #fff;
|
|
122
|
+
width: calc(100% + 2px);
|
|
123
|
+
right: -1px;
|
|
124
|
+
min-width: initial;
|
|
125
|
+
border: 1px solid var(--wp-admin-theme-color);
|
|
126
|
+
border-top: none;
|
|
127
|
+
box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
|
|
128
|
+
border-bottom-right-radius: 2px;
|
|
129
|
+
border-bottom-left-radius: 2px;
|
|
111
130
|
}
|
|
112
131
|
|
|
113
132
|
.patterns-create-modal__name-input input[type=text] {
|
|
114
|
-
min-height:
|
|
133
|
+
min-height: 40px;
|
|
134
|
+
margin: 0;
|
|
115
135
|
}
|
package/build-style/style.css
CHANGED
|
@@ -106,10 +106,30 @@
|
|
|
106
106
|
.patterns-menu-items__convert-modal {
|
|
107
107
|
z-index: 1000001;
|
|
108
108
|
}
|
|
109
|
+
.patterns-menu-items__convert-modal [role=dialog] > [role=document] {
|
|
110
|
+
width: 350px;
|
|
111
|
+
}
|
|
109
112
|
.patterns-menu-items__convert-modal .patterns-menu-items__convert-modal-categories {
|
|
110
|
-
|
|
113
|
+
width: 100%;
|
|
114
|
+
position: relative;
|
|
115
|
+
min-height: 40px;
|
|
116
|
+
}
|
|
117
|
+
.patterns-menu-items__convert-modal .components-form-token-field__suggestions-list {
|
|
118
|
+
position: absolute;
|
|
119
|
+
box-sizing: border-box;
|
|
120
|
+
z-index: 1;
|
|
121
|
+
background-color: #fff;
|
|
122
|
+
width: calc(100% + 2px);
|
|
123
|
+
left: -1px;
|
|
124
|
+
min-width: initial;
|
|
125
|
+
border: 1px solid var(--wp-admin-theme-color);
|
|
126
|
+
border-top: none;
|
|
127
|
+
box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
|
|
128
|
+
border-bottom-left-radius: 2px;
|
|
129
|
+
border-bottom-right-radius: 2px;
|
|
111
130
|
}
|
|
112
131
|
|
|
113
132
|
.patterns-create-modal__name-input input[type=text] {
|
|
114
|
-
min-height:
|
|
133
|
+
min-height: 40px;
|
|
134
|
+
margin: 0;
|
|
115
135
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/patterns",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.4",
|
|
4
4
|
"description": "Management of user pattern editing.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -32,19 +32,19 @@
|
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@babel/runtime": "^7.16.0",
|
|
35
|
-
"@wordpress/block-editor": "^12.10.
|
|
36
|
-
"@wordpress/blocks": "^12.19.
|
|
37
|
-
"@wordpress/components": "^25.8.
|
|
38
|
-
"@wordpress/compose": "^6.19.
|
|
39
|
-
"@wordpress/core-data": "^6.19.
|
|
40
|
-
"@wordpress/data": "^9.12.
|
|
41
|
-
"@wordpress/element": "^5.19.
|
|
42
|
-
"@wordpress/html-entities": "^3.42.
|
|
43
|
-
"@wordpress/i18n": "^4.42.
|
|
44
|
-
"@wordpress/icons": "^9.33.
|
|
45
|
-
"@wordpress/notices": "^4.10.
|
|
46
|
-
"@wordpress/private-apis": "^0.24.
|
|
47
|
-
"@wordpress/url": "^3.43.
|
|
35
|
+
"@wordpress/block-editor": "^12.10.4",
|
|
36
|
+
"@wordpress/blocks": "^12.19.4",
|
|
37
|
+
"@wordpress/components": "^25.8.4",
|
|
38
|
+
"@wordpress/compose": "^6.19.4",
|
|
39
|
+
"@wordpress/core-data": "^6.19.4",
|
|
40
|
+
"@wordpress/data": "^9.12.4",
|
|
41
|
+
"@wordpress/element": "^5.19.4",
|
|
42
|
+
"@wordpress/html-entities": "^3.42.4",
|
|
43
|
+
"@wordpress/i18n": "^4.42.4",
|
|
44
|
+
"@wordpress/icons": "^9.33.4",
|
|
45
|
+
"@wordpress/notices": "^4.10.4",
|
|
46
|
+
"@wordpress/private-apis": "^0.24.4",
|
|
47
|
+
"@wordpress/url": "^3.43.4"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
50
|
"react": "^18.0.0",
|
|
@@ -53,5 +53,5 @@
|
|
|
53
53
|
"publishConfig": {
|
|
54
54
|
"access": "public"
|
|
55
55
|
},
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "d1072bbcaf037a18d414da7865ebaf366a0e7062"
|
|
57
57
|
}
|
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
import { __ } from '@wordpress/i18n';
|
|
5
5
|
import { useMemo, useState } from '@wordpress/element';
|
|
6
6
|
import { FormTokenField } from '@wordpress/components';
|
|
7
|
-
import { useSelect } from '@wordpress/data';
|
|
8
|
-
import { store as coreStore } from '@wordpress/core-data';
|
|
9
7
|
import { useDebounce } from '@wordpress/compose';
|
|
10
8
|
import { decodeEntities } from '@wordpress/html-entities';
|
|
11
9
|
|
|
@@ -13,40 +11,29 @@ const unescapeString = ( arg ) => {
|
|
|
13
11
|
return decodeEntities( arg );
|
|
14
12
|
};
|
|
15
13
|
|
|
16
|
-
const EMPTY_ARRAY = [];
|
|
17
|
-
const MAX_TERMS_SUGGESTIONS = 20;
|
|
18
|
-
const DEFAULT_QUERY = {
|
|
19
|
-
per_page: MAX_TERMS_SUGGESTIONS,
|
|
20
|
-
_fields: 'id,name',
|
|
21
|
-
context: 'view',
|
|
22
|
-
};
|
|
23
14
|
export const CATEGORY_SLUG = 'wp_pattern_category';
|
|
24
15
|
|
|
25
|
-
export default function CategorySelector( {
|
|
16
|
+
export default function CategorySelector( {
|
|
17
|
+
categoryTerms,
|
|
18
|
+
onChange,
|
|
19
|
+
categoryMap,
|
|
20
|
+
} ) {
|
|
26
21
|
const [ search, setSearch ] = useState( '' );
|
|
27
22
|
const debouncedSearch = useDebounce( setSearch, 500 );
|
|
28
23
|
|
|
29
|
-
const { searchResults } = useSelect(
|
|
30
|
-
( select ) => {
|
|
31
|
-
const { getEntityRecords } = select( coreStore );
|
|
32
|
-
|
|
33
|
-
return {
|
|
34
|
-
searchResults: !! search
|
|
35
|
-
? getEntityRecords( 'taxonomy', CATEGORY_SLUG, {
|
|
36
|
-
...DEFAULT_QUERY,
|
|
37
|
-
search,
|
|
38
|
-
} )
|
|
39
|
-
: EMPTY_ARRAY,
|
|
40
|
-
};
|
|
41
|
-
},
|
|
42
|
-
[ search ]
|
|
43
|
-
);
|
|
44
|
-
|
|
45
24
|
const suggestions = useMemo( () => {
|
|
46
|
-
return (
|
|
47
|
-
unescapeString(
|
|
48
|
-
|
|
49
|
-
|
|
25
|
+
return Array.from( categoryMap.values() )
|
|
26
|
+
.map( ( category ) => unescapeString( category.label ) )
|
|
27
|
+
.filter( ( category ) => {
|
|
28
|
+
if ( search !== '' ) {
|
|
29
|
+
return category
|
|
30
|
+
.toLowerCase()
|
|
31
|
+
.includes( search.toLowerCase() );
|
|
32
|
+
}
|
|
33
|
+
return true;
|
|
34
|
+
} )
|
|
35
|
+
.sort( ( a, b ) => a.localeCompare( b ) );
|
|
36
|
+
}, [ search, categoryMap ] );
|
|
50
37
|
|
|
51
38
|
function handleChange( termNames ) {
|
|
52
39
|
const uniqueTerms = termNames.reduce( ( terms, newTerm ) => {
|
|
@@ -64,17 +51,16 @@ export default function CategorySelector( { values, onChange } ) {
|
|
|
64
51
|
}
|
|
65
52
|
|
|
66
53
|
return (
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
</>
|
|
54
|
+
<FormTokenField
|
|
55
|
+
className="patterns-menu-items__convert-modal-categories"
|
|
56
|
+
value={ categoryTerms }
|
|
57
|
+
suggestions={ suggestions }
|
|
58
|
+
onChange={ handleChange }
|
|
59
|
+
onInputChange={ debouncedSearch }
|
|
60
|
+
label={ __( 'Categories' ) }
|
|
61
|
+
tokenizeOnBlur
|
|
62
|
+
__experimentalExpandOnFocus
|
|
63
|
+
__next40pxDefaultSize
|
|
64
|
+
/>
|
|
79
65
|
);
|
|
80
66
|
}
|
|
@@ -10,8 +10,8 @@ import {
|
|
|
10
10
|
ToggleControl,
|
|
11
11
|
} from '@wordpress/components';
|
|
12
12
|
import { __ } from '@wordpress/i18n';
|
|
13
|
-
import { useState } from '@wordpress/element';
|
|
14
|
-
import { useDispatch } from '@wordpress/data';
|
|
13
|
+
import { useState, useMemo } from '@wordpress/element';
|
|
14
|
+
import { useDispatch, useSelect } from '@wordpress/data';
|
|
15
15
|
import { store as noticesStore } from '@wordpress/notices';
|
|
16
16
|
import { store as coreStore } from '@wordpress/core-data';
|
|
17
17
|
|
|
@@ -42,6 +42,42 @@ export default function CreatePatternModal( {
|
|
|
42
42
|
const { saveEntityRecord, invalidateResolution } = useDispatch( coreStore );
|
|
43
43
|
const { createErrorNotice } = useDispatch( noticesStore );
|
|
44
44
|
|
|
45
|
+
const { corePatternCategories, userPatternCategories } = useSelect(
|
|
46
|
+
( select ) => {
|
|
47
|
+
const { getUserPatternCategories, getBlockPatternCategories } =
|
|
48
|
+
select( coreStore );
|
|
49
|
+
|
|
50
|
+
return {
|
|
51
|
+
corePatternCategories: getBlockPatternCategories(),
|
|
52
|
+
userPatternCategories: getUserPatternCategories(),
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
);
|
|
56
|
+
|
|
57
|
+
const categoryMap = useMemo( () => {
|
|
58
|
+
// Merge the user and core pattern categories and remove any duplicates.
|
|
59
|
+
const uniqueCategories = new Map();
|
|
60
|
+
[ ...userPatternCategories, ...corePatternCategories ].forEach(
|
|
61
|
+
( category ) => {
|
|
62
|
+
if (
|
|
63
|
+
! uniqueCategories.has( category.label ) &&
|
|
64
|
+
// There are two core categories with `Post` label so explicitly remove the one with
|
|
65
|
+
// the `query` slug to avoid any confusion.
|
|
66
|
+
category.name !== 'query'
|
|
67
|
+
) {
|
|
68
|
+
// We need to store the name separately as this is used as the slug in the
|
|
69
|
+
// taxonomy and may vary from the label.
|
|
70
|
+
uniqueCategories.set( category.label, {
|
|
71
|
+
label: category.label,
|
|
72
|
+
value: category.label,
|
|
73
|
+
name: category.name,
|
|
74
|
+
} );
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
);
|
|
78
|
+
return uniqueCategories;
|
|
79
|
+
}, [ userPatternCategories, corePatternCategories ] );
|
|
80
|
+
|
|
45
81
|
async function onCreate( patternTitle, sync ) {
|
|
46
82
|
if ( ! title || isSaving ) {
|
|
47
83
|
return;
|
|
@@ -84,10 +120,16 @@ export default function CreatePatternModal( {
|
|
|
84
120
|
*/
|
|
85
121
|
async function findOrCreateTerm( term ) {
|
|
86
122
|
try {
|
|
123
|
+
// We need to match any existing term to the correct slug to prevent duplicates, eg.
|
|
124
|
+
// the core `Headers` category uses the singular `header` as the slug.
|
|
125
|
+
const existingTerm = categoryMap.get( term );
|
|
126
|
+
const termData = existingTerm
|
|
127
|
+
? { name: existingTerm.label, slug: existingTerm.name }
|
|
128
|
+
: { name: term };
|
|
87
129
|
const newTerm = await saveEntityRecord(
|
|
88
130
|
'taxonomy',
|
|
89
131
|
CATEGORY_SLUG,
|
|
90
|
-
|
|
132
|
+
termData,
|
|
91
133
|
{ throwOnError: true }
|
|
92
134
|
);
|
|
93
135
|
invalidateResolution( 'getUserPatternCategories' );
|
|
@@ -126,8 +168,9 @@ export default function CreatePatternModal( {
|
|
|
126
168
|
className="patterns-create-modal__name-input"
|
|
127
169
|
/>
|
|
128
170
|
<CategorySelector
|
|
129
|
-
|
|
171
|
+
categoryTerms={ categoryTerms }
|
|
130
172
|
onChange={ setCategoryTerms }
|
|
173
|
+
categoryMap={ categoryMap }
|
|
131
174
|
/>
|
|
132
175
|
<ToggleControl
|
|
133
176
|
label={ __( 'Synced' ) }
|
|
@@ -1,10 +1,36 @@
|
|
|
1
1
|
.patterns-menu-items__convert-modal {
|
|
2
2
|
z-index: z-index(".patterns-menu-items__convert-modal");
|
|
3
|
+
|
|
4
|
+
// Fix the modal width to prevent added categories from stretching the modal.
|
|
5
|
+
[role="dialog"] > [role="document"] {
|
|
6
|
+
width: 350px;
|
|
7
|
+
}
|
|
8
|
+
|
|
3
9
|
.patterns-menu-items__convert-modal-categories {
|
|
4
|
-
|
|
10
|
+
width: 100%;
|
|
11
|
+
position: relative;
|
|
12
|
+
min-height: 40px;
|
|
13
|
+
}
|
|
14
|
+
.components-form-token-field__suggestions-list {
|
|
15
|
+
position: absolute;
|
|
16
|
+
box-sizing: border-box;
|
|
17
|
+
z-index: 1;
|
|
18
|
+
background-color: $white;
|
|
19
|
+
// Account for the border width of the token field.
|
|
20
|
+
width: calc(100% + 2px);
|
|
21
|
+
left: -1px;
|
|
22
|
+
min-width: initial;
|
|
23
|
+
border: 1px solid var(--wp-admin-theme-color);
|
|
24
|
+
border-top: none;
|
|
25
|
+
box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
|
|
26
|
+
border-bottom-left-radius: 2px;
|
|
27
|
+
border-bottom-right-radius: 2px;
|
|
5
28
|
}
|
|
6
29
|
}
|
|
7
30
|
|
|
8
31
|
.patterns-create-modal__name-input input[type="text"] {
|
|
9
|
-
|
|
32
|
+
// Match the minimal height of the category selector.
|
|
33
|
+
min-height: 40px;
|
|
34
|
+
// Override the default 1px margin-x.
|
|
35
|
+
margin: 0;
|
|
10
36
|
}
|