tallstackui Move Sidebar Button Collapse to Header

Checklist:

[x] I read the CONTRIBUTION GUIDE
[x] I created a new branch on my fork for this pull request
[x] I ensure that the current tests are passing
[x] I added tests that prove this pull request is working

What:

I changed the way I use the sidebar collapse and changed the position of the sidebar collapse button, so that when using a brand in the sidebar, the collapse button doesn't interfere.

[ ] Feature
[x] Enhancements
[ ] Bugfix

Description:

i change collapsible to sidebarCollapsible and position button sidebar collapse to header, add tooltip in collapse menu

Demonstration & Notes:

https://github.com/user-attachments/assets/08c8ee1c-8a0c-406f-8abb-361ec23a1fe7

tooltip:

Use Collapse Sidebar Like this :

<body>
 
    <x-ts-layout sidebarCollapsible> 
        <x-slot:header>
            <x-ts-layout.header>
                <x-slot:right>
                    <x-ts-dropdown text="Hello, {{ auth()->user()->name }}!">
                        <form method="POST" action="{{ route('logout') }}">
                            @csrf
                            <x-ts-dropdown.items text="Logout" onclick="event.preventDefault(); this.closest('form').submit();" />
                        </form>
                    </x-ts-dropdown>
                </x-slot:right>
            </x-ts-layout.header>
        </x-slot:header>
 
        <x-slot:menu>
            <x-ts-side-bar>
                <x-ts-side-bar.item text="Home" icon="home" :route="route('dashboard')" />
                <x-ts-side-bar.item text="Settings" icon="cog" :route="route('settings')" />
            </x-ts-side-bar>
        </x-slot:menu>
 
        {{ $slot }}
    </x-ts-layout>
 
    @livewireScripts
</body>

Add sidebarCollapsible in layout

Jun 21 '25 10:06 ryanyulianto

Hey @ryanyulianto ! This is awesome! I see the benefits of this PR, but I think this PR is not as aligned with the codes I expect for TSUI. I will redo this PR following some internal standards during the next week.

Jun 21 '25 22:06 devajmeireles

Hey @ryanyulianto ! This is awesome! I see the benefits of this PR, but I think this PR is not as aligned with the codes I expect for TSUI. I will redo this PR following some internal standards during the next week.

Ok, thank sir, in my change, if menu is group and the sidebar is not open and is collapse, i hide the arrow group and line, like the last icon from second image, that is menu from group

Jun 22 '25 01:06 ryanyulianto

Hey @ryanyulianto ! This is awesome! I see the benefits of this PR, but I think this PR is not as aligned with the codes I expect for TSUI. I will redo this PR following some internal standards during the next week.

https://github.com/user-attachments/assets/e5829bb6-2406-48f3-8f48-d3461f4ed8fd

i change like this

Jun 22 '25 14:06 ryanyulianto

Hey @ryanyulianto ! This is awesome! I see the benefits of this PR, but I think this PR is not as aligned with the codes I expect for TSUI. I will redo this PR following some internal standards during the next week.

This is much needed similar to other standard templates. Maybe a burger icon should be implemented further.

Jul 23 '25 02:07 ilyas-kazi

Something like this would be cool, if possible.

With the mouse over it, a description will appear:

Aug 05 '25 12:08 joelhmetz

Something like this would be cool, if possible.

With the mouse over it, a description will appear:

Ya, it all available in my pr

Aug 05 '25 12:08 ryanyulianto

@devajmeireles Maybe you can write down some internal standards that I have to do, so that I can improve this pr

Aug 05 '25 12:08 ryanyulianto