{"repo":"giusdp/live_pane","free":true,"listed":false,"github":"https://github.com/giusdp/live_pane","clone":"git clone https://github.com/giusdp/live_pane.git","description":"Resizable pane components for LiveView.","language":"TypeScript","stars":35,"topics":["component-library","liveview","phoenix"],"license":"MIT","category":"ui-components","readme_excerpt":"Live Pane A client-side, dependency-free, set hooks and components to easily create resizable panels in your Phoenix applications. This project has taken a lot of inspiration and code from the work done by paneforge and react-resizable-panels. Installation Add live pane to your list of dependencies in mix.exs : Then open up your app.js and import/setup the hooks. If you have a package.json file at the top of assets , you can add this to it: And then import the module: Or you can import the file directly: Finally setup the hooks in your app.js file: Also add '../deps/live pane/lib/ / . ex' to your list of paths Tailwind will look for class names, in your tailwind.config.js : Usage Now you can use the Group, Pane and Resizer components in your LiveView templates. Just make sure to set an id for the group and then use the same id in each pane and resizer for the group id attribute, so they can be linked together.","default_branch":null,"files":null,"tree":[],"storefront":"/r/giusdp","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/giusdp/live_pane/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}