All files page.tsx

100% Statements 54/54
100% Branches 1/1
100% Functions 0/0
100% Lines 54/54

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 551x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x  
import { Component, IComponentPropsWithoutRef } from "@clutchd/component";
import { composeClassNames as cn } from "@clutchd/compose-props";
import { Flex, IFlexProps } from "@clutchd/flex";
import type { WithMinHeight, WithMinWidth } from "@clutchd/tailwind";
import * as React from "react";
 
/**
 * Type to define `Page` element.
 */
type IPage = React.ElementRef<typeof Component.div>;
 
/**
 * Type to define `Page` props.
 */
interface IPageProps extends IFlexProps, WithMinWidth, WithMinHeight {}
 
/**
 * Type to define `Page` props with html attributes.
 */
interface IPageHtmlProps
  extends IPageProps,
    IComponentPropsWithoutRef<typeof Component.div> {}
 
/**
 * `Page` - A `Container` designed to contain an entire page. Renders as a `div` element that fills the screen.
 * @param props `IPageHtmlProps` used to render this `Page`.
 * @returns `Page` component.
 */
const Page = React.forwardRef<IPage, IPageHtmlProps>(
  (
    {
      className,
      direction = "flex-col",
      minWidth = "min-w-screen",
      minHeight = "min-h-screen",
      ...props
    },
    forwardedRef,
  ) => {
    return (
      <Flex
        className={cn(minWidth, minHeight, className)}
        direction={direction}
        ref={forwardedRef}
        {...props}
      />
    );
  },
);
 
Page.displayName = "Page";
 
export { Page };
export type { IPage, IPageHtmlProps, IPageProps };