Skip to content

Releases: microsoft/roosterjs

RoosterJs 8.42.0 and RoosterJs Content Model 0.1.0

10 Feb 17:18
fcd1061
Compare
Choose a tag to compare

Announce RoosterJs Content Model (Preview)

Content Model is a new way to represent content in HTML editor, to help better doing format, and more. It convert HTML content into a JSON object then all other format API will operate on this JSON object then convert it back to HTML.

This is the first preview version of Content Model. Now you can get it from npm with package name and version "[email protected]". Please check out this example of how to use roosterjs Content Model: https://codepen.io/jiuqingsong/pen/rNrXVyB

Note: RoosterJs Content Model is still under development, the public interfaces is still not very stable yet so please expect frequently breaking changes in the future.

New features added to Content Model

  • New image edit ability
    • Image Border
    • Image Shadow
    • Change Image
  • Paragraph line space settings and API

Bug fix

  • Fix list trigger before a paragraph (#1540)
  • Dismiss image edit border when focus out of editor (#1558)
  • Add filter to client rects (#1560)
  • Check if there is rotate handle, before update the rotate handles (#1568)
  • Disable list indentation hotkey on mac (#1552)
  • Fix a pending format issue in firefox (#1572)

Interface change

  • New members of interface StyleBasedFormatState
    • lineHeight: Line height of the element
    • marginTop: Top margin of the element
    • marginBottom: Bottom margin of the element

RoosterJs 8.41.0

27 Jan 18:54
878aab5
Compare
Choose a tag to compare

New features

  • Variable based dark color (Experimentail feature: VariableBasedDarkColor) (#1531)
    Implement dark mode using variable-based CSS color. To use this feature, enable experimental feature VariableBasedDarkColor and check all your function calls to setColor() and applyFormat() of roosterjs then add parameter darkColorHandler to them.
  • Support isCodeBlock in FormatState (#1533)
  • Support canMergeTableCell in FormatState (#1526)

Improvement

  • Do image editing on top of shadow DOM (#1520)

Bug fix

  • remove new max-width for new inline image (#1527)

Engineering improvement

  • Load fluent ui from cdnjs for demo site (#1525)

Interface change

  • New Experimental feature
    • VariableBasedDarkColor: Use variable-based dark mode solution rather than dataset-based solution. When enable this feature, need to pass in a DarkModelHandler object to each call of setColor and applyFormat if you need them work for dark mode
  • New parameter of API applyFormat, setColor
    • darkColorHandler: A color handler for dark mode for new variable-based dark mode solution
  • New interface DarkColorHandler
    • registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string;
      Given a light mode color value and an optional dark mode color value, register this color so that editor can handle it, then return the CSS color value for current color mode.
    • reset(): void;
      Reset known color record, clean up registered color variables.
    • parseColorValue(color: string | null | undefined): ColorKeyAndValue;
      Parse an existing color value, if it is in variable-based color format, extract color key, light color and query related dark color if any.
  • New member of interface EditorCore
    • darkColorHandler: Dark model handler for the editor, used for variable-based solution. If keep it null, editor will still use original dataset-based dark mode solution.
  • New method or IEditor and Editor
    • getDarkColorHandler: Get a dark color handler for variable-based dark mode solution. Need to enable experimental feature VariableBasedDarkColor
  • New member of interface ElementBasedFormatState
    • isCodeBlock: Whether the text is in Code block
    • canMergeTableCell: Whether we can execute table cell merge operation

RoosterJs 8.40.2

22 Jan 07:58
962fb77
Compare
Choose a tag to compare

Bug fix

  • Fix Cut/Copy page scroll issue (#1496)
  • Fix image plugin z-index calc (#1500)
  • Remove image edit wrapper when content change (#1508)
  • Fix for image selection not dismiss issue when TableSelection related plugin is not added to editor (#1510)
  • Fix #1509: Make insert table pane better shown when there is global CSS for box-sizing (#1511)

RoosterJs 8.40.0

10 Jan 17:26
a279b70
Compare
Choose a tag to compare

New features

  • Support Alt+Shift+Left/Right to outdent/indent list (#1444)

Improvement

  • Image edit improvement:
    • Calculate zIndex for image editing (#1462)
    • Keep image wrapper under scroll container (#1466)
    • Remove id from cloned image (#1480)
  • Remove link to local file when paste (#1463)

Bug fix

  • Improve the format-on-span behavior and fix a bug in TypeInContainerPlugin (#1455, #1469, #1471, #1474, #1482)
  • Fix a bug in splitBalancedNodeRange (#1470)
  • Fix a bug when paste header from Word (#1473)

Experimental features

  • Graduate PendingStyleBasedFormat (#1381)
  • Graduate NormalizeList (#1381)
  • Graduate ConvertSingleImageBody

Engineering improvement

  • Fix heap overflow issue when build (#1488)

Interface changes

  • New parameter of function getSelectedBlockElementsInRegion
    • shouldApplyFormatToSpan
  • New member of enum KnownCreateElementDataIndex
    • EmptyLineFormatInSpan
  • New parameter of constructor of Paste plugin
    • convertSingleImageBody

RoosterJs 8.39.1

02 Dec 23:34
20e3a02
Compare
Choose a tag to compare

Improvement

  • Improve handling of quotes inside lists (#1438)
  • Show image edit pane with correct zIndex (#1437)
  • Allow styled table header cells to be clear formatted (#1447)

Bug fix

  • Fix issue when cell resizing with merged cells (#1445)
  • Fix Unhandled Rejection: Error: Editor is already disposed (#1449)
  • Fix markdown text replacement (#1432)
  • Add check for last typed character (#1452)

RoosterJs 8.38.0

29 Nov 17:44
b36201b
Compare
Choose a tag to compare

Bug fix

  • Restore Ctrl+Click behavior on Firefox (#1406)
  • Fix cursor jump bug for auto list format (#1426)
  • Fix dark mode list color lost issue (#1428)
  • Fix numbered list triggering issue (#1425)

Improvement

  • Improve shadow edit behavior where there is entity in editor (#1408)
  • Support customizing default behavior of image edit when image is selected (#1405)
  • Improve clear format behavior (#1415)
  • Support add hyperlink on image (#1427)
  • When paste a table into a table, paste cell style as well (#1431)

Engineering improvement

  • Add test case to HyperLink plugin (#1329)

Interface change

  • New parameter of utility setListItemStyle
    • isCssStyle: True means the given styles are CSS style names, false means they are HTML attributes
  • New entity related API
    • createEntityPlaceholder: Create a placeholder comment node for entity
    • moveContentWithEntityPlaceholders: Move content from a container into a new Document fragment, and try keep entities to be reusable by creating placeholder
    • restoreContentWithEntityPlaceholder: Restore HTML content from a document fragment that may contain entity placeholders
  • New property for interface LifecyclePluginState
    • shadowEditEntities: Cached entity pairs for original content
  • New property for interface ImageEditOptions
    • onSelectState: Which operations will be executed when image is selected

RoosterJs 8.36.0

12 Nov 05:57
6e9d1c2
Compare
Choose a tag to compare

Improvement

  • Remove empty div Between list when backspacing. (#1365)
  • Allow applying default format on SPAN instead of DIV (Experimental feature: DefaultFormatInSpan) (#1380, #1399)
  • Image selection and editing: Edit image on top of editor DIV to avoid impacting editing DOM structure (#1377, #1383)
  • Move Image Selection plugin into EditorCore

Bug fix

  • Fix a code bug in list metadata hanlding (#1379)
  • Fix changing font size doesn't work for empty selections on Safari (#1384)

Graduate features

  • TableAlignment: Align table elements to left, center and right using setAlignment API
  • AdaptiveHandlesResizer: Provide a circular resize handles that adaptive the number od handles to the size of the image
  • ImageSelection: When a html image is selected, the selected image data will be stored by editor core.

Engineering improvement

  • Change the order of karma plugins to generate more accurate code discover report (#1371)

Interface changes

  • New style API
    • setGlobalCssStyles: Add global css styles
    • removeGlobalCssStyle: Remove a css rule style from a style sheet
  • New parameter of color API getDarkColor
    • baseLValue: The Light value for base dark color in LAB format. Default value is the Light value for #333333
  • New experimental feature
    • DefaultFormatInSpan: When apply default format when initialize or user type, apply the format on a SPAN element rather than the block element (In most case, the DIV element) so keep the block element clean
  • New core plugin
    • imageSelection: Image selection Plugin detects image selection and help highlight the image
  • New parameter of core API EnsureTypeInContainer
    • applyFormatToSpan: When set to true, default format (if any) will be applied to a SPAN element inside the block element instead of the block element itself.
  • New Content Edit Feature
    • mergeListOnBackspaceAfterList: MergeListOnBackspaceAfterList edit feature, provides the ability to merge list on backspace on block after a list

RoosterJs 8.35.1

31 Oct 19:43
587670f
Compare
Choose a tag to compare

Bug fix

  • List trigger fix (#1328)
  • Fix list style for arrow and square marker (#1342)
  • Fix null range issue in entityFeatures (#1344)
  • Fix copy/paste issue for markdown plugin (#1326)
  • Fix set list chain after set numbering list (#1352)
  • Fix issue of resizing a cropped image (#1354)
  • Stop propagation for HOME and other keys (#1366)
  • Fix code error in typed key check (#1372)
  • Auto detect clear mode when clear format in roosterjs-react Ribbon (#1363)

Improvement

  • Handle CSS variable when sanitize (#1339)
  • Import talbe selection and image selection (#1347, #1357, #1355)
  • Officially support image selection (#1345)
  • Remove empty div Between list when backspacing (#1365)

Engineering improvement

  • Improve building speed (#1338)
  • Update README.md (#1341)
  • Enable strict mode for roosterjs-color-utils (#1319)
  • Add test cases for PickerPlugin (#1361)
  • Change the order of karma plugins to better show test coverage (#1371)

Interface change

  • New override of IEditor.select(), now it supports select using a SelectionRangeEx object directly
  • New parameter of getDarkColor()
    • baseLValue: The light value for base dark color in LAB format. Default is the light value for #333333
  • New interface ImageContentMetadata to support storing image selection in undo snapshot
  • New content edit feature
    • mergeListOnBackspaceAfterList: merge list when press BackSpace between lists in a block

RoosterJs 8.34.0

18 Oct 16:25
e71c96b
Compare
Choose a tag to compare

Bug fix

  • Image selection: Trigger selection event when click

Improvement

  • Allow insert entity on region root (#1316)

Engineering improvement

  • Finish strict mode change for core package (#1318)
  • Enable strict mode on "roosterjs-editor-plugins" - Phase 1 (#1289)

Interface change

  • New exported API
    • isNodeAfter: Checks if node1 is after node2
  • New parameter of API insertEntity
    • insertToRegionRoot: When pass true, insert the entity at the root level of current region. Parent nodes will be split if need
  • New field of interface InsertOptionBase
    • insertToRegionRoot: Boolean flag for inserting the content onto root node of current region. If current position is not at root of region, break parent node until insert can happen at root of region. This option only takes effect when insertOnNewLine is true, otherwise it will be ignored.

RoosterJs 8.33.1

05 Oct 20:23
fd08bb5
Compare
Choose a tag to compare

Bug fix

  • Fix #1310 Context Menu in roosterjs-react is not working (#1309)