shadcn_ui-resizable
Shadcn UI — Resizable
Instructions
ShadResizablePanelGroup contains ShadResizablePanel children. Each panel has id, defaultSize (fraction 0–1), optional minSize and maxSize, and child. Use axis: Axis.vertical for vertical splits. Nest ShadResizablePanelGroup inside a panel for nested layouts. Set showHandle: true to show the resize handle; optional handleIcon or handleIconSrc to customize. Double-click the handle to reset to default size.
Basic horizontal
ShadResizablePanelGroup(
children: [
ShadResizablePanel(
id: 0,
defaultSize: .5,
minSize: .2,
maxSize: .8,
child: Center(child: Text('One', style: theme.textTheme.large)),
),
ShadResizablePanel(
id: 1,
defaultSize: .5,
child: ShadResizablePanelGroup(
axis: Axis.vertical,
children: [
ShadResizablePanel(
id: 0,
defaultSize: .3,
child: Center(child: Text('Two', style: theme.textTheme.large)),
),
ShadResizablePanel(
id: 1,
defaultSize: .7,
child: Align(child: Text('Three', style: theme.textTheme.large)),
),
],
),
),
],
)
Vertical
ShadResizablePanelGroup(
axis: Axis.vertical,
children: [
ShadResizablePanel(
id: 0,
defaultSize: 0.3,
minSize: 0.1,
child: Center(child: Text('Header', style: theme.textTheme.large)),
),
ShadResizablePanel(
id: 1,
defaultSize: 0.7,
minSize: 0.1,
child: Center(child: Text('Footer', style: theme.textTheme.large)),
),
],
)
With visible handle
ShadResizablePanelGroup(
showHandle: true,
children: [
ShadResizablePanel(id: 0, defaultSize: .5, minSize: .2, child: ...),
ShadResizablePanel(id: 1, defaultSize: .5, minSize: .2, child: ...),
],
)
Wrap the group in a bordered container (e.g. DecoratedBox + ClipRRect with theme.radius) for a clean look.
More from serverpod/skills-registry
riverpod-codegen-and-hooks
Use Riverpod code generation (@riverpod, riverpod_generator) and hooks (hooks_riverpod, HookConsumerWidget, flutter_hooks with Riverpod). Use when the user asks about @riverpod, code generation, riverpod_generator, when to use codegen, or using flutter_hooks with Riverpod (HookConsumerWidget, HookConsumer).
25riverpod-providers
Declare and use Riverpod providers (Provider, FutureProvider, StreamProvider, NotifierProvider, AsyncNotifierProvider, StreamNotifierProvider); unmodifiable vs modifiable, top-level declaration, Ref, Notifier build method. Use when creating providers, choosing provider type, writing Notifier classes, or understanding Riverpod state. Use this skill whenever the user asks about Riverpod providers, provider types, or notifiers.
24riverpod-consumers
Use Riverpod Consumer, ConsumerWidget, and ConsumerStatefulWidget to read and watch providers in widgets; WidgetRef, builder ref parameter. Use when building widgets that need to access Riverpod providers, ref.watch or ref.read in the UI, or converting StatelessWidget to ConsumerWidget. Prefer this skill when the user asks how to use providers in Flutter widgets or why ConsumerWidget is required.
19riverpod-getting-started
Install Riverpod (flutter_riverpod or riverpod), wrap the app in ProviderScope, run a hello-world provider, and optionally enable riverpod_lint and code generation. Use when starting a Flutter or Dart project with Riverpod, adding the Riverpod dependency, or setting up ProviderScope and a first provider. For version highlights see the official Riverpod docs.
18riverpod-auto-dispose
Enable automatic disposal of Riverpod providers when they have no listeners; keepAlive, onDispose, invalidate, ref.keepAlive. Use when preventing memory leaks, caching only while used, or cleaning up resources when a provider is no longer needed. Use this skill when the user asks about auto-dispose, keepAlive, or when to dispose Riverpod state.
17riverpod-refs
Use Ref and WidgetRef to read, watch, listen, invalidate, and refresh providers; onDispose and onCancel lifecycle; ref.read vs ref.watch vs ref.listen, ref.invalidate and ref.refresh. Use when interacting with Riverpod providers from widgets or other providers, when to use watch vs read, or when resetting provider state. Use this skill whenever the user asks about ref.watch, ref.read, ref.listen, ref.invalidate, or Riverpod lifecycle.
16