All files footer.tsx

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

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 441x 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 } from "@clutchd/component";
import { Flex, IFlexProps } from "@clutchd/flex";
import * as React from "react";
 
/**
 * Type to define `Footer` element.
 */
type IFooter = React.ElementRef<typeof Component.footer>;
 
/**
 * Type to define `Footer` props.
 */
interface IFooterProps extends IFlexProps {}
 
/**
 * Type to define `Footer` props with html attributes.
 */
interface IFooterHtmlProps
  extends IFooterProps,
    React.ComponentPropsWithoutRef<typeof Component.footer> {}
 
/**
 * `Footer` - A layout component designed to contain a page's footer content. Renders as a `footer` element.
 * @param props `IFooterHtmlProps` used to render this `Footer`.
 * @returns `Footer` component.
 */
const Footer = React.forwardRef<IFooter, IFooterHtmlProps>(
  (
    { children, direction = "flex-row", justify = "justify-between", ...props },
    forwardedRef,
  ) => {
    return (
      <Flex asChild direction={direction} justify={justify} {...props}>
        <footer ref={forwardedRef}>{children}</footer>
      </Flex>
    );
  },
);
 
Footer.displayName = "Footer";
 
export { Footer };
export type { IFooter, IFooterHtmlProps, IFooterProps };