VegaComponentConfig

Defined in: parser/types.ts:1199

The VegaComponentConfig interface is used to define the properties of a Vega Component. This component is used to render a Vega/Vega-Lite Component by adding Vega/Vega-Lite specs within the reVISit config itself.

To do this, would use the following snippet:

{
 "type": "vega",
 "config": { ... vega specs here ...},
}

IIf you are using Vega, you can use signals with `revisitAnswer` to send the user's responses back to the reVISit. For example, you can use the following snippet in your Vega spec's signals section:
```js
{
 "signals": [
   {
     "name": "revisitAnswer",
     "value": {},
     "on": [
       {
         "events": "rect:click",
         "update": "{responseId: 'vegaDemoResponse1', response: datum.category}"
       }
     ]
   }
 ]
}

In this example, when a user clicks on a rectangle in the Vega chart, the revisitAnswer signal is updated with the responseId and response.

Extends

• BaseIndividualComponent

Properties

Property	Type	Description	Inherited from	Defined in
allowFailedTraining?	boolean	Controls whether the component should allow failed training. If present, will override the allow failed training setting in the uiConfig.	BaseIndividualComponent.allowFailedTraining	parser/types.ts:936
clickToRecord?	boolean	Enables a click-and-hold microphone button instead of continuous recording. When true, audio is muted by default and is recorded only while the button is held. When false, recording starts immediately and can be paused/resumed via the microphone button. Defaults to false.	BaseIndividualComponent.clickToRecord	parser/types.ts:940
config	object	The vega or vega-lite configuration.	-	parser/types.ts:1202
correctAnswer?	Answer[]	The correct answer to the component. This is used for training trials where the user is shown the correct answer after a guess.	BaseIndividualComponent.correctAnswer	parser/types.ts:896
description?	string	The description of the component. This is used to identify and provide additional information for the component in the admin panel.	BaseIndividualComponent.description	parser/types.ts:900
enumerateQuestions?	boolean	Whether to prepend questions with their index (+ 1). This should only be used when all questions are in the same location, e.g. all are in the side bar. If present, will override the enumeration of questions setting in the uiConfig.	BaseIndividualComponent.enumerateQuestions	parser/types.ts:944
helpTextPath?	string	The path to the help text file. This is displayed when a participant clicks help. Markdown is supported. If present, will override the help text path set in the uiConfig.	BaseIndividualComponent.helpTextPath	parser/types.ts:916
instruction?	string	The instruction of the component. This is used to identify and provide additional information for the component in the admin panel.	BaseIndividualComponent.instruction	parser/types.ts:912
instructionLocation?	ConfigResponseBlockLocation	The location of the instructions. If present, will override the instruction location setting in the uiConfig.	BaseIndividualComponent.instructionLocation	parser/types.ts:914
meta?	Record<string, unknown>	The meta data for the component. This is used to identify and provide additional information for the component in the admin panel.	BaseIndividualComponent.meta	parser/types.ts:898
nextButtonDisableTime?	number	The time in milliseconds to wait before the next button is disabled. If present, will override the next button disable time setting in the uiConfig.	BaseIndividualComponent.nextButtonDisableTime	parser/types.ts:926
nextButtonEnableTime?	number	The time in milliseconds to wait before the next button is enabled. If present, will override the next button enable time setting in the uiConfig.	BaseIndividualComponent.nextButtonEnableTime	parser/types.ts:924
nextButtonLocation?	ConfigResponseBlockLocation	The location of the next button. If present, will override the next button location setting in the uiConfig.	BaseIndividualComponent.nextButtonLocation	parser/types.ts:922
nextButtonText?	string	The text to display on the next button. If present, will override the next button text setting in the uiConfig.	BaseIndividualComponent.nextButtonText	parser/types.ts:920
nextOnEnter?	boolean	Whether enter key should move to the next question. If present, will override the enter key setting in the uiConfig.	BaseIndividualComponent.nextOnEnter	parser/types.ts:918
previousButton?	boolean	Whether to show the previous button. If present, will override the previous button setting in the uiConfig.	BaseIndividualComponent.previousButton	parser/types.ts:928
previousButtonText?	string	The text that is displayed on the previous button. If present, will override the previous button text setting in the uiConfig.	BaseIndividualComponent.previousButtonText	parser/types.ts:930
provideFeedback?	boolean	Controls whether the component should provide feedback to the participant, such as in a training trial. If present, will override the provide feedback setting in the uiConfig.	BaseIndividualComponent.provideFeedback	parser/types.ts:932
recordAudio?	boolean	Whether or not we want to utilize think-aloud features. If present, will override the record audio setting in the uiConfig.	BaseIndividualComponent.recordAudio	parser/types.ts:938
recordScreen?	boolean	Whether or not we want to utilize screen recording feature. If present, will override the record screen setting in the uiConfig. If true, the uiConfig must have recordScreen set to true or the screen will not be captured. It's also required that the library component, $screen-recording.components.screenRecordingPermission, be included in the study at some point before this component to ensure permissions are granted and screen capture has started.	BaseIndividualComponent.recordScreen	parser/types.ts:942
response	Response[]	The responses to the component	BaseIndividualComponent.response	parser/types.ts:892
responseDividers?	boolean	Whether to show the response dividers. If present, will override the response dividers setting in the uiConfig.	BaseIndividualComponent.responseDividers	parser/types.ts:946
responseOrder?	"random" | "fixed"	The order of the responses. Defaults to 'fixed'.	BaseIndividualComponent.responseOrder	parser/types.ts:950
showTitle?	boolean	Controls whether the title should be hidden in the study. If present, will override the title setting in the uiConfig.	BaseIndividualComponent.showTitle	parser/types.ts:908
showTitleBar?	boolean	Controls whether the title bar should be hidden in the study. If present, will override the title bar setting in the uiConfig.	BaseIndividualComponent.showTitleBar	parser/types.ts:910
sidebarWidth?	number	The width of the left sidebar. If present, will override the sidebar width setting in the uiConfig.	BaseIndividualComponent.sidebarWidth	parser/types.ts:906
style?	Styles	You can set styles here, using React CSSProperties, for example: {"width": 100} or {"width": "50%"}	BaseIndividualComponent.style	parser/types.ts:954
stylesheetPath?	string	The path to the external stylesheet file.	BaseIndividualComponent.stylesheetPath	parser/types.ts:952
trainingAttempts?	number	The number of training attempts allowed for the component. If present, will override the training attempts setting in the uiConfig.	BaseIndividualComponent.trainingAttempts	parser/types.ts:934
type	"vega"	-	-	parser/types.ts:1200
windowEventDebounceTime?	number	Debounce time in milliseconds for automatically tracked window events. If present, will override the window event debounce time setting in the uiConfig.	BaseIndividualComponent.windowEventDebounceTime	parser/types.ts:948
withActions?	boolean	Whether to include vega actions. Defaults to true.	-	parser/types.ts:1204
withProgressBar?	boolean	Controls whether the progress bar is rendered. If present, will override the progress bar setting in the uiConfig.	BaseIndividualComponent.withProgressBar	parser/types.ts:902
withSidebar?	boolean	Controls whether the left sidebar is rendered at all. Required to be true if your response's location is set to sidebar for any question. If present, will override the sidebar setting in the uiConfig.	BaseIndividualComponent.withSidebar	parser/types.ts:904