@wordpress/block-editor 14.3.6 → 14.3.8

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 (117) hide show
  1. package/README.md +2 -2
  2. package/build/components/block-list/use-block-props/use-selected-block-event-handlers.js +14 -6
  3. package/build/components/block-list/use-block-props/use-selected-block-event-handlers.js.map +1 -1
  4. package/build/components/block-list/zoom-out-separator.js +10 -7
  5. package/build/components/block-list/zoom-out-separator.js.map +1 -1
  6. package/build/components/block-popover/index.js +1 -1
  7. package/build/components/block-popover/index.js.map +1 -1
  8. package/build/components/block-toolbar/index.js +28 -16
  9. package/build/components/block-toolbar/index.js.map +1 -1
  10. package/build/components/block-toolbar/use-has-block-toolbar.js +3 -3
  11. package/build/components/block-toolbar/use-has-block-toolbar.js.map +1 -1
  12. package/build/components/block-tools/index.js +1 -6
  13. package/build/components/block-tools/index.js.map +1 -1
  14. package/build/components/block-tools/use-show-block-tools.js +4 -6
  15. package/build/components/block-tools/use-show-block-tools.js.map +1 -1
  16. package/build/components/block-tools/zoom-out-mode-inserters.js +22 -36
  17. package/build/components/block-tools/zoom-out-mode-inserters.js.map +1 -1
  18. package/build/components/iframe/index.js +40 -10
  19. package/build/components/iframe/index.js.map +1 -1
  20. package/build/components/inserter/block-patterns-tab/index.js +4 -0
  21. package/build/components/inserter/block-patterns-tab/index.js.map +1 -1
  22. package/build/components/inserter/hooks/use-insertion-point.js +16 -4
  23. package/build/components/inserter/hooks/use-insertion-point.js.map +1 -1
  24. package/build/components/inserter/media-tab/media-tab.js +4 -0
  25. package/build/components/inserter/media-tab/media-tab.js.map +1 -1
  26. package/build/components/inserter/menu.js +5 -2
  27. package/build/components/inserter/menu.js.map +1 -1
  28. package/build/hooks/block-bindings.js +12 -1
  29. package/build/hooks/block-bindings.js.map +1 -1
  30. package/build/hooks/use-zoom-out.js +24 -16
  31. package/build/hooks/use-zoom-out.js.map +1 -1
  32. package/build/store/private-selectors.js +37 -2
  33. package/build/store/private-selectors.js.map +1 -1
  34. package/build/store/selectors.js +15 -8
  35. package/build/store/selectors.js.map +1 -1
  36. package/build/utils/dom.js +16 -1
  37. package/build/utils/dom.js.map +1 -1
  38. package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.js +14 -6
  39. package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.js.map +1 -1
  40. package/build-module/components/block-list/zoom-out-separator.js +10 -7
  41. package/build-module/components/block-list/zoom-out-separator.js.map +1 -1
  42. package/build-module/components/block-popover/index.js +1 -1
  43. package/build-module/components/block-popover/index.js.map +1 -1
  44. package/build-module/components/block-toolbar/index.js +30 -18
  45. package/build-module/components/block-toolbar/index.js.map +1 -1
  46. package/build-module/components/block-toolbar/use-has-block-toolbar.js +3 -3
  47. package/build-module/components/block-toolbar/use-has-block-toolbar.js.map +1 -1
  48. package/build-module/components/block-tools/index.js +1 -6
  49. package/build-module/components/block-tools/index.js.map +1 -1
  50. package/build-module/components/block-tools/use-show-block-tools.js +4 -6
  51. package/build-module/components/block-tools/use-show-block-tools.js.map +1 -1
  52. package/build-module/components/block-tools/zoom-out-mode-inserters.js +22 -36
  53. package/build-module/components/block-tools/zoom-out-mode-inserters.js.map +1 -1
  54. package/build-module/components/iframe/index.js +40 -10
  55. package/build-module/components/iframe/index.js.map +1 -1
  56. package/build-module/components/inserter/block-patterns-tab/index.js +5 -1
  57. package/build-module/components/inserter/block-patterns-tab/index.js.map +1 -1
  58. package/build-module/components/inserter/hooks/use-insertion-point.js +16 -4
  59. package/build-module/components/inserter/hooks/use-insertion-point.js.map +1 -1
  60. package/build-module/components/inserter/media-tab/media-tab.js +5 -1
  61. package/build-module/components/inserter/media-tab/media-tab.js.map +1 -1
  62. package/build-module/components/inserter/menu.js +5 -2
  63. package/build-module/components/inserter/menu.js.map +1 -1
  64. package/build-module/hooks/block-bindings.js +13 -2
  65. package/build-module/hooks/block-bindings.js.map +1 -1
  66. package/build-module/hooks/use-zoom-out.js +24 -17
  67. package/build-module/hooks/use-zoom-out.js.map +1 -1
  68. package/build-module/store/private-selectors.js +35 -2
  69. package/build-module/store/private-selectors.js.map +1 -1
  70. package/build-module/store/selectors.js +15 -8
  71. package/build-module/store/selectors.js.map +1 -1
  72. package/build-module/utils/dom.js +16 -1
  73. package/build-module/utils/dom.js.map +1 -1
  74. package/build-style/content-rtl.css +14 -20
  75. package/build-style/content.css +14 -20
  76. package/build-style/style-rtl.css +28 -21
  77. package/build-style/style.css +28 -21
  78. package/build-types/utils/dom.d.ts.map +1 -1
  79. package/package.json +6 -6
  80. package/src/components/block-canvas/style.scss +1 -0
  81. package/src/components/block-list/content.scss +3 -2
  82. package/src/components/block-list/use-block-props/use-selected-block-event-handlers.js +25 -4
  83. package/src/components/block-list/zoom-out-separator.js +8 -6
  84. package/src/components/block-popover/index.js +2 -2
  85. package/src/components/block-toolbar/index.js +37 -24
  86. package/src/components/block-toolbar/style.scss +10 -1
  87. package/src/components/block-toolbar/use-has-block-toolbar.js +19 -28
  88. package/src/components/block-tools/index.js +0 -9
  89. package/src/components/block-tools/style.scss +2 -26
  90. package/src/components/block-tools/use-show-block-tools.js +2 -10
  91. package/src/components/block-tools/zoom-out-mode-inserters.js +26 -50
  92. package/src/components/iframe/content.scss +16 -24
  93. package/src/components/iframe/index.js +53 -12
  94. package/src/components/iframe/style.scss +6 -5
  95. package/src/components/inserter/block-patterns-tab/index.js +6 -1
  96. package/src/components/inserter/hooks/use-insertion-point.js +23 -5
  97. package/src/components/inserter/media-tab/media-tab.js +6 -1
  98. package/src/components/inserter/menu.js +7 -1
  99. package/src/components/inserter/style.scss +6 -0
  100. package/src/components/rich-text/style.scss +5 -0
  101. package/src/hooks/block-bindings.js +40 -23
  102. package/src/hooks/use-zoom-out.js +36 -20
  103. package/src/store/private-selectors.js +40 -1
  104. package/src/store/selectors.js +16 -8
  105. package/src/style.scss +1 -0
  106. package/src/utils/dom.js +22 -2
  107. package/tsconfig.tsbuildinfo +1 -1
  108. package/build/components/block-tools/zoom-out-popover.js +0 -57
  109. package/build/components/block-tools/zoom-out-popover.js.map +0 -1
  110. package/build/components/block-tools/zoom-out-toolbar.js +0 -159
  111. package/build/components/block-tools/zoom-out-toolbar.js.map +0 -1
  112. package/build-module/components/block-tools/zoom-out-popover.js +0 -48
  113. package/build-module/components/block-tools/zoom-out-popover.js.map +0 -1
  114. package/build-module/components/block-tools/zoom-out-toolbar.js +0 -152
  115. package/build-module/components/block-tools/zoom-out-toolbar.js.map +0 -1
  116. package/src/components/block-tools/zoom-out-popover.js +0 -46
  117. package/src/components/block-tools/zoom-out-toolbar.js +0 -167
@@ -7,6 +7,7 @@ exports.useShowBlockTools = useShowBlockTools;
7
7
  var _data = require("@wordpress/data");
8
8
  var _blocks = require("@wordpress/blocks");
