mirror of
https://github.com/enso-org/enso.git
synced 2024-12-18 07:42:21 +03:00
245ec7afe8
Closes #8673. Stacked on #9132. Before:   After:   # Important Notes - The model has been refactored from execution-modes (live/design) to record-mode (on/off) up to the point of the project store, where it's translated (since the backend still uses the live/design concepts).
34 lines
1.0 KiB
Vue
34 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import { logEvent } from 'histoire/client'
|
|
import { ref } from 'vue'
|
|
|
|
import TopBar from '@/components/TopBar.vue'
|
|
|
|
const title = ref('Mock Project')
|
|
const recordMode = ref(true)
|
|
const breadcrumbs = ref(['main', 'ad_analytics'])
|
|
</script>
|
|
|
|
<template>
|
|
<Story title="Top Bar" group="graph" :layout="{ type: 'grid', width: 500 }" autoPropsDisabled>
|
|
<div style="height: 48px">
|
|
<TopBar
|
|
:title="title"
|
|
:recordMode="recordMode"
|
|
:breadcrumbs="breadcrumbs"
|
|
@back="logEvent('back', [])"
|
|
@forward="logEvent('forward', [])"
|
|
@recordOnce="logEvent('recordOnce', [])"
|
|
@breadcrumbClick="logEvent('breadcrumbClick', [$event])"
|
|
@update:recordMode="logEvent('update:recordMode', [$event]), (recordMode = $event)"
|
|
/>
|
|
</div>
|
|
|
|
<template #controls>
|
|
<HstText v-model="title" title="title" />
|
|
<HstJson v-model="recordMode" title="recordMode" />
|
|
<HstJson v-model="breadcrumbs" title="breadcrumbs" />
|
|
</template>
|
|
</Story>
|
|
</template>
|