Collapsible

A toggle to display nested properties.

Usage

Most often used in conjunction with the Field and FieldGroup components, the Collapsible component allows you to toggle the display of nested properties.

links
Link[]
::field{name="links" type="Link[]"}
  ::collapsible
    :field{name="label" required}
  ::
::

You can change the icon specifically in your app.config.ts through the ui.content.collapsible.icon key:

export default defineAppConfig({
  ui: {
    content: {
      collapsible: {
        button: {
          icon: {
            name: 'i-ph-caret-down'
          }
        }
      }
    }
  }
})

Or globally through the ui.icons.chevron key:

export default defineAppConfig({
  ui: {
    icons: {
      chevron: 'i-ph-caret-down'
    }
  }
})

Props

name
string
"properties"