Split codebase (#455)

2026-08-25 04:44:12 +02:00 · 2026-05-07 15:50:10 -07:00
parent d2dc719cc6
commit 10559c8f4f
742 changed files with 7686 additions and 3249 deletions
@@ -0,0 +1,93 @@
+import classNames from "classnames";
+import type { ComponentType, ForwardedRef, HTMLAttributes, ReactNode } from "react";
+import { forwardRef } from "react";
+
+const gapClasses = {
+  0: "gap-0",
+  0.5: "gap-0.5",
+  1: "gap-1",
+  1.5: "gap-1.5",
+  2: "gap-2",
+  3: "gap-3",
+  4: "gap-4",
+  5: "gap-5",
+  6: "gap-6",
+};
+
+interface HStackProps extends BaseStackProps {
+  children?: ReactNode;
+}
+
+export const HStack = forwardRef(function HStack(
+  { className, space, children, alignItems = "center", ...props }: HStackProps,
+  // oxlint-disable-next-line no-explicit-any
+  ref: ForwardedRef<any>,
+) {
+  return (
+    <BaseStack
+      ref={ref}
+      className={classNames(className, "flex-row", space != null && gapClasses[space])}
+      alignItems={alignItems}
+      {...props}
+    >
+      {children}
+    </BaseStack>
+  );
+});
+
+export type VStackProps = BaseStackProps & {
+  children: ReactNode;
+};
+
+export const VStack = forwardRef(function VStack(
+  { className, space, children, ...props }: VStackProps,
+  // oxlint-disable-next-line no-explicit-any
+  ref: ForwardedRef<any>,
+) {
+  return (
+    <BaseStack
+      ref={ref}
+      className={classNames(className, "flex-col", space != null && gapClasses[space])}
+      {...props}
+    >
+      {children}
+    </BaseStack>
+  );
+});
+
+type BaseStackProps = HTMLAttributes<HTMLElement> & {
+  as?: ComponentType | "ul" | "label" | "form" | "p";
+  space?: keyof typeof gapClasses;
+  alignItems?: "start" | "center" | "stretch" | "end";
+  justifyContent?: "start" | "center" | "end" | "between";
+  wrap?: boolean;
+};
+
+const BaseStack = forwardRef(function BaseStack(
+  { className, alignItems, justifyContent, wrap, children, as, ...props }: BaseStackProps,
+  // oxlint-disable-next-line no-explicit-any
+  ref: ForwardedRef<any>,
+) {
+  const Component = as ?? "div";
+  return (
+    <Component
+      ref={ref}
+      className={classNames(
+        className,
+        "flex",
+        wrap && "flex-wrap",
+        alignItems === "center" && "items-center",
+        alignItems === "start" && "items-start",
+        alignItems === "stretch" && "items-stretch",
+        alignItems === "end" && "items-end",
+        justifyContent === "start" && "justify-start",
+        justifyContent === "center" && "justify-center",
+        justifyContent === "end" && "justify-end",
+        justifyContent === "between" && "justify-between",
+      )}
+      {...props}
+    >
+      {children}
+    </Component>
+  );
+});