@wordpress/edit-site 4.9.0 → 4.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (199) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/build/components/add-new-template/add-custom-generic-template-modal.js +84 -0
  3. package/build/components/add-new-template/add-custom-generic-template-modal.js.map +1 -0
  4. package/build/components/add-new-template/add-custom-template-modal.js +82 -61
  5. package/build/components/add-new-template/add-custom-template-modal.js.map +1 -1
  6. package/build/components/add-new-template/new-template.js +94 -81
  7. package/build/components/add-new-template/new-template.js.map +1 -1
  8. package/build/components/add-new-template/utils.js +574 -57
  9. package/build/components/add-new-template/utils.js.map +1 -1
  10. package/build/components/block-editor/index.js +1 -3
  11. package/build/components/block-editor/index.js.map +1 -1
  12. package/build/components/code-editor/index.js +17 -4
  13. package/build/components/code-editor/index.js.map +1 -1
  14. package/build/components/editor/index.js +16 -0
  15. package/build/components/editor/index.js.map +1 -1
  16. package/build/components/error-boundary/index.js +6 -0
  17. package/build/components/error-boundary/index.js.map +1 -1
  18. package/build/components/global-styles/dimensions-panel.js +191 -21
  19. package/build/components/global-styles/dimensions-panel.js.map +1 -1
  20. package/build/components/global-styles/global-styles-provider.js +4 -2
  21. package/build/components/global-styles/global-styles-provider.js.map +1 -1
  22. package/build/components/global-styles/hooks.js +11 -2
  23. package/build/components/global-styles/hooks.js.map +1 -1
  24. package/build/components/global-styles/screen-color-palette.js +13 -17
  25. package/build/components/global-styles/screen-color-palette.js.map +1 -1
  26. package/build/components/global-styles/screen-colors.js +59 -7
  27. package/build/components/global-styles/screen-colors.js.map +1 -1
  28. package/build/components/global-styles/screen-heading-color.js +157 -0
  29. package/build/components/global-styles/screen-heading-color.js.map +1 -0
  30. package/build/components/global-styles/screen-link-color.js +48 -14
  31. package/build/components/global-styles/screen-link-color.js.map +1 -1
  32. package/build/components/global-styles/screen-typography-element.js +4 -0
  33. package/build/components/global-styles/screen-typography-element.js.map +1 -1
  34. package/build/components/global-styles/screen-typography.js +5 -0
  35. package/build/components/global-styles/screen-typography.js.map +1 -1
  36. package/build/components/global-styles/typography-panel.js +73 -12
  37. package/build/components/global-styles/typography-panel.js.map +1 -1
  38. package/build/components/global-styles/typography-utils.js +217 -0
  39. package/build/components/global-styles/typography-utils.js.map +1 -0
  40. package/build/components/global-styles/ui.js +11 -0
  41. package/build/components/global-styles/ui.js.map +1 -1
  42. package/build/components/global-styles/use-global-styles-output.js +298 -61
  43. package/build/components/global-styles/use-global-styles-output.js.map +1 -1
  44. package/build/components/global-styles/utils.js +49 -3
  45. package/build/components/global-styles/utils.js.map +1 -1
  46. package/build/components/header/index.js +22 -10
  47. package/build/components/header/index.js.map +1 -1
  48. package/build/components/header/undo-redo/redo.js +2 -1
  49. package/build/components/header/undo-redo/redo.js.map +1 -1
  50. package/build/components/keyboard-shortcut-help-modal/index.js +1 -3
  51. package/build/components/keyboard-shortcut-help-modal/index.js.map +1 -1
  52. package/build/components/list/actions/index.js +1 -1
  53. package/build/components/list/actions/index.js.map +1 -1
  54. package/build/components/save-button/index.js +2 -3
  55. package/build/components/save-button/index.js.map +1 -1
  56. package/build/components/sidebar/navigation-menu-sidebar/navigation-menu.js +2 -2
  57. package/build/components/sidebar/navigation-menu-sidebar/navigation-menu.js.map +1 -1
  58. package/build/components/sidebar/template-card/template-actions.js +1 -1
  59. package/build/components/sidebar/template-card/template-actions.js.map +1 -1
  60. package/build/components/template-details/edit-template-title.js +11 -3
  61. package/build/components/template-details/edit-template-title.js.map +1 -1
  62. package/build/components/template-details/index.js +2 -21
  63. package/build/components/template-details/index.js.map +1 -1
  64. package/build/components/template-details/template-areas.js +1 -1
  65. package/build/components/template-details/template-areas.js.map +1 -1
  66. package/build/components/template-part-converter/convert-to-template-part.js +4 -1
  67. package/build/components/template-part-converter/convert-to-template-part.js.map +1 -1
  68. package/build/hooks/index.js +2 -0
  69. package/build/hooks/index.js.map +1 -1
  70. package/build/hooks/template-part-edit.js +86 -0
  71. package/build/hooks/template-part-edit.js.map +1 -0
  72. package/build/store/selectors.js +4 -1
  73. package/build/store/selectors.js.map +1 -1
  74. package/build-module/components/add-new-template/add-custom-generic-template-modal.js +77 -0
  75. package/build-module/components/add-new-template/add-custom-generic-template-modal.js.map +1 -0
  76. package/build-module/components/add-new-template/add-custom-template-modal.js +82 -61
  77. package/build-module/components/add-new-template/add-custom-template-modal.js.map +1 -1
  78. package/build-module/components/add-new-template/new-template.js +96 -84
  79. package/build-module/components/add-new-template/new-template.js.map +1 -1
  80. package/build-module/components/add-new-template/utils.js +555 -50
  81. package/build-module/components/add-new-template/utils.js.map +1 -1
  82. package/build-module/components/block-editor/index.js +1 -2
  83. package/build-module/components/block-editor/index.js.map +1 -1
  84. package/build-module/components/code-editor/index.js +18 -5
  85. package/build-module/components/code-editor/index.js.map +1 -1
  86. package/build-module/components/editor/index.js +16 -0
  87. package/build-module/components/editor/index.js.map +1 -1
  88. package/build-module/components/error-boundary/index.js +5 -0
  89. package/build-module/components/error-boundary/index.js.map +1 -1
  90. package/build-module/components/global-styles/dimensions-panel.js +191 -22
  91. package/build-module/components/global-styles/dimensions-panel.js.map +1 -1
  92. package/build-module/components/global-styles/global-styles-provider.js +4 -2
  93. package/build-module/components/global-styles/global-styles-provider.js.map +1 -1
  94. package/build-module/components/global-styles/hooks.js +11 -2
  95. package/build-module/components/global-styles/hooks.js.map +1 -1
  96. package/build-module/components/global-styles/screen-color-palette.js +14 -19
  97. package/build-module/components/global-styles/screen-color-palette.js.map +1 -1
  98. package/build-module/components/global-styles/screen-colors.js +59 -7
  99. package/build-module/components/global-styles/screen-colors.js.map +1 -1
  100. package/build-module/components/global-styles/screen-heading-color.js +143 -0
  101. package/build-module/components/global-styles/screen-heading-color.js.map +1 -0
  102. package/build-module/components/global-styles/screen-link-color.js +47 -14
  103. package/build-module/components/global-styles/screen-link-color.js.map +1 -1
  104. package/build-module/components/global-styles/screen-typography-element.js +4 -0
  105. package/build-module/components/global-styles/screen-typography-element.js.map +1 -1
  106. package/build-module/components/global-styles/screen-typography.js +5 -0
  107. package/build-module/components/global-styles/screen-typography.js.map +1 -1
  108. package/build-module/components/global-styles/typography-panel.js +74 -13
  109. package/build-module/components/global-styles/typography-panel.js.map +1 -1
  110. package/build-module/components/global-styles/typography-utils.js +204 -0
  111. package/build-module/components/global-styles/typography-utils.js.map +1 -0
  112. package/build-module/components/global-styles/ui.js +10 -0
  113. package/build-module/components/global-styles/ui.js.map +1 -1
  114. package/build-module/components/global-styles/use-global-styles-output.js +294 -69
  115. package/build-module/components/global-styles/use-global-styles-output.js.map +1 -1
  116. package/build-module/components/global-styles/utils.js +47 -4
  117. package/build-module/components/global-styles/utils.js.map +1 -1
  118. package/build-module/components/header/index.js +25 -12
  119. package/build-module/components/header/index.js.map +1 -1
  120. package/build-module/components/header/undo-redo/redo.js +3 -2
  121. package/build-module/components/header/undo-redo/redo.js.map +1 -1
  122. package/build-module/components/keyboard-shortcut-help-modal/index.js +1 -2
  123. package/build-module/components/keyboard-shortcut-help-modal/index.js.map +1 -1
  124. package/build-module/components/list/actions/index.js +1 -1
  125. package/build-module/components/list/actions/index.js.map +1 -1
  126. package/build-module/components/save-button/index.js +3 -4
  127. package/build-module/components/save-button/index.js.map +1 -1
  128. package/build-module/components/sidebar/navigation-menu-sidebar/navigation-menu.js +3 -3
  129. package/build-module/components/sidebar/navigation-menu-sidebar/navigation-menu.js.map +1 -1
  130. package/build-module/components/sidebar/template-card/template-actions.js +1 -1
  131. package/build-module/components/sidebar/template-card/template-actions.js.map +1 -1
  132. package/build-module/components/template-details/edit-template-title.js +12 -3
  133. package/build-module/components/template-details/edit-template-title.js.map +1 -1
  134. package/build-module/components/template-details/index.js +3 -22
  135. package/build-module/components/template-details/index.js.map +1 -1
  136. package/build-module/components/template-details/template-areas.js +1 -1
  137. package/build-module/components/template-details/template-areas.js.map +1 -1
  138. package/build-module/components/template-part-converter/convert-to-template-part.js +3 -1
  139. package/build-module/components/template-part-converter/convert-to-template-part.js.map +1 -1
  140. package/build-module/hooks/index.js +1 -0
  141. package/build-module/hooks/index.js.map +1 -1
  142. package/build-module/hooks/template-part-edit.js +67 -0
  143. package/build-module/hooks/template-part-edit.js.map +1 -0
  144. package/build-module/store/selectors.js +5 -2
  145. package/build-module/store/selectors.js.map +1 -1
  146. package/build-style/style-rtl.css +55 -48
  147. package/build-style/style.css +55 -48
  148. package/package.json +29 -29
  149. package/src/components/add-new-template/add-custom-generic-template-modal.js +97 -0
  150. package/src/components/add-new-template/add-custom-template-modal.js +93 -68
  151. package/src/components/add-new-template/new-template.js +126 -95
  152. package/src/components/add-new-template/style.scss +41 -8
  153. package/src/components/add-new-template/utils.js +622 -80
  154. package/src/components/block-editor/index.js +0 -2
  155. package/src/components/code-editor/index.js +15 -5
  156. package/src/components/editor/index.js +11 -0
  157. package/src/components/error-boundary/index.js +5 -0
  158. package/src/components/global-styles/dimensions-panel.js +214 -24
  159. package/src/components/global-styles/global-styles-provider.js +8 -9
  160. package/src/components/global-styles/hooks.js +18 -0
  161. package/src/components/global-styles/screen-color-palette.js +25 -27
  162. package/src/components/global-styles/screen-colors.js +55 -7
  163. package/src/components/global-styles/screen-heading-color.js +201 -0
  164. package/src/components/global-styles/screen-link-color.js +65 -23
  165. package/src/components/global-styles/screen-typography-element.js +4 -0
  166. package/src/components/global-styles/screen-typography.js +6 -0
  167. package/src/components/global-styles/style.scss +14 -11
  168. package/src/components/global-styles/test/typography-utils.js +130 -0
  169. package/src/components/global-styles/test/use-global-styles-output.js +296 -2
  170. package/src/components/global-styles/typography-panel.js +85 -16
  171. package/src/components/global-styles/typography-utils.js +228 -0
  172. package/src/components/global-styles/ui.js +13 -0
  173. package/src/components/global-styles/use-global-styles-output.js +387 -89
  174. package/src/components/global-styles/utils.js +43 -2
  175. package/src/components/header/index.js +37 -13
  176. package/src/components/header/style.scss +5 -3
  177. package/src/components/header/undo-redo/redo.js +6 -2
  178. package/src/components/keyboard-shortcut-help-modal/index.js +1 -2
  179. package/src/components/keyboard-shortcut-help-modal/style.scss +0 -5
  180. package/src/components/list/actions/index.js +3 -1
  181. package/src/components/list/style.scss +0 -8
  182. package/src/components/save-button/index.js +10 -13
  183. package/src/components/sidebar/navigation-menu-sidebar/navigation-menu.js +1 -5
  184. package/src/components/sidebar/style.scss +4 -0
  185. package/src/components/sidebar/template-card/template-actions.js +3 -1
  186. package/src/components/template-details/edit-template-title.js +10 -2
  187. package/src/components/template-details/index.js +7 -22
  188. package/src/components/template-details/template-areas.js +3 -1
  189. package/src/components/template-part-converter/convert-to-template-part.js +3 -1
  190. package/src/components/test/error-boundary.js +38 -0
  191. package/src/hooks/index.js +1 -0
  192. package/src/hooks/template-part-edit.js +82 -0
  193. package/src/store/selectors.js +11 -5
  194. package/src/style.scss +0 -1
  195. package/build/components/edit-template-part-menu-button/index.js +0 -90
  196. package/build/components/edit-template-part-menu-button/index.js.map +0 -1
  197. package/build-module/components/edit-template-part-menu-button/index.js +0 -72
  198. package/build-module/components/edit-template-part-menu-button/index.js.map +0 -1
  199. package/src/components/edit-template-part-menu-button/index.js +0 -82
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 4.12.0 (2022-08-10)
6
+
7
+ ## 4.11.0 (2022-07-27)
8
+
9
+ ## 4.10.0 (2022-07-13)
10
+
5
11
  ## 4.9.0 (2022-06-29)
