graphieros/vue-data-ui v2.2.14 on GitHub

A new component was added, bringing the total count to 50 🎉

VueUiWordCloud (see the demo on the docs website)

The component takes the following props:

dataset: VueUiWordCloudDatasetItem[] | string;
config?: VueUiWordCloudConfig;

<VueUiWordCloud 
  :dataset="dataset" 
  :config="config" 
/>

The dataset prop can either be plain text, or an array of objects of type VueUiWordCloudDatasetItem[]:

[
  {
    name: string;
    value: number;
  },
  {...}
]

A utility function is also available for you to convert plain text to a dataset of type VueUiWordCloudDatasetItem[]:

import { createWordCloudDatasetFromPlainText } from "vue-data-ui";

const plainText = "Lorem ipsum dolor sit amet";

const dataset = ref<VueUiWordCloudDatasetItem[]>(createWordCloudDatasetFromPlainText(plainText));

Since v2.2.16, an optional callback was added to this function, to format text output:

import { createWordCloudDatasetFromPlainText } from "vue-data-ui";

const plainText = "Hello, world, hello, people!";
const dataset = ref(createWordCloudDatasetFromPlainText(plainText, word => word.toUpperCase()));
/* output:
[
  { name: "HELLO", value: 2 },
  { name: "WORLD", value: 1 },
  { name: "PEOPLE", value: 1 }   
]
*/

As for all components, it can be used with the VueDataUi universal component:

<VueDataUi 
  component="VueUiWordCloud" 
  :dataset="dataset" 
  :config="config" 
/>

This component also bears the customPalette and theme config options.
As a reminder: