@syncognito/maya
Version:
Maya Design System - Shared tokens and platform-specific components
36 lines • 1.1 kB
JavaScript
'use client';
import { jsx as _jsx } from "react/jsx-runtime";
import { typography, spacing, shadows } from '../../tokens';
export const Card = ({ children, variant = 'default', padding = 'md', style, }) => {
const baseStyles = {
backgroundColor: '#ffffff',
borderRadius: '8px',
fontFamily: typography.fontFamily.sans,
...style,
};
const variantStyles = {
default: {
border: '1px solid #e5e7eb',
boxShadow: shadows.none,
},
elevated: {
border: 'none',
boxShadow: shadows.component.card.elevated,
},
outlined: {
border: '1px solid #e5e7eb',
boxShadow: shadows.none,
},
}[variant];
const paddingStyles = {
sm: { padding: spacing.sm },
md: { padding: spacing.card.padding },
lg: { padding: spacing.lg },
}[padding];
return (_jsx("div", { style: {
...baseStyles,
...variantStyles,
...paddingStyles,
}, children: children }));
};
//# sourceMappingURL=Card.js.map