@itwin/itwinui-react/esm/core/Footer/Footer.js

A react component library for iTwinUI

import * as React from 'react';
import cx from 'classnames';
import { Box } from '../../utils/index.js';
import { FooterItem } from './FooterItem.js';
import { FooterSeparator } from './FooterSeparator.js';
import { FooterList } from './FooterList.js';
import { Anchor } from '../Typography/Anchor.js';
let defaultTranslatedTitles = {
  cookies: 'Cookies',
  legalNotices: 'Legal notices',
  privacy: 'Privacy',
  termsOfService: 'Terms of service',
  termsOfUse: 'Terms of use',
};
export const defaultFooterElements = [
  {
    key: 'copyright',
    title: `© ${new Date().getFullYear()} Bentley Systems, Incorporated`,
  },
  {
    key: 'termsOfService',
    title: defaultTranslatedTitles.termsOfService,
    url: 'https://connect-agreementportal.bentley.com/AgreementApp/Home/Eula/view/readonly/BentleyConnect',
  },
  {
    key: 'privacy',
    title: defaultTranslatedTitles.privacy,
    url: 'https://www.bentley.com/en/privacy-policy',
  },
  {
    key: 'termsOfUse',
    title: defaultTranslatedTitles.termsOfUse,
    url: 'https://www.bentley.com/en/terms-of-use-and-select-online-agreement',
  },
  {
    key: 'cookies',
    title: defaultTranslatedTitles.cookies,
    url: 'https://www.bentley.com/en/cookie-policy',
  },
  {
    key: 'legalNotices',
    title: defaultTranslatedTitles.legalNotices,
    url: 'https://connect.bentley.com/Legal',
  },
];
export const Footer = Object.assign(
  (props) => {
    let { children, customElements, translatedTitles, className, ...rest } =
      props;
    let titles = {
      ...defaultTranslatedTitles,
      ...translatedTitles,
    };
    let translatedElements = defaultFooterElements.map((element) => {
      if (element.key && titles.hasOwnProperty(element.key)) {
        let key = element.key;
        return {
          ...element,
          title: titles[key],
        };
      }
      return element;
    });
    let elements = translatedElements;
    if (customElements)
      elements =
        'function' == typeof customElements
          ? customElements(translatedElements)
          : [...translatedElements, ...customElements];
    return React.createElement(
      Box,
      {
        as: 'footer',
        className: cx('iui-legal-footer', className),
        ...rest,
      },
      children
        ? children
        : React.createElement(
            FooterList,
            null,
            elements.map((element, index) =>
              React.createElement(
                React.Fragment,
                {
                  key: element.key || `${element.title}-${index}`,
                },
                index > 0 && React.createElement(FooterSeparator, null),
                React.createElement(
                  FooterItem,
                  null,
                  element.url
                    ? React.createElement(
                        Anchor,
                        {
                          href: element.url,
                          target: '_blank',
                          rel: 'noreferrer',
                        },
                        element.title,
                      )
                    : element.title,
                ),
              ),
            ),
          ),
    );
  },
  {
    List: FooterList,
    Item: FooterItem,
    Separator: FooterSeparator,
  },
);
if ('development' === process.env.NODE_ENV) Footer.displayName = 'Footer';