1 files changed, 33 insertions, 0 deletions

diff --git a/src/ui/layouts/SplitViewPanel.tsx b/src/ui/layouts/SplitViewPanel.tsx
new file mode 100644
index 0000000..7f04b44
--- /dev/null
+++ b/src/ui/layouts/SplitViewPanel.tsx
@@ -0,0 +1,33 @@
+import type { HTMLTag, Polymorphic } from "corvos/plugins/jsx.ts";
+
+export type Props<Tag extends HTMLTag> = Polymorphic<{
+        as: Tag;
+        sticky?: boolean;
+        side?: "25";
+        min?: "50" | "100" | "200";
+        fill?: boolean;
+}>;
+
+export const SplitViewPanel = <T extends HTMLTag = "div">({
+        as: Tag = "div" as T,
+        sticky,
+        side,
+        min,
+        fill,
+        class: cls,
+        ...props
+}: Props<T>) => (
+        <Tag
+                class:list={[
+                        "l-split-view__panel",
+                        {
+                                "l-split-view__panel--sticky": sticky,
+                                [`l-split-view__panel--side-${side}`]: side,
+                                [`l-split-view__panel--min-${min}`]: min,
+                                "l-split-view__panel--fill": fill,
+                        },
+                        cls,
+                ]}
+                {...props}
+        />
+);