@univerjs/docs-drawing 1.0.0-alpha.7 → 1.0.0-beta.0

package/lib/cjs/facade.js

@@ -97,8 +97,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getSize() {
-		var _this$getImageData$do, _this$getImageData3;
-		return (_this$getImageData$do = (_this$getImageData3 = this.getImageData()) === null || _this$getImageData3 === void 0 ? void 0 : _this$getImageData3.docTransform.size) !== null && _this$getImageData$do !== void 0 ? _this$getImageData$do : null;
+		var _this$getImageData3;
+		return ((_this$getImageData3 = this.getImageData()) === null || _this$getImageData3 === void 0 ? void 0 : _this$getImageData3.docTransform.size) ?? null;
 	}
 	/**
 	* Gets the current clockwise rotation angle.
@@ -131,8 +131,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getPositionH() {
-		var _this$getImageData$do2, _this$getImageData5;
-		return (_this$getImageData$do2 = (_this$getImageData5 = this.getImageData()) === null || _this$getImageData5 === void 0 ? void 0 : _this$getImageData5.docTransform.positionH) !== null && _this$getImageData$do2 !== void 0 ? _this$getImageData$do2 : null;
+		var _this$getImageData5;
+		return ((_this$getImageData5 = this.getImageData()) === null || _this$getImageData5 === void 0 ? void 0 : _this$getImageData5.docTransform.positionH) ?? null;
 	}
 	/**
 	* Gets the current vertical position.
@@ -148,8 +148,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getPositionV() {
-		var _this$getImageData$do3, _this$getImageData6;
-		return (_this$getImageData$do3 = (_this$getImageData6 = this.getImageData()) === null || _this$getImageData6 === void 0 ? void 0 : _this$getImageData6.docTransform.positionV) !== null && _this$getImageData$do3 !== void 0 ? _this$getImageData$do3 : null;
+		var _this$getImageData6;
+		return ((_this$getImageData6 = this.getImageData()) === null || _this$getImageData6 === void 0 ? void 0 : _this$getImageData6.docTransform.positionV) ?? null;
 	}
 	/**
 	* Gets the current raw document image data.
@@ -258,6 +258,11 @@ var FDocumentImage = class {
 	}
 	/**
 	* Sets the image wrapping style.
+	*
+	* Use `INLINE` to place the image in the text flow, `WRAP_SQUARE` to flow text beside it, or
+	* `WRAP_TOP_AND_BOTTOM` to keep text above and below it. `BEHIND_TEXT` and `IN_FRONT_OF_TEXT` do not reserve space
+	* in the text layout and can overlap text.
+	*
 	* When switching from inline to a floating style in a UI environment, the current visual position is preserved.
 	* @param {TextWrappingStyle} wrappingStyle The wrapping style to apply.
 	* @returns {boolean} `true` when the update command succeeds; otherwise, `false`.
@@ -267,7 +272,8 @@ var FDocumentImage = class {
 	* const image = fDocument.getImages()[0];
 	*
 	* if (image) {
-	*   const success = image.setWrappingStyle(univerAPI.Enum.DocsImageWrappingStyle.WRAP_SQUARE);
+	*   // Float the image beside body text without covering it.
+	*   const success = image.setWrappingStyle(univerAPI.Enum.TextWrappingStyle.WRAP_SQUARE);
 	*   console.log(success);
 	* }
 	* ```
@@ -432,17 +438,19 @@ var FDocumentImage = class {
 //#region src/facade/f-document.ts
 var FDocumentImageMixin = class extends _univerjs_docs_facade.FDocument {
 	async insertImage(options) {
-		var _options$wrappingStyl, _options$angle, _options$positionH, _options$positionV;
 		const unitId = this.getId();
 		const imageId = (0, _univerjs_core.generateRandomId)(6);
-		const size = resolveImageSize(await this._getIntrinsicSize(options.source, options.imageSourceType), options);
+		const size = options.width != null && options.height != null ? {
+			width: options.width,
+			height: options.height
+		} : resolveImageSize(await this._getIntrinsicSize(options.source, options.imageSourceType), options);
 		const defaultTransform = (0, _univerjs_docs.buildDocTransform)(size.width, size.height);
-		const wrappingStyle = (_options$wrappingStyl = options.wrappingStyle) !== null && _options$wrappingStyl !== void 0 ? _options$wrappingStyl : _univerjs_docs_drawing.TextWrappingStyle.INLINE;
+		const wrappingStyle = options.wrappingStyle ?? _univerjs_docs_drawing.TextWrappingStyle.INLINE;
 		const docTransform = {
 			...defaultTransform,
-			angle: (_options$angle = options.angle) !== null && _options$angle !== void 0 ? _options$angle : defaultTransform.angle,
-			positionH: (_options$positionH = options.positionH) !== null && _options$positionH !== void 0 ? _options$positionH : defaultTransform.positionH,
-			positionV: (_options$positionV = options.positionV) !== null && _options$positionV !== void 0 ? _options$positionV : defaultTransform.positionV
+			angle: options.angle ?? defaultTransform.angle,
+			positionH: options.positionH ?? defaultTransform.positionH,
+			positionV: options.positionV ?? defaultTransform.positionV
 		};
 		const transform = (0, _univerjs_docs.docDrawingPositionToTransform)(docTransform);
 		const drawing = {
@@ -478,10 +486,9 @@ var FDocumentImageMixin = class extends _univerjs_docs_facade.FDocument {
 		return this._injector.createInstance(FDocumentImage, this, imageId, this._injector);
 	}
 	getImages() {
-		var _documentDataModel$ge, _documentDataModel$ge2;
 		const documentDataModel = this.getDocumentDataModel();
-		const drawings = (_documentDataModel$ge = documentDataModel.getDrawings()) !== null && _documentDataModel$ge !== void 0 ? _documentDataModel$ge : {};
-		return ((_documentDataModel$ge2 = documentDataModel.getDrawingsOrder()) !== null && _documentDataModel$ge2 !== void 0 ? _documentDataModel$ge2 : Object.keys(drawings)).filter((drawingId) => {
+		const drawings = documentDataModel.getDrawings() ?? {};
+		return (documentDataModel.getDrawingsOrder() ?? Object.keys(drawings)).filter((drawingId) => {
 			var _drawings$drawingId;
 			return ((_drawings$drawingId = drawings[drawingId]) === null || _drawings$drawingId === void 0 ? void 0 : _drawings$drawingId.drawingType) === _univerjs_core.DrawingTypeEnum.DRAWING_IMAGE;
 		}).map((drawingId) => this._injector.createInstance(FDocumentImage, this, drawingId, this._injector));
@@ -543,7 +550,7 @@ _univerjs_docs_facade.FDocument.extend(FDocumentImageMixin);
 * limitations under the License.
 */
 var FDocumentImageEnumMixin = class extends _univerjs_core_facade.FEnum {
-	get DocsImageWrappingStyle() {
+	get TextWrappingStyle() {
 		return _univerjs_docs_drawing.TextWrappingStyle;
 	}
 	get DocsImageRelativeFromH() {

package/lib/cjs/index.js

@@ -11,81 +11,29 @@ const InsertDocDrawingCommand = {
 	id: "doc.command.insert-doc-image",
 	type: _univerjs_core.CommandType.COMMAND,
 	handler: (accessor, params) => {
-		var _documentDataModel$ge, _snapshot$headers, _snapshot$footers, _snapshot$drawingsOrd, _snapshot$drawingsOrd2;
+		var _documentDataModel$ge, _snapshot$headers, _snapshot$footers;
 		if (!params) return false;
 		const commandService = accessor.get(_univerjs_core.ICommandService);
 		const univerInstanceService = accessor.get(_univerjs_core.IUniverInstanceService);
 		const { unitId, drawings, textRange } = params;
 		const documentDataModel = univerInstanceService.getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
 		if (!documentDataModel) return false;
-		const targetTextRange = resolveDocDrawingInsertTextRange(accessor, unitId, textRange);
-		if (!targetTextRange) return false;
-		const { collapsed, startOffset, segmentId = "" } = targetTextRange;
-		const body = (_documentDataModel$ge = documentDataModel.getSelfOrHeaderFooterModel(segmentId)) === null || _documentDataModel$ge === void 0 ? void 0 : _documentDataModel$ge.getBody();
-		if (!body) return false;
-		const textX = new _univerjs_core.TextX();
-		const jsonX = _univerjs_core.JSONX.getInstance();
-		const rawActions = [];
+		const resolvedTextRange = resolveDocDrawingInsertTextRange(accessor, unitId, textRange);
+		if (!resolvedTextRange) return false;
+		const { segmentId = "" } = resolvedTextRange;
+		if (!((_documentDataModel$ge = documentDataModel.getSelfOrHeaderFooterModel(segmentId)) === null || _documentDataModel$ge === void 0 ? void 0 : _documentDataModel$ge.getBody())) return false;
 		const snapshot = documentDataModel.getSnapshot();
-		const targetDrawings = !!((_snapshot$headers = snapshot.headers) === null || _snapshot$headers === void 0 ? void 0 : _snapshot$headers[segmentId]) || !!((_snapshot$footers = snapshot.footers) === null || _snapshot$footers === void 0 ? void 0 : _snapshot$footers[segmentId]) ? drawings.map((drawing) => {
-			var _drawing$transforms;
-			return {
-				...drawing,
-				isMultiTransform: _univerjs_core.BooleanNumber.TRUE,
-				transforms: (_drawing$transforms = drawing.transforms) !== null && _drawing$transforms !== void 0 ? _drawing$transforms : drawing.transform ? [drawing.transform] : null
-			};
-		}) : drawings;
-		const drawingOrderLength = (_snapshot$drawingsOrd = (_snapshot$drawingsOrd2 = snapshot.drawingsOrder) === null || _snapshot$drawingsOrd2 === void 0 ? void 0 : _snapshot$drawingsOrd2.length) !== null && _snapshot$drawingsOrd !== void 0 ? _snapshot$drawingsOrd : 0;
-		let removeDrawingLen = 0;
-		if (collapsed) {
-			if (startOffset > 0) textX.push({
-				t: _univerjs_core.TextXActionType.RETAIN,
-				len: startOffset
-			});
-		} else {
-			var _documentDataModel$ge2, _documentDataModel$ge3;
-			const dos = _univerjs_core.BuildTextUtils.selection.delete([targetTextRange], body, 0, null, false);
-			textX.push(...dos);
-			const removedCustomBlockIds = (0, _univerjs_core.getCustomBlockIdsInSelections)(body, [targetTextRange]);
-			const drawings = (_documentDataModel$ge2 = documentDataModel.getDrawings()) !== null && _documentDataModel$ge2 !== void 0 ? _documentDataModel$ge2 : {};
-			const drawingOrder = (_documentDataModel$ge3 = documentDataModel.getDrawingsOrder()) !== null && _documentDataModel$ge3 !== void 0 ? _documentDataModel$ge3 : [];
-			const sortedRemovedCustomBlockIds = removedCustomBlockIds.sort((a, b) => {
-				if (drawingOrder.indexOf(a) > drawingOrder.indexOf(b)) return -1;
-				else if (drawingOrder.indexOf(a) < drawingOrder.indexOf(b)) return 1;
-				return 0;
-			});
-			if (sortedRemovedCustomBlockIds.length > 0) for (const blockId of sortedRemovedCustomBlockIds) {
-				const drawing = drawings[blockId];
-				const drawingIndex = drawingOrder.indexOf(blockId);
-				if (drawing == null || drawingIndex < 0) continue;
-				const removeDrawingAction = jsonX.removeOp(["drawings", blockId], drawing);
-				const removeDrawingOrderAction = jsonX.removeOp(["drawingsOrder", drawingIndex], blockId);
-				rawActions.push(removeDrawingAction);
-				rawActions.push(removeDrawingOrderAction);
-				removeDrawingLen++;
-			}
-		}
-		textX.push({
-			t: _univerjs_core.TextXActionType.INSERT,
-			body: {
-				dataStream: "\b".repeat(targetDrawings.length),
-				customBlocks: targetDrawings.map((drawing, i) => ({
-					startIndex: i,
-					blockId: drawing.drawingId
-				}))
-			},
-			len: targetDrawings.length
+		const targetDrawings = !!((_snapshot$headers = snapshot.headers) === null || _snapshot$headers === void 0 ? void 0 : _snapshot$headers[segmentId]) || !!((_snapshot$footers = snapshot.footers) === null || _snapshot$footers === void 0 ? void 0 : _snapshot$footers[segmentId]) ? drawings.map((drawing) => ({
+			...drawing,
+			isMultiTransform: _univerjs_core.BooleanNumber.TRUE,
+			transforms: drawing.transforms ?? (drawing.transform ? [drawing.transform] : null)
+		})) : drawings;
+		const actions = _univerjs_core.BuildTextUtils.drawing.add({
+			selection: resolvedTextRange,
+			documentDataModel,
+			drawings: targetDrawings
 		});
-		const path = (0, _univerjs_core.getRichTextEditPath)(documentDataModel, segmentId);
-		const placeHolderAction = jsonX.editOp(textX.serialize(), path);
-		rawActions.push(placeHolderAction);
-		for (const drawing of targetDrawings) {
-			const { drawingId } = drawing;
-			const addDrawingAction = jsonX.insertOp(["drawings", drawingId], drawing);
-			const addDrawingOrderAction = jsonX.insertOp(["drawingsOrder", drawingOrderLength - removeDrawingLen], drawingId);
-			rawActions.push(addDrawingAction);
-			rawActions.push(addDrawingOrderAction);
-		}
+		if (!actions) return false;
 		const doMutation = {
 			id: _univerjs_docs.RichTextEditingMutation.id,
 			params: {
@@ -94,30 +42,26 @@ const InsertDocDrawingCommand = {
 				textRanges: []
 			}
 		};
-		doMutation.params.actions = rawActions.reduce((acc, cur) => {
-			return _univerjs_core.JSONX.compose(acc, cur);
-		}, null);
+		doMutation.params.actions = actions;
 		const result = commandService.syncExecuteCommand(doMutation.id, doMutation.params);
 		return Boolean(result);
 	}
 };
 function resolveDocDrawingInsertTextRange(accessor, unitId, textRange) {
-	var _ref, _contentInsertRange$s;
 	const activeTextRange = accessor.get(_univerjs_docs.DocSelectionManagerService).getActiveTextRange();
-	const explicitTextRange = textRange ? (0, _univerjs_docs.normalizeTextRange)(textRange) : null;
-	const contentInsertRange = explicitTextRange !== null && explicitTextRange !== void 0 ? explicitTextRange : (0, _univerjs_docs.getContentInsertRange)(accessor, unitId);
-	if (!contentInsertRange) return activeTextRange !== null && activeTextRange !== void 0 ? activeTextRange : null;
+	const contentInsertRange = (textRange ? (0, _univerjs_docs.normalizeTextRange)(textRange) : null) ?? (0, _univerjs_docs.getContentInsertRange)(accessor, unitId);
+	if (!contentInsertRange) return activeTextRange ?? null;
 	return {
 		...activeTextRange,
 		startOffset: contentInsertRange.startOffset,
 		endOffset: contentInsertRange.endOffset,
 		collapsed: contentInsertRange.startOffset === contentInsertRange.endOffset,
-		segmentId: (_ref = (_contentInsertRange$s = contentInsertRange.segmentId) !== null && _contentInsertRange$s !== void 0 ? _contentInsertRange$s : activeTextRange === null || activeTextRange === void 0 ? void 0 : activeTextRange.segmentId) !== null && _ref !== void 0 ? _ref : ""
+		segmentId: contentInsertRange.segmentId ?? (activeTextRange === null || activeTextRange === void 0 ? void 0 : activeTextRange.segmentId) ?? ""
 	};
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/typeof.js
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/typeof.js
 function _typeof(o) {
 	"@babel/helpers - typeof";
 	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
@@ -128,7 +72,7 @@ function _typeof(o) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/toPrimitive.js
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/toPrimitive.js
 function toPrimitive(t, r) {
 	if ("object" != _typeof(t) || !t) return t;
 	var e = t[Symbol.toPrimitive];
@@ -141,14 +85,14 @@ function toPrimitive(t, r) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/toPropertyKey.js
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/toPropertyKey.js
 function toPropertyKey(t) {
 	var i = toPrimitive(t, "string");
 	return "symbol" == _typeof(i) ? i : i + "";
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/defineProperty.js
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/defineProperty.js
 function _defineProperty(e, r, t) {
 	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
 		value: t,
@@ -202,7 +146,7 @@ const RemoveDocDrawingCommand = {
 	id: "doc.command.remove-doc-image",
 	type: _univerjs_core.CommandType.COMMAND,
 	handler: (accessor, params) => {
-		var _ref, _contentInsertRange$s, _documentDataModel$ge, _documentDataModel$ge2, _documentDataModel$ge3;
+		var _documentDataModel$ge;
 		if (!params) return false;
 		const commandService = accessor.get(_univerjs_core.ICommandService);
 		const undoRedoService = accessor.get(_univerjs_core.IUndoRedoService);
@@ -213,29 +157,27 @@ const RemoveDocDrawingCommand = {
 		const documentDataModel = univerInstanceService.getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
 		if (!documentDataModel || removeDrawings.length === 0) return false;
 		const activeTextRange = docSelectionManagerService.getActiveTextRange();
-		const explicitTextRange = !textRange ? null : (0, _univerjs_docs.normalizeTextRange)(textRange);
-		const contentInsertRange = explicitTextRange !== null && explicitTextRange !== void 0 ? explicitTextRange : (0, _univerjs_docs.getContentInsertRange)(accessor, unitId);
-		const segmentId = (_ref = (_contentInsertRange$s = contentInsertRange === null || contentInsertRange === void 0 ? void 0 : contentInsertRange.segmentId) !== null && _contentInsertRange$s !== void 0 ? _contentInsertRange$s : activeTextRange === null || activeTextRange === void 0 ? void 0 : activeTextRange.segmentId) !== null && _ref !== void 0 ? _ref : "";
+		const contentInsertRange = (!textRange ? null : (0, _univerjs_docs.normalizeTextRange)(textRange)) ?? (0, _univerjs_docs.getContentInsertRange)(accessor, unitId);
+		const segmentId = (contentInsertRange === null || contentInsertRange === void 0 ? void 0 : contentInsertRange.segmentId) ?? (activeTextRange === null || activeTextRange === void 0 ? void 0 : activeTextRange.segmentId) ?? "";
 		const textX = new _univerjs_core.TextX();
 		const jsonX = _univerjs_core.JSONX.getInstance();
-		const customBlocks = (_documentDataModel$ge = (_documentDataModel$ge2 = documentDataModel.getSelfOrHeaderFooterModel(segmentId)) === null || _documentDataModel$ge2 === void 0 || (_documentDataModel$ge2 = _documentDataModel$ge2.getBody()) === null || _documentDataModel$ge2 === void 0 ? void 0 : _documentDataModel$ge2.customBlocks) !== null && _documentDataModel$ge !== void 0 ? _documentDataModel$ge : [];
+		const customBlocks = ((_documentDataModel$ge = documentDataModel.getSelfOrHeaderFooterModel(segmentId)) === null || _documentDataModel$ge === void 0 || (_documentDataModel$ge = _documentDataModel$ge.getBody()) === null || _documentDataModel$ge === void 0 ? void 0 : _documentDataModel$ge.customBlocks) ?? [];
 		const removeCustomBlocks = removeDrawings.map((drawing) => customBlocks.find((customBlock) => customBlock.blockId === drawing.drawingId)).filter((block) => !!block).sort((a, b) => a.startIndex > b.startIndex ? 1 : -1);
 		if (removeCustomBlocks.length === 0) return false;
-		const drawings = (_documentDataModel$ge3 = documentDataModel.getDrawings()) !== null && _documentDataModel$ge3 !== void 0 ? _documentDataModel$ge3 : {};
+		const drawings = documentDataModel.getDrawings() ?? {};
 		const removeDrawingParamById = new Map(removeDrawings.map((drawing) => [drawing.drawingId, drawing]));
 		const removeDrawingSnapshots = removeCustomBlocks.map((block) => drawings[block.blockId]).filter((drawing) => drawing != null);
 		const resourceRedoMutations = [];
 		const resourceUndoMutations = [];
 		const resourceMutationGroups = [];
 		for (const block of removeCustomBlocks) {
-			var _removeDrawingParam$s;
 			const { blockId } = block;
 			const drawing = drawings[blockId];
 			if (drawing == null) continue;
 			const removeDrawingParam = removeDrawingParamById.get(blockId);
 			const mutationInfos = drawingAdapterService.getRemoveDrawingMutationInfos({
 				unitId,
-				subUnitId: (_removeDrawingParam$s = removeDrawingParam === null || removeDrawingParam === void 0 ? void 0 : removeDrawingParam.subUnitId) !== null && _removeDrawingParam$s !== void 0 ? _removeDrawingParam$s : unitId,
+				subUnitId: (removeDrawingParam === null || removeDrawingParam === void 0 ? void 0 : removeDrawingParam.subUnitId) ?? unitId,
 				drawing,
 				removeDrawings: removeDrawingSnapshots
 			});
@@ -320,13 +262,47 @@ function executeMutations(mutations, commandService) {
 	return true;
 }
 
-//#endregion
-//#region src/services/doc-drawing.service.ts
-var DocDrawingService = class extends _univerjs_drawing.UnitDrawingService {};
-const IDocDrawingService = (0, _univerjs_core.createIdentifier)("univer.doc.plugin.doc-drawing.service");
-
 //#endregion
 //#region src/commands/commands/set-drawing-arrange.command.ts
+const DRAWINGS_ORDER_KEY = "drawingsOrder";
+/**
+* Calculates the target model order. Adjacent moves treat selected drawings as a group,
+* so selected drawings keep their relative order instead of crossing each other.
+*/
+function getArrangedDrawingOrder(drawingOrder, drawingIds, arrangeType) {
+	const selectedDrawingIds = new Set(drawingIds.filter((drawingId) => drawingOrder.includes(drawingId)));
+	const arrangedDrawingOrder = [...drawingOrder];
+	if (selectedDrawingIds.size === 0) return arrangedDrawingOrder;
+	if (arrangeType === _univerjs_core.ArrangeTypeEnum.forward) {
+		for (let index = arrangedDrawingOrder.length - 2; index >= 0; index--) if (selectedDrawingIds.has(arrangedDrawingOrder[index]) && !selectedDrawingIds.has(arrangedDrawingOrder[index + 1])) [arrangedDrawingOrder[index], arrangedDrawingOrder[index + 1]] = [arrangedDrawingOrder[index + 1], arrangedDrawingOrder[index]];
+	} else if (arrangeType === _univerjs_core.ArrangeTypeEnum.backward) {
+		for (let index = 1; index < arrangedDrawingOrder.length; index++) if (selectedDrawingIds.has(arrangedDrawingOrder[index]) && !selectedDrawingIds.has(arrangedDrawingOrder[index - 1])) [arrangedDrawingOrder[index], arrangedDrawingOrder[index - 1]] = [arrangedDrawingOrder[index - 1], arrangedDrawingOrder[index]];
+	} else if (arrangeType === _univerjs_core.ArrangeTypeEnum.front || arrangeType === _univerjs_core.ArrangeTypeEnum.back) {
+		const selected = arrangedDrawingOrder.filter((drawingId) => selectedDrawingIds.has(drawingId));
+		const unselected = arrangedDrawingOrder.filter((drawingId) => !selectedDrawingIds.has(drawingId));
+		return arrangeType === _univerjs_core.ArrangeTypeEnum.front ? [...unselected, ...selected] : [...selected, ...unselected];
+	}
+	return arrangedDrawingOrder;
+}
+/**
+* Converts the target order into granular JSONX move operations. This avoids replacing
+* the entire drawingsOrder array and keeps collaboration conflicts scoped to moved items.
+*/
+function createDrawingOrderActions(drawingOrder, arrangedDrawingOrder) {
+	const jsonX = _univerjs_core.JSONX.getInstance();
+	const workingDrawingOrder = [...drawingOrder];
+	const rawActions = [];
+	for (let targetIndex = 0; targetIndex < arrangedDrawingOrder.length; targetIndex++) {
+		const drawingId = arrangedDrawingOrder[targetIndex];
+		const currentIndex = workingDrawingOrder.indexOf(drawingId);
+		if (currentIndex < 0 || currentIndex === targetIndex) continue;
+		const action = jsonX.moveOp([DRAWINGS_ORDER_KEY, currentIndex], [DRAWINGS_ORDER_KEY, targetIndex]);
+		if (action) rawActions.push(action);
+		workingDrawingOrder.splice(currentIndex, 1);
+		workingDrawingOrder.splice(targetIndex, 0, drawingId);
+	}
+	return rawActions.reduce((actions, action) => _univerjs_core.JSONX.compose(actions, action), null);
+}
 /**
 * The command to arrange drawings.
 */
@@ -335,39 +311,18 @@ const SetDocDrawingArrangeCommand = {
 	type: _univerjs_core.CommandType.COMMAND,
 	handler: (accessor, params) => {
 		const commandService = accessor.get(_univerjs_core.ICommandService);
-		const docDrawingService = accessor.get(IDocDrawingService);
 		if (params == null) return false;
-		const { unitId, subUnitId, drawingIds, arrangeType } = params;
-		const drawingOrderMapParam = {
+		const { unitId, drawingIds, arrangeType } = params;
+		const documentDataModel = accessor.get(_univerjs_core.IUniverInstanceService).getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
+		const drawingOrder = documentDataModel === null || documentDataModel === void 0 ? void 0 : documentDataModel.getDrawingsOrder();
+		if (!drawingOrder) return false;
+		const actions = createDrawingOrderActions(drawingOrder, getArrangedDrawingOrder(drawingOrder, drawingIds, arrangeType));
+		if (_univerjs_core.JSONX.isNoop(actions)) return false;
+		const result = commandService.syncExecuteCommand(_univerjs_docs.RichTextEditingMutation.id, {
 			unitId,
-			subUnitId,
-			drawingIds
-		};
-		let jsonOp;
-		if (arrangeType === _univerjs_core.ArrangeTypeEnum.forward) jsonOp = docDrawingService.getForwardDrawingsOp(drawingOrderMapParam);
-		else if (arrangeType === _univerjs_core.ArrangeTypeEnum.backward) jsonOp = docDrawingService.getBackwardDrawingOp(drawingOrderMapParam);
-		else if (arrangeType === _univerjs_core.ArrangeTypeEnum.front) jsonOp = docDrawingService.getFrontDrawingsOp(drawingOrderMapParam);
-		else if (arrangeType === _univerjs_core.ArrangeTypeEnum.back) jsonOp = docDrawingService.getBackDrawingsOp(drawingOrderMapParam);
-		if (jsonOp == null) return false;
-		const { redo } = jsonOp;
-		if (redo == null) return false;
-		const rawActions = [];
-		let redoCopy = _univerjs_core.Tools.deepClone(redo);
-		redoCopy = redoCopy.slice(3);
-		redoCopy.unshift("drawingsOrder");
-		rawActions.push(redoCopy);
-		const doMutation = {
-			id: _univerjs_docs.RichTextEditingMutation.id,
-			params: {
-				unitId,
-				actions: [],
-				textRanges: null
-			}
-		};
-		doMutation.params.actions = rawActions.reduce((acc, cur) => {
-			return _univerjs_core.JSONX.compose(acc, cur);
-		}, null);
-		const result = commandService.syncExecuteCommand(doMutation.id, doMutation.params);
+			actions,
+			textRanges: null
+		});
 		return Boolean(result);
 	}
 };
@@ -378,14 +333,13 @@ const UpdateDrawingDocTransformCommand = {
 	id: "doc.command.update-drawing-doc-transform",
 	type: _univerjs_core.CommandType.COMMAND,
 	handler: (accessor, params) => {
-		var _documentDataModel$ge;
 		if (!params) return false;
 		const commandService = accessor.get(_univerjs_core.ICommandService);
 		const univerInstanceService = accessor.get(_univerjs_core.IUniverInstanceService);
 		const { unitId, drawings } = params;
 		const documentDataModel = univerInstanceService.getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
 		if (!documentDataModel) return false;
-		const oldDrawings = (_documentDataModel$ge = documentDataModel.getSnapshot().drawings) !== null && _documentDataModel$ge !== void 0 ? _documentDataModel$ge : {};
+		const oldDrawings = documentDataModel.getSnapshot().drawings ?? {};
 		const jsonX = _univerjs_core.JSONX.getInstance();
 		const actions = [];
 		for (const { drawingId, key, value } of drawings) {
@@ -412,11 +366,43 @@ const UpdateDrawingDocTransformCommand = {
 
 //#endregion
 //#region src/commands/commands/update-doc-drawing-wrapping-style.command.ts
+/**
+* Controls how a document drawing participates in text layout.
+*
+* `INLINE`, `WRAP_SQUARE`, and `WRAP_TOP_AND_BOTTOM` participate in text layout and can cause text to reflow.
+* `BEHIND_TEXT` and `IN_FRONT_OF_TEXT` are overlay styles and do not cause text to reflow.
+*/
 let TextWrappingStyle = /* @__PURE__ */ function(TextWrappingStyle) {
+	/**
+	* Places the drawing in the text flow like a character.
+	*
+	* The drawing occupies layout space and does not overlap surrounding text. Its position is determined by its
+	* document range, so floating position settings have no visible effect.
+	*/
 	TextWrappingStyle["INLINE"] = "inline";
+	/**
+	* Floats the drawing behind document text without causing the text to reflow.
+	*
+	* Use this style for backgrounds or watermarks. Text can overlap the drawing, so ensure that it remains readable.
+	*/
 	TextWrappingStyle["BEHIND_TEXT"] = "behindText";
+	/**
+	* Floats the drawing in front of document text without causing the text to reflow.
+	*
+	* The drawing can cover overlapping text. Use this style only when an overlay is intentional.
+	*/
 	TextWrappingStyle["IN_FRONT_OF_TEXT"] = "inFrontOfText";
+	/**
+	* Floats the drawing and wraps text around its rectangular bounds.
+	*
+	* Use this style for images that should appear beside body text, such as portraits or illustrations.
+	*/
 	TextWrappingStyle["WRAP_SQUARE"] = "wrapSquare";
+	/**
+	* Floats the drawing in a horizontal band, with text only above and below it.
+	*
+	* Use this style for wide figures or standalone illustrations that should not have text beside them.
+	*/
 	TextWrappingStyle["WRAP_TOP_AND_BOTTOM"] = "wrapTopAndBottom";
 	return TextWrappingStyle;
 }({});
@@ -434,13 +420,12 @@ const UpdateDocDrawingWrappingStyleCommand = {
 	id: "doc.command.update-doc-drawing-wrapping-style",
 	type: _univerjs_core.CommandType.COMMAND,
 	handler: (accessor, params) => {
-		var _documentDataModel$ge;
 		if (!params) return false;
 		const { drawings, wrappingStyle, unitId } = params;
 		const commandService = accessor.get(_univerjs_core.ICommandService);
 		const documentDataModel = accessor.get(_univerjs_core.IUniverInstanceService).getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
 		if (!documentDataModel) return false;
-		const oldDrawings = (_documentDataModel$ge = documentDataModel.getDrawings()) !== null && _documentDataModel$ge !== void 0 ? _documentDataModel$ge : {};
+		const oldDrawings = documentDataModel.getDrawings() ?? {};
 		const jsonX = _univerjs_core.JSONX.getInstance();
 		const rawActions = [];
 		for (const drawing of drawings) {
@@ -485,7 +470,12 @@ const UpdateDocDrawingWrappingStyleCommand = {
 };
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/decorateParam.js
+//#region src/services/doc-drawing.service.ts
+var DocDrawingService = class extends _univerjs_drawing.UnitDrawingService {};
+const IDocDrawingService = (0, _univerjs_core.createIdentifier)("univer.doc.plugin.doc-drawing.service");
+
+//#endregion
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/decorateParam.js
 function __decorateParam(paramIndex, decorator) {
 	return function(target, key) {
 		decorator(target, key, paramIndex);
@@ -493,7 +483,7 @@ function __decorateParam(paramIndex, decorator) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.137.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.140.0/helpers/esm/decorate.js
 function __decorate(decorators, target, key, desc) {
 	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
 	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -538,8 +528,8 @@ let DocDrawingController = class DocDrawingController extends _univerjs_core.Dis
 				const drawings = doc.getSnapshot().drawings;
 				const drawingOrder = doc.getSnapshot().drawingsOrder;
 				return JSON.stringify({
-					data: drawings !== null && drawings !== void 0 ? drawings : {},
-					order: drawingOrder !== null && drawingOrder !== void 0 ? drawingOrder : []
+					data: drawings ?? {},
+					order: drawingOrder ?? []
 				});
 			}
 			return "";
@@ -570,10 +560,9 @@ let DocDrawingController = class DocDrawingController extends _univerjs_core.Dis
 				});
 			},
 			onLoad: (unitId, value) => {
-				var _value$data, _value$order;
 				this._setDrawingDataForUnit(unitId, {
-					data: (_value$data = value.data) !== null && _value$data !== void 0 ? _value$data : {},
-					order: (_value$order = value.order) !== null && _value$order !== void 0 ? _value$order : []
+					data: value.data ?? {},
+					order: value.order ?? []
 				});
 			}
 		}));
@@ -626,7 +615,7 @@ DocDrawingController = __decorate([
 //#endregion
 //#region package.json
 var name = "@univerjs/docs-drawing";
-var version = "1.0.0-alpha.7";
+var version = "1.0.0-beta.0";
 
 //#endregion
 //#region src/config/config.ts
@@ -675,7 +664,11 @@ _defineProperty(UniverDocsDrawingPlugin, "pluginName", DOCS_DRAWING_PLUGIN);
 _defineProperty(UniverDocsDrawingPlugin, "packageName", name);
 _defineProperty(UniverDocsDrawingPlugin, "version", version);
 _defineProperty(UniverDocsDrawingPlugin, "type", _univerjs_core.UniverInstanceType.UNIVER_DOC);
-UniverDocsDrawingPlugin = __decorate([__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.Injector)), __decorateParam(2, _univerjs_core.IConfigService)], UniverDocsDrawingPlugin);
+UniverDocsDrawingPlugin = __decorate([
+	(0, _univerjs_core.DependentOn)(_univerjs_docs.UniverDocsPlugin, _univerjs_drawing.UniverDrawingPlugin),
+	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
+	__decorateParam(2, _univerjs_core.IConfigService)
+], UniverDocsDrawingPlugin);
 
 //#endregion
 exports.DOCS_DRAWING_PLUGIN = DOCS_DRAWING_PLUGIN;

package/lib/es/facade.js

@@ -96,8 +96,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getSize() {
-		var _this$getImageData$do, _this$getImageData3;
-		return (_this$getImageData$do = (_this$getImageData3 = this.getImageData()) === null || _this$getImageData3 === void 0 ? void 0 : _this$getImageData3.docTransform.size) !== null && _this$getImageData$do !== void 0 ? _this$getImageData$do : null;
+		var _this$getImageData3;
+		return ((_this$getImageData3 = this.getImageData()) === null || _this$getImageData3 === void 0 ? void 0 : _this$getImageData3.docTransform.size) ?? null;
 	}
 	/**
 	* Gets the current clockwise rotation angle.
@@ -130,8 +130,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getPositionH() {
-		var _this$getImageData$do2, _this$getImageData5;
-		return (_this$getImageData$do2 = (_this$getImageData5 = this.getImageData()) === null || _this$getImageData5 === void 0 ? void 0 : _this$getImageData5.docTransform.positionH) !== null && _this$getImageData$do2 !== void 0 ? _this$getImageData$do2 : null;
+		var _this$getImageData5;
+		return ((_this$getImageData5 = this.getImageData()) === null || _this$getImageData5 === void 0 ? void 0 : _this$getImageData5.docTransform.positionH) ?? null;
 	}
 	/**
 	* Gets the current vertical position.
@@ -147,8 +147,8 @@ var FDocumentImage = class {
 	* ```
 	*/
 	getPositionV() {
-		var _this$getImageData$do3, _this$getImageData6;
-		return (_this$getImageData$do3 = (_this$getImageData6 = this.getImageData()) === null || _this$getImageData6 === void 0 ? void 0 : _this$getImageData6.docTransform.positionV) !== null && _this$getImageData$do3 !== void 0 ? _this$getImageData$do3 : null;
+		var _this$getImageData6;
+		return ((_this$getImageData6 = this.getImageData()) === null || _this$getImageData6 === void 0 ? void 0 : _this$getImageData6.docTransform.positionV) ?? null;
 	}
 	/**
 	* Gets the current raw document image data.
@@ -257,6 +257,11 @@ var FDocumentImage = class {
 	}
 	/**
 	* Sets the image wrapping style.
+	*
+	* Use `INLINE` to place the image in the text flow, `WRAP_SQUARE` to flow text beside it, or
+	* `WRAP_TOP_AND_BOTTOM` to keep text above and below it. `BEHIND_TEXT` and `IN_FRONT_OF_TEXT` do not reserve space
+	* in the text layout and can overlap text.
+	*
 	* When switching from inline to a floating style in a UI environment, the current visual position is preserved.
 	* @param {TextWrappingStyle} wrappingStyle The wrapping style to apply.
 	* @returns {boolean} `true` when the update command succeeds; otherwise, `false`.
@@ -266,7 +271,8 @@ var FDocumentImage = class {
 	* const image = fDocument.getImages()[0];
 	*
 	* if (image) {
-	*   const success = image.setWrappingStyle(univerAPI.Enum.DocsImageWrappingStyle.WRAP_SQUARE);
+	*   // Float the image beside body text without covering it.
+	*   const success = image.setWrappingStyle(univerAPI.Enum.TextWrappingStyle.WRAP_SQUARE);
 	*   console.log(success);
 	* }
 	* ```
@@ -431,17 +437,19 @@ var FDocumentImage = class {
 //#region src/facade/f-document.ts
 var FDocumentImageMixin = class extends FDocument {
 	async insertImage(options) {
-		var _options$wrappingStyl, _options$angle, _options$positionH, _options$positionV;
 		const unitId = this.getId();
 		const imageId = generateRandomId(6);
-		const size = resolveImageSize(await this._getIntrinsicSize(options.source, options.imageSourceType), options);
+		const size = options.width != null && options.height != null ? {
+			width: options.width,
+			height: options.height
+		} : resolveImageSize(await this._getIntrinsicSize(options.source, options.imageSourceType), options);
 		const defaultTransform = buildDocTransform(size.width, size.height);
-		const wrappingStyle = (_options$wrappingStyl = options.wrappingStyle) !== null && _options$wrappingStyl !== void 0 ? _options$wrappingStyl : TextWrappingStyle.INLINE;
+		const wrappingStyle = options.wrappingStyle ?? TextWrappingStyle.INLINE;
 		const docTransform = {
 			...defaultTransform,
-			angle: (_options$angle = options.angle) !== null && _options$angle !== void 0 ? _options$angle : defaultTransform.angle,
-			positionH: (_options$positionH = options.positionH) !== null && _options$positionH !== void 0 ? _options$positionH : defaultTransform.positionH,
-			positionV: (_options$positionV = options.positionV) !== null && _options$positionV !== void 0 ? _options$positionV : defaultTransform.positionV
+			angle: options.angle ?? defaultTransform.angle,
+			positionH: options.positionH ?? defaultTransform.positionH,
+			positionV: options.positionV ?? defaultTransform.positionV
 		};
 		const transform = docDrawingPositionToTransform(docTransform);
 		const drawing = {
@@ -477,10 +485,9 @@ var FDocumentImageMixin = class extends FDocument {
 		return this._injector.createInstance(FDocumentImage, this, imageId, this._injector);
 	}
 	getImages() {
-		var _documentDataModel$ge, _documentDataModel$ge2;
 		const documentDataModel = this.getDocumentDataModel();
-		const drawings = (_documentDataModel$ge = documentDataModel.getDrawings()) !== null && _documentDataModel$ge !== void 0 ? _documentDataModel$ge : {};
-		return ((_documentDataModel$ge2 = documentDataModel.getDrawingsOrder()) !== null && _documentDataModel$ge2 !== void 0 ? _documentDataModel$ge2 : Object.keys(drawings)).filter((drawingId) => {
+		const drawings = documentDataModel.getDrawings() ?? {};
+		return (documentDataModel.getDrawingsOrder() ?? Object.keys(drawings)).filter((drawingId) => {
 			var _drawings$drawingId;
 			return ((_drawings$drawingId = drawings[drawingId]) === null || _drawings$drawingId === void 0 ? void 0 : _drawings$drawingId.drawingType) === DrawingTypeEnum.DRAWING_IMAGE;
 		}).map((drawingId) => this._injector.createInstance(FDocumentImage, this, drawingId, this._injector));
@@ -542,7 +549,7 @@ FDocument.extend(FDocumentImageMixin);
 * limitations under the License.
 */
 var FDocumentImageEnumMixin = class extends FEnum {
-	get DocsImageWrappingStyle() {
+	get TextWrappingStyle() {
 		return TextWrappingStyle;
 	}
 	get DocsImageRelativeFromH() {