Unable to disable stencil resize in Vue 3

[PollieDev]

Hey there,

Thank you for this wonderful package. I'm currently experiencing an issue (potentially a bug) whereby I am unable to disable the stencil adjustment.

You should be able to do it by adding the following props;

:stencil-props="{
  handlers: {},
  movable: false,
  scalable: false,
  aspectRatio: 1,
}"
:resize-image="{
  adjustStencil: false,
}"

However no luck on these.

I am running Vue 3.2.40 with vue-advanced-cropper 2.8.6. All examples on Code Sandbox I find is on Vue 2 and the resizing of the stencil is indeed disabled.

The code Im running is the static example of in the docs:

<cropper
  src="https://images.unsplash.com/photo-1673620068429-7546b29532cf?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1974&q=80"
  :stencil-props="{
    handlers: {},
    movable: false,
    scalable: false,
    aspectRatio: 1,
  }"
  :resize-image="{
    adjustStencil: false,
  }"
  image-restriction="stencil"
/>

A Code Sandbox example can be found here; https://codesandbox.io/s/optimistic-hill-rcejzx

As you can see on this, if you hover over the border of the stencil you can resize the stencil as you like.

Thanks in advance for any help

[Norserium]

@PollieDev, that's is the mistake in the documentation.

The scalable prop was renamed to resizable a long time ago. What's sandboxes do you see, where scalable prop was working?

The fixed sandbox.

[PollieDev]

Aha, makes sense. Thanks!

The sandboxes I saw were from users on old tickets (and thereby old version). Those Sandboxes were mostly a couple of years old so makes sense those still worked with scalable.

Thank you very much!

[Norserium]

@PollieDev, you are welcome!