9
9
  var _store = require("../../store");
10
+ var _lockUnlock = require("../../lock-unlock");
10
11
  /**
11
12
  * WordPress dependencies
12
13
  */
@@ -31,7 +32,7 @@ function useShowBlockTools() {
31
32
  hasMultiSelection,
32
33
  __unstableGetEditorMode,
33
34
  isTyping
34
- } = select(_store.store);
35
+ } = (0, _lockUnlock.unlock)(select(_store.store));
35
36
  const clientId = getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId();
36
37
  const block = getBlock(clientId);
37
38
  const editorMode = __unstableGetEditorMode();
@@ -39,14 +40,11 @@ function useShowBlockTools() {
39
40
  const isEmptyDefaultBlock = hasSelectedBlock && (0, _blocks.isUnmodifiedDefaultBlock)(block) && getBlockMode(clientId) !== 'html';
40
41
  const _showEmptyBlockSideInserter = clientId && !isTyping() && editorMode === 'edit' && isEmptyDefaultBlock;
41
42
  const maybeShowBreadcrumb = hasSelectedBlock && !hasMultiSelection() && editorMode === 'navigation';
42
- const isZoomOut = editorMode === 'zoom-out';
43
- const _showZoomOutToolbar = isZoomOut && block?.attributes?.align === 'full' && !_showEmptyBlockSideInserter && !maybeShowBreadcrumb;
44
- const _showBlockToolbarPopover = !_showZoomOutToolbar && !getSettings().hasFixedToolbar && !_showEmptyBlockSideInserter && hasSelectedBlock && !isEmptyDefaultBlock && !maybeShowBreadcrumb;
43
+ const _showBlockToolbarPopover = !getSettings().hasFixedToolbar && !_showEmptyBlockSideInserter && hasSelectedBlock && !isEmptyDefaultBlock && !maybeShowBreadcrumb;
45
44
  return {
46
45
  showEmptyBlockSideInserter: _showEmptyBlockSideInserter,
47
46
  showBreadcrumb: !_showEmptyBlockSideInserter && maybeShowBreadcrumb,
48
- showBlockToolbarPopover: _showBlockToolbarPopover,
49
- showZoomOutToolbar: _showZoomOutToolbar
47
+ showBlockToolbarPopover: _showBlockToolbarPopover
50
48
  };
51
49
  }, []);
52
50
  }
