@itwin/itwinui-react/esm/core/Footer/Footer.d.ts

A react component library for iTwinUI

import * as React from 'react';
import type { CommonProps } from '../../utils/index.js';
export type TitleTranslations = {
    termsOfService?: string;
    privacy?: string;
    termsOfUse?: string;
    cookies?: string;
    legalNotices?: string;
};
type FooterProps = {
    /**
     * Customize footer elements.
     * Providing a `FooterElement[]` will append the custom elements to the end of the default elements.
     * Providing a function that returns a `FooterElement[]` allows further customization - whatever is returned from the function is displayed in the footer with no amendments.
     */
    customElements?: FooterElement[] | ((defaultElements: FooterElement[]) => FooterElement[]);
    /**
     * Provide localized strings.
     */
    translatedTitles?: TitleTranslations;
    /**
     * Custom footer content. If provided, it will render only what you passed.
     * Use `defaultFooterElements` to get the default footer elements.
     */
    children?: React.ReactNode;
} & CommonProps;
export type FooterElement = {
    /**
     * Title of the footer element.
     */
    title: string;
    /**
     * URL of the footer element.
     */
    url?: string;
    /**
     * Key of the footer element.
     */
    key?: keyof TitleTranslations | 'copyright' | (string & Record<never, never>);
};
export declare const defaultFooterElements: FooterElement[];
/**
 * Footer element with all needed legal and info links.
 * Be sure to place it manually at the bottom of your page.
 * You can use position 'absolute' with relative body or set the height of the content and place footer at the end.
 * @example <caption>Appending custom element after default elements</caption>
 * <Footer customElements={[{title: 'Bentley', url: 'https://www.bentley.com/'}]} />
 * @example <caption>Returning only custom elements</caption>
 * <Footer customElements={() => newFooterElements)} />
 * @example <caption>Filtering out a specific element</caption>
 * <Footer customElements={(defaultElements) => defaultElements.filter(({ key }) => key !== 'privacy' )} />
 * @example <caption>Changing a url</caption>
 * <Footer customElements={(defaultElements) => defaultElements.map(element => ({ ...element, url: element.key === 'privacy' ? customPrivacyUrl : element.url }))} />
 */
export declare const Footer: ((props: FooterProps) => React.JSX.Element) & {
    List: import("../../utils/props.js").PolymorphicForwardRefComponent<"ul", {}>;
    Item: import("../../utils/props.js").PolymorphicForwardRefComponent<"li", {}>;
    Separator: import("../../utils/props.js").PolymorphicForwardRefComponent<"li", {}>;
};
export {};