Usage
import { useScreenBrightness } from 'node-fullykiosk';
function App() {
const { brightness, setBrightness } = useScreenBrightness();
return (
<div>
<p>Current brightness: {brightness}</p>
<button onClick={() => setBrightness(128)}>
Set to 50%
</button>
<button onClick={() => setBrightness(255)}>
Set to 100%
</button>
</div>
);
}
Return Value
Returns an object with the following properties:
The current screen brightness value between 0 and 255. Returns undefined if not running in Fully Kiosk Browser.
setBrightness
(brightness: number) => void
Function to set the screen brightness. Accepts a number between 0 (darkest) and 255 (brightest).
Examples
Brightness Slider
import { useScreenBrightness } from 'node-fullykiosk';
function BrightnessControl() {
const { brightness, setBrightness } = useScreenBrightness();
return (
<div>
<label>Brightness: {brightness}</label>
<input
type="range"
min="0"
max="255"
value={brightness ?? 128}
onChange={(e) => setBrightness(Number(e.target.value))}
/>
</div>
);
}
Preset Brightness Levels
import { useScreenBrightness } from 'node-fullykiosk';
function PresetBrightness() {
const { brightness, setBrightness } = useScreenBrightness();
const presets = [
{ label: 'Low', value: 64 },
{ label: 'Medium', value: 128 },
{ label: 'High', value: 192 },
{ label: 'Max', value: 255 },
];
return (
<div>
<p>Current: {brightness}</p>
{presets.map(({ label, value }) => (
<button key={label} onClick={() => setBrightness(value)}>
{label}
</button>
))}
</div>
);
}