Skip to content

Commit 8fdac9e

Browse files
MaggieCabreraMaggieCabrera
committed
add text indent supports
1 parent 44b5cd5 commit 8fdac9e

File tree

11 files changed

+62
-0
lines changed

11 files changed

+62
-0
lines changed

‎docs/reference-guides/theme-json-reference/theme-json-living.md

+2
Original file line numberDiff line numberDiff line change
@@ -186,6 +186,7 @@ Settings related to typography.
186186
| lineHeight | boolean | false | |
187187
| textColumns | boolean | false | |
188188
| textDecoration | boolean | true | |
189+
| textIndent | boolean | true | |
189190
| writingMode | boolean | false | |
190191
| textTransform | boolean | true | |
191192
| dropCap | boolean | true | |
@@ -282,6 +283,7 @@ Typography styles.
282283
| lineHeight | string, object | |
283284
| textColumns | string | |
284285
| textDecoration | string, object | |
286+
| textIndent | string, object | |
285287
| writingMode | string, object | |
286288
| textTransform | string, object | |
287289

‎lib/block-supports/typography.php

+9
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ function gutenberg_register_typography_support( $block_type ) {
2828
$has_line_height_support = $typography_supports['lineHeight'] ?? false;
2929
$has_text_columns_support = $typography_supports['textColumns'] ?? false;
3030
$has_text_decoration_support = $typography_supports['__experimentalTextDecoration'] ?? false;
31+
$has_text_indent_support = $typography_supports['__experimentalTextIndent'] ?? false;
3132
$has_text_transform_support = $typography_supports['__experimentalTextTransform'] ?? false;
3233
$has_writing_mode_support = $typography_supports['__experimentalWritingMode'] ?? false;
3334

@@ -39,6 +40,7 @@ function gutenberg_register_typography_support( $block_type ) {
3940
|| $has_line_height_support
4041
|| $has_text_columns_support
4142
|| $has_text_decoration_support
43+
|| $has_text_indent_support
4244
|| $has_text_transform_support
4345
|| $has_writing_mode_support;
4446

@@ -97,6 +99,7 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
9799
$has_line_height_support = $typography_supports['lineHeight'] ?? false;
98100
$has_text_columns_support = $typography_supports['textColumns'] ?? false;
99101
$has_text_decoration_support = $typography_supports['__experimentalTextDecoration'] ?? false;
102+
$has_text_indent_support = $typography_supports['__experimentalTextIndent'] ?? false;
100103
$has_text_transform_support = $typography_supports['__experimentalTextTransform'] ?? false;
101104
$has_writing_mode_support = $typography_supports['__experimentalWritingMode'] ?? false;
102105

@@ -108,6 +111,7 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
108111
$should_skip_line_height = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'lineHeight' );
109112
$should_skip_text_columns = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textColumns' );
110113
$should_skip_text_decoration = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textDecoration' );
114+
$should_skip_text_indent = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textIndent' );
111115
$should_skip_text_transform = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textTransform' );
112116
$should_skip_letter_spacing = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'letterSpacing' );
113117
$should_skip_writing_mode = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'writingMode' );
@@ -152,6 +156,11 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
152156
gutenberg_typography_get_preset_inline_style_value( $block_attributes['style']['typography']['textDecoration'], 'text-decoration' );
153157
}
154158

