chore(resize-rotate-node): update examples
This commit is contained in:
@@ -1,8 +1,8 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { Connection, Edge, Elements, FlowInstance } from '@braks/vue-flow'
|
import type { Connection, Edge, Elements, FlowInstance } from '@braks/vue-flow'
|
||||||
import { Background, Controls, MiniMap, VueFlow, addEdge } from '@braks/vue-flow'
|
import { Background, Controls, MiniMap, VueFlow, addEdge } from '@braks/vue-flow'
|
||||||
|
import { ResizeRotateNode } from '../src'
|
||||||
import initialElements from './elements'
|
import initialElements from './elements'
|
||||||
import { ResizeRotateNode } from '~/index'
|
|
||||||
|
|
||||||
const elements = ref<Elements>(initialElements)
|
const elements = ref<Elements>(initialElements)
|
||||||
const rfInstance = ref<FlowInstance | null>(null)
|
const rfInstance = ref<FlowInstance | null>(null)
|
||||||
@@ -39,5 +39,6 @@ body,
|
|||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -8,9 +8,41 @@ export default [
|
|||||||
id: '1',
|
id: '1',
|
||||||
label: 'Node 1',
|
label: 'Node 1',
|
||||||
type: 'resize-rotate',
|
type: 'resize-rotate',
|
||||||
|
targetPosition: 'left',
|
||||||
|
sourcePosition: 'right',
|
||||||
position: {
|
position: {
|
||||||
x: 430,
|
x: 0,
|
||||||
y: 0,
|
y: 0,
|
||||||
},
|
},
|
||||||
|
data: {
|
||||||
|
style: {
|
||||||
|
background: 'rgb(255, 0, 114) none repeat scroll 0% 0%',
|
||||||
|
padding: '20px',
|
||||||
|
borderRadius: '20px',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
label: 'Node 2',
|
||||||
|
type: 'resize-rotate',
|
||||||
|
targetPosition: 'left',
|
||||||
|
position: {
|
||||||
|
x: 330,
|
||||||
|
y: 50,
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
style: {
|
||||||
|
background: 'rgb(50, 188, 188) none repeat scroll 0% 0%',
|
||||||
|
padding: '20px',
|
||||||
|
borderRadius: '20px',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'e1-2',
|
||||||
|
source: '1',
|
||||||
|
target: '2',
|
||||||
|
type: 'smoothstep',
|
||||||
},
|
},
|
||||||
] as Elements
|
] as Elements
|
||||||
|
|||||||
Reference in New Issue
Block a user