Home > @jsplumbtoolkit/browser-ui-vue3 > Palette

Palette variable

Provides a mixin you can use to create a component that controls a set of droppable nodes for a Surface.

Usage:

Vue.component('my-palette', {
 props:[ "nodeTypes" ],
 mixins:[ jsPlumbToolkitVue3.Palette ],
 selector:'[data-type]',
 template:'<ul><li v-for="node in nodeTypes" :data-type="type">{{label}}</li></ul>',
 methods:{
     typeExtractor: function (el) {
         return el.getAttribute("jtk-node-type");
     },
     dataGenerator: function (type) {
         return { w:120, h:80 };
     }
 }
})

Signature:

Palette: {
    props: {
        surfaceId: StringConstructor;
        selector: StringConstructor;
    };
    mounted: () => void;
}