Skip to content

Instantly share code, notes, and snippets.

@kkinder
Created February 6, 2020 20:23
Show Gist options
  • Save kkinder/a519ebda65ab3daa9bc6ce128287a109 to your computer and use it in GitHub Desktop.
Save kkinder/a519ebda65ab3daa9bc6ce128287a109 to your computer and use it in GitHub Desktop.
Quasar Live Templates for Jetbrains IDEs
<templateSet group="Quasar">
<template name="q-ajax-bar" value="&lt;q-ajax-bar&#10; ref=&quot;$ref$&quot;&#10; position=&quot;$position$&quot;&#10; color=&quot;$color$&quot;&#10; size=&quot;$size$&quot;&#10; skip-hijack/&gt;&#10;" description="Ajax Bar" toReformat="true" toShortenFQNames="true">
<variable name="ref" expression="" defaultValue="&quot;bar&quot;" alwaysStopAt="true" />
<variable name="position" expression="" defaultValue="&quot;bottom&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;accent&quot;" alwaysStopAt="true" />
<variable name="size" expression="" defaultValue="&quot;10px&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-dialog" value="&lt;q-dialog v-model=&quot;$model$&quot;&gt;&#10; &lt;q-card&gt;&#10; &lt;q-card-section class=&quot;row items-center q-pb-none&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;$title$&lt;/div&gt;&#10; &lt;q-space /&gt;&#10; &lt;q-btn icon=&quot;close&quot; flat round dense v-close-popup /&gt;&#10; &lt;/q-card-section&gt;&#10;&#10; &lt;q-card-section&gt;&#10; $SELECTION$&#10; &lt;/q-card-section&gt;&#10; &lt;/q-card&gt;&#10;&lt;/q-dialog&gt;&#10;" description="Dialog" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="title" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-avatar" value="&lt;q-avatar color=&quot;$color$&quot; text-color=&quot;$textColor$&quot; icon=&quot;$icon$&quot; /&gt;" description="Avatar" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;red&quot;" alwaysStopAt="true" />
<variable name="textColor" expression="" defaultValue="&quot;white&quot;" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="&quot;directions&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-badge" value="&lt;q-badge color=&quot;$color$&quot;&gt;$SELECTION$&lt;/q-badge&gt;" description="Badge" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;blue&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-banner" value="&lt;q-banner class=&quot;bg-primary text-white&quot;&gt;&#10; $SELECTION$&#10; &lt;template v-slot:action&gt;&#10; &lt;q-btn flat color=&quot;white&quot; label=&quot;Dismiss&quot; /&gt;&#10; &lt;/template&gt;&#10;&lt;/q-banner&gt;" description="Banner" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-bar" value="&lt;q-bar&gt;&#10; &lt;q-btn dense flat :icon=&quot;fabApple&quot; /&gt;&#10; &lt;div class=&quot;text-weight-bold&quot;&gt;&#10; $app$&#10; &lt;/div&gt;&#10; &lt;div class=&quot;cursor-pointer gt-md&quot;&gt;File&lt;/div&gt;&#10; &lt;div class=&quot;cursor-pointer gt-md&quot;&gt;Edit&lt;/div&gt;&#10; &lt;div class=&quot;cursor-pointer gt-md&quot;&gt;View&lt;/div&gt;&#10; &lt;div class=&quot;cursor-pointer gt-md&quot;&gt;Window&lt;/div&gt;&#10; &lt;div class=&quot;cursor-pointer gt-md&quot;&gt;Help&lt;/div&gt;&#10; &lt;q-space /&gt;&#10; &lt;q-btn dense flat icon=&quot;airplay&quot; class=&quot;gt-xs&quot; /&gt;&#10; &lt;q-btn dense flat icon=&quot;battery_charging_full&quot; /&gt;&#10; &lt;q-btn dense flat icon=&quot;wifi&quot; /&gt;&#10; &lt;div&gt;9:41&lt;/div&gt;&#10; &lt;q-btn dense flat icon=&quot;search&quot; /&gt;&#10; &lt;q-btn dense flat icon=&quot;list&quot; /&gt;&#10;&lt;/q-bar&gt;" description="Bar" toReformat="true" toShortenFQNames="true">
<variable name="app" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-breadcrumbs" value="&lt;q-breadcrumbs&gt;&#10; &lt;q-breadcrumbs-el label=&quot;$label1$&quot; icon=&quot;$icon1$&quot; /&gt;&#10; &lt;q-breadcrumbs-el label=&quot;$label2$&quot; icon=&quot;$icon2$&quot; /&gt;&#10; &lt;q-breadcrumbs-el label=&quot;$label3$&quot; /&gt;&#10;&lt;/q-breadcrumbs&gt;&#10;" description="Breadcrumbs" toReformat="true" toShortenFQNames="true">
<variable name="label1" expression="" defaultValue="&quot;Home&quot;" alwaysStopAt="true" />
<variable name="icon1" expression="" defaultValue="&quot;home&quot;" alwaysStopAt="true" />
<variable name="label2" expression="" defaultValue="&quot;Components&quot;" alwaysStopAt="true" />
<variable name="icon2" expression="" defaultValue="&quot;widgets&quot;" alwaysStopAt="true" />
<variable name="label3" expression="" defaultValue="&quot;Breadcrumbs&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-btn" value="&lt;q-btn color=&quot;$color$&quot; icon=&quot;$icon$&quot; label=&quot;$END$&quot;/&gt;" description="Button" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="&quot;camera_enhance&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-btn-group" value="&lt;q-btn-group push&gt;&#10; &lt;q-btn push label=&quot;$label1$&quot; icon=&quot;$icon1$&quot; /&gt;&#10; &lt;q-btn push label=&quot;$label2$&quot; icon=&quot;$icon2$&quot; /&gt;&#10; &lt;q-btn push label=&quot;$label3$&quot; icon=&quot;$icon3$&quot; /&gt;&#10;&lt;/q-btn-group&gt;&#10;" description="Button Group" toReformat="true" toShortenFQNames="true">
<variable name="label1" expression="" defaultValue="&quot;First&quot;" alwaysStopAt="true" />
<variable name="icon1" expression="" defaultValue="&quot;timeline&quot;" alwaysStopAt="true" />
<variable name="label2" expression="" defaultValue="&quot;Second&quot;" alwaysStopAt="true" />
<variable name="icon2" expression="" defaultValue="&quot;visibility&quot;" alwaysStopAt="true" />
<variable name="label3" expression="" defaultValue="&quot;Third&quot;" alwaysStopAt="true" />
<variable name="icon3" expression="" defaultValue="&quot;update&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-btn-dropdown" value="&lt;q-btn-dropdown color=&quot;$color$&quot; label=&quot;$label$&quot;&gt;&#10; &lt;q-list&gt;&#10; &lt;q-item clickable v-close-popup @click=&quot;$click$&quot;&gt;&#10; &lt;q-item-section&gt;&#10; &lt;q-item-label&gt;$itemLabel$&lt;/q-item-label&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10;&lt;/q-btn-dropdown&gt;" description="Button Dropdown" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Dropdown Button&quot;" alwaysStopAt="true" />
<variable name="click" expression="" defaultValue="&quot;onItemClick&quot;" alwaysStopAt="true" />
<variable name="itemLabel" expression="" defaultValue="&quot;Photos&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-card" value="&lt;q-card class=&quot;my-card&quot;&gt;&#10; &lt;q-card-section&gt;&#10; $SELECTION$&#10; &lt;/q-card-section&gt;&#10;&lt;/q-card&gt;" description="Card" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-carousel" value="&lt;q-carousel&#10; v-model=&quot;$model$&quot;&#10; transition-prev=&quot;scale&quot;&#10; transition-next=&quot;scale&quot;&#10; swipeable&#10; animated&#10; control-color=&quot;white&quot;&#10; navigation&#10; padding&#10; arrows&#10; height=&quot;300px&quot;&#10; class=&quot;bg-primary text-white shadow-1 rounded-borders&quot;&#10;&gt;&#10; &lt;q-carousel-slide name=&quot;style&quot; class=&quot;column no-wrap flex-center&quot;&gt;&#10; &lt;q-icon name=&quot;style&quot; size=&quot;56px&quot; /&gt;&#10; &lt;div class=&quot;q-mt-md text-center&quot;&gt;&#10; $SELECTION$&#10; &lt;/div&gt;&#10; &lt;/q-carousel-slide&gt;&#10;&lt;/q-carousel&gt;" description="Carousel" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;slide&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-chat-message" value="&lt;q-chat-message :text=&quot;['$END$']&quot; sent/&gt;" description="Chat Message" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-chip" value="&lt;q-chip icon=&quot;$icon$&quot;&gt;$END$&lt;/q-chip&gt;" description="Chip" toReformat="true" toShortenFQNames="true">
<variable name="icon" expression="" defaultValue="&quot;event&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-circular-progress" value="&lt;q-circular-progress&#10; :value=&quot;$value$&quot;&#10; size=&quot;50px&quot;&#10; color=&quot;$color$&quot;&#10; class=&quot;q-ma-md&quot;&#10;/&gt;" description="Circular Progress" toReformat="true" toShortenFQNames="true">
<variable name="value" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-color" value="&lt;q-color v-model=&quot;$END$&quot; /&gt;" description="Color Picker" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-editor" value="&lt;div class=&quot;q-pa-md q-gutter-sm&quot;&gt;&#10; &lt;q-editor v-model=&quot;$model$&quot; min-height=&quot;5rem&quot; /&gt;&#10;&#10; &lt;q-card flat bordered&gt;&#10; &lt;q-card-section&gt;&#10; &lt;pre style=&quot;white-space: pre-line&quot;&gt;{{ $model$ }}&lt;/pre&gt;&#10; &lt;/q-card-section&gt;&#10; &lt;/q-card&gt;&#10;&#10; &lt;q-card flat bordered&gt;&#10; &lt;q-card-section v-html=&quot;$model$&quot; /&gt;&#10; &lt;/q-card&gt;&#10;&lt;/div&gt;" description="Editor (WYSIWYG)" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-expansion-item" value="&lt;q-list bordered class=&quot;rounded-borders&quot;&gt;&#10; &lt;q-expansion-item&#10; expand-separator&#10; icon=&quot;$icon$&quot;&#10; label=&quot;$label$&quot;&#10; caption=&quot;$caption$&quot;&gt;&#10; &lt;q-card&gt;&#10; &lt;q-card-section&gt;&#10; $SELECTION$&#10; &lt;/q-card-section&gt;&#10; &lt;/q-card&gt;&#10; &lt;/q-expansion-item&gt;&#10;&lt;/q-list&gt;" description="Expansion Item" toReformat="true" toShortenFQNames="true">
<variable name="icon" expression="" defaultValue="&quot;perm_identity&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Account settings&quot;" alwaysStopAt="true" />
<variable name="caption" expression="" defaultValue="&quot;John Doe&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-form" value="&lt;q-form @submit=&quot;$onSubmit$&quot; class=&quot;q-gutter-md&quot;&gt;&#10; $END$&#10; &lt;div&gt;&#10; &lt;q-btn label=&quot;$submitLabel$&quot; type=&quot;submit&quot; color=&quot;primary&quot;/&gt;&#10; &lt;/div&gt;&#10;&lt;/q-form&gt;&#10;" description="Form" toReformat="true" toShortenFQNames="true">
<variable name="onSubmit" expression="" defaultValue="&quot;onSubmit&quot;" alwaysStopAt="true" />
<variable name="submitLabel" expression="" defaultValue="&quot;Submit&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-input" value="&lt;q-input filled v-model=&quot;$mobel$&quot; label=&quot;$label$&quot; /&gt;" description="Input Text Field" toReformat="true" toShortenFQNames="true">
<variable name="mobel" expression="" defaultValue="&quot;textField&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Text Field&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-input-prepend-append" value="&lt;q-input filled v-model=&quot;$model$&quot; label=&quot;$label$&quot;&gt;&#10; &lt;template v-slot:prepend&gt;&#10; &lt;q-icon name=&quot;$icon$&quot; /&gt;&#10; &lt;/template&gt;&#10; &lt;template v-slot:append&gt;&#10; &lt;q-icon name=&quot;$icon2$&quot; @click=&quot;$model$ = ''&quot; class=&quot;cursor-pointer&quot; /&gt;&#10; &lt;/template&gt;&#10;&lt;/q-input&gt;" description="Input (Prepend/Append)" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;textField&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;My Text Field&quot;" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="&quot;event&quot;" alwaysStopAt="true" />
<variable name="icon2" expression="" defaultValue="&quot;close&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-select" value="&lt;q-select v-model=&quot;$model$&quot; :options=&quot;$options$&quot; label=&quot;$label$&quot; /&gt;" description="Selectbox" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;selectField&quot;" alwaysStopAt="true" />
<variable name="options" expression="" defaultValue="&quot;['Google', 'Facebook', 'Twitter', 'Apple', 'Oracle']&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Social Network&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-file" value="&lt;q-file v-model=&quot;$model$&quot; label=&quot;$label$&quot; /&gt;" description="File Uplaod" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;fileField&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;File Upload&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-field" value="&lt;q-field label=&quot;Standard&quot; stack-label&gt;&#10; &lt;template v-slot:control&gt;&#10; &lt;div class=&quot;self-center full-width no-outline&quot; tabindex=&quot;0&quot;&gt;$SELECTION$&lt;/div&gt;&#10; &lt;/template&gt;&#10;&lt;/q-field&gt;" description="Field (Wrapper)" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-radio-list" value="&lt;q-list&gt;&#10; &lt;q-item tag=&quot;label&quot; v-ripple&gt;&#10; &lt;q-item-section avatar&gt;&#10; &lt;q-radio v-model=&quot;$model$&quot; val=&quot;$val$&quot;/&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;q-item-section&gt;&#10; &lt;q-item-label&gt;$label$&lt;/q-item-label&gt;&#10; &lt;q-item-label caption&gt;$caption$&lt;/q-item-label&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10;&lt;/q-list&gt;" description="Radio List" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;radioField&quot;" alwaysStopAt="true" />
<variable name="val" expression="" defaultValue="&quot;selectedValue&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Radio Field&quot;" alwaysStopAt="true" />
<variable name="caption" expression="" defaultValue="&quot;Explanation of Selection&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-radio-inline" value="&lt;div class=&quot;q-gutter-sm&quot;&gt;&#10; &lt;q-radio v-model=&quot;$model$&quot; val=&quot;$value$&quot; label=&quot;$label$&quot; /&gt;&#10;&lt;/div&gt;" description="Radio Inline" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;radioField&quot;" alwaysStopAt="true" />
<variable name="value" expression="" defaultValue="&quot;value&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Radio Field&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-checkbox" value="&lt;q-checkbox v-model=&quot;$model$&quot; label=&quot;$label$&quot; /&gt;" description="Checkbox" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;checkboxField&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Checkbox&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-toggle" value="&lt;q-toggle v-model=&quot;$model$&quot; checked-icon=&quot;$checkIcon$&quot; color=&quot;$color$&quot; unchecked-icon=&quot;$uncheckIcon$&quot;/&gt;" description="Toggle" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;toggleField&quot;" alwaysStopAt="true" />
<variable name="checkIcon" expression="" defaultValue="&quot;check&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;green&quot;" alwaysStopAt="true" />
<variable name="uncheckIcon" expression="" defaultValue="&quot;clear&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-btn-toggle" value="&lt;q-btn-toggle&#10; v-model=&quot;$model$&quot;&#10; toggle-color=&quot;$color$&quot;&#10; :options=&quot;[&#10; {label: 'One', value: 'one'},&#10; {label: 'Two', value: 'two'},&#10; {label: 'Three', value: 'three'}&#10; ]&quot;/&gt;" description="Button Toggle (Button Radio)" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;btnToggleField&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-option-group-radio" value="&lt;q-option-group&#10; v-model=&quot;$model$&quot;&#10; :options=&quot;$options$&quot;&#10; color=&quot;$color$&quot;/&gt;" description="Option Group (Radio)" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;optionField&quot;" alwaysStopAt="true" />
<variable name="options" expression="" defaultValue="&quot;[{label: 'Option 1',value: 'op1'},{label: 'Option 2',value: 'op2'},{label: 'Option 3',value: 'op3'}]&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-option-group-checkbox" value="&lt;q-option-group&#10; type=&quot;checkbox&quot;&#10; v-model=&quot;$model$&quot;&#10; :options=&quot;$options$&quot;&#10; color=&quot;$color$&quot;/&gt;" description="Option Group (Checkbox)" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;optionField&quot;" alwaysStopAt="true" />
<variable name="options" expression="" defaultValue="&quot;[{label: 'Option 1',value: 'op1'},{label: 'Option 2',value: 'op2'},{label: 'Option 3',value: 'op3'}]&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-slider" value="&lt;q-slider v-model=&quot;$model$&quot; :min=&quot;$min$&quot; :max=&quot;$max$&quot;/&gt;" description="Slider" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;sliderField&quot;" alwaysStopAt="true" />
<variable name="min" expression="" defaultValue="&quot;0&quot;" alwaysStopAt="true" />
<variable name="max" expression="" defaultValue="&quot;100&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-range" value="&lt;q-range v-model=&quot;$model$&quot;&#10; :min=&quot;$min$&quot;&#10; :max=&quot;$max$&quot;/&gt;" description="Range" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;rangeField&quot;" alwaysStopAt="true" />
<variable name="min" expression="" defaultValue="&quot;0&quot;" alwaysStopAt="true" />
<variable name="max" expression="" defaultValue="&quot;100&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-time" value="&lt;q-time v-model=&quot;$model$&quot; /&gt;" description="Time Picker" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;timeField&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-date" value="&lt;q-date v-model=&quot;$model$&quot; /&gt;" description="Date Picker" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;dateField&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-icon" value="&lt;q-btn :icon=&quot;$icon$&quot; size=&quot;$size$&quot;/&gt;" description="Icon" toReformat="true" toShortenFQNames="true">
<variable name="icon" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="size" expression="" defaultValue="&quot;xl&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-img" value="&lt;q-img :src=&quot;$END$&quot; spinner-color=&quot;white&quot; style=&quot;height: 140px; max-width: 150px&quot;/&gt;" description="Image" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-infinite-scroll" value="&lt;q-infinite-scroll @load=&quot;$onLoad$&quot; :offset=&quot;$offset$&quot;&gt;&#10; &lt;div v-for=&quot;(item, index) in $items$&quot; :key=&quot;index&quot; class=&quot;caption&quot;&gt;&#10; &lt;p&gt;$END$&lt;/p&gt;&#10; &lt;/div&gt;&#10; &lt;template v-slot:loading&gt;&#10; &lt;div class=&quot;row justify-center q-my-md&quot;&gt;&#10; &lt;q-spinner-dots color=&quot;primary&quot; size=&quot;40px&quot; /&gt;&#10; &lt;/div&gt;&#10; &lt;/template&gt;&#10;&lt;/q-infinite-scroll&gt;" description="Infinite Scroll" toReformat="true" toShortenFQNames="true">
<variable name="onLoad" expression="" defaultValue="&quot;onLoad&quot;" alwaysStopAt="true" />
<variable name="offset" expression="" defaultValue="&quot;250&quot;" alwaysStopAt="true" />
<variable name="items" expression="" defaultValue="&quot;[]&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-inner-loading" value="&lt;q-inner-loading :showing=&quot;$showing$&quot;&gt;&#10; &lt;q-spinner-gears size=&quot;50px&quot; color=&quot;primary&quot; /&gt;&#10;&lt;/q-inner-loading&gt;" description="Inner Loading" toReformat="true" toShortenFQNames="true">
<variable name="showing" expression="" defaultValue="&quot;loading&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-intersection" value="&lt;q-intersection&#10; v-for=&quot;index in 60&quot;&#10; :key=&quot;index&quot;&gt;&#10; &lt;q-card class=&quot;q-ma-sm&quot;&gt;&#10; &lt;img src=&quot;$src$&quot;&gt;&#10; &#10; &lt;q-card-section&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Card #{{ index }}&lt;/div&gt;&#10; &lt;div class=&quot;text-subtitle2&quot;&gt;by John Doe&lt;/div&gt;&#10; &lt;/q-card-section&gt;&#10; &lt;/q-card&gt;&#10;&lt;/q-intersection&gt;" description="Intersection" toReformat="true" toShortenFQNames="true">
<variable name="src" expression="" defaultValue="&quot;https://cdn.quasar.dev/img/mountains.jpg&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-knob" value="&lt;q-knob show-value class=&quot;text-light-blue q-ma-md&quot; v-model=&quot;$model$&quot; size=&quot;50px&quot; color=&quot;$color$&quot;/&gt;" description="Knob" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;knobField&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;light-blue&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-linear-progress" value="&lt;q-linear-progress :value=&quot;$value$&quot;/&gt;" description="Linear Progress" toReformat="true" toShortenFQNames="true">
<variable name="value" expression="" defaultValue="&quot;0.5&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-linear-progress-indeterminate" value="&lt;q-linear-progress :value=&quot;$value$&quot; indeterminate/&gt;" description="Linear Progress (Indeterminate)" toReformat="true" toShortenFQNames="true">
<variable name="value" expression="" defaultValue="&quot;0.5&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-list" value="&lt;q-list bordered separator&gt;&#10; &lt;q-item clickable v-ripple&gt;&#10; &lt;q-item-section&gt;&#10; &lt;q-item-label&gt;$item$&lt;/q-item-label&gt;&#10; &lt;q-item-label caption&gt;$caption$&lt;/q-item-label&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10;&lt;/q-list&gt;" description="List" toReformat="true" toShortenFQNames="true">
<variable name="item" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="caption" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-item-icon" value="&lt;q-item clickable v-ripple&gt;&#10; &lt;q-item-section avatar&gt;&#10; &lt;q-icon color=&quot;$color$&quot; name=&quot;$icon$&quot; /&gt;&#10; &lt;/q-item-section&gt;&#10;&#10; &lt;q-item-section&gt;$label$&lt;/q-item-section&gt;&#10;&lt;/q-item&gt;&#10;" description="List Item (With Icon)" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Bluetooth&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-item-badge" value="&lt;q-item&gt;&#10; &lt;q-item-section&gt;&#10; &lt;q-item-label&gt;$line1$&lt;/q-item-label&gt;&#10; &lt;q-item-label caption&gt;$secondLine$&lt;/q-item-label&gt;&#10; &lt;/q-item-section&gt;&#10;&#10; &lt;q-item-section side top&gt;&#10; &lt;q-badge color=&quot;$color$&quot; label=&quot;$badge$&quot; /&gt;&#10; &lt;/q-item-section&gt;&#10;&lt;/q-item&gt;" description="List Item (With Badge )" toReformat="true" toShortenFQNames="true">
<variable name="line1" expression="" defaultValue="&quot;Single line item&quot;" alwaysStopAt="true" />
<variable name="secondLine" expression="" defaultValue="&quot;Secondary line text. Lorem ipsum dolor sit amet, consectetur adipiscit elit.&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;teal&quot;" alwaysStopAt="true" />
<variable name="badge" expression="" defaultValue="&quot;10k&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-markup-table" value="&lt;q-markup-table&gt;&#10; &lt;thead&gt;&#10; &lt;tr&gt;&#10; $tr$&#10; &lt;/tr&gt;&#10; &lt;/thead&gt;&#10; &lt;tbody&gt;&#10; &lt;tr&gt;&#10; $END$&#10; &lt;/tr&gt;&#10; &lt;/tbody&gt;&#10;&lt;/q-markup-table&gt;" description="Markup Table" toReformat="true" toShortenFQNames="true">
<variable name="tr" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-menu" value="&lt;q-btn color=&quot;primary&quot; label=&quot;$label$&quot;&gt;&#10; &lt;q-menu&gt;&#10; &lt;q-list dense style=&quot;min-width: 100px&quot;&gt;&#10; &lt;q-item clickable v-close-popup&gt;&#10; &lt;q-item-section&gt;Open...&lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10; &lt;q-item clickable v-close-popup&gt;&#10; &lt;q-item-section&gt;New&lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10; &lt;q-separator /&gt;&#10; &lt;q-item clickable&gt;&#10; &lt;q-item-section&gt;Preferences&lt;/q-item-section&gt;&#10; &lt;q-item-section side&gt;&#10; &lt;q-icon name=&quot;keyboard_arrow_right&quot; /&gt;&#10; &lt;/q-item-section&gt;&#10;&#10; &lt;q-menu anchor=&quot;top right&quot; self=&quot;top left&quot;&gt;&#10; &lt;q-list&gt;&#10; &lt;q-item&#10; v-for=&quot;n in 3&quot;&#10; :key=&quot;n&quot;&#10; dense&#10; clickable&#10; &gt;&#10; &lt;q-item-section&gt;Submenu Label&lt;/q-item-section&gt;&#10; &lt;q-item-section side&gt;&#10; &lt;q-icon name=&quot;keyboard_arrow_right&quot; /&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;q-menu auto-close anchor=&quot;top right&quot; self=&quot;top left&quot;&gt;&#10; &lt;q-list&gt;&#10; &lt;q-item&#10; v-for=&quot;n in 3&quot;&#10; :key=&quot;n&quot;&#10; dense&#10; clickable&#10; &gt;&#10; &lt;q-item-section&gt;3rd level Label&lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10; &lt;/q-list&gt;&#10; &lt;/q-menu&gt;&#10; &lt;/q-item&gt;&#10; &lt;/q-list&gt;&#10; &lt;/q-menu&gt;&#10;&#10; &lt;/q-item&gt;&#10; &lt;q-separator /&gt;&#10; &lt;q-item clickable v-close-popup&gt;&#10; &lt;q-item-section&gt;Quit&lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10; &lt;/q-list&gt;&#10; &lt;/q-menu&gt;&#10;&lt;/q-btn&gt;&#10;" description="Menu" toReformat="true" toShortenFQNames="true">
<variable name="label" expression="" defaultValue="&quot;Click Me&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-no-ssr" value="&lt;q-no-ssr&gt;&#10; &lt;div&gt;$END$&lt;/div&gt;&#10;&lt;/q-no-ssr&gt;" description="No SSR" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-resize-observer" value="&lt;q-resize-observer @resize=&quot;$callback$&quot; /&gt;" description="Resize Observer" toReformat="true" toShortenFQNames="true">
<variable name="callback" expression="" defaultValue="&quot;onResize&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-scroll-observer" value="&lt;q-scroll-observer @scroll=&quot;$callback$&quot; /&gt;" description="Scroll Observer" toReformat="true" toShortenFQNames="true">
<variable name="callback" expression="" defaultValue="&quot;scrollHandler&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-pagination" value="&lt;q-pagination v-model=&quot;$model$&quot; :max=&quot;5&quot; :direction-links=&quot;true&quot;&gt;" description="Pagination" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;currentPage&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-parallax" value="&lt;q-parallax src=&quot;$src$&quot;&gt;&#10; &lt;h1 class=&quot;text-white&quot;&gt;$END$&lt;/h1&gt;&#10;&lt;/q-parallax&gt;" description="Parallax" toReformat="true" toShortenFQNames="true">
<variable name="src" expression="" defaultValue="&quot;https://cdn.quasar.dev/img/parallax2.jpg&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-popup-edit" value="&lt;div class=&quot;cursor-pointer&quot; style=&quot;width: 100px&quot;&gt;&#10; $label$&#10; &lt;q-popup-edit v-model=&quot;$model$&quot; :cover=&quot;false&quot; :offset=&quot;[0, 10]&quot;&gt;&#10; &lt;q-input color=&quot;$color$&quot; v-model=&quot;label2&quot; dense autofocus counter&gt;&#10; &lt;template v-slot:prepend&gt;&#10; &lt;q-icon name=&quot;record_voice_over&quot; color=&quot;$color$&quot; /&gt;&#10; &lt;/template&gt;&#10; &lt;/q-input&gt;&#10; &lt;/q-popup-edit&gt;&#10;&lt;/div&gt;" description="Popup Edit" toReformat="true" toShortenFQNames="true">
<variable name="label" expression="" defaultValue="&quot;Click Me&quot;" alwaysStopAt="true" />
<variable name="model" expression="" defaultValue="&quot;popupField&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-popup-proxy" value="&lt;q-btn push color=&quot;$color$&quot; label=&quot;$label$&quot;&gt;&#10; &lt;q-popup-proxy&gt;&#10; &lt;q-banner&gt;&#10; &lt;template v-slot:avatar&gt;&#10; &lt;q-icon name=&quot;$icon$&quot; color=&quot;$color$&quot; /&gt;&#10; &lt;/template&gt;&#10; $SELECTION$&#10; &lt;/q-banner&gt;&#10; &lt;/q-popup-proxy&gt;&#10;&lt;/q-btn&gt;" description="Popup Proxy" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<variable name="label" expression="" defaultValue="&quot;Click Me&quot;" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="&quot;signal_wifi_off&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-pull-to-refresh" value="&lt;q-pull-to-refresh @refresh=&quot;refresh&quot;&gt;&#10; &lt;div v-for=&quot;(item, index) in items&quot; :key=&quot;index&quot; class=&quot;q-mb-sm&quot;&gt;&#10; &lt;q-badge color=&quot;secondary&quot;&gt;&#10; {{ items.length - index }}&#10; &lt;/q-badge&gt;&#10; $SELECTION$&#10; &lt;/div&gt;&#10;&lt;/q-pull-to-refresh&gt;" description="Pull To Refresh" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-rating" value="&lt;q-rating v-model=&quot;$model$&quot; size=&quot;2em&quot; :max=&quot;10&quot; color=&quot;$color$&quot;/&gt;" description="Rating" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;ratingField&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;accent&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-scroll-area" value="&lt;q-scroll-area style=&quot;height: 200px; max-width: 300px;&quot;&gt;&#10; $SELECTION$$&#10;&lt;/q-scroll-area&gt;" description="Scroll Area" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-separator" value="&lt;q-separator /&gt;" description="Separator" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-skeleton" value="&lt;q-skeleton :type=&quot;$type$&quot; /&gt;" description="Skeleton" toReformat="true" toShortenFQNames="true">
<variable name="type" expression="" defaultValue="&quot;QInput&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-slide-item" value="&lt;q-slide-item @left=&quot;$onLeft$&quot; @right=&quot;$onRight$&quot;&gt;&#10; &lt;template v-slot:left&gt;&lt;q-icon name=&quot;done&quot; /&gt;&lt;/template&gt;&#10; &lt;template v-slot:right&gt;&lt;q-icon name=&quot;alarm&quot; /&gt;&lt;/template&gt;&#10;&#10; &lt;q-item&gt;&#10; &lt;q-item-section avatar&gt;&#10; &lt;q-avatar color=&quot;primary&quot; text-color=&quot;white&quot; icon=&quot;bluetooth&quot; /&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;q-item-section&gt;Icons only&lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10;&lt;/q-slide-item&gt;" description="Slide Item" toReformat="true" toShortenFQNames="true">
<variable name="onLeft" expression="" defaultValue="&quot;onLeft&quot;" alwaysStopAt="true" />
<variable name="onRight" expression="" defaultValue="&quot;onRight&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-slide-transition" value="&lt;q-slide-transition&gt;&#10; &lt;div v-show=&quot;visible&quot;&gt;&#10; &lt;img&#10; class=&quot;responsive&quot;&#10; src=&quot;$src$&quot;&gt;&#10; &lt;/div&gt;&#10;&lt;/q-slide-transition&gt;" description="Slide Transition" toReformat="true" toShortenFQNames="true">
<variable name="src" expression="" defaultValue="&quot;https://cdn.quasar.dev/img/quasar.jpg&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-space" value="&lt;q-space /&gt;" description="Space" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-spinner" value="&lt;q-spinner color=&quot;$color$&quot; size=&quot;3em&quot; :thickness=&quot;10&quot;/&gt;" description="Spinner" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-splitter" value="&lt;q-splitter v-model=&quot;$model$&quot; style=&quot;height: 400px&quot;&gt;&#10;&#10; &lt;template v-slot:before&gt;&#10; &lt;div class=&quot;q-pa-md&quot;&gt;&#10; $SELECTION$&#10; &lt;/div&gt;&#10; &lt;/template&gt;&#10;&#10; &lt;template v-slot:after&gt;&#10; &lt;div class=&quot;q-pa-md&quot;&gt;&#10; $END$&#10; &lt;/div&gt;&#10; &lt;/template&gt;&#10;&lt;/q-splitter&gt;" description="Splitter" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="splitterModel" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-stepper" value="&lt;q-stepper v-model=&quot;$model$&quot; ref=&quot;$ref$&quot; color=&quot;primary&quot; animated&gt;&#10; &lt;q-step&#10; :name=&quot;1&quot;&#10; title=&quot;Select campaign settings&quot;&#10; icon=&quot;settings&quot;&#10; :done=&quot;step &gt; 1&quot;&gt;&#10; For each ad campaign that you create, you can control how much you're willing to&#10; spend on clicks and conversions, which networks and geographical locations you want&#10; your ads to show on, and more.&#10; &lt;/q-step&gt;&#10;&#10; &lt;q-step&#10; :name=&quot;2&quot;&#10; title=&quot;Create an ad group&quot;&#10; caption=&quot;Optional&quot;&#10; icon=&quot;create_new_folder&quot;&#10; :done=&quot;step &gt; 2&quot;&#10; &gt;&#10; An ad group contains one or more ads which target a shared set of keywords.&#10; &lt;/q-step&gt;&#10;&#10; &lt;q-step&#10; :name=&quot;3&quot;&#10; title=&quot;Ad template&quot;&#10; icon=&quot;assignment&quot;&#10; disable&#10; &gt;&#10; This step won't show up because it is disabled.&#10; &lt;/q-step&gt;&#10;&#10; &lt;q-step&#10; :name=&quot;4&quot;&#10; title=&quot;Create an ad&quot;&#10; icon=&quot;add_comment&quot;&#10; &gt;&#10; Try out different ad text to see what brings in the most customers, and learn how to&#10; enhance your ads using features like ad extensions. If you run into any problems with&#10; your ads, find out how to tell if they're running and how to resolve approval issues.&#10; &lt;/q-step&gt;&#10;&#10; &lt;template v-slot:navigation&gt;&#10; &lt;q-stepper-navigation&gt;&#10; &lt;q-btn @click=&quot;$refs.$ref$.next()&quot; color=&quot;primary&quot; :label=&quot;step === 4 ? 'Finish' : 'Continue'&quot; /&gt;&#10; &lt;q-btn v-if=&quot;step &gt; 1&quot; flat color=&quot;primary&quot; @click=&quot;$refs.stepper.previous()&quot; label=&quot;Back&quot; class=&quot;q-ml-sm&quot; /&gt;&#10; &lt;/q-stepper-navigation&gt;&#10; &lt;/template&gt;&#10;&lt;/q-stepper&gt;" description="Stepper" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;stepperModel&quot;" alwaysStopAt="true" />
<variable name="ref" expression="" defaultValue="&quot;stepperRef&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-table" value="&lt;q-table title=&quot;$title$&quot; :data=&quot;$data$&quot; :columns=&quot;$columns$&quot; row-key=&quot;$key$&quot;/&gt;" description="Table" toReformat="true" toShortenFQNames="true">
<variable name="title" expression="" defaultValue="&quot;My Table&quot;" alwaysStopAt="true" />
<variable name="data" expression="" defaultValue="&quot;data&quot;" alwaysStopAt="true" />
<variable name="columns" expression="" defaultValue="&quot;columns&quot;" alwaysStopAt="true" />
<variable name="key" expression="" defaultValue="&quot;name&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-tabs-card" value="&lt;q-card&gt;&#10; &lt;q-tabs v-model=&quot;$model$&quot; dense class=&quot;text-grey&quot; active-color=&quot;primary&quot;&#10; indicator-color=&quot;primary&quot; align=&quot;justify&quot; narrow-indicator&gt;&#10; &lt;q-tab name=&quot;mails&quot; label=&quot;Mails&quot; /&gt;&#10; &lt;q-tab name=&quot;alarms&quot; label=&quot;Alarms&quot; /&gt;&#10; &lt;q-tab name=&quot;movies&quot; label=&quot;Movies&quot; /&gt;&#10; &lt;/q-tabs&gt;&#10;&#10; &lt;q-separator /&gt;&#10;&#10; &lt;q-tab-panels v-model=&quot;tab&quot; animated&gt;&#10; &lt;q-tab-panel name=&quot;mails&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Mails&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10;&#10; &lt;q-tab-panel name=&quot;alarms&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Alarms&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10;&#10; &lt;q-tab-panel name=&quot;movies&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Movies&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10; &lt;/q-tab-panels&gt;&#10;&lt;/q-card&gt;&#10;" description="Tabs Card" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;tabsModel&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-tabs" value="&lt;q-tabs v-model=&quot;$model$&quot;&gt;&#10; &lt;q-tab name=&quot;mails&quot; icon=&quot;mail&quot; label=&quot;Mails&quot; /&gt;&#10; &lt;q-tab name=&quot;alarms&quot; icon=&quot;alarm&quot; label=&quot;Alarms&quot; /&gt;&#10; &lt;q-tab name=&quot;movies&quot; icon=&quot;movie&quot; label=&quot;Movies&quot; /&gt;&#10;&lt;/q-tabs&gt;" description="Tabs" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;tabsModel&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-tabs-panel" value="&lt;q-tab-panels v-model=&quot;$model$&quot; animated class=&quot;shadow-2 rounded-borders&quot;&gt;&#10; &lt;q-tab-panel name=&quot;mails&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Mails&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10;&#10; &lt;q-tab-panel name=&quot;alarms&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Alarms&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10;&#10; &lt;q-tab-panel name=&quot;movies&quot;&gt;&#10; &lt;div class=&quot;text-h6&quot;&gt;Movies&lt;/div&gt;&#10; Lorem ipsum dolor sit amet consectetur adipisicing elit.&#10; &lt;/q-tab-panel&gt;&#10;&lt;/q-tab-panels&gt;" description="Tabs Panels" toReformat="true" toShortenFQNames="true">
<variable name="model" expression="" defaultValue="&quot;tabsModel&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-timeline" value="&lt;q-timeline color=&quot;$color$&quot;&gt;&#10; &lt;q-timeline-entry title=&quot;$title$&quot; subtitle=&quot;$date$&quot; icon=&quot;$icon$&quot;&gt;&#10; &lt;div&gt;&#10; $END$&#10; &lt;/div&gt;&#10; &lt;/q-timeline-entry&gt;&#10;&lt;/q-timeline&gt;" description="Timeline" toReformat="true" toShortenFQNames="true">
<variable name="color" expression="" defaultValue="&quot;secondary&quot;" alwaysStopAt="true" />
<variable name="title" expression="" defaultValue="&quot;Event Title&quot;" alwaysStopAt="true" />
<variable name="date" expression="" defaultValue="&quot;February 21, 1986&quot;" alwaysStopAt="true" />
<variable name="icon" expression="" defaultValue="&quot;delete&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-toolbar" value="&lt;q-toolbar class=&quot;$class$&quot;&gt;&#10; &lt;q-btn flat round dense icon=&quot;menu&quot; /&gt;&#10; &lt;q-toolbar-title&gt;&#10; $END$&#10; &lt;/q-toolbar-title&gt;&#10; &lt;q-btn flat round dense icon=&quot;more_vert&quot; /&gt;&#10;&lt;/q-toolbar&gt;" description="Toolbar" toReformat="true" toShortenFQNames="true">
<variable name="class" expression="" defaultValue="&quot;text-primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-tooltip" value="&lt;q-btn label=&quot;$label$&quot; color=&quot;$color$&quot;&gt;&#10; &lt;q-tooltip&gt;&#10; $END$&#10; &lt;/q-tooltip&gt;&#10;&lt;/q-btn&gt;" description="Tooltip" toReformat="true" toShortenFQNames="true">
<variable name="label" expression="" defaultValue="&quot;Hover Me&quot;" alwaysStopAt="true" />
<variable name="color" expression="" defaultValue="&quot;primary&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-tree" value="&lt;q-tree :nodes=&quot;$nodes$&quot; node-key=&quot;$nodeKey$&quot;/&gt;" description="Tree" toReformat="true" toShortenFQNames="true">
<variable name="nodes" expression="" defaultValue="&quot;simple&quot;" alwaysStopAt="true" />
<variable name="nodeKey" expression="" defaultValue="&quot;label&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-uploader" value="&lt;q-uploader url=&quot;$END$&quot;/&gt;" description="Uploader" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-video" value="&lt;q-video src=&quot;$src$&quot;/&gt;" description="Video" toReformat="true" toShortenFQNames="true">
<variable name="src" expression="" defaultValue="&quot;https://www.youtube.com/embed/k3_tw44QsZQ?rel=0&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-virtual-scroll" value="&lt;q-virtual-scroll&#10; style=&quot;max-height: 300px;&quot;&#10; :items=&quot;$list$&quot;&#10; separator&gt;&#10; &lt;template v-slot=&quot;{ item, index }&quot;&gt;&#10; &lt;q-item&#10; :key=&quot;index&quot;&#10; dense&gt;&#10; &lt;q-item-section&gt;&#10; &lt;q-item-label&gt;&#10; #{{ index }} - {{ item.label }}&#10; &lt;/q-item-label&gt;&#10; &lt;/q-item-section&gt;&#10; &lt;/q-item&gt;&#10; &lt;/template&gt;&#10;&lt;/q-virtual-scroll&gt;" description="Virtual Scroll" toReformat="true" toShortenFQNames="true">
<variable name="list" expression="" defaultValue="&quot;heavyList&quot;" alwaysStopAt="true" />
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
<template name="q-page" value="&lt;q-page padding&gt;&#10; $SELECTION$&#10;&lt;/q-page&gt;" description="Page" toReformat="true" toShortenFQNames="true">
<context>
<option name="VUE_TEMPLATE" value="true" />
</context>
</template>
</templateSet>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment