extending views/modal custom width

[rabii]

When extending the views/modal setting a custom width doesn't apply and throw an error as (this.width is not a function). Is there any other way to customise the width of the modal ? also is there is any way to make the modal float on the UI without closing. I am working on a case where i need the modal to stay open and allow the user to navigate through other parts of the system (like setting a higher index for the modal). wonder if anyone worked on something similar.

Thanks

[Kharg]

You can add isCollapsable true to your modal to make it collapsable just like email modals.

[rabii]

i know but that is not what i want. collapsing the modal is hiding information from user. The use case requires the modal to be opened and floating all over the rest of the UI el.

[yuri]

There's no such an ability. You need to create a custom view and use Espo.Ui.Dialog to create a dialog to be used as the view container.

[rabii]

You mean for floating modal i will look into that.

what about the width i can see that the width has be passed to the Espo.UI.dialog however it is still not working when providing a custom width for a modal extending views/modal

https://github.com/espocrm/espocrm/blob/2c6f08009a7714bd1b249238f6ee559fa25dd2c9/client/src/views/modal.js#L359

[rabii]

Thanks yuri

OK i managed to get the custom width applied on the modal.

width = 400 // doesn't work and throws and error 

width = '400' // works fine 

However there is an issue i am facing now where when the modal custom width is applied the modal will be centered in the global view. Is this a desired behavior ? if not is there is any params that control modal position

[yuri]

I do not recommend to use the 'width'. It's from early days and is not used/maintained. Likely will be removed to prevent usage.

[rabii]

sure i will avoid using the width. In fact i am changing the whole design and how to implement this.
Thanks

[Kharg]

I think that you can maybe use css to define a custom size and add the isDraggable property to make it moveable.

[Firyo]

Making the modal draggable doesn't impossible to do but the fact that you can click outside it without closing it implies that you need to work with some kind of custom CSS that uses a simple position: absolute (without backdrop).

You can still extends from the views/modal views but you'll have to create a custom css class to do your things.