6
12
 
7
13
  ## 4.8.0 (2022-06-15)
@@ -0,0 +1,84 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _element = require("@wordpress/element");
9
+
10
+ var _lodash = require("lodash");
11
+
12
+ var _i18n = require("@wordpress/i18n");
13
+
14
+ var _components = require("@wordpress/components");
15
+
16
+ /**
17
+ * External dependencies
18
+ */
19
+
20
+ /**
21
+ * WordPress dependencies
22
+ */
23
+ function AddCustomGenericTemplateModal(_ref) {
24
+ let {
25
+ onClose,
26
+ createTemplate
27
+ } = _ref;
28
+ const [title, setTitle] = (0, _element.useState)('');
29
+ const defaultTitle = (0, _i18n.__)('Custom Template');
30
+ const [isBusy, setIsBusy] = (0, _element.useState)(false);
31
+
32
+ async function onCreateTemplate(event) {
33
+ event.preventDefault();
34
+
35
+ if (isBusy) {
36
+ return;
37
+ }
38
+
39
+ setIsBusy(true);
40
+ createTemplate({
41
+ slug: 'wp-custom-template-' + (0, _lodash.kebabCase)(title || defaultTitle),
42
+ title: title || defaultTitle
43
+ }, false);
44
+ }
45
+
46
+ return (0, _element.createElement)(_components.Modal, {
47
+ title: (0, _i18n.__)('Create custom template'),
48
+ closeLabel: (0, _i18n.__)('Close'),
49
+ onRequestClose: () => {
50
+ onClose();
51
+ },
52
+ overlayClassName: "edit-site-custom-generic-template__modal"
53
+ }, (0, _element.createElement)("form", {
54
+ onSubmit: onCreateTemplate
55
+ }, (0, _element.createElement)(_components.Flex, {
56
+ align: "flex-start",
57
+ gap: 8
58
+ }, (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_components.TextControl, {
59
+ label: (0, _i18n.__)('Name'),
60
+ value: title,
61
+ onChange: setTitle,
62
+ placeholder: defaultTitle,
63
+ disabled: isBusy,
64
+ help: (0, _i18n.__)('Describe the template, e.g. "Post with sidebar".')
65
+ }))), (0, _element.createElement)(_components.Flex, {
66
+ className: "edit-site-custom-generic-template__modal-actions",
67
+ justify: "flex-end",
68
+ expanded: false
69
+ }, (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_components.Button, {
70
+ variant: "tertiary",
71
+ onClick: () => {
72
+ onClose();
73
+ }
74
+ }, (0, _i18n.__)('Cancel'))), (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_components.Button, {
75
+ variant: "primary",
76
+ type: "submit",
77
+ isBusy: isBusy,
78
+ "aria-disabled": isBusy
79
+ }, (0, _i18n.__)('Create'))))));
80
+ }
81
+
82
+ var _default = AddCustomGenericTemplateModal;
83
+ exports.default = _default;
84
+ //# sourceMappingURL=add-custom-generic-template-modal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/edit-site/src/components/add-new-template/add-custom-generic-template-modal.js"],"names":["AddCustomGenericTemplateModal","onClose","createTemplate","title","setTitle","defaultTitle","isBusy","setIsBusy","onCreateTemplate","event","preventDefault","slug"],"mappings":";;;;;;;AAQA;;AALA;;AAMA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAWA,SAASA,6BAAT,OAAsE;AAAA,MAA9B;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,GAA8B;AACrE,QAAM,CAAEC,KAAF,EAASC,QAAT,IAAsB,uBAAU,EAAV,CAA5B;AACA,QAAMC,YAAY,GAAG,cAAI,iBAAJ,CAArB;AACA,QAAM,CAAEC,MAAF,EAAUC,SAAV,IAAwB,uBAAU,KAAV,CAA9B;;AACA,iBAAeC,gBAAf,CAAiCC,KAAjC,EAAyC;AACxCA,IAAAA,KAAK,CAACC,cAAN;;AAEA,QAAKJ,MAAL,EAAc;AACb;AACA;;AAEDC,IAAAA,SAAS,CAAE,IAAF,CAAT;AAEAL,IAAAA,cAAc,CACb;AACCS,MAAAA,IAAI,EACH,wBAAwB,uBAAWR,KAAK,IAAIE,YAApB,CAF1B;AAGCF,MAAAA,KAAK,EAAEA,KAAK,IAAIE;AAHjB,KADa,EAMb,KANa,CAAd;AAQA;;AACD,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAG,cAAI,wBAAJ,CADT;AAEC,IAAA,UAAU,EAAG,cAAI,OAAJ,CAFd;AAGC,IAAA,cAAc,EAAG,MAAM;AACtBJ,MAAAA,OAAO;AACP,KALF;AAMC,IAAA,gBAAgB,EAAC;AANlB,KAQC;AAAM,IAAA,QAAQ,EAAGO;AAAjB,KACC,4BAAC,gBAAD;AAAM,IAAA,KAAK,EAAC,YAAZ;AAAyB,IAAA,GAAG,EAAG;AAA/B,KACC,4BAAC,oBAAD,QACC,4BAAC,uBAAD;AACC,IAAA,KAAK,EAAG,cAAI,MAAJ,CADT;AAEC,IAAA,KAAK,EAAGL,KAFT;AAGC,IAAA,QAAQ,EAAGC,QAHZ;AAIC,IAAA,WAAW,EAAGC,YAJf;AAKC,IAAA,QAAQ,EAAGC,MALZ;AAMC,IAAA,IAAI,EAAG,cACN,kDADM;AANR,IADD,CADD,CADD,EAgBC,4BAAC,gBAAD;AACC,IAAA,SAAS,EAAC,kDADX;AAEC,IAAA,OAAO,EAAC,UAFT;AAGC,IAAA,QAAQ,EAAG;AAHZ,KAKC,4BAAC,oBAAD,QACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,UADT;AAEC,IAAA,OAAO,EAAG,MAAM;AACfL,MAAAA,OAAO;AACP;AAJF,KAMG,cAAI,QAAJ,CANH,CADD,CALD,EAeC,4BAAC,oBAAD,QACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,SADT;AAEC,IAAA,IAAI,EAAC,QAFN;AAGC,IAAA,MAAM,EAAGK,MAHV;AAIC,qBAAgBA;AAJjB,KAMG,cAAI,QAAJ,CANH,CADD,CAfD,CAhBD,CARD,CADD;AAsDA;;eAEcN,6B","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\tTextControl,\n} from '@wordpress/components';\n\nfunction AddCustomGenericTemplateModal( { onClose, createTemplate } ) {\n\tconst [ title, setTitle ] = useState( '' );\n\tconst defaultTitle = __( 'Custom Template' );\n\tconst [ isBusy, setIsBusy ] = useState( false );\n\tasync function onCreateTemplate( event ) {\n\t\tevent.preventDefault();\n\n\t\tif ( isBusy ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsBusy( true );\n\n\t\tcreateTemplate(\n\t\t\t{\n\t\t\t\tslug:\n\t\t\t\t\t'wp-custom-template-' + kebabCase( title || defaultTitle ),\n\t\t\t\ttitle: title || defaultTitle,\n\t\t\t},\n\t\t\tfalse\n\t\t);\n\t}\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Create custom template' ) }\n\t\t\tcloseLabel={ __( 'Close' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tonClose();\n\t\t\t} }\n\t\t\toverlayClassName=\"edit-site-custom-generic-template__modal\"\n\t\t>\n\t\t\t<form onSubmit={ onCreateTemplate }>\n\t\t\t\t<Flex align=\"flex-start\" gap={ 8 }>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\t\t\tvalue={ title }\n\t\t\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\t\t\tplaceholder={ defaultTitle }\n\t\t\t\t\t\t\tdisabled={ isBusy }\n\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t'Describe the template, e.g. \"Post with sidebar\".'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"edit-site-custom-generic-template__modal-actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\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} }\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\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\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\tisBusy={ isBusy }\n\t\t\t\t\t\t\taria-disabled={ isBusy }\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</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n\nexport default AddCustomGenericTemplateModal;\n"]}
@@ -29,11 +29,6 @@ var _utils = require("./utils");
29
29
  * Internal dependencies
