36 lines
904 B
TypeScript
36 lines
904 B
TypeScript
import cx from 'clsx';
|
|
import { isNil } from 'lodash-es';
|
|
import { useMemo } from 'react';
|
|
import { schemeType, SchemeType } from '../models';
|
|
import { Badge } from './Badge';
|
|
import styles from './SchemeSign.module.css';
|
|
|
|
type SchemeSignProps = {
|
|
scheme?: SchemeType;
|
|
short?: boolean;
|
|
};
|
|
|
|
export function SchemeSign({ scheme, short = false }: SchemeSignProps) {
|
|
const schemeName = schemeType(scheme, short);
|
|
const signColorStyles = useMemo(() => {
|
|
switch (scheme) {
|
|
case 'q_scheme':
|
|
return styles.q;
|
|
case 'swatch_scheme':
|
|
return styles.swatch;
|
|
case 'material_2':
|
|
return styles.m2;
|
|
case 'material_3':
|
|
return styles.m3;
|
|
case 'material_3_dynamic':
|
|
return styles.m3d;
|
|
}
|
|
}, [scheme]);
|
|
|
|
return (
|
|
!isNil(scheme) && (
|
|
<Badge extendClassName={cx(styles.badge, signColorStyles)}>{schemeName}</Badge>
|
|
)
|
|
);
|
|
}
|