@tipp/ui 1.0.37 → 1.0.39

package/src/atoms/card.tsx

@@ -1 +1,45 @@
-export { Card, type CardProps } from '@radix-ui/themes';
+import { forwardRef, useMemo } from 'react';
+import {
+  Card as RadixCard,
+  type CardProps as RadixCardProps,
+} from '@radix-ui/themes';
+
+export type CardProps = RadixCardProps & {
+  borderRadius?: 'none';
+  borderDisable?: {
+    left?: boolean;
+    right?: boolean;
+    top?: boolean;
+    bottom?: boolean;
+  };
+};
+
+export const Card = forwardRef<HTMLDivElement, CardProps>(
+  (props, forwardedRef) => {
+    const { borderDisable, borderRadius, ...rest } = props;
+
+    const borderInsetClassName = useMemo(() => {
+      if (!borderDisable) return '';
+      const { left, right, top, bottom } = borderDisable;
+      return [
+        left && 'disable-inset-left',
+        right && 'disable-inset-right',
+        top && 'disable-inset-top',
+        bottom && 'disable-inset-bottom',
+      ]
+        .filter(Boolean)
+        .join(' ');
+    }, [borderDisable]);
+
+    return (
+      <RadixCard
+        {...rest}
+        className={`${borderInsetClassName} ${rest.className}`}
+        data-radius={borderRadius}
+        ref={forwardedRef}
+      />
+    );
+  }
+);
+
+Card.displayName = 'Card';