---
title: useComponentHideState
summary: Introduces the `useComponentHideState` hook for getting whether a widget should be shown or hidden.
---

# useComponentHideState

> `useComponentHideState` can only be used inside widget components that have been registered with the player.


The player has built-in logic for the following behavior: click the player to hide all **Widgets**; click again to show all **Widgets**; or hide all **Widgets** after a period of inactivity.

This hook is used to determine whether a **Widget** on the current screen should be displayed. `true` means it should be shown, and `false` means it should be hidden.

## Type Definition

```tsx
export type useComponentHideState = () => [boolean];
```

## UsageExample

```jsx
import React, { useEffect } from 'react';
import { View } from '@ray-js/components';
import {
  ComponentConfigProps,useComponentHideState
} from '@ray-js/ipc-player-integration';

function Widget1(props: ComponentConfigProps) {
  const [state] = useComponentHideState()
  console.log(state, 'state')
  
  return null;
}
```