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

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

- Page: https://pluginprobe.com/plugins/tableberg/1.1.5/code/admin/src/components/ToggleControl.jsx
- Raw: https://pluginprobe.com/plugins/tableberg/1.1.5/raw/admin/src/components/ToggleControl.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/ToggleControl.jsx#L10-L20`.

```jsx
import React, { useEffect, useRef, useState } from "react";

/**
 * Toggle control component.
 *
 * @class
 * @param {Object}   props                component properties
 * @param {boolean}  props.status         control status
 * @param {boolean}  props.name           control name
 * @param {boolean}  props.disabled       control disabled status
 * @param {Function} props.onStatusChange status changed callback
 */
function ToggleControl({
    status,
    name,
    onStatusChange = () => {},
    disabled = false,
}) {
    /**
     * Click handler for toggle component.
     */
    const clickHandler = () => {
        if (!disabled) {
            onStatusChange(!status, name);
        }
    };

    return (
        <div
            onClick={clickHandler}
            className={"tableberg-toggle-control"}
            data-enabled={JSON.stringify(disabled || status)}
            role={"button"}
        >
            <div className={"knob"}></div>
        </div>
    );
}

/**
 * @module ToggleControl
 */
export default ToggleControl;

```