Spaces:
Running
Running
File size: 2,061 Bytes
9b3539b af53b62 9b3539b af53b62 9b3539b 4767f72 9b3539b 4767f72 ca01fa3 9b3539b 4767f72 ca01fa3 c1a1d02 4767f72 9b3539b ca01fa3 9b3539b fc7156e ca01fa3 9b3539b 4767f72 9b3539b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
<script lang="ts">
import { Handle, type NodeProps } from '@xyflow/svelte';
type $$Props = NodeProps;
export let id: $$Props['id']; id;
export let data: $$Props['data'];
export let dragHandle: $$Props['dragHandle'] = undefined; dragHandle;
export let type: $$Props['type'] = undefined; type;
export let selected: $$Props['selected'] = undefined; selected;
export let isConnectable: $$Props['isConnectable'] = undefined; isConnectable;
export let zIndex: $$Props['zIndex'] = undefined; zIndex;
export let width: $$Props['width'] = undefined; width;
export let height: $$Props['height'] = undefined; height;
export let dragging: $$Props['dragging']; dragging;
export let targetPosition: $$Props['targetPosition'] = undefined; targetPosition;
export let sourcePosition: $$Props['sourcePosition'] = undefined; sourcePosition;
export let positionAbsoluteX: $$Props['positionAbsoluteX'] = undefined; positionAbsoluteX;
export let positionAbsoluteY: $$Props['positionAbsoluteY'] = undefined; positionAbsoluteY;
let expanded = true;
function titleClicked() {
expanded = !expanded;
}
</script>
<div class="node-container">
<div class="lynxkite-node">
<div class="title" on:click={titleClicked}>
{data.title}
{#if data.error}<span class="error-sign">⚠️</span>{/if}
</div>
{#if expanded}
{#if data.error}
<div class="error">{data.error}</div>
{/if}
<slot />
{/if}
{#if sourcePosition}
<Handle type="source" position={sourcePosition} />
{/if}
{#if targetPosition}
<Handle type="target" position={targetPosition} />
{/if}
</div>
</div>
<style>
.error {
background: #ffdddd;
padding: 8px;
font-size: 12px;
}
.error-sign {
float: right;
}
.node-container {
padding: 8px;
min-width: 170px;
max-width: 300px;
}
.lynxkite-node {
box-shadow: 0px 5px 50px 0px rgba(0, 0, 0, 0.3);
background: white;
}
.title {
background: #ff8800;
font-weight: bold;
padding: 8px;
}
</style>
|