cfeb294308
* Add note component
* save note size and position
* move add note button up
* nit
* Add markdown support
* wip
* fix add sticky note button
* fix text update
* Add sticky note to saved flow data
* add note color picker
* Introduce node multiselect
* Add group notes
* Adapt layout to group node
* create a note manager class
* clean reactivity
* clean
* improve adaptive layout to group note
* modify layout based on cached text height
* fined grained graph rendering for notes
* separate noteManager into editor and render
* separate noteManager into editor and render
* create a note change observer
* render note node from context
* simplify note state managment
* show note in flow viewer
* clean dirty changes
* clean selection manager
* fix layout check
* improve bg surface select
* Handle z-index for stacked group notes
* clean selection manager
* exclude notes from rect select
* Allow switch between selection modes with keyboard keys
* improve selection box styling
* prevent dragging note when editing
* nit
* Simplify selection using svelte flow built in feature
* handle note selection separately
* Add min size for notes
* improve selection toggle
* improve mode switch
* make size and position optional for group notes
* Improve initial viewport position
* Add context menu for the canevas
* nit
* Add node context menu
* improve note select
* use clickoutside for note deselect
* use pointerdown outside to close context menu
* nit
* fix selection issues
* make edges non selectable
* improve color palette
* fix backend
* fix backend check
* cargo lock restore
* Add toggle to display notes
* fix note selection
* nit
* account for css offset in for loop
* fix multiple selection pannel styling
* clear flow selection when creating note
* Improve placeholder and note default text
* Escape note edit mode when pressing Esc
* Allow note edition in local dev
* clean
* Handle subflow selection
* prevent group note resizing
* nit
* allow notes in flow expand
* Improve multi select panel
* Allow context menu in note mode
* Add event listenner to fix pane click deselect
* prevent zoom in text area in notes
* improve bounding box styling
* Use control for box selection for non mac users
* nit
* clean notes groups
* nit
* use portal for note actions
* handle assets node when computing note layout
* Simplify layout compute for notes
* use smart color choice for notes
* Switch display note when adding a new note
* clean code
* improve group note bound size calculation
* simplify AI tool nodes and asset handling
* nit
* nit
* improve flow centering
* create group note button
* Improve selection of nodes
* Revert "Improve selection of nodes"
This reverts commit d2c40d82b1.
* refert backend changes
* nit
* improve graph selection
* clean
* make backend work except job runs
* fix notSelectable
---------
Co-authored-by: Ruben Fiszel <ruben@windmill.dev>
77 lines
2.2 KiB
Svelte
77 lines
2.2 KiB
Svelte
<script lang="ts">
|
|
import type { FlowModule, FlowValue } from '$lib/gen'
|
|
|
|
import { createEventDispatcher } from 'svelte'
|
|
import { twMerge } from 'tailwind-merge'
|
|
|
|
import FlowGraphViewerStep from './FlowGraphViewerStep.svelte'
|
|
import FlowGraphV2 from './graph/FlowGraphV2.svelte'
|
|
import { dfs } from './flows/dfs'
|
|
import { workspaceStore } from '$lib/stores'
|
|
|
|
export let flow: {
|
|
summary: string
|
|
description?: string
|
|
value: FlowValue
|
|
schema?: any
|
|
path?: string
|
|
}
|
|
|
|
export let overflowAuto = false
|
|
export let noSide = false
|
|
export let download = false
|
|
export let noGraph = false
|
|
export let triggerNode = false
|
|
export let stepDetail: FlowModule | string | undefined = undefined
|
|
export let workspace: string | undefined = $workspaceStore
|
|
|
|
const dispatch = createEventDispatcher()
|
|
</script>
|
|
|
|
<div class="grid grid-cols-3 w-full h-full">
|
|
{#if !noGraph}
|
|
<div
|
|
class="{noSide ? 'col-span-3' : 'sm:col-span-2 col-span-3'} w-full border max-h-full"
|
|
class:overflow-auto={overflowAuto}
|
|
>
|
|
<FlowGraphV2
|
|
{triggerNode}
|
|
earlyStop={flow.value.skip_expr !== undefined}
|
|
cache={flow.value.cache_ttl !== undefined}
|
|
path={flow?.path}
|
|
{download}
|
|
minHeight={400}
|
|
{workspace}
|
|
modules={flow?.value?.modules}
|
|
failureModule={flow?.value?.failure_module}
|
|
preprocessorModule={flow?.value?.preprocessor_module}
|
|
notes={flow?.value?.notes}
|
|
onSelect={(nodeId) => {
|
|
if (nodeId === 'Trigger') {
|
|
dispatch('triggerDetail')
|
|
return
|
|
} else if (nodeId === 'failure') {
|
|
stepDetail = flow?.value?.failure_module
|
|
} else if (nodeId === 'preprocessor') {
|
|
stepDetail = flow?.value?.preprocessor_module
|
|
} else {
|
|
stepDetail = dfs(flow?.value?.modules ?? [], (m) => m).find((m) => m?.id === nodeId)
|
|
}
|
|
stepDetail = stepDetail ?? nodeId
|
|
dispatch('select', stepDetail)
|
|
}}
|
|
/>
|
|
</div>
|
|
{/if}
|
|
{#if !noSide}
|
|
<div
|
|
class={twMerge(
|
|
'relative w-full h-full min-h-[150px] max-h-[90vh] border-r border-b border-t p-2 pt-0 overflow-auto hidden sm:flex flex-col gap-4',
|
|
noGraph ? 'border-0 w-max' : ''
|
|
)}
|
|
>
|
|
<FlowGraphViewerStep schema={flow.schema} {stepDetail} />
|
|
</div>
|
|
{/if}
|
|
</div>
|