Do not copy div ID on Enter

[juliaroldi]

The id of DIV must be unique, then when dividing a paragraph do not copy the id of the div to the new DIV created. This changes also introduce a new component InsertCustomContainerPane with a new api 'InsertCustomContainer' that inserts a format container with an id to make it an identifiable block on Content Model. To test this change:

1. Enable the option HandleEnter in EditPlugin

2. Open Api Playground, select "InsertCustomContainer" api
3. Add the html content below to the text area of the pane, an Id in the field of content id and click "Insert Custom Container"

<div id="SIGNATURE">
      SIGNATURE
  </div>

5. After the content is inserted, press enter in the middle of the word.
6. The new DIV created should not have the id SIGNATURE.
   

[JiuqingSong]

Please add more comment to explain how to use this parameter, especially for the callback

[JiuqingSong]

we have passed in editor as parameter, so you can use it and no need to check null for this.editor

[JiuqingSong]

I prefer we keep this parameter here and still check it if the one in EditorOptions is not passed. Because it can be used by some team today, so if we remove the check here, it will break their feature

[JiuqingSong]

We can save a checker function in the class, initialize it in ctor, so no need to check it everytime when Enter is pressed. for example:

class EditPlugin {
..
  private handleNormalEnter: (event: PluginEvent) => boolean;
  
  constructor (..) {
    ...
    switch (typeof options.shouldHandleEnterKey) {
      case 'function': 
        this.handleNormalEnter = options.shouldHandleEnterKey;
        break;

     case 'undefined':
         this.shouldHandleEnterKey = this.createNormalEnterChecker(this.editor.isExperimentalFeatureEnabled('handleEnterKey'));
         break;

     default:
          this.createNormalEnterChecker(!!options.shouldHandlerEnterKey);
          break;
   }

   private createNormalEnterChecker(result: boolean) {
        return result ? () => true : () => false;
   }

When handle enter key, just call this.handleNormalEnter(event), no additional checking needed.

[JiuqingSong]

And add comment in the experimental feature and the new option to explain the priority

[juliaroldi]

I did a bit different than what you proposed, I added back the experimental feature check, so it do not break the code of the user that has the experimental features enabled.

[JiuqingSong]

1. How about move this into function splitParagraph? I can't think about any scenario that we split paragraph and want the ID to be duplicated
2. Instead of explicitly delete ID here, suggest we just whitelist all format that we want to copy, then remove everything else.

[JiuqingSong]

So you didn't pass a new format object here, which means the new paragraph will not have any format?

We should create a list of formats that we want to copy, then remove everything else.

[juliaroldi]

Which format we need to pass? Maybe we should pass the ones we need to override?

[JiuqingSong]

Here are the format I think we need to inherit:

• backgroundColor
• direction
• textAlign
• htmlAlign
• lineHeight
• textIndent
• margin* (under MarginFormat)
• padding* (under PaddingFormat)

And here are the ones that I'd like to remove

• whiteSpace
• isTextIndentApplied
• id
• border* (under BorderFormat)