159+
if ( $has_text_indent_support && ! $should_skip_text_indent && isset( $block_attributes['style']['typography']['textIndent'] ) ) {
160+
$typography_block_styles['textIndent'] =
161+
gutenberg_typography_get_preset_inline_style_value( $block_attributes['style']['typography']['textIndent'], 'text-indent' );
162+
}
163+
155164
if ( $has_text_transform_support && ! $should_skip_text_transform && isset( $block_attributes['style']['typography']['textTransform'] ) ) {
156165
$typography_block_styles['textTransform'] =
157166
gutenberg_typography_get_preset_inline_style_value( $block_attributes['style']['typography']['textTransform'], 'text-transform' );

‎lib/class-wp-theme-json-gutenberg.php

+3
Original file line numberDiff line numberDiff line change
@@ -264,6 +264,7 @@ class WP_Theme_JSON_Gutenberg {
264264
'--wp--style--root--padding-bottom' => array( 'spacing', 'padding', 'bottom' ),
265265
'--wp--style--root--padding-left' => array( 'spacing', 'padding', 'left' ),
266266
'text-decoration' => array( 'typography', 'textDecoration' ),
267+
'text-indent' => array( 'typography', 'textIndent' ),
267268
'text-transform' => array( 'typography', 'textTransform' ),
268269
'filter' => array( 'filter', 'duotone' ),
269270
'box-shadow' => array( 'shadow' ),
@@ -425,6 +426,7 @@ class WP_Theme_JSON_Gutenberg {
425426
'lineHeight' => null,
426427
'textColumns' => null,
427428
'textDecoration' => null,
429+
'textIndent' => null,
428430
'textTransform' => null,
429431
'writingMode' => null,
430432
),
@@ -520,6 +522,7 @@ class WP_Theme_JSON_Gutenberg {
520522
'lineHeight' => null,
521523
'textColumns' => null,
522524
'textDecoration' => null,
525+
'textIndent' => null,
523526
'textTransform' => null,
524527
'writingMode' => null,
525528
),

‎lib/theme.json

+1
Original file line numberDiff line numberDiff line change
@@ -265,6 +265,7 @@
265265
"lineHeight": false,
266266
"textColumns": false,
267267
"textDecoration": true,
268+
"textIndent": true,
268269
"textTransform": true,
269270
"writingMode": false
270271
},

‎packages/block-editor/src/hooks/supports.js

+6
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,11 @@ const WRITING_MODE_SUPPORT_KEY = 'typography.__experimentalWritingMode';
4040
* transforms e.g. settings found in `block.json`.
4141
*/
4242
const TEXT_TRANSFORM_SUPPORT_KEY = 'typography.__experimentalTextTransform';
43+
/**
44+
* Key within block settings' supports array indicating support for text
45+
* indent e.g. settings found in `block.json`.
46+
*/
47+
const TEXT_INDENT_SUPPORT_KEY = 'typography.__experimentalTextIndent';
4348

4449
/**
4550
* Key within block settings' supports array indicating support for letter-spacing
@@ -55,6 +60,7 @@ const TYPOGRAPHY_SUPPORT_KEYS = [
5560
FONT_FAMILY_SUPPORT_KEY,
5661
TEXT_COLUMNS_SUPPORT_KEY,
5762
TEXT_DECORATION_SUPPORT_KEY,
63+
TEXT_INDENT_SUPPORT_KEY,
5864
TEXT_TRANSFORM_SUPPORT_KEY,
5965
WRITING_MODE_SUPPORT_KEY,
6066
LETTER_SPACING_SUPPORT_KEY,

‎packages/block-editor/src/hooks/typography.js

+2
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ function omit( object, keys ) {
2828

2929
const LETTER_SPACING_SUPPORT_KEY = 'typography.__experimentalLetterSpacing';
3030
const TEXT_TRANSFORM_SUPPORT_KEY = 'typography.__experimentalTextTransform';
31+
const TEXT_INDENT_SUPPORT_KEY = 'typography.__experimentalTextIndent';
3132
const TEXT_DECORATION_SUPPORT_KEY = 'typography.__experimentalTextDecoration';
3233
const TEXT_COLUMNS_SUPPORT_KEY = 'typography.textColumns';
3334
const FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle';
@@ -42,6 +43,7 @@ export const TYPOGRAPHY_SUPPORT_KEYS = [
4243
FONT_FAMILY_SUPPORT_KEY,
4344
TEXT_COLUMNS_SUPPORT_KEY,
4445
TEXT_DECORATION_SUPPORT_KEY,
46+
TEXT_INDENT_SUPPORT_KEY,
4547
WRITING_MODE_SUPPORT_KEY,
4648
TEXT_TRANSFORM_SUPPORT_KEY,
4749
LETTER_SPACING_SUPPORT_KEY,

‎packages/block-editor/src/hooks/utils.js

+4
Original file line numberDiff line numberDiff line change
@@ -188,6 +188,7 @@ export function useBlockSettings( name, parentLayout ) {
188188
lineHeight,
189189
textColumns,
190190
textDecoration,
191+
textIndent,
191192
writingMode,
192193
textTransform,
193194
letterSpacing,
@@ -239,6 +240,7 @@ export function useBlockSettings( name, parentLayout ) {
239240
'typography.lineHeight',
240241
'typography.textColumns',
241242
'typography.textDecoration',
243+
'typography.textIndent',
242244
'typography.writingMode',
243245
'typography.textTransform',
244246
'typography.letterSpacing',
@@ -328,6 +330,7 @@ export function useBlockSettings( name, parentLayout ) {
328330
lineHeight,
329331
textColumns,
330332
textDecoration,
333+
textIndent,
331334
textTransform,
332335
letterSpacing,
333336
writingMode,
@@ -370,6 +373,7 @@ export function useBlockSettings( name, parentLayout ) {
370373
lineHeight,
371374
textColumns,
372375
textDecoration,
376+
textIndent,
373377
textTransform,
374378
letterSpacing,
375379
writingMode,

‎packages/block-library/src/paragraph/block.json

+1
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@
5858
"__experimentalFontWeight": true,
5959
"__experimentalLetterSpacing": true,
6060
"__experimentalTextTransform": true,
61+
"__experimentalTextIndent": true,
6162
"__experimentalWritingMode": true,
6263
"__experimentalDefaultControls": {
6364
"fontSize": true

‎packages/blocks/src/api/constants.js

+5
Original file line numberDiff line numberDiff line change
@@ -233,6 +233,11 @@ export const __EXPERIMENTAL_STYLE_PROPERTY = {
233233
support: [ 'typography', '__experimentalTextDecoration' ],
234234
useEngine: true,
235235
},
236+
textIndent: {
237+
value: [ 'typography', 'textIndent' ],
238+
support: [ 'typography', '__experimentalTextIndent' ],
239+
useEngine: true,
240+
},
236241
textTransform: {
237242
value: [ 'typography', 'textTransform' ],
238243
support: [ 'typography', '__experimentalTextTransform' ],

‎packages/style-engine/src/styles/typography/index.ts

+13
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,18 @@ const textDecoration = {
100100
},
101101
};
102102

103+
const textIndent = {
104+
name: 'textIndent',
105+
generate: ( style: Style, options: StyleOptions ) => {
106+
return generateRule(
107+
style,
108+
options,
109+
[ 'typography', 'textIndent' ],
110+
'textIndent'
111+
);
112+
},
113+
};
114+
103115
const textTransform = {
104116
name: 'textTransform',
105117
generate: ( style: Style, options: StyleOptions ) => {
@@ -133,6 +145,7 @@ export default [
133145
lineHeight,
134146
textColumns,
135147
textDecoration,
148+
textIndent,
136149
textTransform,
137150
writingMode,
138151
];

‎schemas/json/theme.json

+16
Original file line numberDiff line numberDiff line change
@@ -556,6 +556,11 @@
556556
"type": "boolean",
557557
"default": true
558558
},
559+
"textIndent": {
560+
"description": "Allow users to set custom text indent.",
561+
"type": "boolean",
562+
"default": true
563+
},
559564
"writingMode": {
560565
"description": "Allow users to set the writing mode.",
561566
"type": "boolean",
@@ -1707,6 +1712,17 @@
17071712
}
17081713
]
17091714
},
1715+
"textIndent": {
1716+
"description": "Sets the `text-indent` CSS property.",
1717+
"oneOf": [
1718+
{
1719+
"type": "string"
1720+
},
1721+
{
1722+
"$ref": "#/definitions/refComplete"
1723+
}
1724+
]
1725+
},
17101726
"writingMode": {
17111727
"description": "Sets the `writing-mode` CSS property.",
17121728
"oneOf": [

0 commit comments

Comments
 (0)