feat: implement RdxEditor components including layout, section, and sticky footer with tests feat: introduce RdxFormGrid for form layout management feat: create RdxPage components for structured page layout with actions and headers feat: add RdxRowActions for handling row-level actions with dropdown support
33 lines
782 B
TypeScript
33 lines
782 B
TypeScript
import { cn } from "@repo/shadcn-ui/lib/utils";
|
|
import type { ComponentPropsWithoutRef, ReactNode } from "react";
|
|
|
|
export type RdxPageWidth = "full" | "wide" | "content";
|
|
|
|
export interface RdxPageContainerProps
|
|
extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
|
|
children: ReactNode;
|
|
width?: RdxPageWidth;
|
|
}
|
|
|
|
const WIDTH_CLASSNAME: Record<RdxPageWidth, string> = {
|
|
full: "w-full",
|
|
wide: "mx-auto max-w-screen-2xl w-full",
|
|
content: "mx-auto max-w-5xl w-full",
|
|
};
|
|
|
|
export const RdxPageContainer = ({
|
|
children,
|
|
className,
|
|
width = "full",
|
|
...props
|
|
}: RdxPageContainerProps) => {
|
|
return (
|
|
<div
|
|
className={cn("min-w-0 w-full px-4 py-4 md:px-6 md:py-6", WIDTH_CLASSNAME[width], className)}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</div>
|
|
);
|
|
};
|