Rich select, selected options dont have css, and problem when using array of objects as options in multiple mode

[iteniasim]

In t-rich-select, it is not known where to pass the classes for the selected options rendered in the input box when the mode is multiple.

and when we use options as array of objects for multiple mode, like so

<t-rich-select multiple :close-on-select="false" :options="categories" value-attribute="id" text-attribute="name" placeholder="Primary categories" :value="form.categoryIds" />

the selected data is not rendered in the input, although the data is selected.

this above image should look like this

and this also demonstrate how there is no css passed for the rich select when in multiple mode for rendering the selected options but somehow it works in the demo, although its not the exact copy from the demo, the css is not passed even in the exact copy paste from the docs

and i am using the default configs, the below image is from docs, and how i would want it look like locally too

[jerots]

facing the same issue here

[nikuscs]

your probably missing some css/slot from the default config

[MFredX]

I had the same issue but I didn't include any props in my vue-tailwind.js and it seemed to fix it. My vue-tailwind.js looked like this

import Vue from "vue";
import VueTailwind from "vue-tailwind";
import { TRichSelect } from "vue-tailwind/dist/components";

const settings = {
  "t-rich-select": {
    component: TRichSelect,
  }
};

Vue.use(VueTailwind, settings);

[everydaysoftware]

You need to add

selectButtonTagWrapper: 'flex flex-wrap overflow-hidden',
selectButtonTag: 'bg-blue-500 block disabled:cursor-not-allowed disabled:opacity-50 duration-100 ease-in-out focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 rounded shadow-sm text-sm text-white transition white-space-no m-0.5 max-w-full overflow-hidden h-8 flex items-center',
selectButtonTagText: 'px-3',
selectButtonTagDeleteButton: '-ml-1.5 h-full hover:bg-blue-600 hover:shadow-sm inline-flex items-center px-2 transition',
selectButtonTagDeleteButtonIcon: 'w-3 h-3',

in your settings in either fixedClasses or classes (depending on how you want to customize it in variants).

@alfonsobries: It is missing in the shipment and on the "Customizing" and "Settings" tab.