# tableberg/1.1.5/admin/src/components/NavigationHeaderButton.jsx

Tableberg – Simple Gutenberg Table Block, version 1.1.5. 40 lines.

- Page: https://pluginprobe.com/plugins/tableberg/1.1.5/code/admin/src/components/NavigationHeaderButton.jsx
- Raw: https://pluginprobe.com/plugins/tableberg/1.1.5/raw/admin/src/components/NavigationHeaderButton.jsx
- Modified: 2026-09-16T03:30:32+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/tableberg/1.1.5/code/admin/src/components/NavigationHeaderButton.jsx#L10-L20`.

```jsx
import React from "react";

/**
 * Navigation header button component.
 *
 * @param {Object}   props                component properties
 * @param {string}   props.title          button title
 * @param {string}   props.targetPath     target path
 * @param {Function} props.onClickHandler click handler, will call with targetPath as first argument
 * @param {boolean}  props.isActive       button active status
 * @class
 */
function NavigationHeaderButton({
    title,
    targetPath,
    onClickHandler,
    isActive = false,
}) {
    const onClickHandlerDefault = () => onClickHandler(targetPath);

    return (
        <div
            data-active={isActive}
            data-path={targetPath}
            className={"tableberg-menu-navigation-header-button"}
            tabIndex={0}
            role={"button"}
            onClick={onClickHandlerDefault}
            onKeyDown={onClickHandlerDefault}
        >
            {title}
        </div>
    );
}

/**
 * @module NavigationHeaderButton
 */
export default NavigationHeaderButton;

```