vueless 0.0.750 → 0.0.751

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.750",
+  "version": "0.0.751",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.button-toggle/UToggle.vue

@@ -40,8 +40,16 @@ function isSelected(option: UToggleOption) {
   return selectedValue.value === option.value;
 }
 
-function onClickOption(option: UToggleOption) {
-  if (props.multiple) {
+function onClickOption(rawOption: UToggleOption) {
+  const option = { ...rawOption };
+
+  delete option.onClick;
+
+  if (typeof rawOption.onClick === "function") {
+    rawOption.onClick(option);
+  }
+
+  if (props.multiple || props.options.length === 1) {
     const newValue = Array.isArray(selectedValue.value) ? [...selectedValue.value] : [];
     const index = newValue.indexOf(option.value);
 
@@ -105,9 +113,7 @@ const { getDataTest, optionsAttrs, toggleButtonInactiveAttrs, toggleButtonActive
             @binding {string} icon-name
             @binding {number} index
           -->
-        <slot name="option" :option="option" :label="label" :icon-name="iconName" :index="index">
-          {{ option.label }}
-        </slot>
+        <slot name="option" :option="option" :label="label" :icon-name="iconName" :index="index" />
       </template>
 
       <template #right="{ iconName }">

package/ui.button-toggle/types.ts

@@ -6,11 +6,12 @@ export type Config = typeof defaultConfig;
 
 export interface UToggleOption {
   value: string | number;
-  label: string;
+  label?: string;
   disabled?: boolean;
   icon?: string;
   leftIcon?: string;
   rightIcon?: string;
+  onClick?: (option: Omit<UToggleOption, "onClick">) => void;
   [key: string]: unknown;
 }