Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Numbered list is not displayed correctly #3857

Open
Sasha95 opened this issue Dec 12, 2024 · 2 comments
Open

Numbered list is not displayed correctly #3857

Sasha95 opened this issue Dec 12, 2024 · 2 comments
Labels
bug Something isn't working

Comments

@Sasha95
Copy link

Sasha95 commented Dec 12, 2024

Description

In the template that on the site if you insert the following markdown text, then all nested elements are numbered 1

Reproduction URL

No response

Reproduction steps

### Featured Shows

1. **Macao into the Future**
   - Examines specific aspects of Macao's development, including:
     - Politics
     - Economy
     - Society
     - Culture
     - Tourism
   - Discusses Macao's integration into the Guangdong-Hong Kong-Macao Greater Bay Area.

Plate version

40.0.0

Slate React version

0.111.0

plate-list, plate-indent-list

"@udecode/plate-indent-list": "^40.0.0",
"@udecode/plate-list": "^40.0.0",

Screenshots

iScreen Shoter - Google Chrome - 241213001859
image

Logs

No response

Browsers

Chrome, Firefox, Safari

@Sasha95 Sasha95 added the bug Something isn't working label Dec 12, 2024
@axinvd
Copy link

axinvd commented Dec 13, 2024

I'm experiencing the same issue. Any solutions yet, please?

@Sasha95
Copy link
Author

Sasha95 commented Dec 13, 2024

I came up with this solution to get around this problem, how can I use this function directly in indentListPlugins?

ex:
image

const indentListStart = (nodes?: Value) => {
  if (!nodes) return nodes;

  const indentCounters: { [key: number]: number } = {};

  nodes.forEach((node, index) => {
    const indent = (node.indent || 0) as number;
    if (node.listStyleType === ListStyleType.Decimal) {
      if (index > 0 && (nodes[index - 1] as TElement & { indent: number }).indent < indent) {
        indentCounters[indent] = 1;
      } else if (!indentCounters[indent]) {
        indentCounters[indent] = 1;
      }
      node.listStart = indentCounters[indent]++;
    } else {
      node.listStart = indent;
    }
  });

  return nodes;
};

export const useCreateEditor = ({ defaultData = defaultDraftValue }: Props) => {
  return usePlateEditor({
    override: {
      components: withPlaceholders(editorComponents),
    },
    plugins: [...editorPlugins, FixedToolbarPlugin, FloatingToolbarPlugin],
    value: indentListStart(defaultData),
  });
};

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants