diff --git a/packages/block-library/src/list/deprecated.js b/packages/block-library/src/list/deprecated.js index cfd7e3039cee87..cecc17430f65e5 100644 --- a/packages/block-library/src/list/deprecated.js +++ b/packages/block-library/src/list/deprecated.js @@ -1,13 +1,13 @@ /** * WordPress dependencies */ -import { RichText, useBlockProps } from '@wordpress/block-editor'; +import { RichText, InnerBlocks, useBlockProps } from '@wordpress/block-editor'; /** * Internal dependencies */ import migrateFontFamily from '../utils/migrate-font-family'; -import { migrateToListV2 } from './utils'; +import { migrateToListV2, migrateTypeToInlineStyle } from './utils'; const v0 = { attributes: { @@ -138,6 +138,87 @@ const v1 = { migrate: migrateToListV2, }; +// In #53301 changed to use the inline style instead of type attribute. +const v2 = { + attributes: { + ordered: { + type: 'boolean', + default: false, + __experimentalRole: 'content', + }, + values: { + type: 'string', + source: 'html', + selector: 'ol,ul', + multiline: 'li', + __unstableMultilineWrapperTags: [ 'ol', 'ul' ], + default: '', + __experimentalRole: 'content', + }, + type: { + type: 'string', + }, + start: { + type: 'number', + }, + reversed: { + type: 'boolean', + }, + placeholder: { + type: 'string', + }, + }, + supports: { + anchor: true, + className: false, + typography: { + fontSize: true, + lineHeight: true, + __experimentalFontFamily: true, + __experimentalFontWeight: true, + __experimentalFontStyle: true, + __experimentalTextTransform: true, + __experimentalTextDecoration: true, + __experimentalLetterSpacing: true, + __experimentalDefaultControls: { + fontSize: true, + }, + }, + color: { + gradients: true, + link: true, + __experimentalDefaultControls: { + background: true, + text: true, + }, + }, + spacing: { + margin: true, + padding: true, + __experimentalDefaultControls: { + margin: false, + padding: false, + }, + }, + __unstablePasteTextInline: true, + __experimentalSelector: 'ol,ul', + __experimentalSlashInserter: true, + }, + isEligible( { type } ) { + return !! type; + }, + save( { attributes } ) { + const { ordered, type, reversed, start } = attributes; + const TagName = ordered ? 'ol' : 'ul'; + return ( + + + + ); + }, + migrate: migrateTypeToInlineStyle, +}; + /** * New deprecations need to be placed first * for them to have higher priority. @@ -146,4 +227,4 @@ const v1 = { * * See block-deprecation.md */ -export default [ v1, v0 ]; +export default [ v2, v1, v0 ]; diff --git a/packages/block-library/src/list/edit.js b/packages/block-library/src/list/edit.js index 10083d7bbf3a4d..569e4182b3ea55 100644 --- a/packages/block-library/src/list/edit.js +++ b/packages/block-library/src/list/edit.js @@ -124,9 +124,14 @@ function IndentUI( { clientId } ) { } export default function Edit( { attributes, setAttributes, clientId, style } ) { + const { ordered, type, reversed, start } = attributes; const blockProps = useBlockProps( { - ...( Platform.isNative && { style } ), + style: { + ...( Platform.isNative && style ), + listStyleType: ordered && type !== 'decimal' ? type : undefined, + }, } ); + const innerBlocksProps = useInnerBlocksProps( blockProps, { allowedBlocks: [ 'core/list-item' ], template: TEMPLATE, @@ -140,7 +145,6 @@ export default function Edit( { attributes, setAttributes, clientId, style } ) { __experimentalCaptureToolbars: true, } ); useMigrateOnLoad( attributes, clientId ); - const { ordered, type, reversed, start } = attributes; const controls = ( @@ -172,7 +176,6 @@ export default function Edit( { attributes, setAttributes, clientId, style } ) { ordered={ ordered } reversed={ reversed } start={ start } - type={ type } { ...innerBlocksProps } /> { controls } diff --git a/packages/block-library/src/list/ordered-list-settings.js b/packages/block-library/src/list/ordered-list-settings.js index 60e7e33d0ad51f..5d5d9936c73a0a 100644 --- a/packages/block-library/src/list/ordered-list-settings.js +++ b/packages/block-library/src/list/ordered-list-settings.js @@ -33,11 +33,26 @@ const OrderedListSettings = ( { setAttributes, reversed, start, type } ) => ( __nextHasNoMarginBottom label={ __( 'Numbering style' ) } options={ [ - { value: '1', label: __( 'Numbers' ) }, - { value: 'A', label: __( 'Uppercase letters' ) }, - { value: 'a', label: __( 'Lowercase letters' ) }, - { value: 'I', label: __( 'Uppercase Roman numerals' ) }, - { value: 'i', label: __( 'Lowercase Roman numerals' ) }, + { + label: __( 'Numbers' ), + value: 'decimal', + }, + { + label: __( 'Uppercase letters' ), + value: 'upper-alpha', + }, + { + label: __( 'Lowercase letters' ), + value: 'lower-alpha', + }, + { + label: __( 'Uppercase Roman numerals' ), + value: 'upper-roman', + }, + { + label: __( 'Lowercase Roman numerals' ), + value: 'lower-roman', + }, ] } value={ type } onChange={ ( newValue ) => setAttributes( { type: newValue } ) } diff --git a/packages/block-library/src/list/save.js b/packages/block-library/src/list/save.js index c74893f38b67b2..d090f0faf4e883 100644 --- a/packages/block-library/src/list/save.js +++ b/packages/block-library/src/list/save.js @@ -7,7 +7,16 @@ export default function save( { attributes } ) { const { ordered, type, reversed, start } = attributes; const TagName = ordered ? 'ol' : 'ul'; return ( - + ); diff --git a/packages/block-library/src/list/utils.js b/packages/block-library/src/list/utils.js index 4fa2a0e0aed949..60f3354cea426f 100644 --- a/packages/block-library/src/list/utils.js +++ b/packages/block-library/src/list/utils.js @@ -3,7 +3,15 @@ */ import { createBlock, rawHandler } from '@wordpress/blocks'; +const LIST_STYLES = { + A: 'upper-alpha', + a: 'lower-alpha', + I: 'upper-roman', + i: 'lower-roman', +}; + export function createListBlockFromDOMElement( listElement ) { + const type = listElement.getAttribute( 'type' ); const listAttributes = { ordered: 'OL' === listElement.tagName, anchor: listElement.id === '' ? undefined : listElement.id, @@ -11,7 +19,7 @@ export function createListBlockFromDOMElement( listElement ) { ? parseInt( listElement.getAttribute( 'start' ), 10 ) : undefined, reversed: listElement.hasAttribute( 'reversed' ) ? true : undefined, - type: listElement.getAttribute( 'type' ) ?? undefined, + type: type && LIST_STYLES[ type ] ? LIST_STYLES[ type ] : undefined, }; const innerBlocks = Array.from( listElement.children ).map( @@ -78,3 +86,16 @@ export function migrateToListV2( attributes ) { listBlock.innerBlocks, ]; } + +export function migrateTypeToInlineStyle( attributes ) { + const { type } = attributes; + + if ( type && LIST_STYLES[ type ] ) { + return { + ...attributes, + type: LIST_STYLES[ type ], + }; + } + + return attributes; +} diff --git a/test/integration/__snapshots__/blocks-raw-handling.test.js.snap b/test/integration/__snapshots__/blocks-raw-handling.test.js.snap index 7ae0dc9b886893..178a57b8755535 100644 --- a/test/integration/__snapshots__/blocks-raw-handling.test.js.snap +++ b/test/integration/__snapshots__/blocks-raw-handling.test.js.snap @@ -14,10 +14,10 @@ exports[`Blocks raw handling pasteHandler google-docs-table 1`] = `"


exports[`Blocks raw handling pasteHandler google-docs-table-with-colspan 1`] = `"

Test colspan

"`; -exports[`Blocks raw handling pasteHandler google-docs-table-with-rowspan 1`] = `"

Test rowspan

"`; - exports[`Blocks raw handling pasteHandler google-docs-table-with-comments 1`] = `"



One
Two
Three
1
2
3
I
II
III"`; +exports[`Blocks raw handling pasteHandler google-docs-table-with-rowspan 1`] = `"

Test rowspan

"`; + exports[`Blocks raw handling pasteHandler google-docs-with-comments 1`] = `"This is a title

This is a heading

Formatting test: bold, italic, link, strikethrough, superscript, subscript, nested.

A
Bulleted
Indented
List

One
Two
Three




One
Two
Three
1
2
3
I
II
III





An image:



"`; exports[`Blocks raw handling pasteHandler gutenberg 1`] = `"Test"`; @@ -174,10 +174,10 @@ exports[`rawHandler should convert a caption shortcode with link 1`] = ` `; exports[`rawHandler should convert a list with attributes 1`] = ` -" -
    -
  1. 1 -
      +" +
        +
      1. 1 +
        1. 1
        2. diff --git a/test/integration/fixtures/blocks/core__list__ol-with-type.html b/test/integration/fixtures/blocks/core__list__deprecated-v2.html similarity index 100% rename from test/integration/fixtures/blocks/core__list__ol-with-type.html rename to test/integration/fixtures/blocks/core__list__deprecated-v2.html diff --git a/test/integration/fixtures/blocks/core__list__ol-with-type.json b/test/integration/fixtures/blocks/core__list__deprecated-v2.json similarity index 91% rename from test/integration/fixtures/blocks/core__list__ol-with-type.json rename to test/integration/fixtures/blocks/core__list__deprecated-v2.json index a15b1546b0ed4c..be078f2f8208e4 100644 --- a/test/integration/fixtures/blocks/core__list__ol-with-type.json +++ b/test/integration/fixtures/blocks/core__list__deprecated-v2.json @@ -5,7 +5,7 @@ "attributes": { "ordered": true, "values": "", - "type": "A" + "type": "upper-alpha" }, "innerBlocks": [ { diff --git a/test/integration/fixtures/blocks/core__list__ol-with-type.parsed.json b/test/integration/fixtures/blocks/core__list__deprecated-v2.parsed.json similarity index 100% rename from test/integration/fixtures/blocks/core__list__ol-with-type.parsed.json rename to test/integration/fixtures/blocks/core__list__deprecated-v2.parsed.json diff --git a/test/integration/fixtures/blocks/core__list__deprecated-v2.serialized.html b/test/integration/fixtures/blocks/core__list__deprecated-v2.serialized.html new file mode 100644 index 00000000000000..44c97ca29209cf --- /dev/null +++ b/test/integration/fixtures/blocks/core__list__deprecated-v2.serialized.html @@ -0,0 +1,5 @@ + +
          +
        1. Item 1
          2. +
        + diff --git a/test/integration/fixtures/blocks/core__list__ol-with-type.serialized.html b/test/integration/fixtures/blocks/core__list__ol-with-type.serialized.html deleted file mode 100644 index a785d55d92bcee..00000000000000 --- a/test/integration/fixtures/blocks/core__list__ol-with-type.serialized.html +++ /dev/null @@ -1,5 +0,0 @@ - -
          -
        1. Item 1
          2. -
        - diff --git a/test/integration/fixtures/documents/ms-word-out.html b/test/integration/fixtures/documents/ms-word-out.html index 0b1a3e00fe84de..98992494032b3e 100644 --- a/test/integration/fixtures/documents/ms-word-out.html +++ b/test/integration/fixtures/documents/ms-word-out.html @@ -36,8 +36,8 @@

        This is a heading level 2

        - -
          + +
          1. One