30
30
  */
31
31
  const EMPTY_ARRAY = [];
32
- const BASE_QUERY = {
33
- order: 'asc',
34
- _fields: 'id,title,slug,link',
35
- context: 'view'
36
- };
37
32
 
38
33
  function SuggestionListItem(_ref) {
39
34
  let {
@@ -49,16 +44,7 @@ function SuggestionListItem(_ref) {
49
44
  as: _components.Button
50
45
  }, composite, {
51
46
  className: baseCssClass,
52
- onClick: () => {
53
- const title = (0, _i18n.sprintf)( // translators: Represents the title of a user's custom template in the Site Editor, where %1$s is the singular name of a post type and %2$s is the name of the post, e.g. "Post: Hello, WordPress"
54
- (0, _i18n.__)('%1$s: %2$s'), entityForSuggestions.labels.singular_name, suggestion.name);
55
- onSelect({
56
- title,
57
- description: (0, _i18n.sprintf)( // translators: Represents the description of a user's custom template in the Site Editor, e.g. "Template for Post: Hello, WordPress"
58
- (0, _i18n.__)('Template for %1$s'), title),
59
- slug: `single-${entityForSuggestions.slug}-${suggestion.slug}`
60
- });
61
- }
47
+ onClick: () => onSelect(entityForSuggestions.config.getSpecificTemplate(suggestion))
62
48
  }), (0, _element.createElement)("span", {
63
49
  className: `${baseCssClass}__title`
64
50
  }, (0, _element.createElement)(_components.TextHighlight, {
@@ -69,6 +55,53 @@ function SuggestionListItem(_ref) {
69
55
  }, suggestion.link));
70
56
  }
71
57
 
58
+ function useDebouncedInput() {
59
+ const [input, setInput] = (0, _element.useState)('');
60
+ const [debounced, setter] = (0, _element.useState)('');
61
+ const setDebounced = (0, _compose.useDebounce)(setter, 250);
62
+ (0, _element.useEffect)(() => {
63
+ if (debounced !== input) {
64
+ setDebounced(input);
65
+ }
66
+ }, [debounced, input]);
67
+ return [input, setInput, debounced];
68
+ }
69
+
70
+ function useSearchSuggestions(entityForSuggestions, search) {
71
+ const {
72
+ config
73
+ } = entityForSuggestions;
74
+ const query = (0, _element.useMemo)(() => ({
75
+ order: 'asc',
76
+ context: 'view',
77
+ search,
78
+ per_page: search ? 20 : 10,
79
+ ...config.queryArgs(search)
80
+ }), [search, config]);
81
+ const {
82
+ records: searchResults,
83
+ hasResolved: searchHasResolved
84
+ } = (0, _coreData.useEntityRecords)(entityForSuggestions.type, entityForSuggestions.slug, query);
85
+ const [suggestions, setSuggestions] = (0, _element.useState)(EMPTY_ARRAY);
86
+ (0, _element.useEffect)(() => {
87
+ if (!searchHasResolved) return;
88
+ let newSuggestions = EMPTY_ARRAY;
89
+
90
+ if (searchResults !== null && searchResults !== void 0 && searchResults.length) {
91
+ newSuggestions = searchResults;
92
+
93
+ if (config.recordNamePath) {
94
+ newSuggestions = (0, _utils.mapToIHasNameAndId)(newSuggestions, config.recordNamePath);
95
+ }
96
+ } // Update suggestions only when the query has resolved, so as to keep
97
+ // the previous results in the UI.
98
+
99
+
100
+ setSuggestions(newSuggestions);
101
+ }, [searchResults, searchHasResolved]);
102
+ return suggestions;
103
+ }
104
+
72
105
  function SuggestionList(_ref2) {
73
106
  let {
74
107
  entityForSuggestions,
@@ -77,54 +110,36 @@ function SuggestionList(_ref2) {
77
110
  const composite = (0, _components.__unstableUseCompositeState)({
78
111
  orientation: 'vertical'
79
112
  });
80
- const [suggestions, setSuggestions] = (0, _element.useState)(EMPTY_ARRAY); // We need to track two values, the search input's value(searchInputValue)
81
- // and the one we want to debounce(search) and make REST API requests.
82
-
83
- const [searchInputValue, setSearchInputValue] = (0, _element.useState)('');
84
- const [search, setSearch] = (0, _element.useState)('');
85
- const debouncedSearch = (0, _compose.useDebounce)(setSearch, 250);
86
- const query = { ...BASE_QUERY,
87
- search,
88
- orderby: search ? 'relevance' : 'modified',
89
- exclude: entityForSuggestions.postsToExclude,
90
- per_page: search ? 20 : 10
91
- };
113
+ const [search, setSearch, debouncedSearch] = useDebouncedInput();
114
+ const suggestions = useSearchSuggestions(entityForSuggestions, debouncedSearch);
92
115
  const {
93
- records: searchResults,
94
- hasResolved: searchHasResolved
95
- } = (0, _coreData.useEntityRecords)(entityForSuggestions.type, entityForSuggestions.slug, query);
96
- (0, _element.useEffect)(() => {
97
- if (search !== searchInputValue) {
98
- debouncedSearch(searchInputValue);
99
- }
100
- }, [search, searchInputValue]);
101
- const entitiesInfo = (0, _element.useMemo)(() => {
102
- if (!(searchResults !== null && searchResults !== void 0 && searchResults.length)) return EMPTY_ARRAY;
103
- return (0, _utils.mapToIHasNameAndId)(searchResults, 'title.rendered');
104
- }, [searchResults]); // Update suggestions only when the query has resolved.
105
-
106
- (0, _element.useEffect)(() => {
107
- if (!searchHasResolved) return;
108
- setSuggestions(entitiesInfo);
109
- }, [entitiesInfo, searchHasResolved]);
110
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.SearchControl, {
111
- onChange: setSearchInputValue,
112
- value: searchInputValue,
113
- label: entityForSuggestions.labels.search_items,
114
- placeholder: entityForSuggestions.labels.search_items
116
+ labels
117
+ } = entityForSuggestions;
118
+ const [showSearchControl, setShowSearchControl] = (0, _element.useState)(false);
119
+
120
+ if (!showSearchControl && (suggestions === null || suggestions === void 0 ? void 0 : suggestions.length) > 9) {
121
+ setShowSearchControl(true);
122
+ }
123
+
124
+ return (0, _element.createElement)(_element.Fragment, null, showSearchControl && (0, _element.createElement)(_components.SearchControl, {
125
+ onChange: setSearch,
126
+ value: search,
127
+ label: labels.search_items,
128
+ placeholder: labels.search_items
115
129
  }), !!(suggestions !== null && suggestions !== void 0 && suggestions.length) && (0, _element.createElement)(_components.__unstableComposite, (0, _extends2.default)({}, composite, {
116
130
  role: "listbox",
117
- className: "edit-site-custom-template-modal__suggestions_list"
131
+ className: "edit-site-custom-template-modal__suggestions_list",
132
+ "aria-label": (0, _i18n.__)('Suggestions list')
118
133
  }), suggestions.map(suggestion => (0, _element.createElement)(SuggestionListItem, {
119
134
  key: suggestion.slug,
120
135
  suggestion: suggestion,
121
- search: search,
136
+ search: debouncedSearch,
122
137
  onSelect: onSelect,
123
138
  entityForSuggestions: entityForSuggestions,
124
139
  composite: composite
125
- }))), search && !(suggestions !== null && suggestions !== void 0 && suggestions.length) && (0, _element.createElement)("p", {
140
+ }))), debouncedSearch && !(suggestions !== null && suggestions !== void 0 && suggestions.length) && (0, _element.createElement)("p", {
126
141
  className: "edit-site-custom-template-modal__no-results"
127
- }, entityForSuggestions.labels.not_found));
142
+ }, labels.not_found));
128
143
  }
