const defaultProps = {
  page: 'design-system',
  variant: 'light',
};

const languages = [
  { label: 'English', to: '' },
  { label: 'Deutsch', to: '' },
  { label: 'Italiano', to: '' }
];

<div>
  <p>Light variant with language menu:</p>
  <Footer
    {...defaultProps}
    languageMenu={<LanguageMenu items={languages}>English</LanguageMenu>}
  />

  <p>Light variant without language menu:</p>
  <Footer
    {...defaultProps}
  />
    
  <p>Light variant with custom handler for Privacy Settings link:</p>
  <Footer
      {...defaultProps}
      onClickPrivacySettings={() => window.alert('"Privacy Settings" link was clicked!')}
  />

  <p>Dark variant with language menu:</p>
  <Footer
    {...defaultProps}
    variant="dark"
    languageMenu={<LanguageMenu items={languages} variant="dark">English</LanguageMenu>}/>

  <p>Dark variant without language menu:</p>
  <Footer
    {...defaultProps}
    variant="dark"
  />
</div>

Tracking setup

Note: This component supports declarative tracking, and no further actions are needed when it used in in an app already setup with lib-tracking 1.x.