updated readme

Author: ANKUR DWIVEDI

README.md

@@ -9,7 +9,17 @@
 
 ImageKit Vue.js SDK allows you to use real-time [image resizing](https://docs.imagekit.io/features/image-transformations), [optimization](https://docs.imagekit.io/features/image-optimization), and [file uploading](https://docs.imagekit.io/api-reference/upload-file-api/client-side-file-upload) in client-side.
 
-## Breaking changes - Upgrading from 1.x to 2.x version
+## Breaking changes 
+
+### Upgrading from 2.x to 3.x version
+
+1. Overlay syntax update
+
+* In version 3.0.0, we've removed the old overlay syntax parameters for transformations, such as `oi`, `ot`, `obg`, and [more](https://docs.imagekit.io/features/image-transformations/overlay). These parameters are deprecated and will start returning errors when used in URLs. Please migrate to the new layers syntax that supports overlay nesting, provides better positional control, and allows more transformations at the layer level. You can start with [examples](https://docs.imagekit.io/features/image-transformations/overlay-using-layers#examples) to learn quickly.
+* You can migrate to the new layers syntax using the `raw` transformation parameter.
+
+### Upgrading from 1.x to 2.x version
+
 2.x version has breaking changes as listed below.
 
 1. In version 2.0.1, three global components, namely `ik-image`, `ik-upload`, and `ik-context`, are no longer supported. Instead, it is recommended to import these components individually.
@@ -192,6 +202,15 @@ import { IKImage, IKUpload, IKContext, IKVideo, } from 'imagekitio-vue'
     :ref={uploadRef}
     :onError={onError} 
     :onSuccess={onSuccess}
+    :transformation="{
+      pre: 'l-text,i-Imagekit,fs-50,l-end', 
+      post: [
+          {
+              type: 'transformation', 
+              value: 'w-100'
+          }
+      ]
+    }"
   />
 </IKContext>
 
@@ -612,6 +631,15 @@ Sample file upload:
     :onError="onError"
     :onSuccess="onSuccess"
     customCoordinates="10,10,100,100"
+    :transformation="{
+      pre: 'l-text,i-Imagekit,fs-50,l-end', 
+      post: [
+          {
+              type: 'transformation', 
+              value: 'w-100'
+          }
+      ]
+    }"
   />
 </template>
 
@@ -662,6 +690,15 @@ Example Usage
     :onError="onError"
     :onSuccess="onSuccess"
     customCoordinates="10,10,100,100"
+    :transformation="{
+      pre: 'l-text,i-Imagekit,fs-50,l-end', 
+      post: [
+          {
+              type: 'transformation', 
+              value: 'w-100'
+          }
+      ]
+    }"
   />
   <button @click="abortChildUpload">Abort Child Upload</button>
 </template>