2023-12-16 19:20:26 +03:00
|
|
|
import { BiInfoCircle } from 'react-icons/bi';
|
|
|
|
|
2023-12-13 14:32:57 +03:00
|
|
|
import ConceptTooltip from '@/components/Common/ConceptTooltip';
|
|
|
|
import TextURL from '@/components/Common/TextURL';
|
2023-12-26 14:23:51 +03:00
|
|
|
import { HelpTopic } from '@/models/miscellaneous';
|
2023-12-13 14:32:57 +03:00
|
|
|
|
2023-12-18 19:42:27 +03:00
|
|
|
import { CProps } from '../props';
|
2023-12-05 01:22:44 +03:00
|
|
|
import InfoTopic from './InfoTopic';
|
|
|
|
|
2023-12-18 19:42:27 +03:00
|
|
|
interface HelpButtonProps
|
|
|
|
extends CProps.Styling {
|
2023-12-05 01:22:44 +03:00
|
|
|
topic: HelpTopic
|
|
|
|
offset?: number
|
|
|
|
}
|
|
|
|
|
2023-12-18 19:42:27 +03:00
|
|
|
function HelpButton({ topic, ...restProps }: HelpButtonProps) {
|
2023-12-05 01:22:44 +03:00
|
|
|
return (
|
2023-12-18 20:45:33 +03:00
|
|
|
<div
|
|
|
|
id={`help-${topic}`}
|
|
|
|
className='p-1'
|
|
|
|
>
|
|
|
|
<BiInfoCircle size='1.25rem' className='clr-text-primary' />
|
2023-12-05 01:22:44 +03:00
|
|
|
<ConceptTooltip clickable
|
|
|
|
anchorSelect={`#help-${topic}`}
|
|
|
|
layer='z-modal-tooltip'
|
2023-12-18 19:42:27 +03:00
|
|
|
{...restProps}
|
2023-12-05 01:22:44 +03:00
|
|
|
>
|
|
|
|
<div className='relative'>
|
|
|
|
<div className='absolute right-0 text-sm top-[0.4rem]'>
|
|
|
|
<TextURL text='Справка...' href={`/manuals?topic=${topic}`} />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<InfoTopic topic={topic} />
|
|
|
|
</ConceptTooltip>
|
2023-12-18 20:45:33 +03:00
|
|
|
</div>);
|
2023-12-05 01:22:44 +03:00
|
|
|
}
|
|
|
|
|
2023-12-13 14:32:57 +03:00
|
|
|
export default HelpButton;
|