@crossed/ui/lib/module/display/Card/Root.js

A universal & performant styling library for React Native, Next.js & React

import { jsx } from "react/jsx-runtime";
import { forwardRef, useMemo } from "react";
import { YBox } from "../../layout";
import { composeStyles } from "@crossed/styled";
import { cardStyles, spacingStyle } from "./styles";
import { useMedia } from "../../useMedia";
const CardRoot = forwardRef(
  ({ role, style, size = "auto", ...props }, ref) => {
    const { md, xl } = useMedia();
    const space = useMemo(() => {
      if (size === "sm")
        return "xs";
      if (size === "xs")
        return "xxs";
      if (size === "auto") {
        if (xl)
          return "lg";
        if (md)
          return "md";
      }
      return "xs";
    }, [size, md, xl]);
    return /* @__PURE__ */ jsx(
      YBox,
      {
        ref,
        role,
        space,
        ...props,
        style: composeStyles(
          cardStyles.root,
          spacingStyle[size],
          props.pressable && cardStyles.rootLink,
          style
        )
      }
    );
  }
);
CardRoot.displayName = "Card";
export {
  CardRoot
};
//# sourceMappingURL=Root.js.map