BaseHeader

Import

import { BaseHeader } from 'binak-react-components';

Using with active style:

import { BaseHeader, headerActiveStyle } from 'binak-react-components';

Props

Name	Type	Default Value
leftContent	ReactNode	undefined
rightContent	ReactNode	undefined
...props	header props	-

Example

const [language, setLanguage] = useState('en');
return (
  <>
    <BaseHeader
      leftContent={
        <>
          <button>Header Button 1</button>
          <button style={headerActiveStyle}>Header Button 2</button>

          <img src={logoImage} alt="" style={{ marginLeft: '1rem' }} />
        </>
      }
      rightContent={
        <>
          <button
            onClick={() => setLanguage('tr')}
            style={language === 'tr' ? headerActiveStyle : {}}
          >
            Türkçe
          </button>
          <button
            onClick={() => setLanguage('de')}
            style={language === 'de' ? headerActiveStyle : {}}
          >
            Deutsch
          </button>
          <button
            onClick={() => setLanguage('en')}
            style={language === 'en' ? headerActiveStyle : {}}
          >
            English
          </button>
          <img src={logoImage} alt="" style={{ marginLeft: '1rem' }} />
        </>
      }
    />
    ;
  </>
);