@react-three/uikit-default
Version:
Default (shadcn) kit for @react-three/uikit
27 lines (26 loc) • 1.45 kB
JavaScript
import { Container, DefaultProperties, } from '@react-three/uikit';
import React, { forwardRef } from 'react';
import { borderRadius, colors } from './theme.js';
const alertVariants = {
default: {},
destructive: {
borderColor: colors.destructive,
borderOpacity: 0.5,
color: colors.destructive,
},
};
export const Alert = forwardRef((props, ref) => {
return (React.createElement(DefaultProperties, { ...alertVariants[props.variant ?? 'default'] },
React.createElement(Container, { flexDirection: "column", positionType: "relative", width: "100%", borderRadius: borderRadius.lg, borderWidth: 1, padding: 16, ref: ref, ...props })));
});
export const AlertIcon = forwardRef((props, ref) => {
return React.createElement(Container, { positionLeft: 16, positionTop: 16, positionType: "absolute", ref: ref, ...props });
});
export const AlertTitle = forwardRef(({ children, ...props }, ref) => {
return (React.createElement(Container, { marginBottom: 4, padding: 0, paddingLeft: 28, ref: ref, ...props },
React.createElement(DefaultProperties, { fontWeight: "medium", letterSpacing: -0.4, lineHeight: "100%" }, children)));
});
export const AlertDescription = forwardRef(({ children, ...props }, ref) => {
return (React.createElement(Container, { paddingLeft: 28, ref: ref, ...props },
React.createElement(DefaultProperties, { lineHeight: "162.5%", fontSize: 14 }, children)));
});