openpencil/packages/docs/programmable/sdk/api/advanced/use-variables-dialog-state.md

title	description
useVariablesDialogState	Manage variables dialog editing state on top of useVariables().

useVariablesDialogState

useVariablesDialogState() builds on useVariables() and adds dialog-specific editing state for collection renaming and focus management.

Use it when you are building a custom variables dialog rather than only consuming the combined useVariablesEditor() helper.

Usage

import { useVariablesDialogState } from '@open-pencil/vue'

const variablesDialog = useVariablesDialogState()

Adds to useVariables()

• editingCollectionId
• setCollectionInputRef()
• startRenameCollection()
• commitRenameCollection()

Related APIs

• useVariables
• useVariablesEditor