mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-24 16:54:03 +00:00
## Summary A toolbar for builder mode, hides various UI elements when in builder mode ## Screenshots (if applicable) Toolbar <img width="706" height="166" alt="image" src="https://github.com/user-attachments/assets/1f0b08b5-1661-4ed5-96bb-feecc73ca701" /> With disabled save and output required popover <img width="711" height="299" alt="image" src="https://github.com/user-attachments/assets/4a93aaf8-d850-4afe-ab9f-4abd44a25420" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-9029-App-mode-builder-toolbar-6-30d6d73d365081e3aef5c90033ba347d) by [Unito](https://www.unito.io)
23 lines
570 B
Vue
23 lines
570 B
Vue
<template>
|
|
<div
|
|
class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-interface-builder-mode-button-background text-interface-builder-mode-button-foreground"
|
|
>
|
|
<i v-if="modelValue === step.id" :class="cn(step.icon, 'size-5')" />
|
|
<span v-else class="text-sm font-bold">
|
|
{{ index + 1 }}
|
|
</span>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { cn } from '@/utils/tailwindUtil'
|
|
|
|
import type { BuilderToolbarStep } from './types'
|
|
|
|
defineProps<{
|
|
step: BuilderToolbarStep
|
|
index: number
|
|
modelValue: string
|
|
}>()
|
|
</script>
|