Extending k-select-field

Hi guys,

I’m really struggling as I can’t find enough documentation to help me solve that one. I’m pretty sure it’s an easy one but I can’t figure it out (not familiar with vue nor kirby plugins)
My question is how do I send the array from the php to the vue js template and props?

vue.js file

        { value: options.value, text: options.text }

export default {
  props: {
    label: String,
    help: String,
    value: String,
    background: String,
    options: Array
  methods: {
    onInput(value) {
      this.$emit("input", value);

<style lang="scss">
/** put your css here **/


Kirby::plugin('julienmillies/color-selector', [
    'fields' => [
    	'colorselector' => [
    		'extends' => 'select',
        'props' => [
          'options' => function (array $options) {
              return $options;

I’m missing the index.js with the JS part of the plugin definition? https://getkirby.com/docs/reference/plugins/extensions/fields#extending-existing-fields__extending-the-frontend

sorry… here it is :slight_smile:

import ColorSelectorField from "./components/ColorSelectorField.vue";
panel.plugin("julienmillies/color-selector", {
  fields: {
    colorselector : ColorSelectorField

Just to be clear, the plugin is based on the online tutorial by Bastian Alggeier, here:https://www.youtube.com/watch?v=NTCIKDalRis

Thanks for helping.

Well I managed to make it work (a bit) and have asked a related question Return query from options