> ## Documentation Index
> Fetch the complete documentation index at: https://developer.watson-orchestrate.ibm.com/llms.txt
> Use this file to discover all available pages before exploring further.

# customPanel.close()

Closes the custom panel and returns the user to the chat view. Call [`instance.customPanels.getPanel()`](customPanels_getPanel) first to get the panel instance.

## Syntax

```javascript theme={null}
await customPanel.close();
```

## Parameters

None.

## Returns

**Promise\<void>**

Returns a promise that resolves when the panel is closed.

## Example

The following example opens a panel with an accept button that closes the panel programmatically when clicked:

```javascript theme={null}
const customPanel = instance.customPanels.getPanel();

customPanel.hostElement.innerHTML = `
  <div style="padding: 16px;">
    <p>Please confirm your one-time password to proceed.</p>
    <input id="otp-input" type="text" placeholder="Enter OTP" />
    <button id="confirm-btn">Confirm</button>
  </div>
`;

document.getElementById('confirm-btn').addEventListener('click', async () => {
  const otp = document.getElementById('otp-input').value;
  // Validate OTP...
  await customPanel.close();
});

await customPanel.open({ title: 'Confirm Payment', hideBackButton: true });
```

> **[Do you need practical examples?](https://www.ibm.com/docs/SSAVQO/deploy/web_chat_agent/tutorials/tutorials_lp.html)**
>
> Learn how to apply the features available for embedded chat into your implementation with guidance and examples.
