@wordpress/block-editor 15.6.1 → 15.7.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.
- package/CHANGELOG.md +2 -0
- package/build/components/background-image-control/index.js +2 -2
- package/build/components/background-image-control/index.js.map +2 -2
- package/build/components/block-quick-navigation/index.js +1 -0
- package/build/components/block-quick-navigation/index.js.map +2 -2
- package/build/components/block-toolbar/switch-section-style.js +2 -5
- package/build/components/block-toolbar/switch-section-style.js.map +2 -2
- package/build/components/global-styles/border-panel.js +2 -1
- package/build/components/global-styles/border-panel.js.map +2 -2
- package/build/components/global-styles/color-panel.js +2 -1
- package/build/components/global-styles/color-panel.js.map +2 -2
- package/build/components/global-styles/dimensions-panel.js +3 -2
- package/build/components/global-styles/dimensions-panel.js.map +2 -2
- package/build/components/global-styles/filters-panel.js +2 -1
- package/build/components/global-styles/filters-panel.js.map +2 -2
- package/build/components/global-styles/hooks.js +0 -179
- package/build/components/global-styles/hooks.js.map +3 -3
- package/build/components/global-styles/index.js +0 -29
- package/build/components/global-styles/index.js.map +2 -2
- package/build/components/global-styles/typography-panel.js +2 -1
- package/build/components/global-styles/typography-panel.js.map +2 -2
- package/build/components/global-styles/typography-utils.js +2 -49
- package/build/components/global-styles/typography-utils.js.map +2 -2
- package/build/components/global-styles/utils.js +0 -396
- package/build/components/global-styles/utils.js.map +3 -3
- package/build/components/inserter/media-tab/media-tab.js +33 -1
- package/build/components/inserter/media-tab/media-tab.js.map +3 -3
- package/build/components/inserter/tips.js +0 -2
- package/build/components/inserter/tips.js.map +2 -2
- package/build/components/media-placeholder/index.js +31 -1
- package/build/components/media-placeholder/index.js.map +3 -3
- package/build/components/media-replace-flow/index.js +29 -1
- package/build/components/media-replace-flow/index.js.map +3 -3
- package/build/components/{global-styles/context.js → media-upload-modal/index.js} +8 -23
- package/build/components/media-upload-modal/index.js.map +7 -0
- package/build/hooks/allowed-blocks.js +3 -8
- package/build/hooks/allowed-blocks.js.map +3 -3
- package/build/hooks/block-style-variation.js +10 -23
- package/build/hooks/block-style-variation.js.map +2 -2
- package/build/hooks/duotone.js +3 -3
- package/build/hooks/duotone.js.map +2 -2
- package/build/hooks/fit-text.js +2 -2
- package/build/hooks/fit-text.js.map +2 -2
- package/build/hooks/font-size.js +2 -2
- package/build/hooks/font-size.js.map +2 -2
- package/build/hooks/use-typography-props.js +2 -2
- package/build/hooks/use-typography-props.js.map +2 -2
- package/build/private-apis.js +3 -1
- package/build/private-apis.js.map +3 -3
- package/build-module/components/background-image-control/index.js +1 -1
- package/build-module/components/background-image-control/index.js.map +2 -2
- package/build-module/components/block-quick-navigation/index.js +1 -0
- package/build-module/components/block-quick-navigation/index.js.map +2 -2
- package/build-module/components/block-toolbar/switch-section-style.js +2 -5
- package/build-module/components/block-toolbar/switch-section-style.js.map +2 -2
- package/build-module/components/global-styles/border-panel.js +2 -1
- package/build-module/components/global-styles/border-panel.js.map +2 -2
- package/build-module/components/global-styles/color-panel.js +2 -1
- package/build-module/components/global-styles/color-panel.js.map +2 -2
- package/build-module/components/global-styles/dimensions-panel.js +2 -1
- package/build-module/components/global-styles/dimensions-panel.js.map +2 -2
- package/build-module/components/global-styles/filters-panel.js +2 -1
- package/build-module/components/global-styles/filters-panel.js.map +2 -2
- package/build-module/components/global-styles/hooks.js +1 -167
- package/build-module/components/global-styles/hooks.js.map +2 -2
- package/build-module/components/global-styles/index.js +1 -29
- package/build-module/components/global-styles/index.js.map +2 -2
- package/build-module/components/global-styles/typography-panel.js +2 -1
- package/build-module/components/global-styles/typography-panel.js.map +2 -2
- package/build-module/components/global-styles/typography-utils.js +1 -49
- package/build-module/components/global-styles/typography-utils.js.map +2 -2
- package/build-module/components/global-styles/utils.js +0 -372
- package/build-module/components/global-styles/utils.js.map +2 -2
- package/build-module/components/inserter/media-tab/media-tab.js +34 -2
- package/build-module/components/inserter/media-tab/media-tab.js.map +2 -2
- package/build-module/components/inserter/tips.js +0 -2
- package/build-module/components/inserter/tips.js.map +2 -2
- package/build-module/components/media-placeholder/index.js +31 -1
- package/build-module/components/media-placeholder/index.js.map +2 -2
- package/build-module/components/media-replace-flow/index.js +29 -1
- package/build-module/components/media-replace-flow/index.js.map +2 -2
- package/build-module/components/media-upload-modal/index.js +7 -0
- package/build-module/components/media-upload-modal/index.js.map +7 -0
- package/build-module/hooks/allowed-blocks.js +3 -8
- package/build-module/hooks/allowed-blocks.js.map +2 -2
- package/build-module/hooks/block-style-variation.js +8 -25
- package/build-module/hooks/block-style-variation.js.map +2 -2
- package/build-module/hooks/duotone.js +3 -3
- package/build-module/hooks/duotone.js.map +2 -2
- package/build-module/hooks/fit-text.js +2 -2
- package/build-module/hooks/fit-text.js.map +2 -2
- package/build-module/hooks/font-size.js +1 -1
- package/build-module/hooks/font-size.js.map +2 -2
- package/build-module/hooks/use-typography-props.js +1 -1
- package/build-module/hooks/use-typography-props.js.map +2 -2
- package/build-module/private-apis.js +3 -1
- package/build-module/private-apis.js.map +2 -2
- package/build-style/style-rtl.css +10 -6
- package/build-style/style.css +10 -6
- package/package.json +36 -35
- package/src/components/background-image-control/index.js +1 -1
- package/src/components/block-card/style.scss +1 -1
- package/src/components/block-navigation/style.scss +1 -1
- package/src/components/block-quick-navigation/index.js +1 -0
- package/src/components/block-quick-navigation/style.scss +5 -0
- package/src/components/block-switcher/style.scss +1 -1
- package/src/components/block-toolbar/switch-section-style.js +2 -5
- package/src/components/color-palette/test/__snapshots__/control.js.snap +1 -1
- package/src/components/global-styles/border-panel.js +2 -1
- package/src/components/global-styles/color-panel.js +2 -1
- package/src/components/global-styles/color-panel.native.js +1 -1
- package/src/components/global-styles/dimensions-panel.js +2 -1
- package/src/components/global-styles/filters-panel.js +2 -1
- package/src/components/global-styles/hooks.js +1 -200
- package/src/components/global-styles/index.js +1 -17
- package/src/components/global-styles/test/typography-utils.js +0 -806
- package/src/components/global-styles/typography-panel.js +2 -1
- package/src/components/global-styles/typography-utils.js +0 -133
- package/src/components/global-styles/utils.js +0 -568
- package/src/components/inserter/media-tab/media-tab.js +44 -2
- package/src/components/inserter/style.scss +2 -2
- package/src/components/inserter/tips.js +0 -2
- package/src/components/media-placeholder/index.js +41 -1
- package/src/components/media-replace-flow/index.js +39 -1
- package/src/components/media-upload-modal/index.js +18 -0
- package/src/components/multi-selection-inspector/style.scss +1 -1
- package/src/hooks/allowed-blocks.js +3 -11
- package/src/hooks/block-style-variation.js +8 -28
- package/src/hooks/duotone.js +3 -3
- package/src/hooks/fit-text.js +2 -2
- package/src/hooks/font-size.js +1 -1
- package/src/hooks/use-typography-props.js +1 -1
- package/src/private-apis.js +2 -0
- package/src/style.scss +1 -0
- package/tsconfig.json +2 -0
- package/build/components/global-styles/context.js.map +0 -7
- package/build/components/global-styles/get-block-css-selector.js +0 -78
- package/build/components/global-styles/get-block-css-selector.js.map +0 -7
- package/build/components/global-styles/get-global-styles-changes.js +0 -216
- package/build/components/global-styles/get-global-styles-changes.js.map +0 -7
- package/build/components/global-styles/use-global-styles-output.js +0 -998
- package/build/components/global-styles/use-global-styles-output.js.map +0 -7
- package/build-module/components/global-styles/context.js +0 -17
- package/build-module/components/global-styles/context.js.map +0 -7
- package/build-module/components/global-styles/get-block-css-selector.js +0 -54
- package/build-module/components/global-styles/get-block-css-selector.js.map +0 -7
- package/build-module/components/global-styles/get-global-styles-changes.js +0 -182
- package/build-module/components/global-styles/get-global-styles-changes.js.map +0 -7
- package/build-module/components/global-styles/use-global-styles-output.js +0 -979
- package/build-module/components/global-styles/use-global-styles-output.js.map +0 -7
- package/src/components/global-styles/README.md +0 -190
- package/src/components/global-styles/context.js +0 -16
- package/src/components/global-styles/get-block-css-selector.js +0 -114
- package/src/components/global-styles/get-global-styles-changes.js +0 -252
- package/src/components/global-styles/test/get-global-styles-changes.js +0 -290
- package/src/components/global-styles/test/use-global-styles-output.js +0 -1131
- package/src/components/global-styles/test/utils.js +0 -499
- package/src/components/global-styles/use-global-styles-output.js +0 -1487
|
@@ -25,6 +25,7 @@ import deprecated from '@wordpress/deprecated';
|
|
|
25
25
|
* Internal dependencies
|
|
26
26
|
*/
|
|
27
27
|
import MediaUpload from '../media-upload';
|
|
28
|
+
import MediaUploadModal from '../media-upload-modal';
|
|
28
29
|
import MediaUploadCheck from '../media-upload/check';
|
|
29
30
|
import URLPopover from '../url-popover';
|
|
30
31
|
import { store as blockEditorStore } from '../../store';
|
|
@@ -32,6 +33,45 @@ import { parseDropEvent } from '../use-on-block-drop';
|
|
|
32
33
|
|
|
33
34
|
const noop = () => {};
|
|
34
35
|
|
|
36
|
+
/**
|
|
37
|
+
* Conditional Media component that uses MediaUploadModal when experiment is enabled,
|
|
38
|
+
* otherwise falls back to MediaUpload.
|
|
39
|
+
*
|
|
40
|
+
* @param {Object} root0 Component props.
|
|
41
|
+
* @param {Function} root0.render Render prop function that receives { open } object.
|
|
42
|
+
* @return {JSX.Element} The component.
|
|
43
|
+
*/
|
|
44
|
+
function ConditionalMediaUpload( { render, ...props } ) {
|
|
45
|
+
const [ isModalOpen, setIsModalOpen ] = useState( false );
|
|
46
|
+
const mediaUpload = useSelect( ( select ) => {
|
|
47
|
+
const { getSettings } = select( blockEditorStore );
|
|
48
|
+
return getSettings().mediaUpload;
|
|
49
|
+
}, [] );
|
|
50
|
+
|
|
51
|
+
if ( window.__experimentalDataViewsMediaModal ) {
|
|
52
|
+
return (
|
|
53
|
+
<>
|
|
54
|
+
{ render && render( { open: () => setIsModalOpen( true ) } ) }
|
|
55
|
+
<MediaUploadModal
|
|
56
|
+
{ ...props }
|
|
57
|
+
isOpen={ isModalOpen }
|
|
58
|
+
onClose={ () => {
|
|
59
|
+
setIsModalOpen( false );
|
|
60
|
+
props.onClose?.();
|
|
61
|
+
} }
|
|
62
|
+
onSelect={ ( media ) => {
|
|
63
|
+
setIsModalOpen( false );
|
|
64
|
+
props.onSelect?.( media );
|
|
65
|
+
} }
|
|
66
|
+
onUpload={ mediaUpload }
|
|
67
|
+
/>
|
|
68
|
+
</>
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
return <MediaUpload { ...props } render={ render } />;
|
|
73
|
+
}
|
|
74
|
+
|
|
35
75
|
const InsertFromURLPopover = ( {
|
|
36
76
|
src,
|
|
37
77
|
onChange,
|
|
@@ -448,7 +488,7 @@ export function MediaPlaceholder( {
|
|
|
448
488
|
};
|
|
449
489
|
const libraryButton = mediaLibraryButton ?? defaultButton;
|
|
450
490
|
const uploadMediaLibraryButton = (
|
|
451
|
-
<
|
|
491
|
+
<ConditionalMediaUpload
|
|
452
492
|
addToGallery={ addToGallery }
|
|
453
493
|
gallery={ multiple && onlyAllowsImages() }
|
|
454
494
|
multiple={ multiple }
|
|
@@ -12,6 +12,7 @@ import {
|
|
|
12
12
|
ToolbarButton,
|
|
13
13
|
} from '@wordpress/components';
|
|
14
14
|
import { useSelect, withDispatch } from '@wordpress/data';
|
|
15
|
+
import { useState } from '@wordpress/element';
|
|
15
16
|
import { DOWN } from '@wordpress/keycodes';
|
|
16
17
|
import {
|
|
17
18
|
postFeaturedImage,
|
|
@@ -26,6 +27,7 @@ import { store as noticesStore } from '@wordpress/notices';
|
|
|
26
27
|
* Internal dependencies
|
|
27
28
|
*/
|
|
28
29
|
import MediaUpload from '../media-upload';
|
|
30
|
+
import MediaUploadModal from '../media-upload-modal';
|
|
29
31
|
import MediaUploadCheck from '../media-upload/check';
|
|
30
32
|
import LinkControl from '../link-control';
|
|
31
33
|
import { store as blockEditorStore } from '../../store';
|
|
@@ -33,6 +35,42 @@ import { store as blockEditorStore } from '../../store';
|
|
|
33
35
|
const noop = () => {};
|
|
34
36
|
let uniqueId = 0;
|
|
35
37
|
|
|
38
|
+
/**
|
|
39
|
+
* Conditional Media component that uses MediaUploadModal when experiment is enabled,
|
|
40
|
+
* otherwise falls back to MediaUpload.
|
|
41
|
+
*
|
|
42
|
+
* @param {Object} root0 Component props.
|
|
43
|
+
* @param {Function} root0.render Render prop function that receives { open } object.
|
|
44
|
+
* @return {JSX.Element} The component.
|
|
45
|
+
*/
|
|
46
|
+
function ConditionalMediaUpload( { render, ...props } ) {
|
|
47
|
+
const [ isModalOpen, setIsModalOpen ] = useState( false );
|
|
48
|
+
const { getSettings } = useSelect( blockEditorStore );
|
|
49
|
+
|
|
50
|
+
if ( window.__experimentalDataViewsMediaModal ) {
|
|
51
|
+
return (
|
|
52
|
+
<>
|
|
53
|
+
{ render && render( { open: () => setIsModalOpen( true ) } ) }
|
|
54
|
+
<MediaUploadModal
|
|
55
|
+
{ ...props }
|
|
56
|
+
isOpen={ isModalOpen }
|
|
57
|
+
onClose={ () => {
|
|
58
|
+
setIsModalOpen( false );
|
|
59
|
+
props.onClose?.();
|
|
60
|
+
} }
|
|
61
|
+
onSelect={ ( media ) => {
|
|
62
|
+
setIsModalOpen( false );
|
|
63
|
+
props.onSelect?.( media );
|
|
64
|
+
} }
|
|
65
|
+
onUpload={ getSettings().mediaUpload }
|
|
66
|
+
/>
|
|
67
|
+
</>
|
|
68
|
+
);
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
return <MediaUpload { ...props } render={ render } />;
|
|
72
|
+
}
|
|
73
|
+
|
|
36
74
|
const MediaReplaceFlow = ( {
|
|
37
75
|
mediaURL,
|
|
38
76
|
mediaId,
|
|
@@ -157,7 +195,7 @@ const MediaReplaceFlow = ( {
|
|
|
157
195
|
<>
|
|
158
196
|
<NavigableMenu className="block-editor-media-replace-flow__media-upload-menu">
|
|
159
197
|
<MediaUploadCheck>
|
|
160
|
-
<
|
|
198
|
+
<ConditionalMediaUpload
|
|
161
199
|
gallery={ gallery }
|
|
162
200
|
addToGallery={ addToGallery }
|
|
163
201
|
multiple={ multiple }
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* WordPress dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { withFilters } from '@wordpress/components';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* This is a placeholder for the media upload modal component necessary to make it possible to provide
|
|
8
|
+
* an integration with the core blocks that handle media files. By default it renders nothing but
|
|
9
|
+
* it provides a way to have it overridden with the `editor.MediaUploadModal` filter.
|
|
10
|
+
*
|
|
11
|
+
* @return {Component} The component to be rendered.
|
|
12
|
+
*/
|
|
13
|
+
const MediaUploadModal = () => null;
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/media-upload-modal/README.md
|
|
17
|
+
*/
|
|
18
|
+
export default withFilters( 'editor.MediaUploadModal' )( MediaUploadModal );
|
|
@@ -3,25 +3,17 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { addFilter } from '@wordpress/hooks';
|
|
5
5
|
import { hasBlockSupport } from '@wordpress/blocks';
|
|
6
|
-
import { useSelect } from '@wordpress/data';
|
|
7
6
|
|
|
8
7
|
/**
|
|
9
8
|
* Internal dependencies
|
|
10
9
|
*/
|
|
11
|
-
import { store as blockEditorStore } from '../store';
|
|
12
10
|
import { PrivateInspectorControlsAllowedBlocks } from '../components/inspector-controls/groups';
|
|
13
11
|
import BlockAllowedBlocksControl from '../components/block-allowed-blocks/allowed-blocks-control';
|
|
12
|
+
import { useBlockEditingMode } from '../components/block-editing-mode';
|
|
14
13
|
|
|
15
14
|
function BlockEditAllowedBlocksControlPure( { clientId } ) {
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
return (
|
|
19
|
-
select( blockEditorStore ).getBlockEditingMode( clientId ) ===
|
|
20
|
-
'contentOnly'
|
|
21
|
-
);
|
|
22
|
-
},
|
|
23
|
-
[ clientId ]
|
|
24
|
-
);
|
|
15
|
+
const blockEditingMode = useBlockEditingMode();
|
|
16
|
+
const isContentOnly = blockEditingMode === 'contentOnly';
|
|
25
17
|
|
|
26
18
|
if ( isContentOnly ) {
|
|
27
19
|
return null;
|
|
@@ -3,16 +3,12 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { getBlockTypes, store as blocksStore } from '@wordpress/blocks';
|
|
5
5
|
import { useSelect } from '@wordpress/data';
|
|
6
|
-
import {
|
|
6
|
+
import { useMemo } from '@wordpress/element';
|
|
7
|
+
import { toStyles, getBlockSelectors } from '@wordpress/global-styles-engine';
|
|
7
8
|
|
|
8
9
|
/**
|
|
9
10
|
* Internal dependencies
|
|
10
11
|
*/
|
|
11
|
-
import {
|
|
12
|
-
GlobalStylesContext,
|
|
13
|
-
toStyles,
|
|
14
|
-
getBlockSelectors,
|
|
15
|
-
} from '../components/global-styles';
|
|
16
12
|
import { usePrivateStyleOverride } from './utils';
|
|
17
13
|
import { getValueFromObjectPath } from '../utils/object';
|
|
18
14
|
import { store as blockEditorStore } from '../store';
|
|
@@ -127,7 +123,6 @@ export function __unstableBlockStyleVariationOverridesWithConfig( { config } ) {
|
|
|
127
123
|
};
|
|
128
124
|
const blockSelectors = getBlockSelectors(
|
|
129
125
|
getBlockTypes(),
|
|
130
|
-
getBlockStyles,
|
|
131
126
|
override.clientId
|
|
132
127
|
);
|
|
133
128
|
const hasBlockGapSupport = false;
|
|
@@ -253,10 +248,6 @@ export function getVariationStylesWithRefValues(
|
|
|
253
248
|
}
|
|
254
249
|
|
|
255
250
|
function useBlockStyleVariation( name, variation, clientId ) {
|
|
256
|
-
// Prefer global styles data in GlobalStylesContext, which are available
|
|
257
|
-
// if in the site editor. Otherwise fall back to whatever is in the
|
|
258
|
-
// editor settings and available in the post editor.
|
|
259
|
-
const { merged: mergedConfig } = useContext( GlobalStylesContext );
|
|
260
251
|
const { globalSettings, globalStyles } = useSelect( ( select ) => {
|
|
261
252
|
const settings = select( blockEditorStore ).getSettings();
|
|
262
253
|
return {
|
|
@@ -268,15 +259,15 @@ function useBlockStyleVariation( name, variation, clientId ) {
|
|
|
268
259
|
return useMemo( () => {
|
|
269
260
|
const variationStyles = getVariationStylesWithRefValues(
|
|
270
261
|
{
|
|
271
|
-
settings:
|
|
272
|
-
styles:
|
|
262
|
+
settings: globalSettings,
|
|
263
|
+
styles: globalStyles,
|
|
273
264
|
},
|
|
274
265
|
name,
|
|
275
266
|
variation
|
|
276
267
|
);
|
|
277
268
|
|
|
278
269
|
return {
|
|
279
|
-
settings:
|
|
270
|
+
settings: globalSettings,
|
|
280
271
|
// The variation style data is all that is needed to generate
|
|
281
272
|
// the styles for the current application to a block. The variation
|
|
282
273
|
// name is updated to match the instance specific class name.
|
|
@@ -290,14 +281,7 @@ function useBlockStyleVariation( name, variation, clientId ) {
|
|
|
290
281
|
},
|
|
291
282
|
},
|
|
292
283
|
};
|
|
293
|
-
}, [
|
|
294
|
-
mergedConfig,
|
|
295
|
-
globalSettings,
|
|
296
|
-
globalStyles,
|
|
297
|
-
variation,
|
|
298
|
-
clientId,
|
|
299
|
-
name,
|
|
300
|
-
] );
|
|
284
|
+
}, [ globalSettings, globalStyles, variation, clientId, name ] );
|
|
301
285
|
}
|
|
302
286
|
|
|
303
287
|
// Rather than leveraging `useInstanceId` here, the `clientId` is used.
|
|
@@ -322,11 +306,7 @@ function useBlockProps( { name, className, clientId } ) {
|
|
|
322
306
|
}
|
|
323
307
|
|
|
324
308
|
const variationConfig = { settings, styles };
|
|
325
|
-
const blockSelectors = getBlockSelectors(
|
|
326
|
-
getBlockTypes(),
|
|
327
|
-
getBlockStyles,
|
|
328
|
-
clientId
|
|
329
|
-
);
|
|
309
|
+
const blockSelectors = getBlockSelectors( getBlockTypes(), clientId );
|
|
330
310
|
const hasBlockGapSupport = false;
|
|
331
311
|
const hasFallbackGapSupport = true;
|
|
332
312
|
const disableLayoutStyles = true;
|
|
@@ -349,7 +329,7 @@ function useBlockProps( { name, className, clientId } ) {
|
|
|
349
329
|
variationStyles: true,
|
|
350
330
|
}
|
|
351
331
|
);
|
|
352
|
-
}, [ variation, settings, styles,
|
|
332
|
+
}, [ variation, settings, styles, clientId ] );
|
|
353
333
|
|
|
354
334
|
usePrivateStyleOverride( {
|
|
355
335
|
id: `variation-${ clientId }`,
|
package/src/hooks/duotone.js
CHANGED
|
@@ -15,6 +15,7 @@ import {
|
|
|
15
15
|
import { useInstanceId } from '@wordpress/compose';
|
|
16
16
|
import { addFilter } from '@wordpress/hooks';
|
|
17
17
|
import { useMemo, useEffect } from '@wordpress/element';
|
|
18
|
+
import { getBlockSelector } from '@wordpress/global-styles-engine';
|
|
18
19
|
|
|
19
20
|
/**
|
|
20
21
|
* Internal dependencies
|
|
@@ -30,7 +31,6 @@ import {
|
|
|
30
31
|
getDuotoneStylesheet,
|
|
31
32
|
getDuotoneUnsetStylesheet,
|
|
32
33
|
} from '../components/duotone/utils';
|
|
33
|
-
import { getBlockCSSSelector } from '../components/global-styles/get-block-css-selector';
|
|
34
34
|
import { scopeSelector } from '../components/global-styles/utils';
|
|
35
35
|
import {
|
|
36
36
|
cleanEmptyObject,
|
|
@@ -354,14 +354,14 @@ function useBlockProps( { clientId, name, style } ) {
|
|
|
354
354
|
false
|
|
355
355
|
);
|
|
356
356
|
if ( experimentalDuotone ) {
|
|
357
|
-
const rootSelector =
|
|
357
|
+
const rootSelector = getBlockSelector( blockType );
|
|
358
358
|
return typeof experimentalDuotone === 'string'
|
|
359
359
|
? scopeSelector( rootSelector, experimentalDuotone )
|
|
360
360
|
: rootSelector;
|
|
361
361
|
}
|
|
362
362
|
|
|
363
363
|
// Regular filter.duotone support uses filter.duotone selectors with fallbacks.
|
|
364
|
-
return
|
|
364
|
+
return getBlockSelector( blockType, 'filter.duotone', {
|
|
365
365
|
fallback: true,
|
|
366
366
|
} );
|
|
367
367
|
}
|
package/src/hooks/fit-text.js
CHANGED
|
@@ -66,12 +66,12 @@ function useFitText( { fitText, name, clientId } ) {
|
|
|
66
66
|
// Any attribute may change the available space.
|
|
67
67
|
const blockAttributes = useSelect(
|
|
68
68
|
( select ) => {
|
|
69
|
-
if ( ! clientId ) {
|
|
69
|
+
if ( ! clientId || ! hasFitTextSupport || ! fitText ) {
|
|
70
70
|
return;
|
|
71
71
|
}
|
|
72
72
|
return select( blockEditorStore ).getBlockAttributes( clientId );
|
|
73
73
|
},
|
|
74
|
-
[ clientId ]
|
|
74
|
+
[ clientId, hasFitTextSupport, fitText ]
|
|
75
75
|
);
|
|
76
76
|
|
|
77
77
|
const applyFitText = useCallback( () => {
|
package/src/hooks/font-size.js
CHANGED
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
import { addFilter } from '@wordpress/hooks';
|
|
5
5
|
import { hasBlockSupport } from '@wordpress/blocks';
|
|
6
6
|
import TokenList from '@wordpress/token-list';
|
|
7
|
+
import { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';
|
|
7
8
|
|
|
8
9
|
/**
|
|
9
10
|
* Internal dependencies
|
|
@@ -21,7 +22,6 @@ import {
|
|
|
21
22
|
shouldSkipSerialization,
|
|
22
23
|
} from './utils';
|
|
23
24
|
import { useSettings } from '../components/use-settings';
|
|
24
|
-
import { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';
|
|
25
25
|
|
|
26
26
|
export const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize';
|
|
27
27
|
|
|
@@ -7,13 +7,13 @@ import clsx from 'clsx';
|
|
|
7
7
|
* WordPress dependencies
|
|
8
8
|
*/
|
|
9
9
|
import { privateApis as componentsPrivateApis } from '@wordpress/components';
|
|
10
|
+
import { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';
|
|
10
11
|
|
|
11
12
|
/**
|
|
12
13
|
* Internal dependencies
|
|
13
14
|
*/
|
|
14
15
|
import { getInlineStyles } from './style';
|
|
15
16
|
import { getFontSizeClass } from '../components/font-sizes';
|
|
16
|
-
import { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';
|
|
17
17
|
import { unlock } from '../lock-unlock';
|
|
18
18
|
|
|
19
19
|
const { kebabCase } = unlock( componentsPrivateApis );
|
package/src/private-apis.js
CHANGED
|
@@ -57,6 +57,7 @@ import {
|
|
|
57
57
|
useBlockElementRef,
|
|
58
58
|
useBlockElement,
|
|
59
59
|
} from './components/block-list/use-block-props/use-block-refs';
|
|
60
|
+
import { default as MediaUploadModal } from './components/media-upload-modal';
|
|
60
61
|
|
|
61
62
|
/**
|
|
62
63
|
* Private @wordpress/block-editor APIs.
|
|
@@ -110,4 +111,5 @@ lock( privateApis, {
|
|
|
110
111
|
essentialFormatKey,
|
|
111
112
|
useBlockElement,
|
|
112
113
|
useBlockElementRef,
|
|
114
|
+
MediaUploadModal,
|
|
113
115
|
} );
|
package/src/style.scss
CHANGED
|
@@ -20,6 +20,7 @@
|
|
|
20
20
|
@use "./components/block-patterns-paging/style.scss" as *;
|
|
21
21
|
@use "./components/block-popover/style.scss" as *;
|
|
22
22
|
@use "./components/block-preview/style.scss" as *;
|
|
23
|
+
@use "./components/block-quick-navigation/style.scss" as *;
|
|
23
24
|
@use "./components/block-rename/style.scss" as *;
|
|
24
25
|
@use "./components/block-styles/style.scss" as *;
|
|
25
26
|
@use "./components/block-switcher/style.scss" as *;
|
package/tsconfig.json
CHANGED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/global-styles/context.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const DEFAULT_GLOBAL_STYLES_CONTEXT = {\n\tuser: {},\n\tbase: {},\n\tmerged: {},\n\tsetUserConfig: () => {},\n};\n\nexport const GlobalStylesContext = createContext(\n\tDEFAULT_GLOBAL_STYLES_CONTEXT\n);\nGlobalStylesContext.displayName = 'GlobalStylesContext';\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAA8B;AAEvB,MAAM,gCAAgC;AAAA,EAC5C,MAAM,CAAC;AAAA,EACP,MAAM,CAAC;AAAA,EACP,QAAQ,CAAC;AAAA,EACT,eAAe,MAAM;AAAA,EAAC;AACvB;AAEO,MAAM,0BAAsB;AAAA,EAClC;AACD;AACA,oBAAoB,cAAc;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var get_block_css_selector_exports = {};
|
|
20
|
-
__export(get_block_css_selector_exports, {
|
|
21
|
-
getBlockCSSSelector: () => getBlockCSSSelector
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(get_block_css_selector_exports);
|
|
24
|
-
var import_utils = require("./utils");
|
|
25
|
-
var import_object = require("../../utils/object");
|
|
26
|
-
function getBlockCSSSelector(blockType, target = "root", options = {}) {
|
|
27
|
-
if (!target) {
|
|
28
|
-
return null;
|
|
29
|
-
}
|
|
30
|
-
const { fallback = false } = options;
|
|
31
|
-
const { name, selectors, supports } = blockType;
|
|
32
|
-
const hasSelectors = selectors && Object.keys(selectors).length > 0;
|
|
33
|
-
const path = Array.isArray(target) ? target.join(".") : target;
|
|
34
|
-
let rootSelector = null;
|
|
35
|
-
if (hasSelectors && selectors.root) {
|
|
36
|
-
rootSelector = selectors?.root;
|
|
37
|
-
} else if (supports?.__experimentalSelector) {
|
|
38
|
-
rootSelector = supports.__experimentalSelector;
|
|
39
|
-
} else {
|
|
40
|
-
rootSelector = ".wp-block-" + name.replace("core/", "").replace("/", "-");
|
|
41
|
-
}
|
|
42
|
-
if (path === "root") {
|
|
43
|
-
return rootSelector;
|
|
44
|
-
}
|
|
45
|
-
const pathArray = Array.isArray(target) ? target : target.split(".");
|
|
46
|
-
if (pathArray.length === 1) {
|
|
47
|
-
const fallbackSelector = fallback ? rootSelector : null;
|
|
48
|
-
if (hasSelectors) {
|
|
49
|
-
const featureSelector2 = (0, import_object.getValueFromObjectPath)(selectors, `${path}.root`, null) || (0, import_object.getValueFromObjectPath)(selectors, path, null);
|
|
50
|
-
return featureSelector2 || fallbackSelector;
|
|
51
|
-
}
|
|
52
|
-
const featureSelector = (0, import_object.getValueFromObjectPath)(
|
|
53
|
-
supports,
|
|
54
|
-
`${path}.__experimentalSelector`,
|
|
55
|
-
null
|
|
56
|
-
);
|
|
57
|
-
if (!featureSelector) {
|
|
58
|
-
return fallbackSelector;
|
|
59
|
-
}
|
|
60
|
-
return (0, import_utils.scopeSelector)(rootSelector, featureSelector);
|
|
61
|
-
}
|
|
62
|
-
let subfeatureSelector;
|
|
63
|
-
if (hasSelectors) {
|
|
64
|
-
subfeatureSelector = (0, import_object.getValueFromObjectPath)(selectors, path, null);
|
|
65
|
-
}
|
|
66
|
-
if (subfeatureSelector) {
|
|
67
|
-
return subfeatureSelector;
|
|
68
|
-
}
|
|
69
|
-
if (fallback) {
|
|
70
|
-
return getBlockCSSSelector(blockType, pathArray[0], options);
|
|
71
|
-
}
|
|
72
|
-
return null;
|
|
73
|
-
}
|
|
74
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
75
|
-
0 && (module.exports = {
|
|
76
|
-
getBlockCSSSelector
|
|
77
|
-
});
|
|
78
|
-
//# sourceMappingURL=get-block-css-selector.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/global-styles/get-block-css-selector.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport { scopeSelector } from './utils';\nimport { getValueFromObjectPath } from '../../utils/object';\n\n/**\n * Determine the CSS selector for the block type and target provided, returning\n * it if available.\n *\n * @param {import('@wordpress/blocks').Block} blockType The block's type.\n * @param {string|string[]} target The desired selector's target e.g. `root`, delimited string, or array path.\n * @param {Object} options Options object.\n * @param {boolean} options.fallback Whether or not to fallback to broader selector.\n *\n * @return {?string} The CSS selector or `null` if no selector available.\n */\nexport function getBlockCSSSelector(\n\tblockType,\n\ttarget = 'root',\n\toptions = {}\n) {\n\tif ( ! target ) {\n\t\treturn null;\n\t}\n\n\tconst { fallback = false } = options;\n\tconst { name, selectors, supports } = blockType;\n\n\tconst hasSelectors = selectors && Object.keys( selectors ).length > 0;\n\tconst path = Array.isArray( target ) ? target.join( '.' ) : target;\n\n\t// Root selector.\n\n\t// Calculated before returning as it can be used as a fallback for feature\n\t// selectors later on.\n\tlet rootSelector = null;\n\n\tif ( hasSelectors && selectors.root ) {\n\t\t// Use the selectors API if available.\n\t\trootSelector = selectors?.root;\n\t} else if ( supports?.__experimentalSelector ) {\n\t\t// Use the old experimental selector supports property if set.\n\t\trootSelector = supports.__experimentalSelector;\n\t} else {\n\t\t// If no root selector found, generate default block class selector.\n\t\trootSelector =\n\t\t\t'.wp-block-' + name.replace( 'core/', '' ).replace( '/', '-' );\n\t}\n\n\t// Return selector if it's the root target we are looking for.\n\tif ( path === 'root' ) {\n\t\treturn rootSelector;\n\t}\n\n\t// If target is not `root` or `duotone` we have a feature or subfeature\n\t// as the target. If the target is a string convert to an array.\n\tconst pathArray = Array.isArray( target ) ? target : target.split( '.' );\n\n\t// Feature selectors ( may fallback to root selector );\n\tif ( pathArray.length === 1 ) {\n\t\tconst fallbackSelector = fallback ? rootSelector : null;\n\n\t\t// Prefer the selectors API if available.\n\t\tif ( hasSelectors ) {\n\t\t\t// Get selector from either `feature.root` or shorthand path.\n\t\t\tconst featureSelector =\n\t\t\t\tgetValueFromObjectPath( selectors, `${ path }.root`, null ) ||\n\t\t\t\tgetValueFromObjectPath( selectors, path, null );\n\n\t\t\t// Return feature selector if found or any available fallback.\n\t\t\treturn featureSelector || fallbackSelector;\n\t\t}\n\n\t\t// Try getting old experimental supports selector value.\n\t\tconst featureSelector = getValueFromObjectPath(\n\t\t\tsupports,\n\t\t\t`${ path }.__experimentalSelector`,\n\t\t\tnull\n\t\t);\n\n\t\t// If nothing to work with, provide fallback selector if available.\n\t\tif ( ! featureSelector ) {\n\t\t\treturn fallbackSelector;\n\t\t}\n\n\t\t// Scope the feature selector by the block's root selector.\n\t\treturn scopeSelector( rootSelector, featureSelector );\n\t}\n\n\t// Subfeature selector.\n\t// This may fallback either to parent feature or root selector.\n\tlet subfeatureSelector;\n\n\t// Use selectors API if available.\n\tif ( hasSelectors ) {\n\t\tsubfeatureSelector = getValueFromObjectPath( selectors, path, null );\n\t}\n\n\t// Only return if we have a subfeature selector.\n\tif ( subfeatureSelector ) {\n\t\treturn subfeatureSelector;\n\t}\n\n\t// To this point we don't have a subfeature selector. If a fallback has been\n\t// requested, remove subfeature from target path and return results of a\n\t// call for the parent feature's selector.\n\tif ( fallback ) {\n\t\treturn getBlockCSSSelector( blockType, pathArray[ 0 ], options );\n\t}\n\n\t// We tried.\n\treturn null;\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA8B;AAC9B,oBAAuC;AAahC,SAAS,oBACf,WACA,SAAS,QACT,UAAU,CAAC,GACV;AACD,MAAK,CAAE,QAAS;AACf,WAAO;AAAA,EACR;AAEA,QAAM,EAAE,WAAW,MAAM,IAAI;AAC7B,QAAM,EAAE,MAAM,WAAW,SAAS,IAAI;AAEtC,QAAM,eAAe,aAAa,OAAO,KAAM,SAAU,EAAE,SAAS;AACpE,QAAM,OAAO,MAAM,QAAS,MAAO,IAAI,OAAO,KAAM,GAAI,IAAI;AAM5D,MAAI,eAAe;AAEnB,MAAK,gBAAgB,UAAU,MAAO;AAErC,mBAAe,WAAW;AAAA,EAC3B,WAAY,UAAU,wBAAyB;AAE9C,mBAAe,SAAS;AAAA,EACzB,OAAO;AAEN,mBACC,eAAe,KAAK,QAAS,SAAS,EAAG,EAAE,QAAS,KAAK,GAAI;AAAA,EAC/D;AAGA,MAAK,SAAS,QAAS;AACtB,WAAO;AAAA,EACR;AAIA,QAAM,YAAY,MAAM,QAAS,MAAO,IAAI,SAAS,OAAO,MAAO,GAAI;AAGvE,MAAK,UAAU,WAAW,GAAI;AAC7B,UAAM,mBAAmB,WAAW,eAAe;AAGnD,QAAK,cAAe;AAEnB,YAAMA,uBACL,sCAAwB,WAAW,GAAI,IAAK,SAAS,IAAK,SAC1D,sCAAwB,WAAW,MAAM,IAAK;AAG/C,aAAOA,oBAAmB;AAAA,IAC3B;AAGA,UAAM,sBAAkB;AAAA,MACvB;AAAA,MACA,GAAI,IAAK;AAAA,MACT;AAAA,IACD;AAGA,QAAK,CAAE,iBAAkB;AACxB,aAAO;AAAA,IACR;AAGA,eAAO,4BAAe,cAAc,eAAgB;AAAA,EACrD;AAIA,MAAI;AAGJ,MAAK,cAAe;AACnB,6BAAqB,sCAAwB,WAAW,MAAM,IAAK;AAAA,EACpE;AAGA,MAAK,oBAAqB;AACzB,WAAO;AAAA,EACR;AAKA,MAAK,UAAW;AACf,WAAO,oBAAqB,WAAW,UAAW,CAAE,GAAG,OAAQ;AAAA,EAChE;AAGA,SAAO;AACR;",
|
|
6
|
-
"names": ["featureSelector"]
|
|
7
|
-
}
|