129
144
 
130
145
  function AddCustomTemplateModal(_ref3) {
@@ -147,33 +162,39 @@ function AddCustomTemplateModal(_ref3) {
147
162
  align: "initial"
148
163
  }, (0, _element.createElement)(_components.FlexItem, {
149
164
  isBlock: true,
165
+ as: _components.Button,
150
166
  onClick: () => {
151
167
  const {
152
168
  slug,
153
169
  title,
154
- description
170
+ description,
171
+ templatePrefix
155
172
  } = entityForSuggestions.template;
156
173
  onSelect({
157
174
  slug,
158
175
  title,
159
- description
176
+ description,
177
+ templatePrefix
160
178
  });
161
179
  }
162
- }, (0, _element.createElement)(_components.__experimentalHeading, {
163
- level: 5
180
+ }, (0, _element.createElement)(_components.__experimentalText, {
181
+ as: "span",
182
+ weight: 600
164
183
  }, entityForSuggestions.labels.all_items), (0, _element.createElement)(_components.__experimentalText, {
165
184
  as: "span"
166
- }, // translators: The user is given the choice to set up a template for all items of a post type, or just a specific one.
185
+ }, // translators: The user is given the choice to set up a template for all items of a post type or taxonomy, or just a specific one.
167
186
  (0, _i18n.__)('For all items'))), (0, _element.createElement)(_components.FlexItem, {
168
187
  isBlock: true,
188
+ as: _components.Button,
169
189
  onClick: () => {
170
190
  setShowSearchEntities(true);
171
191
  }
172
- }, (0, _element.createElement)(_components.__experimentalHeading, {
173
- level: 5
192
+ }, (0, _element.createElement)(_components.__experimentalText, {
193
+ as: "span",
194
+ weight: 600
174
195
  }, entityForSuggestions.labels.singular_name), (0, _element.createElement)(_components.__experimentalText, {
175
196
  as: "span"
176
- }, // translators: The user is given the choice to set up a template for all items of a post type, or just a specific one.
197
+ }, // translators: The user is given the choice to set up a template for all items of a post type or taxonomy, or just a specific one.
177
198
  (0, _i18n.__)('For a specific item'))))), showSearchEntities && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("p", null, (0, _i18n.__)('This template will be used only for the specific item chosen.')), (0, _element.createElement)(SuggestionList, {
178
199
  entityForSuggestions: entityForSuggestions,
179
200
  onSelect: onSelect
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/add-new-template/add-custom-template-modal.js"],"names":["EMPTY_ARRAY","BASE_QUERY","order","_fields","context","SuggestionListItem","suggestion","search","onSelect","entityForSuggestions","composite","baseCssClass","Button","title","labels","singular_name","name","description","slug","link","SuggestionList","orientation","suggestions","setSuggestions","searchInputValue","setSearchInputValue","setSearch","debouncedSearch","query","orderby","exclude","postsToExclude","per_page","records","searchResults","hasResolved","searchHasResolved","type","entitiesInfo","length","search_items","map","not_found","AddCustomTemplateModal","onClose","showSearchEntities","setShowSearchEntities","hasGeneralTemplate","template","all_items"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\tSearchControl,\n\tTextHighlight,\n\t__experimentalText as Text,\n\t__experimentalHeading as Heading,\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n\t__unstableCompositeItem as CompositeItem,\n} from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\nimport { useEntityRecords } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { mapToIHasNameAndId } from './utils';\n\nconst EMPTY_ARRAY = [];\nconst BASE_QUERY = {\n\torder: 'asc',\n\t_fields: 'id,title,slug,link',\n\tcontext: 'view',\n};\n\nfunction SuggestionListItem( {\n\tsuggestion,\n\tsearch,\n\tonSelect,\n\tentityForSuggestions,\n\tcomposite,\n} ) {\n\tconst baseCssClass =\n\t\t'edit-site-custom-template-modal__suggestions_list__list-item';\n\treturn (\n\t\t<CompositeItem\n\t\t\trole=\"option\"\n\t\t\tas={ Button }\n\t\t\t{ ...composite }\n\t\t\tclassName={ baseCssClass }\n\t\t\tonClick={ () => {\n\t\t\t\tconst title = sprintf(\n\t\t\t\t\t// translators: Represents the title of a user's custom template in the Site Editor, where %1$s is the singular name of a post type and %2$s is the name of the post, e.g. \"Post: Hello, WordPress\"\n\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\tentityForSuggestions.labels.singular_name,\n\t\t\t\t\tsuggestion.name\n\t\t\t\t);\n\t\t\t\tonSelect( {\n\t\t\t\t\ttitle,\n\t\t\t\t\tdescription: sprintf(\n\t\t\t\t\t\t// translators: Represents the description of a user's custom template in the Site Editor, e.g. \"Template for Post: Hello, WordPress\"\n\t\t\t\t\t\t__( 'Template for %1$s' ),\n\t\t\t\t\t\ttitle\n\t\t\t\t\t),\n\t\t\t\t\tslug: `single-${ entityForSuggestions.slug }-${ suggestion.slug }`,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t<span className={ `${ baseCssClass }__title` }>\n\t\t\t\t<TextHighlight text={ suggestion.name } highlight={ search } />\n\t\t\t</span>\n\t\t\t{ suggestion.link && (\n\t\t\t\t<span className={ `${ baseCssClass }__info` }>\n\t\t\t\t\t{ suggestion.link }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t</CompositeItem>\n\t);\n}\n\nfunction SuggestionList( { entityForSuggestions, onSelect } ) {\n\tconst composite = useCompositeState( { orientation: 'vertical' } );\n\tconst [ suggestions, setSuggestions ] = useState( EMPTY_ARRAY );\n\t// We need to track two values, the search input's value(searchInputValue)\n\t// and the one we want to debounce(search) and make REST API requests.\n\tconst [ searchInputValue, setSearchInputValue ] = useState( '' );\n\tconst [ search, setSearch ] = useState( '' );\n\tconst debouncedSearch = useDebounce( setSearch, 250 );\n\tconst query = {\n\t\t...BASE_QUERY,\n\t\tsearch,\n\t\torderby: search ? 'relevance' : 'modified',\n\t\texclude: entityForSuggestions.postsToExclude,\n\t\tper_page: search ? 20 : 10,\n\t};\n\tconst { records: searchResults, hasResolved: searchHasResolved } =\n\t\tuseEntityRecords(\n\t\t\tentityForSuggestions.type,\n\t\t\tentityForSuggestions.slug,\n\t\t\tquery\n\t\t);\n\tuseEffect( () => {\n\t\tif ( search !== searchInputValue ) {\n\t\t\tdebouncedSearch( searchInputValue );\n\t\t}\n\t}, [ search, searchInputValue ] );\n\tconst entitiesInfo = useMemo( () => {\n\t\tif ( ! searchResults?.length ) return EMPTY_ARRAY;\n\t\treturn mapToIHasNameAndId( searchResults, 'title.rendered' );\n\t}, [ searchResults ] );\n\t// Update suggestions only when the query has resolved.\n\tuseEffect( () => {\n\t\tif ( ! searchHasResolved ) return;\n\t\tsetSuggestions( entitiesInfo );\n\t}, [ entitiesInfo, searchHasResolved ] );\n\treturn (\n\t\t<>\n\t\t\t<SearchControl\n\t\t\t\tonChange={ setSearchInputValue }\n\t\t\t\tvalue={ searchInputValue }\n\t\t\t\tlabel={ entityForSuggestions.labels.search_items }\n\t\t\t\tplaceholder={ entityForSuggestions.labels.search_items }\n\t\t\t/>\n\t\t\t{ !! suggestions?.length && (\n\t\t\t\t<Composite\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"edit-site-custom-template-modal__suggestions_list\"\n\t\t\t\t>\n\t\t\t\t\t{ suggestions.map( ( suggestion ) => (\n\t\t\t\t\t\t<SuggestionListItem\n\t\t\t\t\t\t\tkey={ suggestion.slug }\n\t\t\t\t\t\t\tsuggestion={ suggestion }\n\t\t\t\t\t\t\tsearch={ search }\n\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\tentityForSuggestions={ entityForSuggestions }\n\t\t\t\t\t\t\tcomposite={ composite }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</Composite>\n\t\t\t) }\n\t\t\t{ search && ! suggestions?.length && (\n\t\t\t\t<p className=\"edit-site-custom-template-modal__no-results\">\n\t\t\t\t\t{ entityForSuggestions.labels.not_found }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction AddCustomTemplateModal( { onClose, onSelect, entityForSuggestions } ) {\n\tconst [ showSearchEntities, setShowSearchEntities ] = useState(\n\t\tentityForSuggestions.hasGeneralTemplate\n\t);\n\tconst baseCssClass = 'edit-site-custom-template-modal';\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ sprintf(\n\t\t\t\t// translators: %s: Name of the post type e.g: \"Post\".\n\t\t\t\t__( 'Add template: %s' ),\n\t\t\t\tentityForSuggestions.labels.singular_name\n\t\t\t) }\n\t\t\tclassName={ baseCssClass }\n\t\t\tcloseLabel={ __( 'Close' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t>\n\t\t\t{ ! showSearchEntities && (\n\t\t\t\t<>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Select whether to create a single template for all items or a specific one.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<Flex\n\t\t\t\t\t\tclassName={ `${ baseCssClass }__contents` }\n\t\t\t\t\t\tgap=\"4\"\n\t\t\t\t\t\talign=\"initial\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst { slug, title, description } =\n\t\t\t\t\t\t\t\t\tentityForSuggestions.template;\n\t\t\t\t\t\t\t\tonSelect( { slug, title, description } );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading level={ 5 }>\n\t\t\t\t\t\t\t\t{ entityForSuggestions.labels.all_items }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<Text as=\"span\">\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t// translators: The user is given the choice to set up a template for all items of a post type, or just a specific one.\n\t\t\t\t\t\t\t\t\t__( 'For all items' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetShowSearchEntities( true );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading level={ 5 }>\n\t\t\t\t\t\t\t\t{ entityForSuggestions.labels.singular_name }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<Text as=\"span\">\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t// translators: The user is given the choice to set up a template for all items of a post type, or just a specific one.\n\t\t\t\t\t\t\t\t\t__( 'For a specific item' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t</Flex>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showSearchEntities && (\n\t\t\t\t<>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'This template will be used only for the specific item chosen.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<SuggestionList\n\t\t\t\t\t\tentityForSuggestions={ entityForSuggestions }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</Modal>\n\t);\n}\n\nexport default AddCustomTemplateModal;\n"]}
1
+ {"version":3,"sources":["@wordpress/edit-site/src/components/add-new-template/add-custom-template-modal.js"],"names":["EMPTY_ARRAY","SuggestionListItem","suggestion","search","onSelect","entityForSuggestions","composite","baseCssClass","Button","config","getSpecificTemplate","name","link","useDebouncedInput","input","setInput","debounced","setter","setDebounced","useSearchSuggestions","query","order","context","per_page","queryArgs","records","searchResults","hasResolved","searchHasResolved","type","slug","suggestions","setSuggestions","newSuggestions","length","recordNamePath","SuggestionList","orientation","setSearch","debouncedSearch","labels","showSearchControl","setShowSearchControl","search_items","map","not_found","AddCustomTemplateModal","onClose","showSearchEntities","setShowSearchEntities","hasGeneralTemplate","singular_name","title","description","templatePrefix","template","all_items"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\tSearchControl,\n\tTextHighlight,\n\t__experimentalText as Text,\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n\t__unstableCompositeItem as CompositeItem,\n} from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\nimport { useEntityRecords } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { mapToIHasNameAndId } from './utils';\n\nconst EMPTY_ARRAY = [];\n\nfunction SuggestionListItem( {\n\tsuggestion,\n\tsearch,\n\tonSelect,\n\tentityForSuggestions,\n\tcomposite,\n} ) {\n\tconst baseCssClass =\n\t\t'edit-site-custom-template-modal__suggestions_list__list-item';\n\treturn (\n\t\t<CompositeItem\n\t\t\trole=\"option\"\n\t\t\tas={ Button }\n\t\t\t{ ...composite }\n\t\t\tclassName={ baseCssClass }\n\t\t\tonClick={ () =>\n\t\t\t\tonSelect(\n\t\t\t\t\tentityForSuggestions.config.getSpecificTemplate(\n\t\t\t\t\t\tsuggestion\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t}\n\t\t>\n\t\t\t<span className={ `${ baseCssClass }__title` }>\n\t\t\t\t<TextHighlight text={ suggestion.name } highlight={ search } />\n\t\t\t</span>\n\t\t\t{ suggestion.link && (\n\t\t\t\t<span className={ `${ baseCssClass }__info` }>\n\t\t\t\t\t{ suggestion.link }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t</CompositeItem>\n\t);\n}\n\nfunction useDebouncedInput() {\n\tconst [ input, setInput ] = useState( '' );\n\tconst [ debounced, setter ] = useState( '' );\n\tconst setDebounced = useDebounce( setter, 250 );\n\tuseEffect( () => {\n\t\tif ( debounced !== input ) {\n\t\t\tsetDebounced( input );\n\t\t}\n\t}, [ debounced, input ] );\n\treturn [ input, setInput, debounced ];\n}\n\nfunction useSearchSuggestions( entityForSuggestions, search ) {\n\tconst { config } = entityForSuggestions;\n\tconst query = useMemo(\n\t\t() => ( {\n\t\t\torder: 'asc',\n\t\t\tcontext: 'view',\n\t\t\tsearch,\n\t\t\tper_page: search ? 20 : 10,\n\t\t\t...config.queryArgs( search ),\n\t\t} ),\n\t\t[ search, config ]\n\t);\n\tconst { records: searchResults, hasResolved: searchHasResolved } =\n\t\tuseEntityRecords(\n\t\t\tentityForSuggestions.type,\n\t\t\tentityForSuggestions.slug,\n\t\t\tquery\n\t\t);\n\tconst [ suggestions, setSuggestions ] = useState( EMPTY_ARRAY );\n\tuseEffect( () => {\n\t\tif ( ! searchHasResolved ) return;\n\t\tlet newSuggestions = EMPTY_ARRAY;\n\t\tif ( searchResults?.length ) {\n\t\t\tnewSuggestions = searchResults;\n\t\t\tif ( config.recordNamePath ) {\n\t\t\t\tnewSuggestions = mapToIHasNameAndId(\n\t\t\t\t\tnewSuggestions,\n\t\t\t\t\tconfig.recordNamePath\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\t// Update suggestions only when the query has resolved, so as to keep\n\t\t// the previous results in the UI.\n\t\tsetSuggestions( newSuggestions );\n\t}, [ searchResults, searchHasResolved ] );\n\treturn suggestions;\n}\n\nfunction SuggestionList( { entityForSuggestions, onSelect } ) {\n\tconst composite = useCompositeState( { orientation: 'vertical' } );\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput();\n\tconst suggestions = useSearchSuggestions(\n\t\tentityForSuggestions,\n\t\tdebouncedSearch\n\t);\n\tconst { labels } = entityForSuggestions;\n\tconst [ showSearchControl, setShowSearchControl ] = useState( false );\n\tif ( ! showSearchControl && suggestions?.length > 9 ) {\n\t\tsetShowSearchControl( true );\n\t}\n\treturn (\n\t\t<>\n\t\t\t{ showSearchControl && (\n\t\t\t\t<SearchControl\n\t\t\t\t\tonChange={ setSearch }\n\t\t\t\t\tvalue={ search }\n\t\t\t\t\tlabel={ labels.search_items }\n\t\t\t\t\tplaceholder={ labels.search_items }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ !! suggestions?.length && (\n\t\t\t\t<Composite\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"edit-site-custom-template-modal__suggestions_list\"\n\t\t\t\t\taria-label={ __( 'Suggestions list' ) }\n\t\t\t\t>\n\t\t\t\t\t{ suggestions.map( ( suggestion ) => (\n\t\t\t\t\t\t<SuggestionListItem\n\t\t\t\t\t\t\tkey={ suggestion.slug }\n\t\t\t\t\t\t\tsuggestion={ suggestion }\n\t\t\t\t\t\t\tsearch={ debouncedSearch }\n\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\tentityForSuggestions={ entityForSuggestions }\n\t\t\t\t\t\t\tcomposite={ composite }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</Composite>\n\t\t\t) }\n\t\t\t{ debouncedSearch && ! suggestions?.length && (\n\t\t\t\t<p className=\"edit-site-custom-template-modal__no-results\">\n\t\t\t\t\t{ labels.not_found }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction AddCustomTemplateModal( { onClose, onSelect, entityForSuggestions } ) {\n\tconst [ showSearchEntities, setShowSearchEntities ] = useState(\n\t\tentityForSuggestions.hasGeneralTemplate\n\t);\n\tconst baseCssClass = 'edit-site-custom-template-modal';\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ sprintf(\n\t\t\t\t// translators: %s: Name of the post type e.g: \"Post\".\n\t\t\t\t__( 'Add template: %s' ),\n\t\t\t\tentityForSuggestions.labels.singular_name\n\t\t\t) }\n\t\t\tclassName={ baseCssClass }\n\t\t\tcloseLabel={ __( 'Close' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t>\n\t\t\t{ ! showSearchEntities && (\n\t\t\t\t<>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Select whether to create a single template for all items or a specific one.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<Flex\n\t\t\t\t\t\tclassName={ `${ baseCssClass }__contents` }\n\t\t\t\t\t\tgap=\"4\"\n\t\t\t\t\t\talign=\"initial\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst {\n\t\t\t\t\t\t\t\t\tslug,\n\t\t\t\t\t\t\t\t\ttitle,\n\t\t\t\t\t\t\t\t\tdescription,\n\t\t\t\t\t\t\t\t\ttemplatePrefix,\n\t\t\t\t\t\t\t\t} = entityForSuggestions.template;\n\t\t\t\t\t\t\t\tonSelect( {\n\t\t\t\t\t\t\t\t\tslug,\n\t\t\t\t\t\t\t\t\ttitle,\n\t\t\t\t\t\t\t\t\tdescription,\n\t\t\t\t\t\t\t\t\ttemplatePrefix,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Text as=\"span\" weight={ 600 }>\n\t\t\t\t\t\t\t\t{ entityForSuggestions.labels.all_items }\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t<Text as=\"span\">\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t// translators: The user is given the choice to set up a template for all items of a post type or taxonomy, or just a specific one.\n\t\t\t\t\t\t\t\t\t__( 'For all items' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetShowSearchEntities( true );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Text as=\"span\" weight={ 600 }>\n\t\t\t\t\t\t\t\t{ entityForSuggestions.labels.singular_name }\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t<Text as=\"span\">\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t// translators: The user is given the choice to set up a template for all items of a post type or taxonomy, or just a specific one.\n\t\t\t\t\t\t\t\t\t__( 'For a specific item' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t</Flex>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showSearchEntities && (\n\t\t\t\t<>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'This template will be used only for the specific item chosen.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<SuggestionList\n\t\t\t\t\t\tentityForSuggestions={ entityForSuggestions }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</Modal>\n\t);\n}\n\nexport default AddCustomTemplateModal;\n"]}
@@ -9,7 +9,9 @@ exports.default = NewTemplate;
9
9
 
10
10
  var _element = require("@wordpress/element");
11
11
 
12
- var _lodash = require("lodash");
12
+ var _apiFetch = _interopRequireDefault(require("@wordpress/api-fetch"));
13
+
14
+ var _url = require("@wordpress/url");
13
15
 
14
16
  var _components = require("@wordpress/components");
15
17
 
@@ -17,8 +19,6 @@ var _data = require("@wordpress/data");
17
19
 
18
20
  var _coreData = require("@wordpress/core-data");
19
21
 
20
- var _editor = require("@wordpress/editor");
21
-
22
22
  var _icons = require("@wordpress/icons");
23
23
 
24
24
  var _i18n = require("@wordpress/i18n");
@@ -29,14 +29,12 @@ var _addCustomTemplateModal = _interopRequireDefault(require("./add-custom-templ
29
29
 
30
30
  var _utils = require("./utils");
31
31
 
32
+ var _addCustomGenericTemplateModal = _interopRequireDefault(require("./add-custom-generic-template-modal"));
33
+
32
34
  var _routes = require("../routes");
33
35
 
34
36
  var _store = require("../../store");
35
37
 
36
- /**
37
- * External dependencies
38
- */
39
-
40
38
  /**
41
39
  * WordPress dependencies
42
40
  */
@@ -65,20 +63,10 @@ function NewTemplate(_ref) {
65
63
  let {
66
64
  postType
67
65
  } = _ref;
68
- const history = (0, _routes.useHistory)();
69
- const postTypes = (0, _utils.usePostTypes)();
70
66
  const [showCustomTemplateModal, setShowCustomTemplateModal] = (0, _element.useState)(false);
67
+ const [showCustomGenericTemplateModal, setShowCustomGenericTemplateModal] = (0, _element.useState)(false);
71
68
  const [entityForSuggestions, setEntityForSuggestions] = (0, _element.useState)({});
72
- const {
73
- existingTemplates,
74
- defaultTemplateTypes
75
- } = (0, _data.useSelect)(select => ({
76
- existingTemplates: select(_coreData.store).getEntityRecords('postType', 'wp_template', {
77
- per_page: -1
78
- }),
79
- defaultTemplateTypes: select(_editor.store).__experimentalGetDefaultTemplateTypes()
80
- }), []);
81
- const postTypesEntitiesInfo = (0, _utils.usePostTypesEntitiesInfo)(existingTemplates);
69
+ const history = (0, _routes.useHistory)();
82
70
  const {
83
71
  saveEntityRecord
84
72
  } = (0, _data.useDispatch)(_coreData.store);
@@ -90,20 +78,37 @@ function NewTemplate(_ref) {
90
78
  } = (0, _data.useDispatch)(_store.store);
91
79
 
92
80
  async function createTemplate(template) {
81
+ let isWPSuggestion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
82
+
93
83
  try {
94
84
  const {
95
85
  title,
96
86
  description,
97
- slug
87
+ slug,
88
+ templatePrefix
98
89
  } = template;
90
+ let templateContent = template.content; // Try to find fallback content from existing templates.
91
+
92
+ if (!templateContent) {
93
+ const fallbackTemplate = await (0, _apiFetch.default)({
94
+ path: (0, _url.addQueryArgs)('/wp/v2/templates/lookup', {
95
+ slug,
96
+ is_custom: !isWPSuggestion,
97
+ template_prefix: templatePrefix
98
+ })
99
+ });
100
+ templateContent = fallbackTemplate.content;
101
+ }
102
+
99
103
  const newTemplate = await saveEntityRecord('postType', 'wp_template', {
100
104
  description,
101
105
  // Slugs need to be strings, so this is for template `404`
102
106
  slug: slug.toString(),
103
107
  status: 'publish',
104
108
  title,
109
+ content: templateContent,
105
110
  // This adds a post meta field in template that is part of `is_custom` value calculation.
106
- is_wp_suggestion: true
111
+ is_wp_suggestion: isWPSuggestion
107
112
  }, {
108
113
  throwOnError: true
109
114
  }); // Set template before navigating away to avoid initial stale value.
@@ -122,68 +127,12 @@ function NewTemplate(_ref) {
122
127
  }
123
128
  }
124
129
 
125
- const existingTemplateSlugs = (existingTemplates || []).map(_ref2 => {
126
- let {
127
- slug
128
- } = _ref2;
129
- return slug;
130
- });
131
- const missingTemplates = (0, _lodash.filter)(defaultTemplateTypes, template => (0, _lodash.includes)(DEFAULT_TEMPLATE_SLUGS, template.slug) && !(0, _lodash.includes)(existingTemplateSlugs, template.slug));
132
- const extraTemplates = (postTypes || []).reduce((accumulator, _postType) => {
133
- var _postTypesEntitiesInf;
134
-
135
- const {
136
- slug,
137
- labels,
138
- icon
139
- } = _postType;
140
- const hasGeneralTemplate = existingTemplateSlugs === null || existingTemplateSlugs === void 0 ? void 0 : existingTemplateSlugs.includes(`single-${slug}`);
141
- const hasEntities = postTypesEntitiesInfo === null || postTypesEntitiesInfo === void 0 ? void 0 : (_postTypesEntitiesInf = postTypesEntitiesInfo[slug]) === null || _postTypesEntitiesInf === void 0 ? void 0 : _postTypesEntitiesInf.hasEntities;
142
- const menuItem = {
143
- slug: `single-${slug}`,
144
- title: (0, _i18n.sprintf)( // translators: %s: Name of the post type e.g: "Post".
145
- (0, _i18n.__)('Single item: %s'), labels.singular_name),
146
- description: (0, _i18n.sprintf)( // translators: %s: Name of the post type e.g: "Post".
147
- (0, _i18n.__)('Displays a single item: %s.'), labels.singular_name),
148
- // `icon` is the `menu_icon` property of a post type. We
149
- // only handle `dashicons` for now, even if the `menu_icon`
150
- // also supports urls and svg as values.
151
- icon: icon !== null && icon !== void 0 && icon.startsWith('dashicons-') ? icon.slice(10) : null
152
- }; // We have a different template creation flow only if they have entities.
153
-
154
- if (hasEntities) {
155
- menuItem.onClick = template => {
156
- setShowCustomTemplateModal(true);
157
- setEntityForSuggestions({
158
- type: 'postType',
159
- slug,
160
- labels,
161
- hasGeneralTemplate,
162
- template,
163
- postsToExclude: postTypesEntitiesInfo[slug].existingPosts
164
- });
165
- };
166
- } // We don't need to add the menu item if there are no
167
- // entities and the general template exists.
168
-
169
-
170
- if (!hasGeneralTemplate || hasEntities) {
171
- accumulator.push(menuItem);
172
- }
130
+ const missingTemplates = useMissingTemplates(setEntityForSuggestions, setShowCustomTemplateModal);
173
131
 
174
- return accumulator;
175
- }, []);
176
-
177
- if (!missingTemplates.length && !extraTemplates.length) {
132
+ if (!missingTemplates.length) {
178
133
  return null;
179
- } // Update the sort order to match the DEFAULT_TEMPLATE_SLUGS order.
180
-
181
-
182
- missingTemplates === null || missingTemplates === void 0 ? void 0 : missingTemplates.sort((template1, template2) => {
183
- return DEFAULT_TEMPLATE_SLUGS.indexOf(template1.slug) - DEFAULT_TEMPLATE_SLUGS.indexOf(template2.slug);
184
- }); // Append all extra templates at the end of the list for now.
134
+ }
185
135
 
186
- missingTemplates.push(...extraTemplates);
187
136
  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.DropdownMenu, {
188
137
  className: "edit-site-new-template-dropdown",
189
138
  icon: null,
@@ -214,10 +163,74 @@ function NewTemplate(_ref) {
214
163
  key: slug,
215
164
  onClick: () => onClick ? onClick(template) : createTemplate(template)
216
165
  }, title);
217
- })))), showCustomTemplateModal && (0, _element.createElement)(_addCustomTemplateModal.default, {
166
+ })), (0, _element.createElement)(_components.MenuGroup, null, (0, _element.createElement)(_components.MenuItem, {
167
+ icon: _icons.layout,
168
+ iconPosition: "left",
169
+ info: (0, _i18n.__)('Custom templates can be applied to any post or page.'),
170
+ key: "custom-template",
171
+ onClick: () => setShowCustomGenericTemplateModal(true)
172
+ }, (0, _i18n.__)('Custom template'))))), showCustomTemplateModal && (0, _element.createElement)(_addCustomTemplateModal.default, {
218
173
  onClose: () => setShowCustomTemplateModal(false),
219
174
  onSelect: createTemplate,
220
175
  entityForSuggestions: entityForSuggestions
176
+ }), showCustomGenericTemplateModal && (0, _element.createElement)(_addCustomGenericTemplateModal.default, {
177
+ onClose: () => setShowCustomGenericTemplateModal(false),
178
+ createTemplate: createTemplate
221
179
  }));
