Structure field

<k-structure-field>

kirby/panel/src/components/Forms/Field/StructureField.vue

This UI component hasn't been finalized yet. The functionality and syntax aren't stable and might be redone in an upcoming release. Only use it at your own risk - breaking changes are likely to occur.

Props

Prop	Type	Default	Description
columns	`object`	–	What columns to show in the table
counter	`boolean`\|`object`	–
disabled	`boolean`	–
duplicate	`boolean`	true	Whether to allow row duplication
empty	`string`	–	The text, that is shown when the field has no entries.
endpoints	`object`	–
fields	`object`	–	Fields for the form
help	`string`	–
input	`string`\|`number`	–
label	`string`	–
limit	`number`	–	How many rows to show per page
max	`number`	–	Upper limit of rows allowed
min	`number`	–	Lower limit of rows required
name	`number`\|`string`	–
prepend	`boolean`	false	Whether to insert new entries at the top of the list instead at the end
required	`boolean`	–
sortBy	`string`	–	Expression by which to sort rows automatically
sortable	`boolean`	true	Whether to allow sorting of rows
translate	`boolean`	–
type	`string`	–
value	`array`	[]

Methods

Method	Parameters	Description
add	`Object` value object with values for each field	Adds new entry
focus	–	Focuses the add button
open	`number` index `string` field	Edit the structure field entry at `index` position in the structure form with field `field` focused

Events

Event	Description	Passes
blur		–
focus		–
input		–

Slots

Slot	Description
counter
default
footer
header
help
label
options

Example

<k-structure-field
    v-model="value"
    :required="true"
    label="Structure"
    name="structure"
    help="This is a structure field"
    @input="input"
/>

CSS classes

.k-structure-field