udecode/plate @udecode/plate-line-height@49.0.0

on GitHub

Major Changes

• #4327 by @zbeyens –

  • Package @udecode/plate-line-height has been deprecated.

  • LineHeightPlugin has been moved to the @platejs/basic-styles package.

  • Migration:

    • Remove @udecode/plate-line-height from your dependencies.
    • Add @platejs/basic-styles to your dependencies if not already present.
    • Import LineHeightPlugin from @platejs/basic-styles/react.

  • setLineHeight signature change:

  // Before
  setLineHeight(editor, { value: 1.5, setNodesOptions });
  
  // After
  setLineHeight(editor, 1.5, setNodesOptions);

  • Removed useLineHeightDropdownMenu and useLineHeightDropdownMenuState. Use it in your own codebase, for example:

  export function LineHeightToolbarButton() {
    const editor = useEditorRef();
    const { defaultNodeValue, validNodeValues: values = [] } =
      editor.getInjectProps(LineHeightPlugin);
  
    const value = useSelectionFragmentProp({
      defaultValue: defaultNodeValue,
      getProp: (node) => node.lineHeight,
    });
  
    const onValueChange = (newValue: string) => {
      editor.tf.lineHeight.setNodes(Number(newValue));
      editor.tf.focus();
    };
  
    // ...
  }

Minor Changes

• #4327 by @zbeyens –
  • New transform method to LineHeightPlugin:
    • editor.tf.lineHeight.setNodes - Transform method for setting line height values. Alias to setLineHeight