How to partially unwrap a link in slate.js

57 Views Asked by At

Here is an example:

https://codesandbox.io/s/slate-2-images-and-links-forked-6v5hgy?file=/src/editor/link-button.tsx

I want to select the text "unlinkThis", click the unlink button, and unwraps the link partially. However, it just unwraps the entire link. Do I need to use Transform.wrapNodes again after Transforms.unwrapNodes?

Unlink button:

export const UnLinkButton = () => {
  const editor = useSlate();
  const isActive = isElementActive(editor);
  return (
    <button
      color={isActive ? "red" : undefined}
      onClick={async () => {
        if (isActive) {
          Transforms.unwrapNodes(editor, {
            split: true,
            match: (n) =>
              !Editor.isEditor(n) && Element.isElement(n) && n.type === "link"
          });
        }
      }}
    >
      unlink
    </button>
  );
};
0

There are 0 best solutions below