# betterdocs/4.9.5/react-src/admin/settings/fields/Header.js

BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot, version 4.9.5. 44 lines.

- Page: https://pluginprobe.com/plugins/betterdocs/4.9.5/code/react-src/admin/settings/fields/Header.js
- Raw: https://pluginprobe.com/plugins/betterdocs/4.9.5/raw/react-src/admin/settings/fields/Header.js
- Modified: 2026-10-12T10:07:14+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/betterdocs/4.9.5/code/react-src/admin/settings/fields/Header.js#L10-L20`.

```javascript
import React from "react";

const Header = (props) => {
    return (
        <div
            className={`wprf-control-wrapper wprf-settings-section-header wprf-section-header wprf-direction-${props?.direction}`}
        >
            {props?.icon ? (
                <div
                    className="wprf-icon header-icon"
                    dangerouslySetInnerHTML={{ __html: props?.icon }}
                />
            ) : (
                ""
            )}
            <div className="wprf-content">
                <h4
                    className="wprf-title"
                    dangerouslySetInnerHTML={{ __html: props.title }}
                />
                <p
                    className="wprf-description"
                    dangerouslySetInnerHTML={{ __html: props.description }}
                />
            </div>
            {props?.links ? (
                <div className="wprf-link-wrapper">
                    {props?.links?.map((link) => (
                        <a
                            href={link?.url}
                            target="_blank"
                            dangerouslySetInnerHTML={{ __html: link?.label }}
                        />
                    ))}
                </div>
            ) : (
                ""
            )}
        </div>
    );
};

export default Header;

```