[VUE]Salesforce LWC Splitter issue

[rocketreading]

Hi Team,

I am using the splitter in LWC, it is just showing the blank space between them, and there is no option for resizing the above and below, like we have a vertical splitter in both sections.
I would require the same between the Gantt and resource utilisation views.

Attaching screenshot fyr.

[alex.l]

Hi,

Confirmed a bug in current version, ticket https://github.com/bryntum/support/issues/11325
You can subscribe on ticket updates to be notified when it's done.

Thank you for your report!

[rocketreading]

Is there any ETA for the same?
Like by when this will be fixed? or If there is any alternative?

[marcio]

Hey rocketreading,

Unfortunately, no ETA for this ticket, but we already have someone from our team looking into the ticket.

[alex.l]

Hi rocketreading,

I am debugging the code and see Salesforce container uses flex-direction: row by default. That causes Splitter appeared in vertical mode (which is correct). The fix is to set correct flex-direction to container it rendered to.

<template>
    <div class="container" lwc:dom="manual" style="flex-direction : column;" ></div>
</template>

Another thing - you need to set width: "100%" for Splitter itself, since SF doesn't care about sizing by deafult. So, please set

const splitter = new bryntum.gantt.Splitter({ appendTo, showButtons : true, width : '100%' });

It should allow you to use Splitter component.
Looking forward for your feedback if it worked for you!

[rocketreading]

It worked thanks