222
180
  }
181
+
182
+ function useMissingTemplates(setEntityForSuggestions, setShowCustomTemplateModal) {
183
+ const existingTemplates = (0, _utils.useExistingTemplates)();
184
+ const defaultTemplateTypes = (0, _utils.useDefaultTemplateTypes)();
185
+ const existingTemplateSlugs = (existingTemplates || []).map(_ref2 => {
186
+ let {
187
+ slug
188
+ } = _ref2;
189
+ return slug;
190
+ });
191
+ const missingDefaultTemplates = (defaultTemplateTypes || []).filter(template => DEFAULT_TEMPLATE_SLUGS.includes(template.slug) && !existingTemplateSlugs.includes(template.slug));
192
+
193
+ const onClickMenuItem = _entityForSuggestions => {
194
+ setShowCustomTemplateModal(true);
195
+ setEntityForSuggestions(_entityForSuggestions);
196
+ }; // We need to replace existing default template types with
197
+ // the create specific template functionality. The original
198
+ // info (title, description, etc.) is preserved in the
199
+ // used hooks.
200
+
201
+
202
+ const enhancedMissingDefaultTemplateTypes = [...missingDefaultTemplates];
203
+ const {
204
+ defaultTaxonomiesMenuItems,
205
+ taxonomiesMenuItems
206
+ } = (0, _utils.useTaxonomiesMenuItems)(onClickMenuItem);
207
+ const {
208
+ defaultPostTypesMenuItems,
209
+ postTypesMenuItems
210
+ } = (0, _utils.usePostTypeMenuItems)(onClickMenuItem);
211
+ const authorMenuItem = (0, _utils.useAuthorMenuItem)(onClickMenuItem);
212
+ [...defaultTaxonomiesMenuItems, ...defaultPostTypesMenuItems, authorMenuItem].forEach(menuItem => {
213
+ if (!menuItem) {
214
+ return;
215
+ }
216
+
217
+ const matchIndex = enhancedMissingDefaultTemplateTypes.findIndex(template => template.slug === menuItem.slug); // Some default template types might have been filtered above from
218
+ // `missingDefaultTemplates` because they only check for the general
219
+ // template. So here we either replace or append the item, augmented
220
+ // with the check if it has available specific item to create a
221
+ // template for.
222
+
223
+ if (matchIndex > -1) {
224
+ enhancedMissingDefaultTemplateTypes[matchIndex] = menuItem;
225
+ } else {
226
+ enhancedMissingDefaultTemplateTypes.push(menuItem);
227
+ }
228
+ }); // Update the sort order to match the DEFAULT_TEMPLATE_SLUGS order.
229
+
230
+ enhancedMissingDefaultTemplateTypes === null || enhancedMissingDefaultTemplateTypes === void 0 ? void 0 : enhancedMissingDefaultTemplateTypes.sort((template1, template2) => {
231
+ return DEFAULT_TEMPLATE_SLUGS.indexOf(template1.slug) - DEFAULT_TEMPLATE_SLUGS.indexOf(template2.slug);
232
+ });
233
+ const missingTemplates = [...enhancedMissingDefaultTemplateTypes, ...postTypesMenuItems, ...taxonomiesMenuItems];
234
+ return missingTemplates;
235
+ }
223
236
  //# sourceMappingURL=new-template.js.map