0.3.1. (#9)

img-js · Nov 29, 2024 · 17f2101 · 17f2101
1 parent 40a9a84
commit 17f2101
Show file tree

Hide file tree

Showing 9 changed files with 39 additions and 16 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -1,5 +1,8 @@
 name: main
 on:
+  pull_request:
+    branches:
+      - main
   push:
     branches:
       - main

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 0.3.1
+
+Added a new fill mode to the `replaceRectToImage` method in the `MceCanvasReplacer` class (credit: [@seven7seven](https://github.com/seven7seven)).
+
 ## 0.3.0
 
 This version changed the license to MIT.

diff --git a/README.md b/README.md
@@ -55,9 +55,9 @@ Add the below code to your head section in HTML document.
 ```html
 <head>
 ...
-<link href="https://cdn.jsdelivr.net/npm/[email protected].0/css/editor.css" rel="stylesheet">
-<script src="https://cdn.jsdelivr.net/npm/[email protected].0/dist/index.umd.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/[email protected].0/dist/index.umd.js"></script>
+<link href="https://cdn.jsdelivr.net/npm/[email protected].1/css/editor.css" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/[email protected].1/dist/index.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].1/dist/index.umd.js"></script>
 ```
 
 Create the editor by:

diff --git a/core/package.json b/core/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "mini-canvas-core",
 	"description": "Core library for Mini Canvas Editor.",
-	"version": "0.3.0",
+	"version": "0.3.1",
 	"license": "SEE LICENSE IN LICENSE",
 	"type": "module",
 	"main": "./lib/cjs/index.browser.cjs",

diff --git a/core/src/replacer/fill-image.ts b/core/src/replacer/fill-image.ts
@@ -4,11 +4,11 @@ export function fillImage(rect: MceRect, sourceImage: HTMLImageElement): MceImag
 	const scale = Math.min(rect.width / sourceImage.width, rect.height / sourceImage.height);
 	const cropWidth = rect.width / scale;
 	const cropHeight = rect.height / scale;
-	
+
 	// Center the crop area
 	const cropY = Math.max(0, (sourceImage.height - cropHeight) / 2);
 	const cropX = Math.max(0, (sourceImage.width - cropWidth) / 2);
-	
+
 	// Center the image in the rect
 	const left = rect.left + (rect.width - sourceImage.width * scale) / 2;
 	const top = rect.top + (rect.height - sourceImage.height * scale) / 2;

diff --git a/core/src/replacer/mce-canvas-replacer.ts b/core/src/replacer/mce-canvas-replacer.ts
@@ -37,7 +37,11 @@ export class MceCanvasReplacer {
 	 * @param mode Mode of fitting image to the rectangle.
 	 * @returns Promise that resolves when the rect is replaced.
 	 */
-	public async replaceRectToImage(layer: MceLayer, sourceImage: HTMLImageElement | string, mode: 'stretch' | 'fit' | 'fill'): Promise<void> {
+	public async replaceRectToImage(
+		layer: MceLayer,
+		sourceImage: HTMLImageElement | string,
+		mode: 'stretch' | 'fit' | 'fill'
+	): Promise<void> {
 		const rect = this.objects[layer.realIndex] as MceRect;
 		if (!rect.visible) {
 			// If the layer is hidden, do nothing.

diff --git a/demos/webpack-app/public/vanilla-javascript.html b/demos/webpack-app/public/vanilla-javascript.html
@@ -41,13 +41,13 @@ <h1>📦 Vanilla JavaScript Example</h1>
 			const isLocalhost = ['localhost', '127.0.0.1'].includes(location.hostname);
 			const cssUrl = isLocalhost
 				? '../../../editor/css/editor.css'
-				: 'https://cdn.jsdelivr.net/npm/[email protected].0/css/editor.css';
+				: 'https://cdn.jsdelivr.net/npm/[email protected].1/css/editor.css';
 			const coreUrl = isLocalhost
 				? '../../../core/dist/index.umd.js'
-				: 'https://cdn.jsdelivr.net/npm/[email protected].0/dist/index.umd.js';
+				: 'https://cdn.jsdelivr.net/npm/[email protected].1/dist/index.umd.js';
 			const editorUrl = isLocalhost
 				? '../../../editor/dist/index.umd.js'
-				: 'https://cdn.jsdelivr.net/npm/[email protected].0/dist/index.umd.js';
+				: 'https://cdn.jsdelivr.net/npm/[email protected].1/dist/index.umd.js';
 
 			document.write('<link href="' + cssUrl + '" rel="stylesheet" \/>');
 			document.write('<script src="' + coreUrl + '"><\/script>');

diff --git a/editor/package.json b/editor/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "mini-canvas-editor",
 	"description": "Canvas editor component for JavaScript application. Easy to integrate and use.",
-	"version": "0.3.0",
+	"version": "0.3.1",
 	"type": "module",
 	"main": "./lib/esm/index.js",
 	"types": "./lib/index.d.ts",
@@ -50,10 +50,10 @@
 		"prettier:fix": "prettier --write ./src ./css"
 	},
 	"dependencies": {
-		"mini-canvas-core": "workspace:*"
+		"mini-canvas-core": "^0.3.1"
 	},
 	"peerDependencies": {
-		"mini-canvas-core": "^0.3.0"
+		"mini-canvas-core": "^0.3.1"
 	},
 	"devDependencies": {
 		"tslib": "^2.6.2",
@@ -88,4 +88,4 @@
 		"image resize",
 		"inpainting"
 	]
-}
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml