Repeater
Data
{ "name": "Fighter", "attacks": [ { "name": "Sword", "damage": "2D20" }, { "name": "Dagger", "damage": "2D6" } ], "slots": {} }[
0
:
{
$formkit
:
primeInputText
label
:
Name
name
:
name
outerClass
:
col-6
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
mt-4
}
children
:
[
]
}
2
:
{
$formkit
:
list
if
:
true
name
:
attacks
dynamic
:
true
children
:
[
0
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
text-xl
}
children
:
[
0
:
Attacks
]
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-outer
style
:
position: relative;
}
children
:
[
0
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-wrapper
}
children
:
[
0
:
{
$el
:
label
if
:
true
attrs
:
{
class
:
formkit-label
}
children
:
[
0
:
]
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-inner
style
:
position: relative;
}
children
:
[
0
:
{
$cmp
:
Button
if
:
$node.value.length == 0
props
:
{
onClick
:
$addNode($node)
label
:
Add
class
:
p-button-sm
icon
:
pi pi-plus
}
}
]
}
]
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-help
}
children
:
[
0
:
]
}
]
}
2
:
{
$formkit
:
group
if
:
true
for
:
[
0
:
item
1
:
index
2
:
$items
]
key
:
$item
index
:
$index
children
:
[
0
:
{
$formkit
:
primeInputText
label
:
Name
name
:
name
outerClass
:
col-4
}
1
:
{
$formkit
:
primeInputText
label
:
Damage
name
:
damage
outerClass
:
col-2
}
2
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-outer col-6
style
:
position: relative;
}
children
:
[
0
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-wrapper
}
children
:
[
0
:
{
$el
:
label
if
:
true
attrs
:
{
class
:
formkit-label
}
children
:
[
0
:
Actions
]
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-inner p-action-buttons
style
:
position: relative;
}
children
:
[
0
:
{
$cmp
:
Button
if
:
true
props
:
{
onClick
:
$removeNode($node, $index)
label
:
icon
:
pi pi-times
class
:
p-button-sm
severity
:
danger
}
}
1
:
{
$cmp
:
Button
if
:
true
props
:
{
onClick
:
$copyNode($node, $index)
label
:
icon
:
pi pi-plus
class
:
p-button-sm
severity
:
}
}
2
:
{
$cmp
:
Button
if
:
$index != 0
props
:
{
onClick
:
$moveNodeUp($node, $index)
label
:
icon
:
pi pi-arrow-up
class
:
p-button-sm
severity
:
secondary
}
}
3
:
{
$el
:
span
if
:
$index == 0
attrs
:
{
class
:
p-space
}
children
:
[
]
}
4
:
{
$cmp
:
Button
if
:
$index < $node.value.length -1
props
:
{
onClick
:
$moveNodeDown($node, $index)
label
:
icon
:
pi pi-arrow-down
class
:
p-button-sm
severity
:
secondary
}
}
5
:
{
$el
:
span
if
:
$index == $node.value.length -1
attrs
:
{
class
:
p-space
}
children
:
[
]
}
]
}
]
}
1
:
{
$el
:
div
if
:
true
attrs
:
{
class
:
formkit-help
}
children
:
[
0
:
]
}
]
}
]
}
]
}
]
{
name
:
Fighter
attacks
:
[
0
:
{
name
:
Sword
damage
:
2D20
}
1
:
{
name
:
Dagger
damage
:
2D6
}
]
addNode
:
e=>()=>{const n=[...e.value,a];e.input(n,!1)}
removeNode
:
(e,n)=>()=>{e.input(e._value.filter((o,t)=>t!==n),!1)}
moveNodeUp
:
(e,n)=>()=>{const o=[...e.value];n>0&&e.input(u(o,n-1,n),!1)}
moveNodeDown
:
(e,n)=>()=>{const o=[...e.value];n<o.length-1&&e.input(u(o,n,n+1),!1)}
copyNode
:
(e,n)=>()=>{const o=e.value[n],t=[...e.value,{...o}];e.input(t,!1)}
slots
:
{
}
}
Formkit (1.6) - PrimeVue (4.2.x) - FormKit-PrimeVue-Version 3.0.10 - sfxcode 2024