@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.
@@ -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
- values,
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 (searchResults !== null && searchResults !== void 0 ? searchResults : []).map(term => unescapeString(term.name));
52
- }, [searchResults]);
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)(_element.Fragment, null, (0, _element.createElement)(_components.FormTokenField, {
46
+ return (0, _element.createElement)(_components.FormTokenField, {
63
47
  className: "patterns-menu-items__convert-modal-categories",
64
- value: values,
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","_data","_coreData","_compose","_htmlEntities","unescapeString","arg","decodeEntities","EMPTY_ARRAY","MAX_TERMS_SUGGESTIONS","DEFAULT_QUERY","per_page","_fields","context","CATEGORY_SLUG","exports","CategorySelector","values","onChange","search","setSearch","useState","debouncedSearch","useDebounce","searchResults","useSelect","select","getEntityRecords","coreStore","suggestions","useMemo","map","term","name","handleChange","termNames","uniqueTerms","reduce","terms","newTerm","some","toLowerCase","push","createElement","Fragment","FormTokenField","className","value","onInputChange","maxSuggestions","label","__","tokenizeOnBlur"],"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 { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDebounce } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\n\nconst unescapeString = ( arg ) => {\n\treturn decodeEntities( arg );\n};\n\nconst EMPTY_ARRAY = [];\nconst MAX_TERMS_SUGGESTIONS = 20;\nconst DEFAULT_QUERY = {\n\tper_page: MAX_TERMS_SUGGESTIONS,\n\t_fields: 'id,name',\n\tcontext: 'view',\n};\nexport const CATEGORY_SLUG = 'wp_pattern_category';\n\nexport default function CategorySelector( { values, onChange } ) {\n\tconst [ search, setSearch ] = useState( '' );\n\tconst debouncedSearch = useDebounce( setSearch, 500 );\n\n\tconst { searchResults } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\n\t\t\treturn {\n\t\t\t\tsearchResults: !! search\n\t\t\t\t\t? getEntityRecords( 'taxonomy', CATEGORY_SLUG, {\n\t\t\t\t\t\t\t...DEFAULT_QUERY,\n\t\t\t\t\t\t\tsearch,\n\t\t\t\t\t } )\n\t\t\t\t\t: EMPTY_ARRAY,\n\t\t\t};\n\t\t},\n\t\t[ search ]\n\t);\n\n\tconst suggestions = useMemo( () => {\n\t\treturn ( searchResults ?? [] ).map( ( term ) =>\n\t\t\tunescapeString( term.name )\n\t\t);\n\t}, [ searchResults ] );\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<>\n\t\t\t<FormTokenField\n\t\t\t\tclassName=\"patterns-menu-items__convert-modal-categories\"\n\t\t\t\tvalue={ values }\n\t\t\t\tsuggestions={ suggestions }\n\t\t\t\tonChange={ handleChange }\n\t\t\t\tonInputChange={ debouncedSearch }\n\t\t\t\tmaxSuggestions={ MAX_TERMS_SUGGESTIONS }\n\t\t\t\tlabel={ __( 'Categories' ) }\n\t\t\t\ttokenizeOnBlur={ true }\n\t\t\t/>\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,KAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAJ,OAAA;AACA,IAAAK,QAAA,GAAAL,OAAA;AACA,IAAAM,aAAA,GAAAN,OAAA;AATA;AACA;AACA;;AASA,MAAMO,cAAc,GAAKC,GAAG,IAAM;EACjC,OAAO,IAAAC,4BAAc,EAAED,GAAI,CAAC;AAC7B,CAAC;AAED,MAAME,WAAW,GAAG,EAAE;AACtB,MAAMC,qBAAqB,GAAG,EAAE;AAChC,MAAMC,aAAa,GAAG;EACrBC,QAAQ,EAAEF,qBAAqB;EAC/BG,OAAO,EAAE,SAAS;EAClBC,OAAO,EAAE;AACV,CAAC;AACM,MAAMC,aAAa,GAAG,qBAAqB;AAACC,OAAA,CAAAD,aAAA,GAAAA,aAAA;AAEpC,SAASE,gBAAgBA,CAAE;EAAEC,MAAM;EAAEC;AAAS,CAAC,EAAG;EAChE,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAG,IAAAC,iBAAQ,EAAE,EAAG,CAAC;EAC5C,MAAMC,eAAe,GAAG,IAAAC,oBAAW,EAAEH,SAAS,EAAE,GAAI,CAAC;EAErD,MAAM;IAAEI;EAAc,CAAC,GAAG,IAAAC,eAAS,EAChCC,MAAM,IAAM;IACb,MAAM;MAAEC;IAAiB,CAAC,GAAGD,MAAM,CAAEE,eAAU,CAAC;IAEhD,OAAO;MACNJ,aAAa,EAAE,CAAC,CAAEL,MAAM,GACrBQ,gBAAgB,CAAE,UAAU,EAAEb,aAAa,EAAE;QAC7C,GAAGJ,aAAa;QAChBS;MACA,CAAE,CAAC,GACHX;IACJ,CAAC;EACF,CAAC,EACD,CAAEW,MAAM,CACT,CAAC;EAED,MAAMU,WAAW,GAAG,IAAAC,gBAAO,EAAE,MAAM;IAClC,OAAO,CAAEN,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAI,EAAE,EAAGO,GAAG,CAAIC,IAAI,IACzC3B,cAAc,CAAE2B,IAAI,CAACC,IAAK,CAC3B,CAAC;EACF,CAAC,EAAE,CAAET,aAAa,CAAG,CAAC;EAEtB,SAASU,YAAYA,CAAEC,SAAS,EAAG;IAClC,MAAMC,WAAW,GAAGD,SAAS,CAACE,MAAM,CAAE,CAAEC,KAAK,EAAEC,OAAO,KAAM;MAC3D,IACC,CAAED,KAAK,CAACE,IAAI,CACTR,IAAI,IAAMA,IAAI,CAACS,WAAW,CAAC,CAAC,KAAKF,OAAO,CAACE,WAAW,CAAC,CACxD,CAAC,EACA;QACDH,KAAK,CAACI,IAAI,CAAEH,OAAQ,CAAC;MACtB;MACA,OAAOD,KAAK;IACb,CAAC,EAAE,EAAG,CAAC;IAEPpB,QAAQ,CAAEkB,WAAY,CAAC;EACxB;EAEA,OACC,IAAAvC,QAAA,CAAA8C,aAAA,EAAA9C,QAAA,CAAA+C,QAAA,QACC,IAAA/C,QAAA,CAAA8C,aAAA,EAAC3C,WAAA,CAAA6C,cAAc;IACdC,SAAS,EAAC,+CAA+C;IACzDC,KAAK,EAAG9B,MAAQ;IAChBY,WAAW,EAAGA,WAAa;IAC3BX,QAAQ,EAAGgB,YAAc;IACzBc,aAAa,EAAG1B,eAAiB;IACjC2B,cAAc,EAAGxC,qBAAuB;IACxCyC,KAAK,EAAG,IAAAC,QAAE,EAAE,YAAa,CAAG;IAC5BC,cAAc,EAAG;EAAM,CACvB,CACA,CAAC;AAEL"}
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
- const newTerm = await saveEntityRecord('taxonomy', _categorySelector.CATEGORY_SLUG, {
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
- values: categoryTerms,
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, Fragment } from "@wordpress/element";
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
- values,
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 (searchResults !== null && searchResults !== void 0 ? searchResults : []).map(term => unescapeString(term.name));
44
- }, [searchResults]);
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(Fragment, null, createElement(FormTokenField, {
38
+ return createElement(FormTokenField, {
55
39
  className: "patterns-menu-items__convert-modal-categories",
56
- value: values,
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","useSelect","store","coreStore","useDebounce","decodeEntities","unescapeString","arg","EMPTY_ARRAY","MAX_TERMS_SUGGESTIONS","DEFAULT_QUERY","per_page","_fields","context","CATEGORY_SLUG","CategorySelector","values","onChange","search","setSearch","debouncedSearch","searchResults","select","getEntityRecords","suggestions","map","term","name","handleChange","termNames","uniqueTerms","reduce","terms","newTerm","some","toLowerCase","push","createElement","Fragment","className","value","onInputChange","maxSuggestions","label","tokenizeOnBlur"],"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 { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDebounce } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\n\nconst unescapeString = ( arg ) => {\n\treturn decodeEntities( arg );\n};\n\nconst EMPTY_ARRAY = [];\nconst MAX_TERMS_SUGGESTIONS = 20;\nconst DEFAULT_QUERY = {\n\tper_page: MAX_TERMS_SUGGESTIONS,\n\t_fields: 'id,name',\n\tcontext: 'view',\n};\nexport const CATEGORY_SLUG = 'wp_pattern_category';\n\nexport default function CategorySelector( { values, onChange } ) {\n\tconst [ search, setSearch ] = useState( '' );\n\tconst debouncedSearch = useDebounce( setSearch, 500 );\n\n\tconst { searchResults } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\n\t\t\treturn {\n\t\t\t\tsearchResults: !! search\n\t\t\t\t\t? getEntityRecords( 'taxonomy', CATEGORY_SLUG, {\n\t\t\t\t\t\t\t...DEFAULT_QUERY,\n\t\t\t\t\t\t\tsearch,\n\t\t\t\t\t } )\n\t\t\t\t\t: EMPTY_ARRAY,\n\t\t\t};\n\t\t},\n\t\t[ search ]\n\t);\n\n\tconst suggestions = useMemo( () => {\n\t\treturn ( searchResults ?? [] ).map( ( term ) =>\n\t\t\tunescapeString( term.name )\n\t\t);\n\t}, [ searchResults ] );\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<>\n\t\t\t<FormTokenField\n\t\t\t\tclassName=\"patterns-menu-items__convert-modal-categories\"\n\t\t\t\tvalue={ values }\n\t\t\t\tsuggestions={ suggestions }\n\t\t\t\tonChange={ handleChange }\n\t\t\t\tonInputChange={ debouncedSearch }\n\t\t\t\tmaxSuggestions={ MAX_TERMS_SUGGESTIONS }\n\t\t\t\tlabel={ __( 'Categories' ) }\n\t\t\t\ttokenizeOnBlur={ true }\n\t\t\t/>\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,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AACzD,SAASC,WAAW,QAAQ,oBAAoB;AAChD,SAASC,cAAc,QAAQ,0BAA0B;AAEzD,MAAMC,cAAc,GAAKC,GAAG,IAAM;EACjC,OAAOF,cAAc,CAAEE,GAAI,CAAC;AAC7B,CAAC;AAED,MAAMC,WAAW,GAAG,EAAE;AACtB,MAAMC,qBAAqB,GAAG,EAAE;AAChC,MAAMC,aAAa,GAAG;EACrBC,QAAQ,EAAEF,qBAAqB;EAC/BG,OAAO,EAAE,SAAS;EAClBC,OAAO,EAAE;AACV,CAAC;AACD,OAAO,MAAMC,aAAa,GAAG,qBAAqB;AAElD,eAAe,SAASC,gBAAgBA,CAAE;EAAEC,MAAM;EAAEC;AAAS,CAAC,EAAG;EAChE,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAGpB,QAAQ,CAAE,EAAG,CAAC;EAC5C,MAAMqB,eAAe,GAAGhB,WAAW,CAAEe,SAAS,EAAE,GAAI,CAAC;EAErD,MAAM;IAAEE;EAAc,CAAC,GAAGpB,SAAS,CAChCqB,MAAM,IAAM;IACb,MAAM;MAAEC;IAAiB,CAAC,GAAGD,MAAM,CAAEnB,SAAU,CAAC;IAEhD,OAAO;MACNkB,aAAa,EAAE,CAAC,CAAEH,MAAM,GACrBK,gBAAgB,CAAE,UAAU,EAAET,aAAa,EAAE;QAC7C,GAAGJ,aAAa;QAChBQ;MACA,CAAE,CAAC,GACHV;IACJ,CAAC;EACF,CAAC,EACD,CAAEU,MAAM,CACT,CAAC;EAED,MAAMM,WAAW,GAAG1B,OAAO,CAAE,MAAM;IAClC,OAAO,CAAEuB,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAI,EAAE,EAAGI,GAAG,CAAIC,IAAI,IACzCpB,cAAc,CAAEoB,IAAI,CAACC,IAAK,CAC3B,CAAC;EACF,CAAC,EAAE,CAAEN,aAAa,CAAG,CAAC;EAEtB,SAASO,YAAYA,CAAEC,SAAS,EAAG;IAClC,MAAMC,WAAW,GAAGD,SAAS,CAACE,MAAM,CAAE,CAAEC,KAAK,EAAEC,OAAO,KAAM;MAC3D,IACC,CAAED,KAAK,CAACE,IAAI,CACTR,IAAI,IAAMA,IAAI,CAACS,WAAW,CAAC,CAAC,KAAKF,OAAO,CAACE,WAAW,CAAC,CACxD,CAAC,EACA;QACDH,KAAK,CAACI,IAAI,CAAEH,OAAQ,CAAC;MACtB;MACA,OAAOD,KAAK;IACb,CAAC,EAAE,EAAG,CAAC;IAEPf,QAAQ,CAAEa,WAAY,CAAC;EACxB;EAEA,OACCO,aAAA,CAAAC,QAAA,QACCD,aAAA,CAACrC,cAAc;IACduC,SAAS,EAAC,+CAA+C;IACzDC,KAAK,EAAGxB,MAAQ;IAChBQ,WAAW,EAAGA,WAAa;IAC3BP,QAAQ,EAAGW,YAAc;IACzBa,aAAa,EAAGrB,eAAiB;IACjCsB,cAAc,EAAGjC,qBAAuB;IACxCkC,KAAK,EAAG9C,EAAE,CAAE,YAAa,CAAG;IAC5B+C,cAAc,EAAG;EAAM,CACvB,CACA,CAAC;AAEL"}
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
- const newTerm = await saveEntityRecord('taxonomy', CATEGORY_SLUG, {
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
- values: categoryTerms,
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":";AAAA;AACA;AACA;AACA,SACCA,KAAK,EACLC,MAAM,EACNC,WAAW,EACXC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,EAC9BC,aAAa,QACP,uBAAuB;AAC9B,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,KAAK,IAAIC,YAAY,QAAQ,oBAAoB;AAC1D,SAASD,KAAK,IAAIE,SAAS,QAAQ,sBAAsB;;AAEzD;AACA;AACA;AACA,SAASC,wBAAwB,EAAEC,kBAAkB,QAAQ,cAAc;;AAE3E;AACA;AACA;AACA,SAASJ,KAAK,IAAIK,aAAa,QAAQ,UAAU;AACjD,OAAOC,gBAAgB,IAAIC,aAAa,QAAQ,qBAAqB;AACrE,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,eAAe,SAASC,kBAAkBA,CAAE;EAC3CC,SAAS;EACTC,OAAO;EACPC,OAAO;EACPC,OAAO;EACPC,SAAS,GAAG;AACb,CAAC,EAAG;EACH,MAAM,CAAEC,QAAQ,EAAEC,WAAW,CAAE,GAAGlB,QAAQ,CAAEM,kBAAkB,CAACa,IAAK,CAAC;EACrE,MAAM,CAAEC,aAAa,EAAEC,gBAAgB,CAAE,GAAGrB,QAAQ,CAAE,EAAG,CAAC;EAC1D,MAAM,CAAEsB,KAAK,EAAEC,QAAQ,CAAE,GAAGvB,QAAQ,CAAE,EAAG,CAAC;EAC1C,MAAM,CAAEwB,QAAQ,EAAEC,WAAW,CAAE,GAAGzB,QAAQ,CAAE,KAAM,CAAC;EACnD,MAAM;IAAE0B;EAAc,CAAC,GAAGhB,MAAM,CAAET,WAAW,CAAEM,aAAc,CAAE,CAAC;EAChE,MAAM;IAAEoB,gBAAgB;IAAEC;EAAqB,CAAC,GAAG3B,WAAW,CAAEG,SAAU,CAAC;EAC3E,MAAM;IAAEyB;EAAkB,CAAC,GAAG5B,WAAW,CAAEE,YAAa,CAAC;EAEzD,eAAe2B,QAAQA,CAAEC,YAAY,EAAEC,IAAI,EAAG;IAC7C,IAAK,CAAEV,KAAK,IAAIE,QAAQ,EAAG;MAC1B;IACD;IAEA,IAAI;MACHC,WAAW,CAAE,IAAK,CAAC;MACnB,MAAMQ,UAAU,GAAG,MAAMC,OAAO,CAACC,GAAG,CACnCf,aAAa,CAACgB,GAAG,CAAIC,QAAQ,IAC5BC,gBAAgB,CAAED,QAAS,CAC5B,CACD,CAAC;MAED,MAAME,UAAU,GAAG,MAAMb,aAAa,CACrCK,YAAY,EACZC,IAAI,EACJ,OAAOlB,OAAO,KAAK,UAAU,GAAGA,OAAO,CAAC,CAAC,GAAGA,OAAO,EACnDmB,UACD,CAAC;MACDrB,SAAS,CAAE;QACV4B,OAAO,EAAED,UAAU;QACnBE,UAAU,EAAEpC;MACb,CAAE,CAAC;IACJ,CAAC,CAAC,OAAQqC,KAAK,EAAG;MACjBb,iBAAiB,CAAEa,KAAK,CAACC,OAAO,EAAE;QACjCC,IAAI,EAAE,UAAU;QAChBC,EAAE,EAAE;MACL,CAAE,CAAC;MACHhC,OAAO,CAAC,CAAC;IACV,CAAC,SAAS;MACTY,WAAW,CAAE,KAAM,CAAC;MACpBJ,gBAAgB,CAAE,EAAG,CAAC;MACtBE,QAAQ,CAAE,EAAG,CAAC;IACf;EACD;;EAEA;AACD;AACA;AACA;EACC,eAAee,gBAAgBA,CAAEQ,IAAI,EAAG;IACvC,IAAI;MACH,MAAMC,OAAO,GAAG,MAAMpB,gBAAgB,CACrC,UAAU,EACVlB,aAAa,EACb;QAAEuC,IAAI,EAAEF;MAAK,CAAC,EACd;QAAEG,YAAY,EAAE;MAAK,CACtB,CAAC;MACDrB,oBAAoB,CAAE,0BAA2B,CAAC;MAClD,OAAOmB,OAAO,CAACF,EAAE;IAClB,CAAC,CAAC,OAAQH,KAAK,EAAG;MACjB,IAAKA,KAAK,CAACQ,IAAI,KAAK,aAAa,EAAG;QACnC,MAAMR,KAAK;MACZ;MAEA,OAAOA,KAAK,CAACS,IAAI,CAACC,OAAO;IAC1B;EACD;EAEA,OACCC,aAAA,CAAC9D,KAAK;IACL+B,KAAK,EAAGvB,EAAE,CAAE,gBAAiB,CAAG;IAChCuD,cAAc,EAAGA,CAAA,KAAM;MACtBvC,OAAO,CAAC,CAAC;MACTQ,QAAQ,CAAE,EAAG,CAAC;IACf,CAAG;IACHgC,gBAAgB,EAAGvC;EAAW,GAE9BqC,aAAA;IACCG,QAAQ,EAAKC,KAAK,IAAM;MACvBA,KAAK,CAACC,cAAc,CAAC,CAAC;MACtB5B,QAAQ,CAAER,KAAK,EAAEL,QAAS,CAAC;IAC5B;EAAG,GAEHoC,aAAA,CAACxD,MAAM;IAAC8D,OAAO,EAAC;EAAG,GAClBN,aAAA,CAAC5D,WAAW;IACXmE,uBAAuB;IACvBC,KAAK,EAAG9D,EAAE,CAAE,MAAO,CAAG;IACtB+D,KAAK,EAAGxC,KAAO;IACfyC,QAAQ,EAAGxC,QAAU;IACrByC,WAAW,EAAGjE,EAAE,CAAE,YAAa,CAAG;IAClCiB,SAAS,EAAC;EAAmC,CAC7C,CAAC,EACFqC,aAAA,CAAC7C,gBAAgB;IAChByD,MAAM,EAAG7C,aAAe;IACxB2C,QAAQ,EAAG1C;EAAkB,CAC7B,CAAC,EACFgC,aAAA,CAACvD,aAAa;IACb+D,KAAK,EAAG9D,EAAE,CAAE,QAAS,CAAG;IACxBmE,IAAI,EAAGnE,EAAE,CACR,yDACD,CAAG;IACHoE,OAAO,EAAGlD,QAAQ,KAAKX,kBAAkB,CAACa,IAAM;IAChD4C,QAAQ,EAAGA,CAAA,KAAM;MAChB7C,WAAW,CACVD,QAAQ,KAAKX,kBAAkB,CAACa,IAAI,GACjCb,kBAAkB,CAAC8D,QAAQ,GAC3B9D,kBAAkB,CAACa,IACvB,CAAC;IACF;EAAG,CACH,CAAC,EACFkC,aAAA,CAAC1D,MAAM;IAAC0E,OAAO,EAAC;EAAO,GACtBhB,aAAA,CAAC7D,MAAM;IACN8E,OAAO,EAAC,UAAU;IAClBC,OAAO,EAAGA,CAAA,KAAM;MACfxD,OAAO,CAAC,CAAC;MACTQ,QAAQ,CAAE,EAAG,CAAC;IACf;EAAG,GAEDxB,EAAE,CAAE,QAAS,CACR,CAAC,EAETsD,aAAA,CAAC7D,MAAM;IACN8E,OAAO,EAAC,SAAS;IACjB1B,IAAI,EAAC,QAAQ;IACb,iBAAgB,CAAEtB,KAAK,IAAIE,QAAU;IACrCgD,MAAM,EAAGhD;EAAU,GAEjBzB,EAAE,CAAE,QAAS,CACR,CACD,CACD,CACH,CACA,CAAC;AAEV"}
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
- max-width: 300px;
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: 34px;
133
+ min-height: 40px;
134
+ margin: 0;
115
135
  }
@@ -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
- max-width: 300px;
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: 34px;
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.2",
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.2",
36
- "@wordpress/blocks": "^12.19.2",
37
- "@wordpress/components": "^25.8.2",
38
- "@wordpress/compose": "^6.19.2",
39
- "@wordpress/core-data": "^6.19.2",
40
- "@wordpress/data": "^9.12.2",
41
- "@wordpress/element": "^5.19.2",
42
- "@wordpress/html-entities": "^3.42.2",
43
- "@wordpress/i18n": "^4.42.2",
44
- "@wordpress/icons": "^9.33.2",
45
- "@wordpress/notices": "^4.10.2",
46
- "@wordpress/private-apis": "^0.24.2",
47
- "@wordpress/url": "^3.43.2"
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": "5d2e3d07cc97af8090fc32c1e5d5013a2967e752"
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( { values, onChange } ) {
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 ( searchResults ?? [] ).map( ( term ) =>
47
- unescapeString( term.name )
48
- );
49
- }, [ searchResults ] );
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
- <FormTokenField
69
- className="patterns-menu-items__convert-modal-categories"
70
- value={ values }
71
- suggestions={ suggestions }
72
- onChange={ handleChange }
73
- onInputChange={ debouncedSearch }
74
- maxSuggestions={ MAX_TERMS_SUGGESTIONS }
75
- label={ __( 'Categories' ) }
76
- tokenizeOnBlur={ true }
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
- { name: term },
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
- values={ categoryTerms }
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
- max-width: 300px;
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
- min-height: 34px;
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
  }