1 files changed, 51 insertions, 0 deletions

diff --git a/src/ui/objects/Divider.tsx b/src/ui/objects/Divider.tsx
new file mode 100644
index 0000000..8f7efcd
--- /dev/null
+++ b/src/ui/objects/Divider.tsx
@@ -0,0 +1,51 @@
+import type { HTMLAttributes, HTMLTag } from "corvos/plugins/jsx.ts";
+
+export type Props = HTMLAttributes<"div" | "hr"> & {
+        "level"?: "strong" | "medium" | "quiet" | "faint";
+        "variant"?: "static-black" | "static-white";
+        "vertical"?: boolean | "dot";
+        "label-as"?: HTMLTag;
+        "children"?: JSX.Element;
+};
+
+export const Divider = ({
+        children,
+        level = "strong",
+        variant,
+        vertical,
+        "label-as": Label = "span",
+        class: cls,
+        ...props
+}: Props) =>
+        children ? (
+                <div
+                        class:list={[
+                                "o-divider",
+                                "o-divider--labelled",
+                                `o-divider--${level}`,
+                                {
+                                        [`o-divider--${variant}`]: variant,
+                                        "o-divider--vertical": vertical === true,
+                                        "o-divider--dot": vertical === "dot",
+                                },
+                                cls,
+                        ]}
+                        {...props}
+                >
+                        <Label class="o-divider__label u-mbs-0">{children}</Label>
+                </div>
+        ) : (
+                <hr
+                        class:list={[
+                                "o-divider",
+                                `o-divider--${level}`,
+                                {
+                                        [`o-divider--${variant}`]: variant,
+                                        "o-divider--vertical": vertical === true,
+                                        "o-divider--dot": vertical === "dot",
+                                },
+                                cls,
+                        ]}
+                        {...props}
+                />
+        );