@@ -1 +1 @@
1
- {"version":3,"names":["_data","require","_blocks","_store","useShowBlockTools","useSelect","select","getSelectedBlockClientId","getFirstMultiSelectedBlockClientId","getBlock","getBlockMode","getSettings","hasMultiSelection","__unstableGetEditorMode","isTyping","blockEditorStore","clientId","block","editorMode","hasSelectedBlock","isEmptyDefaultBlock","isUnmodifiedDefaultBlock","_showEmptyBlockSideInserter","maybeShowBreadcrumb","isZoomOut","_showZoomOutToolbar","attributes","align","_showBlockToolbarPopover","hasFixedToolbar","showEmptyBlockSideInserter","showBreadcrumb","showBlockToolbarPopover","showZoomOutToolbar"],"sources":["@wordpress/block-editor/src/components/block-tools/use-show-block-tools.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Source of truth for which block tools are showing in the block editor.\n *\n * @return {Object} Object of which block tools will be shown.\n */\nexport function useShowBlockTools() {\n\treturn useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetFirstMultiSelectedBlockClientId,\n\t\t\tgetBlock,\n\t\t\tgetBlockMode,\n\t\t\tgetSettings,\n\t\t\thasMultiSelection,\n\t\t\t__unstableGetEditorMode,\n\t\t\tisTyping,\n\t\t} = select( blockEditorStore );\n\n\t\tconst clientId =\n\t\t\tgetSelectedBlockClientId() || getFirstMultiSelectedBlockClientId();\n\n\t\tconst block = getBlock( clientId );\n\t\tconst editorMode = __unstableGetEditorMode();\n\t\tconst hasSelectedBlock = !! clientId && !! block;\n\t\tconst isEmptyDefaultBlock =\n\t\t\thasSelectedBlock &&\n\t\t\tisUnmodifiedDefaultBlock( block ) &&\n\t\t\tgetBlockMode( clientId ) !== 'html';\n\t\tconst _showEmptyBlockSideInserter =\n\t\t\tclientId &&\n\t\t\t! isTyping() &&\n\t\t\teditorMode === 'edit' &&\n\t\t\tisEmptyDefaultBlock;\n\t\tconst maybeShowBreadcrumb =\n\t\t\thasSelectedBlock &&\n\t\t\t! hasMultiSelection() &&\n\t\t\teditorMode === 'navigation';\n\n\t\tconst isZoomOut = editorMode === 'zoom-out';\n\t\tconst _showZoomOutToolbar =\n\t\t\tisZoomOut &&\n\t\t\tblock?.attributes?.align === 'full' &&\n\t\t\t! _showEmptyBlockSideInserter &&\n\t\t\t! maybeShowBreadcrumb;\n\t\tconst _showBlockToolbarPopover =\n\t\t\t! _showZoomOutToolbar &&\n\t\t\t! getSettings().hasFixedToolbar &&\n\t\t\t! _showEmptyBlockSideInserter &&\n\t\t\thasSelectedBlock &&\n\t\t\t! isEmptyDefaultBlock &&\n\t\t\t! maybeShowBreadcrumb;\n\n\t\treturn {\n\t\t\tshowEmptyBlockSideInserter: _showEmptyBlockSideInserter,\n\t\t\tshowBreadcrumb:\n\t\t\t\t! _showEmptyBlockSideInserter && maybeShowBreadcrumb,\n\t\t\tshowBlockToolbarPopover: _showBlockToolbarPopover,\n\t\t\tshowZoomOutToolbar: _showZoomOutToolbar,\n\t\t};\n\t}, [] );\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACO,SAASG,iBAAiBA,CAAA,EAAG;EACnC,OAAO,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAC/B,MAAM;MACLC,wBAAwB;MACxBC,kCAAkC;MAClCC,QAAQ;MACRC,YAAY;MACZC,WAAW;MACXC,iBAAiB;MACjBC,uBAAuB;MACvBC;IACD,CAAC,GAAGR,MAAM,CAAES,YAAiB,CAAC;IAE9B,MAAMC,QAAQ,GACbT,wBAAwB,CAAC,CAAC,IAAIC,kCAAkC,CAAC,CAAC;IAEnE,MAAMS,KAAK,GAAGR,QAAQ,CAAEO,QAAS,CAAC;IAClC,MAAME,UAAU,GAAGL,uBAAuB,CAAC,CAAC;IAC5C,MAAMM,gBAAgB,GAAG,CAAC,CAAEH,QAAQ,IAAI,CAAC,CAAEC,KAAK;IAChD,MAAMG,mBAAmB,GACxBD,gBAAgB,IAChB,IAAAE,gCAAwB,EAAEJ,KAAM,CAAC,IACjCP,YAAY,CAAEM,QAAS,CAAC,KAAK,MAAM;IACpC,MAAMM,2BAA2B,GAChCN,QAAQ,IACR,CAAEF,QAAQ,CAAC,CAAC,IACZI,UAAU,KAAK,MAAM,IACrBE,mBAAmB;IACpB,MAAMG,mBAAmB,GACxBJ,gBAAgB,IAChB,CAAEP,iBAAiB,CAAC,CAAC,IACrBM,UAAU,KAAK,YAAY;IAE5B,MAAMM,SAAS,GAAGN,UAAU,KAAK,UAAU;IAC3C,MAAMO,mBAAmB,GACxBD,SAAS,IACTP,KAAK,EAAES,UAAU,EAAEC,KAAK,KAAK,MAAM,IACnC,CAAEL,2BAA2B,IAC7B,CAAEC,mBAAmB;IACtB,MAAMK,wBAAwB,GAC7B,CAAEH,mBAAmB,IACrB,CAAEd,WAAW,CAAC,CAAC,CAACkB,eAAe,IAC/B,CAAEP,2BAA2B,IAC7BH,gBAAgB,IAChB,CAAEC,mBAAmB,IACrB,CAAEG,mBAAmB;IAEtB,OAAO;MACNO,0BAA0B,EAAER,2BAA2B;MACvDS,cAAc,EACb,CAAET,2BAA2B,IAAIC,mBAAmB;MACrDS,uBAAuB,EAAEJ,wBAAwB;MACjDK,kBAAkB,EAAER;IACrB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;AACR","ignoreList":[]}
1
+ {"version":3,"names":["_data","require","_blocks","_store","_lockUnlock","useShowBlockTools","useSelect","select","getSelectedBlockClientId","getFirstMultiSelectedBlockClientId","getBlock","getBlockMode","getSettings","hasMultiSelection","__unstableGetEditorMode","isTyping","unlock","blockEditorStore","clientId","block","editorMode","hasSelectedBlock","isEmptyDefaultBlock","isUnmodifiedDefaultBlock","_showEmptyBlockSideInserter","maybeShowBreadcrumb","_showBlockToolbarPopover","hasFixedToolbar","showEmptyBlockSideInserter","showBreadcrumb","showBlockToolbarPopover"],"sources":["@wordpress/block-editor/src/components/block-tools/use-show-block-tools.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\n/**\n * Source of truth for which block tools are showing in the block editor.\n *\n * @return {Object} Object of which block tools will be shown.\n */\nexport function useShowBlockTools() {\n\treturn useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetFirstMultiSelectedBlockClientId,\n\t\t\tgetBlock,\n\t\t\tgetBlockMode,\n\t\t\tgetSettings,\n\t\t\thasMultiSelection,\n\t\t\t__unstableGetEditorMode,\n\t\t\tisTyping,\n\t\t} = unlock( select( blockEditorStore ) );\n\n\t\tconst clientId =\n\t\t\tgetSelectedBlockClientId() || getFirstMultiSelectedBlockClientId();\n\n\t\tconst block = getBlock( clientId );\n\t\tconst editorMode = __unstableGetEditorMode();\n\t\tconst hasSelectedBlock = !! clientId && !! block;\n\t\tconst isEmptyDefaultBlock =\n\t\t\thasSelectedBlock &&\n\t\t\tisUnmodifiedDefaultBlock( block ) &&\n\t\t\tgetBlockMode( clientId ) !== 'html';\n\t\tconst _showEmptyBlockSideInserter =\n\t\t\tclientId &&\n\t\t\t! isTyping() &&\n\t\t\teditorMode === 'edit' &&\n\t\t\tisEmptyDefaultBlock;\n\t\tconst maybeShowBreadcrumb =\n\t\t\thasSelectedBlock &&\n\t\t\t! hasMultiSelection() &&\n\t\t\teditorMode === 'navigation';\n\t\tconst _showBlockToolbarPopover =\n\t\t\t! getSettings().hasFixedToolbar &&\n\t\t\t! _showEmptyBlockSideInserter &&\n\t\t\thasSelectedBlock &&\n\t\t\t! isEmptyDefaultBlock &&\n\t\t\t! maybeShowBreadcrumb;\n\n\t\treturn {\n\t\t\tshowEmptyBlockSideInserter: _showEmptyBlockSideInserter,\n\t\t\tshowBreadcrumb:\n\t\t\t\t! _showEmptyBlockSideInserter && maybeShowBreadcrumb,\n\t\t\tshowBlockToolbarPopover: _showBlockToolbarPopover,\n\t\t};\n\t}, [] );\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACO,SAASI,iBAAiBA,CAAA,EAAG;EACnC,OAAO,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAC/B,MAAM;MACLC,wBAAwB;MACxBC,kCAAkC;MAClCC,QAAQ;MACRC,YAAY;MACZC,WAAW;MACXC,iBAAiB;MACjBC,uBAAuB;MACvBC;IACD,CAAC,GAAG,IAAAC,kBAAM,EAAET,MAAM,CAAEU,YAAiB,CAAE,CAAC;IAExC,MAAMC,QAAQ,GACbV,wBAAwB,CAAC,CAAC,IAAIC,kCAAkC,CAAC,CAAC;IAEnE,MAAMU,KAAK,GAAGT,QAAQ,CAAEQ,QAAS,CAAC;IAClC,MAAME,UAAU,GAAGN,uBAAuB,CAAC,CAAC;IAC5C,MAAMO,gBAAgB,GAAG,CAAC,CAAEH,QAAQ,IAAI,CAAC,CAAEC,KAAK;IAChD,MAAMG,mBAAmB,GACxBD,gBAAgB,IAChB,IAAAE,gCAAwB,EAAEJ,KAAM,CAAC,IACjCR,YAAY,CAAEO,QAAS,CAAC,KAAK,MAAM;IACpC,MAAMM,2BAA2B,GAChCN,QAAQ,IACR,CAAEH,QAAQ,CAAC,CAAC,IACZK,UAAU,KAAK,MAAM,IACrBE,mBAAmB;IACpB,MAAMG,mBAAmB,GACxBJ,gBAAgB,IAChB,CAAER,iBAAiB,CAAC,CAAC,IACrBO,UAAU,KAAK,YAAY;IAC5B,MAAMM,wBAAwB,GAC7B,CAAEd,WAAW,CAAC,CAAC,CAACe,eAAe,IAC/B,CAAEH,2BAA2B,IAC7BH,gBAAgB,IAChB,CAAEC,mBAAmB,IACrB,CAAEG,mBAAmB;IAEtB,OAAO;MACNG,0BAA0B,EAAEJ,2BAA2B;MACvDK,cAAc,EACb,CAAEL,2BAA2B,IAAIC,mBAAmB;MACrDK,uBAAuB,EAAEJ;IAC1B,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;AACR","ignoreList":[]}
@@ -24,34 +24,25 @@ function ZoomOutModeInserters() {
24
24
  const [isReady, setIsReady] = (0, _element.useState)(false);
25
25
  const {
26
26
  hasSelection,
27
- blockInsertionPoint,
28
27
  blockOrder,
29
- blockInsertionPointVisible,
30
28
  setInserterIsOpened,
31
29
  sectionRootClientId,
32
- selectedBlockClientId,
33
- hoveredBlockClientId
30
+ selectedBlockClientId
34
31
  } = (0, _data.useSelect)(select => {
35
32
  const {
36
33
  getSettings,
37
- getBlockInsertionPoint,
38
34
  getBlockOrder,
39
35
  getSelectionStart,
40
36
  getSelectedBlockClientId,
41
- getHoveredBlockClientId,
42
- isBlockInsertionPointVisible,
43
37
  getSectionRootClientId
44
38
  } = (0, _lockUnlock.unlock)(select(_store.store));
45
39
  const root = getSectionRootClientId();
46
40
  return {
47
41
  hasSelection: !!getSelectionStart().clientId,
48
- blockInsertionPoint: getBlockInsertionPoint(),
49
42
  blockOrder: getBlockOrder(root),
50
- blockInsertionPointVisible: isBlockInsertionPointVisible(),
51
43
  sectionRootClientId: root,
52
44
  setInserterIsOpened: getSettings().__experimentalSetIsInserterOpened,
53
- selectedBlockClientId: getSelectedBlockClientId(),
54
- hoveredBlockClientId: getHoveredBlockClientId()
45
+ selectedBlockClientId: getSelectedBlockClientId()
55
46
  };
56
47
  }, []);
57
48
  const {
@@ -67,33 +58,28 @@ function ZoomOutModeInserters() {
67
58
  clearTimeout(timeout);
68
59
  };
69
60
  }, []);
70
- if (!isReady) {
61
+ if (!isReady || !hasSelection) {
71
62
  return null;
72
63
  }
73
- return [undefined, ...blockOrder].map((clientId, index) => {
74
- const shouldRenderInsertionPoint = blockInsertionPointVisible && blockInsertionPoint.index === index;
75
- const previousClientId = clientId;
76
- const nextClientId = blockOrder[index];
77
- const isSelected = hasSelection && (selectedBlockClientId === previousClientId || selectedBlockClientId === nextClientId);
78
- const isHovered = hoveredBlockClientId === previousClientId || hoveredBlockClientId === nextClientId;
79
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_inbetween.default, {
80
- previousClientId: previousClientId,
81
- nextClientId: nextClientId,
82
- children: !shouldRenderInsertionPoint && /*#__PURE__*/(0, _jsxRuntime.jsx)(_zoomOutModeInserterButton.default, {
83
- isVisible: isSelected || isHovered,
84
- onClick: () => {
85
- setInserterIsOpened({
86
- rootClientId: sectionRootClientId,
87
- insertionIndex: index,
88
- tab: 'patterns',
89
- category: 'all'
90
- });
91
- showInsertionPoint(sectionRootClientId, index, {
92
- operation: 'insert'
93
- });
94
- }
95
- })
96
- }, index);
64
+ const previousClientId = selectedBlockClientId;
65
+ const index = blockOrder.findIndex(clientId => selectedBlockClientId === clientId);
66
+ const nextClientId = blockOrder[index + 1];
67
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_inbetween.default, {
68
+ previousClientId: previousClientId,
69
+ nextClientId: nextClientId,
70
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_zoomOutModeInserterButton.default, {
71
+ onClick: () => {
72
+ setInserterIsOpened({
73
+ rootClientId: sectionRootClientId,
74
+ insertionIndex: index + 1,
75
+ tab: 'patterns',
76
+ category: 'all'
77
+ });
78
+ showInsertionPoint(sectionRootClientId, index + 1, {
79
+ operation: 'insert'
80
+ });
81
+ }
82
+ })
97
83
  });
98
84
  }
99
85
  var _default = exports.default = ZoomOutModeInserters;
@@ -1 +1 @@
1
- {"version":3,"names":["_data","require","_element","_inbetween","_interopRequireDefault","_zoomOutModeInserterButton","_store","_lockUnlock","_jsxRuntime","ZoomOutModeInserters","isReady","setIsReady","useState","hasSelection","blockInsertionPoint","blockOrder","blockInsertionPointVisible","setInserterIsOpened","sectionRootClientId","selectedBlockClientId","hoveredBlockClientId","useSelect","select","getSettings","getBlockInsertionPoint","getBlockOrder","getSelectionStart","getSelectedBlockClientId","getHoveredBlockClientId","isBlockInsertionPointVisible","getSectionRootClientId","unlock","blockEditorStore","root","clientId","__experimentalSetIsInserterOpened","showInsertionPoint","useDispatch","useEffect","timeout","setTimeout","clearTimeout","undefined","map","index","shouldRenderInsertionPoint","previousClientId","nextClientId","isSelected","isHovered","jsx","default","children","isVisible","onClick","rootClientId","insertionIndex","tab","category","operation","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-tools/zoom-out-mode-inserters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport ZoomOutModeInserterButton from './zoom-out-mode-inserter-button';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nfunction ZoomOutModeInserters() {\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\thasSelection,\n\t\tblockInsertionPoint,\n\t\tblockOrder,\n\t\tblockInsertionPointVisible,\n\t\tsetInserterIsOpened,\n\t\tsectionRootClientId,\n\t\tselectedBlockClientId,\n\t\thoveredBlockClientId,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSettings,\n\t\t\tgetBlockInsertionPoint,\n\t\t\tgetBlockOrder,\n\t\t\tgetSelectionStart,\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetHoveredBlockClientId,\n\t\t\tisBlockInsertionPointVisible,\n\t\t\tgetSectionRootClientId,\n\t\t} = unlock( select( blockEditorStore ) );\n\n\t\tconst root = getSectionRootClientId();\n\n\t\treturn {\n\t\t\thasSelection: !! getSelectionStart().clientId,\n\t\t\tblockInsertionPoint: getBlockInsertionPoint(),\n\t\t\tblockOrder: getBlockOrder( root ),\n\t\t\tblockInsertionPointVisible: isBlockInsertionPointVisible(),\n\t\t\tsectionRootClientId: root,\n\t\t\tsetInserterIsOpened:\n\t\t\t\tgetSettings().__experimentalSetIsInserterOpened,\n\t\t\tselectedBlockClientId: getSelectedBlockClientId(),\n\t\t\thoveredBlockClientId: getHoveredBlockClientId(),\n\t\t};\n\t}, [] );\n\n\tconst { showInsertionPoint } = useDispatch( blockEditorStore );\n\n\t// Defer the initial rendering to avoid the jumps due to the animation.\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsReady( true );\n\t\t}, 500 );\n\t\treturn () => {\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [] );\n\n\tif ( ! isReady ) {\n\t\treturn null;\n\t}\n\n\treturn [ undefined, ...blockOrder ].map( ( clientId, index ) => {\n\t\tconst shouldRenderInsertionPoint =\n\t\t\tblockInsertionPointVisible && blockInsertionPoint.index === index;\n\n\t\tconst previousClientId = clientId;\n\t\tconst nextClientId = blockOrder[ index ];\n\n\t\tconst isSelected =\n\t\t\thasSelection &&\n\t\t\t( selectedBlockClientId === previousClientId ||\n\t\t\t\tselectedBlockClientId === nextClientId );\n\n\t\tconst isHovered =\n\t\t\thoveredBlockClientId === previousClientId ||\n\t\t\thoveredBlockClientId === nextClientId;\n\n\t\treturn (\n\t\t\t<BlockPopoverInbetween\n\t\t\t\tkey={ index }\n\t\t\t\tpreviousClientId={ previousClientId }\n\t\t\t\tnextClientId={ nextClientId }\n\t\t\t>\n\t\t\t\t{ ! shouldRenderInsertionPoint && (\n\t\t\t\t\t<ZoomOutModeInserterButton\n\t\t\t\t\t\tisVisible={ isSelected || isHovered }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetInserterIsOpened( {\n\t\t\t\t\t\t\t\trootClientId: sectionRootClientId,\n\t\t\t\t\t\t\t\tinsertionIndex: index,\n\t\t\t\t\t\t\t\ttab: 'patterns',\n\t\t\t\t\t\t\t\tcategory: 'all',\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tshowInsertionPoint( sectionRootClientId, index, {\n\t\t\t\t\t\t\t\toperation: 'insert',\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) }\n\t\t\t</BlockPopoverInbetween>\n\t\t);\n\t} );\n}\n\nexport default ZoomOutModeInserters;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_data","require","_element","_inbetween","_interopRequireDefault","_zoomOutModeInserterButton","_store","_lockUnlock","_jsxRuntime","ZoomOutModeInserters","isReady","setIsReady","useState","hasSelection","blockOrder","setInserterIsOpened","sectionRootClientId","selectedBlockClientId","useSelect","select","getSettings","getBlockOrder","getSelectionStart","getSelectedBlockClientId","getSectionRootClientId","unlock","blockEditorStore","root","clientId","__experimentalSetIsInserterOpened","showInsertionPoint","useDispatch","useEffect","timeout","setTimeout","clearTimeout","previousClientId","index","findIndex","nextClientId","jsx","default","children","onClick","rootClientId","insertionIndex","tab","category","operation","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-tools/zoom-out-mode-inserters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport ZoomOutModeInserterButton from './zoom-out-mode-inserter-button';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nfunction ZoomOutModeInserters() {\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\thasSelection,\n\t\tblockOrder,\n\t\tsetInserterIsOpened,\n\t\tsectionRootClientId,\n\t\tselectedBlockClientId,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSettings,\n\t\t\tgetBlockOrder,\n\t\t\tgetSelectionStart,\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetSectionRootClientId,\n\t\t} = unlock( select( blockEditorStore ) );\n\n\t\tconst root = getSectionRootClientId();\n\n\t\treturn {\n\t\t\thasSelection: !! getSelectionStart().clientId,\n\t\t\tblockOrder: getBlockOrder( root ),\n\t\t\tsectionRootClientId: root,\n\t\t\tsetInserterIsOpened:\n\t\t\t\tgetSettings().__experimentalSetIsInserterOpened,\n\t\t\tselectedBlockClientId: getSelectedBlockClientId(),\n\t\t};\n\t}, [] );\n\n\tconst { showInsertionPoint } = useDispatch( blockEditorStore );\n\n\t// Defer the initial rendering to avoid the jumps due to the animation.\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsReady( true );\n\t\t}, 500 );\n\t\treturn () => {\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [] );\n\n\tif ( ! isReady || ! hasSelection ) {\n\t\treturn null;\n\t}\n\n\tconst previousClientId = selectedBlockClientId;\n\tconst index = blockOrder.findIndex(\n\t\t( clientId ) => selectedBlockClientId === clientId\n\t);\n\tconst nextClientId = blockOrder[ index + 1 ];\n\n\treturn (\n\t\t<BlockPopoverInbetween\n\t\t\tpreviousClientId={ previousClientId }\n\t\t\tnextClientId={ nextClientId }\n\t\t>\n\t\t\t<ZoomOutModeInserterButton\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tsetInserterIsOpened( {\n\t\t\t\t\t\trootClientId: sectionRootClientId,\n\t\t\t\t\t\tinsertionIndex: index + 1,\n\t\t\t\t\t\ttab: 'patterns',\n\t\t\t\t\t\tcategory: 'all',\n\t\t\t\t\t} );\n\t\t\t\t\tshowInsertionPoint( sectionRootClientId, index + 1, {\n\t\t\t\t\t\toperation: 'insert',\n\t\t\t\t\t} );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</BlockPopoverInbetween>\n\t);\n}\n\nexport default ZoomOutModeInserters;\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,UAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,0BAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,WAAA,GAAAN,OAAA;AAA2C,IAAAO,WAAA,GAAAP,OAAA;AAZ3C;AACA;AACA;;AAIA;AACA;AACA;;AAMA,SAASQ,oBAAoBA,CAAA,EAAG;EAC/B,MAAM,CAAEC,OAAO,EAAEC,UAAU,CAAE,GAAG,IAAAC,iBAAQ,EAAE,KAAM,CAAC;EACjD,MAAM;IACLC,YAAY;IACZC,UAAU;IACVC,mBAAmB;IACnBC,mBAAmB;IACnBC;EACD,CAAC,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAC5B,MAAM;MACLC,WAAW;MACXC,aAAa;MACbC,iBAAiB;MACjBC,wBAAwB;MACxBC;IACD,CAAC,GAAG,IAAAC,kBAAM,EAAEN,MAAM,CAAEO,YAAiB,CAAE,CAAC;IAExC,MAAMC,IAAI,GAAGH,sBAAsB,CAAC,CAAC;IAErC,OAAO;MACNX,YAAY,EAAE,CAAC,CAAES,iBAAiB,CAAC,CAAC,CAACM,QAAQ;MAC7Cd,UAAU,EAAEO,aAAa,CAAEM,IAAK,CAAC;MACjCX,mBAAmB,EAAEW,IAAI;MACzBZ,mBAAmB,EAClBK,WAAW,CAAC,CAAC,CAACS,iCAAiC;MAChDZ,qBAAqB,EAAEM,wBAAwB,CAAC;IACjD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAM;IAAEO;EAAmB,CAAC,GAAG,IAAAC,iBAAW,EAAEL,YAAiB,CAAC;;EAE9D;EACA,IAAAM,kBAAS,EAAE,MAAM;IAChB,MAAMC,OAAO,GAAGC,UAAU,CAAE,MAAM;MACjCvB,UAAU,CAAE,IAAK,CAAC;IACnB,CAAC,EAAE,GAAI,CAAC;IACR,OAAO,MAAM;MACZwB,YAAY,CAAEF,OAAQ,CAAC;IACxB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,IAAK,CAAEvB,OAAO,IAAI,CAAEG,YAAY,EAAG;IAClC,OAAO,IAAI;EACZ;EAEA,MAAMuB,gBAAgB,GAAGnB,qBAAqB;EAC9C,MAAMoB,KAAK,GAAGvB,UAAU,CAACwB,SAAS,CAC/BV,QAAQ,IAAMX,qBAAqB,KAAKW,QAC3C,CAAC;EACD,MAAMW,YAAY,GAAGzB,UAAU,CAAEuB,KAAK,GAAG,CAAC,CAAE;EAE5C,oBACC,IAAA7B,WAAA,CAAAgC,GAAA,EAACrC,UAAA,CAAAsC,OAAqB;IACrBL,gBAAgB,EAAGA,gBAAkB;IACrCG,YAAY,EAAGA,YAAc;IAAAG,QAAA,eAE7B,IAAAlC,WAAA,CAAAgC,GAAA,EAACnC,0BAAA,CAAAoC,OAAyB;MACzBE,OAAO,EAAGA,CAAA,KAAM;QACf5B,mBAAmB,CAAE;UACpB6B,YAAY,EAAE5B,mBAAmB;UACjC6B,cAAc,EAAER,KAAK,GAAG,CAAC;UACzBS,GAAG,EAAE,UAAU;UACfC,QAAQ,EAAE;QACX,CAAE,CAAC;QACHjB,kBAAkB,CAAEd,mBAAmB,EAAEqB,KAAK,GAAG,CAAC,EAAE;UACnDW,SAAS,EAAE;QACZ,CAAE,CAAC;MACJ;IAAG,CACH;EAAC,CACoB,CAAC;AAE1B;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAT,OAAA,GAEchC,oBAAoB","ignoreList":[]}
@@ -126,7 +126,7 @@ function Iframe({
126
126
  scripts = ''
127
127
  } = resolvedAssets;
128
128
  const [iframeDocument, setIframeDocument] = (0, _element.useState)();
129
- const prevContainerWidthRef = (0, _element.useRef)();
129
+ const initialContainerWidth = (0, _element.useRef)(0);
130
130
  const [bodyClasses, setBodyClasses] = (0, _element.useState)([]);
131
131
  const clearerRef = (0, _blockSelectionClearer.useBlockSelectionClearer)();
132
132
  const [before, writingFlowRef, after] = (0, _writingFlow.useWritingFlow)();
@@ -210,9 +210,10 @@ function Iframe({
210
210
  const isZoomedOut = scale !== 1;
211
211
  (0, _element.useEffect)(() => {
212
212
  if (!isZoomedOut) {
213
- prevContainerWidthRef.current = containerWidth;
213
+ initialContainerWidth.current = containerWidth;
214
214
  }
215
215
  }, [containerWidth, isZoomedOut]);
216
+ const scaleContainerWidth = Math.max(initialContainerWidth.current, containerWidth);
216
217
  const disabledRef = (0, _compose.useDisabled)({
217
218
  isDisabled: !readonly
218
219
  });
@@ -257,33 +258,62 @@ function Iframe({
257
258
  return [_src, () => URL.revokeObjectURL(_src)];
258
259
  }, [html]);
259
260
  (0, _element.useEffect)(() => cleanup, [cleanup]);
261
+ const zoomOutAnimationClassnameRef = (0, _element.useRef)(null);
262
+
263
+ // Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect
264
+ // that controls settings the CSS variables, but then we would need to do more work to ensure we're
265
+ // only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large
266
+ // number of dependencies.
260
267
  (0, _element.useEffect)(() => {
261
268
  if (!iframeDocument || !isZoomedOut) {
262
269
  return;
263
270
  }
271
+ const handleZoomOutAnimationClassname = () => {
272
+ clearTimeout(zoomOutAnimationClassnameRef.current);
273
+ iframeDocument.documentElement.classList.add('zoom-out-animation');
274
+ zoomOutAnimationClassnameRef.current = setTimeout(() => {
275
+ iframeDocument.documentElement.classList.remove('zoom-out-animation');
276
+ }, 400); // 400ms should match the animation speed used in components/iframe/content.scss
277
+ };
278
+ handleZoomOutAnimationClassname();
264
279
  iframeDocument.documentElement.classList.add('is-zoomed-out');
280
+ return () => {
281
+ handleZoomOutAnimationClassname();
282
+ iframeDocument.documentElement.classList.remove('is-zoomed-out');
283
+ };
284
+ }, [iframeDocument, isZoomedOut]);
285
+
286
+ // Calculate the scaling and CSS variables for the zoom out canvas
287
+ (0, _element.useEffect)(() => {
288
+ if (!iframeDocument || !isZoomedOut) {
289
+ return;
290
+ }
265
291
  const maxWidth = 750;
292
+ // Note: When we initialize the zoom out when the canvas is smaller (sidebars open),
293
+ // initialContainerWidth will be smaller than the full page, and reflow will happen
294
+ // when the canvas area becomes larger due to sidebars closing. This is a known but
295
+ // minor divergence for now.
296
+
266
297
  // This scaling calculation has to happen within the JS because CSS calc() can
267
298
  // only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid
268
299
  // but calc( 100px / 2px ) is not.
269
- iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale', scale === 'default' ? (Math.min(containerWidth, maxWidth) - parseInt(frameSize) * 2) / prevContainerWidthRef.current : scale);
300
+ iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale', scale === 'default' ? (Math.min(containerWidth, maxWidth) - parseInt(frameSize) * 2) / scaleContainerWidth : scale);
270
301
 
271
302
  // frameSize has to be a px value for the scaling and frame size to be computed correctly.
272
303
  iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-frame-size', typeof frameSize === 'number' ? `${frameSize}px` : frameSize);
273
304
  iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-content-height', `${contentHeight}px`);
274
305
  iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-inner-height', `${iframeWindowInnerHeight}px`);
275
306
  iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-container-width', `${containerWidth}px`);
276
- iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-prev-container-width', `${prevContainerWidthRef.current}px`);
307
+ iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale-container-width', `${scaleContainerWidth}px`);
277
308
  return () => {
278
- iframeDocument.documentElement.classList.remove('is-zoomed-out');
279
309
  iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale');
280
310
  iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-frame-size');
281
311
  iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-content-height');
282
312
  iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-inner-height');
283
313
  iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-container-width');
284
- iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-prev-container-width');
314
+ iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale-container-width');
285
315
  };
286
- }, [scale, frameSize, iframeDocument, iframeWindowInnerHeight, contentHeight, containerWidth, windowInnerWidth, isZoomedOut]);
316
+ }, [scale, frameSize, iframeDocument, iframeWindowInnerHeight, contentHeight, containerWidth, windowInnerWidth, isZoomedOut, scaleContainerWidth]);
287
317
 
288
318
  // Make sure to not render the before and after focusable div elements in view
289
319
  // mode. They're only needed to capture focus in edit mode.
@@ -293,7 +323,8 @@ function Iframe({
293
323
  ...props,
294
324
  style: {
295
325
  ...props.style,
296
- height: props.style?.height
326
+ height: props.style?.height,
327
+ border: 0
297
328
  },
298
329
  ref: (0, _compose.useMergeRefs)([ref, setRef]),
299
330
  tabIndex: tabIndex
@@ -349,8 +380,7 @@ function Iframe({
349
380
  children: [containerResizeListener, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
350
381
  className: (0, _clsx.default)('block-editor-iframe__scale-container', isZoomedOut && 'is-zoomed-out'),
351
382
  style: {
352
- '--wp-block-editor-iframe-zoom-out-container-width': isZoomedOut && `${containerWidth}px`,
353
- '--wp-block-editor-iframe-zoom-out-prev-container-width': isZoomedOut && `${prevContainerWidthRef.current}px`
383
+ '--wp-block-editor-iframe-zoom-out-scale-container-width': isZoomedOut && `${scaleContainerWidth}px`
354
384
  },
355
385
  children: iframe
356
386
  })]
@@ -1 +1 @@
1
- {"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_i18n","_compose","_components","_data","_blockSelectionClearer","_writingFlow","_getCompatibilityStyles","_store","_jsxRuntime","bubbleEvent","event","Constructor","frame","init","key","contentDocument","defaultView","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","defaultPrevented","preventDefault","cancelled","dispatchEvent","useBubbleEvents","iframeDocument","useRefEffect","frameElement","html","documentElement","eventTypes","handlers","name","prototype","Object","getPrototypeOf","constructorName","constructor","window","addEventListener","removeEventListener","Iframe","contentRef","children","tabIndex","scale","frameSize","readonly","forwardedRef","ref","title","__","props","resolvedAssets","isPreviewMode","useSelect","select","getSettings","blockEditorStore","settings","__unstableResolvedAssets","__unstableIsPreviewMode","styles","scripts","setIframeDocument","useState","prevContainerWidthRef","useRef","bodyClasses","setBodyClasses","clearerRef","useBlockSelectionClearer","before","writingFlowRef","after","useWritingFlow","contentResizeListener","height","contentHeight","useResizeObserver","containerResizeListener","width","containerWidth","setRef","node","_load","iFrameDocument","preventFileDropDefault","onLoad","ownerDocument","classList","add","Array","from","body","filter","startsWith","dir","compatStyle","getCompatibilityStyles","getElementById","id","head","appendChild","cloneNode","console","warn","iframeWindowInnerHeight","setIframeWindowInnerHeight","iframeResizeRef","nodeWindow","innerHeight","onResize","windowInnerWidth","setWindowInnerWidth","windowResizeRef","innerWidth","isZoomedOut","useEffect","current","disabledRef","useDisabled","isDisabled","bodyRef","useMergeRefs","src","cleanup","useMemo","_src","URL","createObjectURL","Blob","revokeObjectURL","maxWidth","style","setProperty","Math","min","parseInt","remove","removeProperty","shouldRenderFocusCaptureElements","iframe","jsxs","Fragment","jsx","onKeyDown","currentTarget","target","stopPropagation","nativeEvent","KeyboardEvent","createPortal","className","clsx","__experimentalStyleProvider","document","IframeIfReady","isInitialised","__internalIsInitialized","_default","exports","default","forwardRef"],"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseEffect,\n\tuseRef,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst settings = getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.__unstableIsPreviewMode,\n\t\t};\n\t}, [] );\n\tconst { styles = '', scripts = '' } = resolvedAssets;\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst prevContainerWidthRef = useRef();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tnode._load = () => {\n\t\t\tsetIframeDocument( node.contentDocument );\n\t\t};\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tdelete node._load;\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst [ iframeWindowInnerHeight, setIframeWindowInnerHeight ] = useState();\n\n\tconst iframeResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\tconst onResize = () => {\n\t\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst [ windowInnerWidth, setWindowInnerWidth ] = useState();\n\n\tconst windowResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\tconst onResize = () => {\n\t\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst isZoomedOut = scale !== 1;\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tprevContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\t// Avoid resize listeners when not needed, these will trigger\n\t\t// unnecessary re-renders when animating the iframe width, or when\n\t\t// expanding preview iframes.\n\t\tisZoomedOut ? iframeResizeRef : null,\n\t] );\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<script>window.frameElement._load()</script>\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ styles }\n\t\t${ scripts }\n\t</head>\n\t<body>\n\t\t<script>document.currentScript.parentElement.remove()</script>\n\t</body>\n</html>`;\n\n\tconst [ src, cleanup ] = useMemo( () => {\n\t\tconst _src = URL.createObjectURL(\n\t\t\tnew window.Blob( [ html ], { type: 'text/html' } )\n\t\t);\n\t\treturn [ _src, () => URL.revokeObjectURL( _src ) ];\n\t}, [ html ] );\n\n\tuseEffect( () => cleanup, [ cleanup ] );\n\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument || ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\n\t\tconst maxWidth = 750;\n\t\t// This scaling calculation has to happen within the JS because CSS calc() can\n\t\t// only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid\n\t\t// but calc( 100px / 2px ) is not.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\tscale === 'default'\n\t\t\t\t? ( Math.min( containerWidth, maxWidth ) -\n\t\t\t\t\t\tparseInt( frameSize ) * 2 ) /\n\t\t\t\t\t\tprevContainerWidthRef.current\n\t\t\t\t: scale\n\t\t);\n\n\t\t// frameSize has to be a px value for the scaling and frame size to be computed correctly.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\ttypeof frameSize === 'number' ? `${ frameSize }px` : frameSize\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t`${ contentHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t`${ iframeWindowInnerHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t`${ containerWidth }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-prev-container-width',\n\t\t\t`${ prevContainerWidthRef.current }px`\n\t\t);\n\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-prev-container-width'\n\t\t\t);\n\t\t};\n\t}, [\n\t\tscale,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tiframeWindowInnerHeight,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\twindowInnerWidth,\n\t\tisZoomedOut,\n\t] );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t// We want to prevent React events from bubbling throught the iframe\n\t\t\t\t\t\t// we bubble these manually.\n\t\t\t\t\t\t/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ windowResizeRef }>\n\t\t\t{ containerResizeListener }\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ containerWidth }px`,\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-prev-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ prevContainerWidthRef.current }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_i18n","_compose","_components","_data","_blockSelectionClearer","_writingFlow","_getCompatibilityStyles","_store","_jsxRuntime","bubbleEvent","event","Constructor","frame","init","key","contentDocument","defaultView","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","defaultPrevented","preventDefault","cancelled","dispatchEvent","useBubbleEvents","iframeDocument","useRefEffect","frameElement","html","documentElement","eventTypes","handlers","name","prototype","Object","getPrototypeOf","constructorName","constructor","window","addEventListener","removeEventListener","Iframe","contentRef","children","tabIndex","scale","frameSize","readonly","forwardedRef","ref","title","__","props","resolvedAssets","isPreviewMode","useSelect","select","getSettings","blockEditorStore","settings","__unstableResolvedAssets","__unstableIsPreviewMode","styles","scripts","setIframeDocument","useState","initialContainerWidth","useRef","bodyClasses","setBodyClasses","clearerRef","useBlockSelectionClearer","before","writingFlowRef","after","useWritingFlow","contentResizeListener","height","contentHeight","useResizeObserver","containerResizeListener","width","containerWidth","setRef","node","_load","iFrameDocument","preventFileDropDefault","onLoad","ownerDocument","classList","add","Array","from","body","filter","startsWith","dir","compatStyle","getCompatibilityStyles","getElementById","id","head","appendChild","cloneNode","console","warn","iframeWindowInnerHeight","setIframeWindowInnerHeight","iframeResizeRef","nodeWindow","innerHeight","onResize","windowInnerWidth","setWindowInnerWidth","windowResizeRef","innerWidth","isZoomedOut","useEffect","current","scaleContainerWidth","Math","max","disabledRef","useDisabled","isDisabled","bodyRef","useMergeRefs","src","cleanup","useMemo","_src","URL","createObjectURL","Blob","revokeObjectURL","zoomOutAnimationClassnameRef","handleZoomOutAnimationClassname","clearTimeout","setTimeout","remove","maxWidth","style","setProperty","min","parseInt","removeProperty","shouldRenderFocusCaptureElements","iframe","jsxs","Fragment","jsx","border","onKeyDown","currentTarget","target","stopPropagation","nativeEvent","KeyboardEvent","createPortal","className","clsx","__experimentalStyleProvider","document","IframeIfReady","isInitialised","__internalIsInitialized","_default","exports","default","forwardRef"],"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseEffect,\n\tuseRef,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst settings = getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.__unstableIsPreviewMode,\n\t\t};\n\t}, [] );\n\tconst { styles = '', scripts = '' } = resolvedAssets;\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst initialContainerWidth = useRef( 0 );\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tnode._load = () => {\n\t\t\tsetIframeDocument( node.contentDocument );\n\t\t};\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tdelete node._load;\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst [ iframeWindowInnerHeight, setIframeWindowInnerHeight ] = useState();\n\n\tconst iframeResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\tconst onResize = () => {\n\t\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst [ windowInnerWidth, setWindowInnerWidth ] = useState();\n\n\tconst windowResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\tconst onResize = () => {\n\t\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst isZoomedOut = scale !== 1;\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidth.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidth.current,\n\t\tcontainerWidth\n\t);\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\t// Avoid resize listeners when not needed, these will trigger\n\t\t// unnecessary re-renders when animating the iframe width, or when\n\t\t// expanding preview iframes.\n\t\tisZoomedOut ? iframeResizeRef : null,\n\t] );\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<script>window.frameElement._load()</script>\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ styles }\n\t\t${ scripts }\n\t</head>\n\t<body>\n\t\t<script>document.currentScript.parentElement.remove()</script>\n\t</body>\n</html>`;\n\n\tconst [ src, cleanup ] = useMemo( () => {\n\t\tconst _src = URL.createObjectURL(\n\t\t\tnew window.Blob( [ html ], { type: 'text/html' } )\n\t\t);\n\t\treturn [ _src, () => URL.revokeObjectURL( _src ) ];\n\t}, [ html ] );\n\n\tuseEffect( () => cleanup, [ cleanup ] );\n\n\tconst zoomOutAnimationClassnameRef = useRef( null );\n\n\t// Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect\n\t// that controls settings the CSS variables, but then we would need to do more work to ensure we're\n\t// only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large\n\t// number of dependencies.\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument || ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleZoomOutAnimationClassname = () => {\n\t\t\tclearTimeout( zoomOutAnimationClassnameRef.current );\n\n\t\t\tiframeDocument.documentElement.classList.add(\n\t\t\t\t'zoom-out-animation'\n\t\t\t);\n\n\t\t\tzoomOutAnimationClassnameRef.current = setTimeout( () => {\n\t\t\t\tiframeDocument.documentElement.classList.remove(\n\t\t\t\t\t'zoom-out-animation'\n\t\t\t\t);\n\t\t\t}, 400 ); // 400ms should match the animation speed used in components/iframe/content.scss\n\t\t};\n\n\t\thandleZoomOutAnimationClassname();\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\n\t\treturn () => {\n\t\t\thandleZoomOutAnimationClassname();\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t// Calculate the scaling and CSS variables for the zoom out canvas\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument || ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst maxWidth = 750;\n\t\t// Note: When we initialize the zoom out when the canvas is smaller (sidebars open),\n\t\t// initialContainerWidth will be smaller than the full page, and reflow will happen\n\t\t// when the canvas area becomes larger due to sidebars closing. This is a known but\n\t\t// minor divergence for now.\n\n\t\t// This scaling calculation has to happen within the JS because CSS calc() can\n\t\t// only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid\n\t\t// but calc( 100px / 2px ) is not.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\tscale === 'default'\n\t\t\t\t? ( Math.min( containerWidth, maxWidth ) -\n\t\t\t\t\t\tparseInt( frameSize ) * 2 ) /\n\t\t\t\t\t\tscaleContainerWidth\n\t\t\t\t: scale\n\t\t);\n\n\t\t// frameSize has to be a px value for the scaling and frame size to be computed correctly.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\ttypeof frameSize === 'number' ? `${ frameSize }px` : frameSize\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t`${ contentHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t`${ iframeWindowInnerHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t`${ containerWidth }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t`${ scaleContainerWidth }px`\n\t\t);\n\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width'\n\t\t\t);\n\t\t};\n\t}, [\n\t\tscale,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tiframeWindowInnerHeight,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\twindowInnerWidth,\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t] );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t\tborder: 0,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t// We want to prevent React events from bubbling throught the iframe\n\t\t\t\t\t\t// we bubble these manually.\n\t\t\t\t\t\t/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ windowResizeRef }>\n\t\t\t{ containerResizeListener }\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ scaleContainerWidth }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],"mappings":"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","ignoreList":[]}
@@ -32,12 +32,16 @@ function BlockPatternsTab({
32
32
  selectedCategory,
33
33
  onInsert,
34
34
  rootClientId,
35
+ setHasCategories,
35
36
  children
36
37
  }) {
37
38
  const [showPatternsExplorer, setShowPatternsExplorer] = (0, _element.useState)(false);
38
39
  const categories = (0, _usePatternCategories.usePatternCategories)(rootClientId);
39
40
  const isMobile = (0, _compose.useViewportMatch)('medium', '<');
40
41
  const isResolvingPatterns = (0, _data.useSelect)(select => (0, _lockUnlock.unlock)(select(_store.store)).isResolvingPatterns(), []);
42
+ (0, _element.useEffect)(() => {
43
+ setHasCategories(!!categories.length);
44
+ }, [categories, setHasCategories]);
41
45
  if (isResolvingPatterns) {
42
46
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
43
47
  className: "block-editor-inserter__patterns-loading",
@@ -1 +1 @@
1
- {"version":3,"names":["_element","require","_compose","_components","_i18n","_data","_blockPatternsExplorer","_interopRequireDefault","_mobileTabNavigation","_patternCategoryPreviews","_usePatternCategories","_categoryTabs","_noResults","_store","_lockUnlock","_jsxRuntime","BlockPatternsTab","onSelectCategory","selectedCategory","onInsert","rootClientId","children","showPatternsExplorer","setShowPatternsExplorer","useState","categories","usePatternCategories","isMobile","useViewportMatch","isResolvingPatterns","useSelect","select","unlock","blockEditorStore","jsx","className","Spinner","length","default","jsxs","Fragment","Button","__next40pxDefaultSize","onClick","variant","__","category","PatternCategoryPreviews","showTitlesAsTooltip","name","initialCategory","patternCategories","onModalClose","_default","exports"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { Button, Spinner } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport PatternsExplorerModal from '../block-patterns-explorer';\nimport MobileTabNavigation from '../mobile-tab-navigation';\nimport { PatternCategoryPreviews } from './pattern-category-previews';\nimport { usePatternCategories } from './use-pattern-categories';\nimport CategoryTabs from '../category-tabs';\nimport InserterNoResults from '../no-results';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nfunction BlockPatternsTab( {\n\tonSelectCategory,\n\tselectedCategory,\n\tonInsert,\n\trootClientId,\n\tchildren,\n} ) {\n\tconst [ showPatternsExplorer, setShowPatternsExplorer ] = useState( false );\n\n\tconst categories = usePatternCategories( rootClientId );\n\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\tconst isResolvingPatterns = useSelect(\n\t\t( select ) =>\n\t\t\tunlock( select( blockEditorStore ) ).isResolvingPatterns(),\n\t\t[]\n\t);\n\n\tif ( isResolvingPatterns ) {\n\t\treturn (\n\t\t\t<div className=\"block-editor-inserter__patterns-loading\">\n\t\t\t\t<Spinner />\n\t\t\t</div>\n\t\t);\n\t}\n\n\tif ( ! categories.length ) {\n\t\treturn <InserterNoResults />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isMobile && (\n\t\t\t\t<div className=\"block-editor-inserter__block-patterns-tabs-container\">\n\t\t\t\t\t<CategoryTabs\n\t\t\t\t\t\tcategories={ categories }\n\t\t\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\t\t\tonSelectCategory={ onSelectCategory }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</CategoryTabs>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-explore-button\"\n\t\t\t\t\t\tonClick={ () => setShowPatternsExplorer( true ) }\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Explore all patterns' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ isMobile && (\n\t\t\t\t<MobileTabNavigation categories={ categories }>\n\t\t\t\t\t{ ( category ) => (\n\t\t\t\t\t\t<div className=\"block-editor-inserter__category-panel\">\n\t\t\t\t\t\t\t<PatternCategoryPreviews\n\t\t\t\t\t\t\t\tkey={ category.name }\n\t\t\t\t\t\t\t\tonInsert={ onInsert }\n\t\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\tshowTitlesAsTooltip={ false }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</MobileTabNavigation>\n\t\t\t) }\n\t\t\t{ showPatternsExplorer && (\n\t\t\t\t<PatternsExplorerModal\n\t\t\t\t\tinitialCategory={ selectedCategory || categories[ 0 ] }\n\t\t\t\t\tpatternCategories={ categories }\n\t\t\t\t\tonModalClose={ () => setShowPatternsExplorer( false ) }\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default BlockPatternsTab;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_element","require","_compose","_components","_i18n","_data","_blockPatternsExplorer","_interopRequireDefault","_mobileTabNavigation","_patternCategoryPreviews","_usePatternCategories","_categoryTabs","_noResults","_store","_lockUnlock","_jsxRuntime","BlockPatternsTab","onSelectCategory","selectedCategory","onInsert","rootClientId","setHasCategories","children","showPatternsExplorer","setShowPatternsExplorer","useState","categories","usePatternCategories","isMobile","useViewportMatch","isResolvingPatterns","useSelect","select","unlock","blockEditorStore","useEffect","length","jsx","className","Spinner","default","jsxs","Fragment","Button","__next40pxDefaultSize","onClick","variant","__","category","PatternCategoryPreviews","showTitlesAsTooltip","name","initialCategory","patternCategories","onModalClose","_default","exports"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useEffect } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { Button, Spinner } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport PatternsExplorerModal from '../block-patterns-explorer';\nimport MobileTabNavigation from '../mobile-tab-navigation';\nimport { PatternCategoryPreviews } from './pattern-category-previews';\nimport { usePatternCategories } from './use-pattern-categories';\nimport CategoryTabs from '../category-tabs';\nimport InserterNoResults from '../no-results';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nfunction BlockPatternsTab( {\n\tonSelectCategory,\n\tselectedCategory,\n\tonInsert,\n\trootClientId,\n\tsetHasCategories,\n\tchildren,\n} ) {\n\tconst [ showPatternsExplorer, setShowPatternsExplorer ] = useState( false );\n\n\tconst categories = usePatternCategories( rootClientId );\n\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\tconst isResolvingPatterns = useSelect(\n\t\t( select ) =>\n\t\t\tunlock( select( blockEditorStore ) ).isResolvingPatterns(),\n\t\t[]\n\t);\n\n\tuseEffect( () => {\n\t\tsetHasCategories( !! categories.length );\n\t}, [ categories, setHasCategories ] );\n\n\tif ( isResolvingPatterns ) {\n\t\treturn (\n\t\t\t<div className=\"block-editor-inserter__patterns-loading\">\n\t\t\t\t<Spinner />\n\t\t\t</div>\n\t\t);\n\t}\n\n\tif ( ! categories.length ) {\n\t\treturn <InserterNoResults />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isMobile && (\n\t\t\t\t<div className=\"block-editor-inserter__block-patterns-tabs-container\">\n\t\t\t\t\t<CategoryTabs\n\t\t\t\t\t\tcategories={ categories }\n\t\t\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\t\t\tonSelectCategory={ onSelectCategory }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</CategoryTabs>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-explore-button\"\n\t\t\t\t\t\tonClick={ () => setShowPatternsExplorer( true ) }\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Explore all patterns' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ isMobile && (\n\t\t\t\t<MobileTabNavigation categories={ categories }>\n\t\t\t\t\t{ ( category ) => (\n\t\t\t\t\t\t<div className=\"block-editor-inserter__category-panel\">\n\t\t\t\t\t\t\t<PatternCategoryPreviews\n\t\t\t\t\t\t\t\tkey={ category.name }\n\t\t\t\t\t\t\t\tonInsert={ onInsert }\n\t\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\tshowTitlesAsTooltip={ false }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</MobileTabNavigation>\n\t\t\t) }\n\t\t\t{ showPatternsExplorer && (\n\t\t\t\t<PatternsExplorerModal\n\t\t\t\t\tinitialCategory={ selectedCategory || categories[ 0 ] }\n\t\t\t\t\tpatternCategories={ categories }\n\t\t\t\t\tonModalClose={ () => setShowPatternsExplorer( false ) }\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default BlockPatternsTab;\n"],"mappings":"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","ignoreList":[]}
@@ -77,8 +77,10 @@ function useInsertionPoint({
77
77
  getSelectedBlockClientId,
78
78
  getBlockRootClientId,
79
79
  getBlockIndex,
80
- getBlockOrder
81
- } = select(_store.store);
80
+ getBlockOrder,
81
+ getSectionRootClientId,
82
+ __unstableGetEditorMode
83
+ } = (0, _lockUnlock.unlock)(select(_store.store));
82
84
  const selectedBlockClientId = getSelectedBlockClientId();
83
85
  let _destinationRootClientId = rootClientId;
84
86
  let _destinationIndex;
@@ -89,8 +91,18 @@ function useInsertionPoint({
89
91
  // Insert after a specific client ID.
90
92
  _destinationIndex = getBlockIndex(clientId);
91
93
  } else if (!isAppender && selectedBlockClientId) {
92
- _destinationRootClientId = getBlockRootClientId(selectedBlockClientId);
93
- _destinationIndex = getBlockIndex(selectedBlockClientId) + 1;
94
+ const sectionRootClientId = getSectionRootClientId();
95
+
96
+ // Avoids empty inserter when the selected block is acting
97
+ // as the "root".
98
+ // See https://github.com/WordPress/gutenberg/pull/66214.
99
+ if (__unstableGetEditorMode() === 'zoom-out' && sectionRootClientId === selectedBlockClientId) {
100
+ _destinationRootClientId = sectionRootClientId;
101
+ _destinationIndex = getBlockOrder(_destinationRootClientId).length;
102
+ } else {
103
+ _destinationRootClientId = getBlockRootClientId(selectedBlockClientId);
104
+ _destinationIndex = getBlockIndex(selectedBlockClientId) + 1;
105
+ }
94
106
  } else {
95
107
  // Insert at the end of the list.
96
108
  _destinationIndex = getBlockOrder(_destinationRootClientId).length;