mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
7864e780e7
## Summary Users were finding the final step of the builder flow confusing/misleading, with the "choose default mode" not actually saving the workflow and people losing changes. This updates it to remove "save"/"set default" as a step in the builder, and changes it to a distinct action. ## Changes - **What**: - add mode selection tab on footer toolbar - extract reusable radio group component - remove setting default mode dialog - add save/save as/saved dialogs ## Screenshots (if applicable) https://github.com/user-attachments/assets/c7439c2e-a917-4f2b-b176-f8bb8c10026d ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-10439-feat-App-mode-Rework-save-flow-32d6d73d3650814781b6c7bbea685a97) by [Unito](https://www.unito.io)
47 lines
1.1 KiB
Vue
47 lines
1.1 KiB
Vue
<template>
|
|
<div class="flex w-full min-w-116 flex-col rounded-2xl bg-base-background">
|
|
<!-- Header -->
|
|
<div
|
|
class="flex h-12 items-center justify-between border-b border-border-default px-4"
|
|
>
|
|
<div class="flex items-center gap-2">
|
|
<slot name="header-icon" />
|
|
<h2 class="m-0 text-sm font-normal text-base-foreground">
|
|
<slot name="title" />
|
|
</h2>
|
|
</div>
|
|
<Button
|
|
v-if="showClose"
|
|
variant="muted-textonly"
|
|
class="-mr-1"
|
|
:aria-label="$t('g.close')"
|
|
@click="$emit('close')"
|
|
>
|
|
<i class="pi pi-times size-4" />
|
|
</Button>
|
|
</div>
|
|
|
|
<!-- Body -->
|
|
<div class="flex flex-1 flex-col gap-4 p-4">
|
|
<slot />
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<div class="flex items-center justify-end gap-4 p-4">
|
|
<slot name="footer" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Button from '@/components/ui/button/Button.vue'
|
|
|
|
const { showClose = true } = defineProps<{
|
|
showClose?: boolean
|
|
}>()
|
|
|
|
defineEmits<{
|
|
close: []
|
|
}>()
|
|
</script>
|