2023-05-05 23:23:34 +08:00
|
|
|
import {FC, ReactElement} from 'react';
|
|
|
|
import {Label, Tooltip} from '@fluentui/react-components';
|
|
|
|
|
|
|
|
export const Labeled: FC<{ label: string; desc?: string, content: ReactElement }> = ({label, desc, content}) => {
|
|
|
|
return (
|
2023-05-06 20:17:39 +08:00
|
|
|
<div className="grid grid-cols-2 items-center">
|
2023-05-05 23:23:34 +08:00
|
|
|
{desc ?
|
|
|
|
<Tooltip content={desc} showDelay={0} hideDelay={0} relationship="description">
|
2023-05-06 20:17:39 +08:00
|
|
|
<Label>{label}</Label>
|
2023-05-05 23:23:34 +08:00
|
|
|
</Tooltip> :
|
2023-05-06 20:17:39 +08:00
|
|
|
<Label>{label}</Label>
|
2023-05-05 23:23:34 +08:00
|
|
|
}
|
|
|
|
{content}
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|