Skip to content

Commit a19dee0

Browse files
juliaroldijuliaroldi
authored
Merge pull request #2698 from microsoft/u/juliaroldi/bump-9.6
Bump RoosterJS Content-model to v9.6
2 parents aad8334 + 871cda5 commit a19dee0

File tree

167 files changed

+1343
-490
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

167 files changed

+1343
-490
lines changed

‎demo/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.14.0/umd/react-dom.production.min.js"></script>
2323
<script src="https://cdnjs.cloudflare.com/ajax/libs/fluentui-react/8.60.1/fluentui-react.min.js"></script>
2424
<script src="rooster-min.js"></script>
25+
<script src="rooster-react-min.js"></script>
2526
<script src="demo.js"></script>
2627
</body>
2728
</html>

‎demo/scripts/controlsV2/demoButtons/changeImageButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { changeImage } from 'roosterjs-content-model-api';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
function createInput(doc: Document): HTMLInputElement {
55
const input = doc.createElement('input');

‎demo/scripts/controlsV2/demoButtons/createImageEditButtons.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { ImageEditor } from 'roosterjs-content-model-types';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
/**
55
* @internal

‎demo/scripts/controlsV2/demoButtons/darkModeButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { MainPane } from '../mainPane/MainPane';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
/**
55
* Key of localized strings of Dark mode button

‎demo/scripts/controlsV2/demoButtons/exportContentButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { exportContent } from 'roosterjs-content-model-core';
22
import { ModelToTextCallbacks } from 'roosterjs-content-model-types';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
44

55
/**
66
* Key of localized strings of Zoom button

‎demo/scripts/controlsV2/demoButtons/formatPainterButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { FormatPainterHandler } from '../plugins/FormatPainterPlugin';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
/**
55
* @internal

‎demo/scripts/controlsV2/demoButtons/formatTableButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { formatTable } from 'roosterjs-content-model-api';
22
import { TableBorderFormat } from 'roosterjs-content-model-dom';
33
import { TableMetadataFormat } from 'roosterjs-content-model-types';
4-
import type { RibbonButton } from '../roosterjsReact/ribbon';
4+
import type { RibbonButton } from 'roosterjs-react';
55

66
const PREDEFINED_STYLES: Record<
77
string,

‎demo/scripts/controlsV2/demoButtons/imageBorderColorButton.ts

+3-20
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,13 @@
1-
import { renderColorPicker } from '../roosterjsReact/colorPicker/component/renderColorPicker';
1+
import { getColorPickerDropDown, getTextColorValue } from 'roosterjs-react';
22
import { setImageBorder } from 'roosterjs-content-model-api';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
4-
import {
5-
getColorPickerContainerClassName,
6-
getColorPickerItemClassName,
7-
} from '../roosterjsReact/colorPicker/utils/getClassNamesForColorPicker';
8-
import {
9-
getTextColorValue,
10-
TextColorDropDownItems,
11-
TextColors,
12-
} from '../roosterjsReact/colorPicker/utils/textColors';
3+
import type { RibbonButton } from 'roosterjs-react';
134

145
/**
156
* @internal
167
* "Image Border Color" button on the format ribbon
178
*/
189
export const imageBorderColorButton: RibbonButton<'buttonNameImageBorderColor'> = {
19-
dropDownMenu: {
20-
items: TextColorDropDownItems,
21-
itemClassName: getColorPickerItemClassName(),
22-
allowLivePreview: true,
23-
itemRender: (item, onClick) => renderColorPicker(item, TextColors, onClick),
24-
commandBarSubMenuProperties: {
25-
className: getColorPickerContainerClassName(),
26-
},
27-
},
10+
dropDownMenu: getColorPickerDropDown('text'),
2811
key: 'buttonNameImageBorderColor',
2912
unlocalizedText: 'Image Border Color',
3013
iconName: 'Photo2',

‎demo/scripts/controlsV2/demoButtons/imageBorderRemoveButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { setImageBorder } from 'roosterjs-content-model-api';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
/**
55
* @internal

‎demo/scripts/controlsV2/demoButtons/imageBorderStyleButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { setImageBorder } from 'roosterjs-content-model-api';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const STYLES: Record<string, string> = {
55
dashed: 'dashed',

‎demo/scripts/controlsV2/demoButtons/imageBorderWidthButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { setImageBorder } from 'roosterjs-content-model-api';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const WIDTH = [8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
55

‎demo/scripts/controlsV2/demoButtons/imageBoxShadowButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { RibbonButton } from '../roosterjsReact/ribbon';
21
import { setImageBoxShadow } from 'roosterjs-content-model-api';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const STYLES_NAMES: Record<string, string> = {
55
noShadow: 'noShadow',

‎demo/scripts/controlsV2/demoButtons/listStartNumberButton.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { CancelButtonStringKey, OkButtonStringKey } from '../roosterjsReact/common';
2-
import { RibbonButton } from '../roosterjsReact/ribbon';
1+
import { CancelButtonStringKey, OkButtonStringKey, showInputDialog } from 'roosterjs-react';
32
import { setListStartNumber } from 'roosterjs-content-model-api';
4-
import { showInputDialog } from '../roosterjsReact/inputDialog';
3+
import type { RibbonButton } from 'roosterjs-react';
54

65
/**
76
* @internal

‎demo/scripts/controlsV2/demoButtons/pasteButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { extractClipboardItems } from 'roosterjs-content-model-dom';
22
import { paste } from 'roosterjs-content-model-core';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
44

55
/**
66
* @internal

‎demo/scripts/controlsV2/demoButtons/popoutButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { MainPane } from '../mainPane/MainPane';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
/**
55
* Key of localized strings of Popout button

‎demo/scripts/controlsV2/demoButtons/setBulletedListStyleButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { BulletListType } from 'roosterjs-content-model-dom';
22
import { setListStyle } from 'roosterjs-content-model-api';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
44

55
const dropDownMenuItems = {
66
[BulletListType.Disc]: 'Disc',

‎demo/scripts/controlsV2/demoButtons/setNumberedListStyleButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { NumberingListType } from 'roosterjs-content-model-dom';
22
import { setListStyle } from 'roosterjs-content-model-api';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
44

55
const dropDownMenuItems = {
66
[NumberingListType.Decimal]: 'Decimal',

‎demo/scripts/controlsV2/demoButtons/setTableCellShadeButton.ts

+6-20
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,15 @@
1-
import { BackgroundColorKeys } from '../roosterjsReact/colorPicker/types/stringKeys';
2-
import { renderColorPicker } from '../roosterjsReact/colorPicker/component/renderColorPicker';
3-
import { setTableCellShade } from 'roosterjs-content-model-api';
4-
import {
5-
getColorPickerContainerClassName,
6-
getColorPickerItemClassName,
7-
} from '../roosterjsReact/colorPicker/utils/getClassNamesForColorPicker';
81
import {
9-
BackgroundColorDropDownItems,
10-
BackgroundColors,
2+
BackgroundColorKeys,
113
getBackgroundColorValue,
12-
} from '../roosterjsReact/colorPicker/utils/backgroundColors';
13-
import type { RibbonButton } from '../roosterjsReact/ribbon';
4+
getColorPickerDropDown,
5+
} from 'roosterjs-react';
6+
import { setTableCellShade } from 'roosterjs-content-model-api';
7+
import type { RibbonButton } from 'roosterjs-react';
148

159
export const setTableCellShadeButton: RibbonButton<
1610
'ribbonButtonSetTableCellShade' | BackgroundColorKeys
1711
> = {
18-
dropDownMenu: {
19-
items: BackgroundColorDropDownItems,
20-
itemClassName: getColorPickerItemClassName(),
21-
allowLivePreview: true,
22-
itemRender: (item, onClick) => renderColorPicker(item, BackgroundColors, onClick),
23-
commandBarSubMenuProperties: {
24-
className: getColorPickerContainerClassName(),
25-
},
26-
},
12+
dropDownMenu: getColorPickerDropDown('background'),
2713
key: 'ribbonButtonSetTableCellShade',
2814
unlocalizedText: 'Set table shade color',
2915
iconName: 'BackgroundColor',

‎demo/scripts/controlsV2/demoButtons/spaceBeforeAfterButtons.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { getFormatState, setParagraphMargin } from 'roosterjs-content-model-api';
2-
import { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const spaceAfterButtonKey = 'buttonNameSpaceAfter';
55
const spaceBeforeButtonKey = 'buttonNameSpaceBefore';

‎demo/scripts/controlsV2/demoButtons/spacingButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { RibbonButton } from '../roosterjsReact/ribbon';
21
import { setSpacing } from 'roosterjs-content-model-api';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const SPACING_OPTIONS = ['1.0', '1.15', '1.5', '2.0'];
55
const NORMAL_SPACING = 1.2;

‎demo/scripts/controlsV2/demoButtons/tableBorderApplyButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { applyTableBorderFormat } from 'roosterjs-content-model-api';
22
import { BorderOperations } from 'roosterjs-content-model-types';
33
import { MainPane } from '../mainPane/MainPane';
4-
import { RibbonButton } from '../roosterjsReact/ribbon';
4+
import type { RibbonButton } from 'roosterjs-react';
55

66
const TABLE_OPERATIONS: Record<string, BorderOperations> = {
77
menuNameTableAllBorder: 'allBorders',

‎demo/scripts/controlsV2/demoButtons/tableBorderColorButton.ts

+3-20
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,13 @@
1+
import { getColorPickerDropDown, getTextColorValue } from 'roosterjs-react';
12
import { MainPane } from '../mainPane/MainPane';
2-
import { renderColorPicker } from '../roosterjsReact/colorPicker/component/renderColorPicker';
3-
import {
4-
getColorPickerContainerClassName,
5-
getColorPickerItemClassName,
6-
} from '../roosterjsReact/colorPicker/utils/getClassNamesForColorPicker';
7-
import {
8-
getTextColorValue,
9-
TextColorDropDownItems,
10-
TextColors,
11-
} from '../roosterjsReact/colorPicker/utils/textColors';
12-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
134

145
/**
156
* @internal
167
* "Table Border Color" button on the format ribbon
178
*/
189
export const tableBorderColorButton: RibbonButton<'buttonNameTableBorderColor'> = {
19-
dropDownMenu: {
20-
items: TextColorDropDownItems,
21-
itemClassName: getColorPickerItemClassName(),
22-
allowLivePreview: true,
23-
itemRender: (item, onClick) => renderColorPicker(item, TextColors, onClick),
24-
commandBarSubMenuProperties: {
25-
className: getColorPickerContainerClassName(),
26-
},
27-
},
10+
dropDownMenu: getColorPickerDropDown('text'),
2811
key: 'buttonNameTableBorderColor',
2912
unlocalizedText: 'Table Border Color',
3013
iconName: 'ColorSolid',

‎demo/scripts/controlsV2/demoButtons/tableBorderStyleButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { MainPane } from '../mainPane/MainPane';
2-
import { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const STYLES: Record<string, string> = {
55
dashed: 'dashed',

‎demo/scripts/controlsV2/demoButtons/tableBorderWidthButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { MainPane } from '../mainPane/MainPane';
2-
import { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const WIDTH = [0.25, 0.5, 0.75, 1, 1.5, 2.25, 3, 4.5, 6];
55

‎demo/scripts/controlsV2/demoButtons/tableEditButtons.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
import { editTable } from 'roosterjs-content-model-api';
22
import { TableOperation } from 'roosterjs-content-model-types';
3-
import {
3+
import type {
4+
RibbonButton,
45
TableEditAlignMenuItemStringKey,
56
TableEditAlignTableMenuItemStringKey,
67
TableEditDeleteMenuItemStringKey,
78
TableEditInsertMenuItemStringKey,
89
TableEditMenuItemStringKey,
910
TableEditMergeMenuItemStringKey,
1011
TableEditSplitMenuItemStringKey,
11-
} from '../roosterjsReact/contextMenu';
12-
import type { RibbonButton } from '../roosterjsReact/ribbon';
12+
} from 'roosterjs-react';
1313

1414
const TableEditOperationMap: Partial<Record<TableEditMenuItemStringKey, TableOperation>> = {
1515
menuNameTableInsertAbove: 'insertAbove',

‎demo/scripts/controlsV2/demoButtons/tableOptionsButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { formatTable, getFormatState } from 'roosterjs-content-model-api';
22
import { TableMetadataFormat } from 'roosterjs-content-model-types';
3-
import type { RibbonButton } from '../roosterjsReact/ribbon';
3+
import type { RibbonButton } from 'roosterjs-react';
44

55
const TableEditOperationMap: Partial<Record<
66
TableOptionsMenuItemStringKey,

‎demo/scripts/controlsV2/demoButtons/zoomButton.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { MainPane } from '../mainPane/MainPane';
2-
import type { RibbonButton } from '../roosterjsReact/ribbon';
2+
import type { RibbonButton } from 'roosterjs-react';
33

44
const DropDownItems = {
55
'zoom50%': '50%',

‎demo/scripts/controlsV2/mainPane/MainPane.tsx

+14-12
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,6 @@ import * as ReactDOM from 'react-dom';
33
import SampleEntityPlugin from '../plugins/SampleEntityPlugin';
44
import { ApiPlaygroundPlugin } from '../sidePane/apiPlayground/ApiPlaygroundPlugin';
55
import { ContentModelPanePlugin } from '../sidePane/contentModel/ContentModelPanePlugin';
6-
import { createEmojiPlugin } from '../roosterjsReact/emoji';
7-
import { createImageEditMenuProvider } from '../roosterjsReact/contextMenu/menus/createImageEditMenuProvider';
8-
import { createListEditMenuProvider } from '../roosterjsReact/contextMenu/menus/createListEditMenuProvider';
9-
import { createPasteOptionPlugin } from '../roosterjsReact/pasteOptions';
10-
import { createRibbonPlugin, Ribbon, RibbonButton, RibbonPlugin } from '../roosterjsReact/ribbon';
116
import { darkModeButton } from '../demoButtons/darkModeButton';
127
import { Editor } from 'roosterjs-content-model-core';
138
import { EditorOptionsPlugin } from '../sidePane/editorOptions/EditorOptionsPlugin';
@@ -23,20 +18,31 @@ import { getTheme } from '../theme/themes';
2318
import { OptionState, UrlPlaceholder } from '../sidePane/editorOptions/OptionState';
2419
import { popoutButton } from '../demoButtons/popoutButton';
2520
import { PresetPlugin } from '../sidePane/presets/PresetPlugin';
26-
import { redoButton } from '../roosterjsReact/ribbon/buttons/redoButton';
2721
import { registerWindowForCss, unregisterWindowForCss } from '../../utils/cssMonitor';
28-
import { Rooster } from '../roosterjsReact/rooster';
2922
import { SamplePickerPlugin } from '../plugins/SamplePickerPlugin';
3023
import { SidePane } from '../sidePane/SidePane';
3124
import { SidePanePlugin } from '../sidePane/SidePanePlugin';
3225
import { SnapshotPlugin } from '../sidePane/snapshot/SnapshotPlugin';
3326
import { ThemeProvider } from '@fluentui/react/lib/Theme';
3427
import { TitleBar } from '../titleBar/TitleBar';
3528
import { trustedHTMLHandler } from '../../utils/trustedHTMLHandler';
36-
import { undoButton } from '../roosterjsReact/ribbon/buttons/undoButton';
3729
import { UpdateContentPlugin } from '../plugins/UpdateContentPlugin';
3830
import { WindowProvider } from '@fluentui/react/lib/WindowProvider';
3931
import { zoomButton } from '../demoButtons/zoomButton';
32+
import type { RibbonButton, RibbonPlugin } from 'roosterjs-react';
33+
import {
34+
createContextMenuPlugin,
35+
createEmojiPlugin,
36+
createImageEditMenuProvider,
37+
createListEditMenuProvider,
38+
createPasteOptionPlugin,
39+
createRibbonPlugin,
40+
createTableEditMenuProvider,
41+
redoButton,
42+
Rooster,
43+
undoButton,
44+
Ribbon,
45+
} from 'roosterjs-react';
4046
import {
4147
Border,
4248
Colors,
@@ -59,10 +65,6 @@ import {
5965
TableEditPlugin,
6066
WatermarkPlugin,
6167
} from 'roosterjs-content-model-plugins';
62-
import {
63-
createContextMenuPlugin,
64-
createTableEditMenuProvider,
65-
} from '../roosterjsReact/contextMenu';
6668

6769
const styles = require('./MainPane.scss');
6870

‎demo/scripts/controlsV2/plugins/SamplePickerPlugin.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Callout } from '@fluentui/react/lib/Callout';
33
import { DOMInsertPoint } from 'roosterjs-content-model-types';
44
import { IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu';
55
import { mergeStyles } from '@fluentui/react/lib/Styling';
6-
import { ReactEditorPlugin, UIUtilities } from '../roosterjsReact/common';
6+
import { ReactEditorPlugin, UIUtilities } from 'roosterjs-react';
77
import {
88
PickerDirection,
99
PickerHandler,

0 commit comments

Comments
 (0)