sit-onyx 1.0.0-alpha.87 → 1.0.0-alpha.89

package/dist/components/OnyxCheckbox/OnyxCheckbox.vue.d.ts

@@ -1,51 +1,75 @@
-import { OnyxCheckboxProps } from './types';
+import { SelectOptionValue } from '../../types';
 
-declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxCheckboxProps>, {
-    modelValue: boolean;
-    indeterminate: boolean;
-    disabled: boolean;
-    loading: boolean;
-    required: boolean;
-    truncation: string;
-    skeleton: boolean;
-}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    validityChange: (validity: ValidityState) => void;
-    "update:modelValue": (value: boolean) => void;
-}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxCheckboxProps>, {
-    modelValue: boolean;
-    indeterminate: boolean;
-    disabled: boolean;
-    loading: boolean;
-    required: boolean;
-    truncation: string;
-    skeleton: boolean;
-}>>> & {
+declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(__VLS_props: {
+    required?: boolean | undefined;
+    label: string;
+    value: TValue;
+    density?: "default" | "compact" | "cozy" | undefined;
+    disabled?: boolean | undefined;
+    loading?: boolean | undefined;
+    skeleton?: boolean | undefined;
+    customError?: string | undefined;
+    indeterminate?: boolean | undefined;
+    hideLabel?: boolean | undefined;
+    truncation?: "ellipsis" | "multiline" | undefined;
+    requiredMarker?: "required" | "optional" | undefined;
+    modelValue?: boolean | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onValidityChange?: ((validity: ValidityState) => any) | undefined;
-}, {
-    required: boolean;
-    disabled: boolean;
-    loading: boolean;
-    skeleton: boolean;
-    indeterminate: boolean;
-    modelValue: boolean;
-    truncation: "ellipsis" | "multiline";
-}, {}>;
-export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
+} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
+    attrs: any;
+    slots: {};
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", value: boolean) => void);
+} | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
+    props: {
+        required?: boolean | undefined;
+        label: string;
+        value: TValue;
+        density?: "default" | "compact" | "cozy" | undefined;
+        disabled?: boolean | undefined;
+        loading?: boolean | undefined;
+        skeleton?: boolean | undefined;
+        customError?: string | undefined;
+        indeterminate?: boolean | undefined;
+        hideLabel?: boolean | undefined;
+        truncation?: "ellipsis" | "multiline" | undefined;
+        requiredMarker?: "required" | "optional" | undefined;
+        modelValue?: boolean | undefined;
+        "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+        onValidityChange?: ((validity: ValidityState) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+    expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", value: boolean) => void);
+}>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}> & {
+    __ctx?: {
+        props: {
+            required?: boolean | undefined;
+            label: string;
+            value: TValue;
+            density?: "default" | "compact" | "cozy" | undefined;
+            disabled?: boolean | undefined;
+            loading?: boolean | undefined;
+            skeleton?: boolean | undefined;
+            customError?: string | undefined;
+            indeterminate?: boolean | undefined;
+            hideLabel?: boolean | undefined;
+            truncation?: "ellipsis" | "multiline" | undefined;
+            requiredMarker?: "required" | "optional" | undefined;
+            modelValue?: boolean | undefined;
+            "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            onValidityChange?: ((validity: ValidityState) => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
+        attrs: any;
+        slots: {};
+        emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", value: boolean) => void);
+    } | undefined;
 };
+export default _default;
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};

package/dist/components/OnyxCheckbox/types.d.ts

@@ -1,41 +1,14 @@
-import { TruncationType } from '../../types/fonts';
+import { SelectOption, SelectOptionValue } from '../../types';
 import { CustomValidityProp } from '../../composables/useCustomValidity';
 import { RequiredMarkerProp } from '../../composables/required';
-import { DensityProp } from '../../composables/density';
 
-export type OnyxCheckboxProps = DensityProp & RequiredMarkerProp & CustomValidityProp & {
+export type OnyxCheckboxProps<TValue extends SelectOptionValue = SelectOptionValue> = SelectOption<TValue> & RequiredMarkerProp & CustomValidityProp & {
     /**
      * Whether the checkbox is checked.
      */
     modelValue?: boolean;
-    /**
-     * Label to show. Required due to accessibility / screen readers.
-     * If you want to visually hide the label, use the `hideLabel` property.
-     */
-    label: string;
     /**
      * If `true`, an indeterminate indicator is shown.
      */
     indeterminate?: boolean;
-    /**
-     * Whether to disable the checkbox and prevent user interaction.
-     */
-    disabled?: boolean;
-    /**
-     * Shows a loading indicator.
-     */
-    loading?: boolean;
-    /**
-     * If `true`, the label will be visually hidden and the `title` attribute will be set.
-     * For accessibility / screen readers, the aria-label will still be set.
-     */
-    hideLabel?: boolean;
-    /**
-     * How to truncate the label if it exceeds the max width.
-     */
-    truncation?: TruncationType;
-    /**
-     * Whether to show a skeleton checkbox.
-     */
-    skeleton?: boolean;
 };

package/dist/components/OnyxCheckboxGroup/OnyxCheckboxGroup.vue.d.ts

@@ -1,4 +1,6 @@
-declare const _default: <TValue extends string | number | boolean>(__VLS_props: {
+import { SelectOptionValue } from '../../types';
+
+declare const _default: <TValue extends SelectOptionValue>(__VLS_props: {
     density?: "default" | "compact" | "cozy" | undefined;
     disabled?: boolean | undefined;
     skeleton?: number | undefined;

package/dist/components/OnyxCheckboxGroup/types.d.ts

@@ -1,9 +1,8 @@
-import { SelectionOptionValue } from '../OnyxRadioButton/types';
-import { OnyxCheckboxProps } from '../OnyxCheckbox/types';
-import { Direction } from '../../types';
+import { Direction, SelectOption, SelectOptionValue } from '../../types';
+import { RequiredMarkerProp } from '../../composables/required';
 import { DensityProp } from '../../composables/density';
 
-export type OnyxCheckboxGroupProps<TValue extends SelectionOptionValue = SelectionOptionValue> = DensityProp & {
+export type OnyxCheckboxGroupProps<TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & {
     /**
      * Checkbox options.
      */
@@ -40,6 +39,4 @@ export type OnyxCheckboxGroupProps<TValue extends SelectionOptionValue = Selecti
      */
     skeleton?: number;
 };
-export type CheckboxGroupOption<T extends SelectionOptionValue> = Omit<OnyxCheckboxProps, "modelValue" | "indeterminate" | "hideLabel"> & {
-    id: T;
-};
+export type CheckboxGroupOption<TValue extends SelectOptionValue = SelectOptionValue> = SelectOption<TValue> & RequiredMarkerProp;

package/dist/components/OnyxListbox/OnyxListbox.vue.d.ts

@@ -1,12 +1,12 @@
 import { ListboxOption } from './types';
-import { ListboxValue } from '@sit-onyx/headless';
+import { SelectOptionValue } from '../../types';
 
-declare const _default: <TValue extends ListboxValue = ListboxValue, TMultiple extends boolean = false>(__VLS_props: {
+declare const _default: <TValue extends SelectOptionValue = SelectOptionValue, TMultiple extends boolean = false>(__VLS_props: {
     label: string;
     loading?: boolean | undefined;
     multiple?: TMultiple | undefined;
-    modelValue?: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined;
-    "onUpdate:modelValue"?: ((value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
+    modelValue?: import('./types').ListboxModelValue<TValue, TMultiple> | undefined;
+    "onUpdate:modelValue"?: ((value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
     options: ListboxOption<TValue>[];
     withCheckAll?: (TMultiple extends true ? boolean | {
         label?: string | undefined;
@@ -47,14 +47,14 @@ declare const _default: <TValue extends ListboxValue = ListboxValue, TMultiple e
          */
         optionsEnd?(): unknown;
     };
-    emit: ((evt: "update:modelValue", value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
+    emit: ((evt: "update:modelValue", value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
 } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
     props: {
         label: string;
         loading?: boolean | undefined;
         multiple?: TMultiple | undefined;
-        modelValue?: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined;
-        "onUpdate:modelValue"?: ((value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
+        modelValue?: import('./types').ListboxModelValue<TValue, TMultiple> | undefined;
+        "onUpdate:modelValue"?: ((value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
         options: ListboxOption<TValue>[];
         withCheckAll?: (TMultiple extends true ? boolean | {
             label?: string | undefined;
@@ -96,7 +96,7 @@ declare const _default: <TValue extends ListboxValue = ListboxValue, TMultiple e
          */
         optionsEnd?(): unknown;
     };
-    emit: ((evt: "update:modelValue", value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
+    emit: ((evt: "update:modelValue", value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
 }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }> & {
@@ -105,8 +105,8 @@ declare const _default: <TValue extends ListboxValue = ListboxValue, TMultiple e
             label: string;
             loading?: boolean | undefined;
             multiple?: TMultiple | undefined;
-            modelValue?: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined;
-            "onUpdate:modelValue"?: ((value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
+            modelValue?: import('./types').ListboxModelValue<TValue, TMultiple> | undefined;
+            "onUpdate:modelValue"?: ((value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => any) | undefined;
             options: ListboxOption<TValue>[];
             withCheckAll?: (TMultiple extends true ? boolean | {
                 label?: string | undefined;
@@ -148,7 +148,7 @@ declare const _default: <TValue extends ListboxValue = ListboxValue, TMultiple e
              */
             optionsEnd?(): unknown;
         };
-        emit: ((evt: "update:modelValue", value: import('@sit-onyx/headless').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
+        emit: ((evt: "update:modelValue", value: import('./types').ListboxModelValue<TValue, TMultiple> | undefined) => void) & ((evt: "lazyLoad") => void);
     } | undefined;
 };
 export default _default;

package/dist/components/OnyxListbox/types.d.ts

@@ -1,6 +1,7 @@
-import { ListboxValue, ListboxModelValue } from '@sit-onyx/headless';
+import { SelectOption, SelectOptionValue } from '../../types';
 
-export type OnyxListboxProps<TValue extends ListboxValue = ListboxValue, TMultiple extends boolean = false> = {
+export type ListboxModelValue<TValue extends SelectOptionValue = SelectOptionValue, TMultiple extends boolean = false> = TMultiple extends true ? TValue[] : TValue;
+export type OnyxListboxProps<TValue extends SelectOptionValue = SelectOptionValue, TMultiple extends boolean = false> = {
     /**
      * Aria label. Must be set for accessibility reasons.
      */
@@ -14,7 +15,7 @@ export type OnyxListboxProps<TValue extends ListboxValue = ListboxValue, TMultip
      */
     message?: string;
     /**
-     * Current value / selected options.
+     * Current value / selected option(s).
      */
     modelValue?: ListboxModelValue<TValue, TMultiple>;
     /**
@@ -43,19 +44,7 @@ export type OnyxListboxProps<TValue extends ListboxValue = ListboxValue, TMultip
      */
     lazyLoading?: ListboxLazyLoading;
 };
-export type ListboxOption<T extends ListboxValue = ListboxValue> = {
-    /**
-     * Option ID / value to use when the option is selected.
-     */
-    id: T;
-    /**
-     * Label to show.
-     */
-    label: string;
-    /**
-     * Whether the option is disabled.
-     */
-    disabled?: boolean;
+export type ListboxOption<TValue extends SelectOptionValue = SelectOptionValue> = Pick<SelectOption<TValue>, "value" | "label" | "disabled"> & {
     /**
      * Optional group name. If set, all options will be grouped under that group name.
      */

package/dist/components/OnyxRadioButton/OnyxRadioButton.vue.d.ts

@@ -1,12 +1,11 @@
-import { SelectionOptionValue } from './types';
+import { SelectOptionValue } from '../../types';
 
-declare const _default: <TValue extends SelectionOptionValue = SelectionOptionValue>(__VLS_props: {
+declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(__VLS_props: {
     required?: boolean | undefined;
     label: string;
-    onChange?: ((value: string) => any) | undefined;
+    onChange?: ((value: boolean) => any) | undefined;
     selected?: boolean | undefined;
-    value?: unknown;
-    id: TValue;
+    value: TValue;
     density?: "default" | "compact" | "cozy" | undefined;
     disabled?: boolean | undefined;
     loading?: boolean | undefined;
@@ -18,15 +17,14 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
 } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
     attrs: any;
     slots: {};
-    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: boolean) => void);
 } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
     props: {
         required?: boolean | undefined;
         label: string;
-        onChange?: ((value: string) => any) | undefined;
+        onChange?: ((value: boolean) => any) | undefined;
         selected?: boolean | undefined;
-        value?: unknown;
-        id: TValue;
+        value: TValue;
         density?: "default" | "compact" | "cozy" | undefined;
         disabled?: boolean | undefined;
         loading?: boolean | undefined;
@@ -39,7 +37,7 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};
-    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: boolean) => void);
 }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }> & {
@@ -47,10 +45,9 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
         props: {
             required?: boolean | undefined;
             label: string;
-            onChange?: ((value: string) => any) | undefined;
+            onChange?: ((value: boolean) => any) | undefined;
             selected?: boolean | undefined;
-            value?: unknown;
-            id: TValue;
+            value: TValue;
             density?: "default" | "compact" | "cozy" | undefined;
             disabled?: boolean | undefined;
             loading?: boolean | undefined;
@@ -63,7 +60,7 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
         expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
         attrs: any;
         slots: {};
-        emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
+        emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: boolean) => void);
     } | undefined;
 };
 export default _default;

package/dist/components/OnyxRadioButton/types.d.ts

@@ -1,37 +1,8 @@
-import { TruncationType } from '../../types/fonts';
+import { SelectOption, SelectOptionValue } from '../../types';
 import { CustomValidityProp } from '../../composables/useCustomValidity';
 import { DensityProp } from '../../composables/density';
 
-export type SelectionOptionValue = string | number | boolean;
-/**
- * TODO: move to dedicated file
- */
-export type SelectionOption<T extends SelectionOptionValue = SelectionOptionValue, TValue = unknown> = {
-    /**
-     * id of the selection option, not of the radio button input
-     */
-    id: T;
-    label: string;
-    /**
-     * An optional value.
-     * It's not actually used by the selection controls, but can be used to associate data with this option.
-     */
-    value?: TValue;
-    disabled?: boolean;
-    /**
-     * Shows a loading indicator.
-     */
-    loading?: boolean;
-    /**
-     * How to truncate the label if it exceeds the max width.
-     */
-    truncation?: TruncationType;
-    /**
-     * Whether to show a skeleton radio button.
-     */
-    skeleton?: boolean;
-};
-export type OnyxRadioButtonProps<TValue extends SelectionOptionValue = SelectionOptionValue> = SelectionOption<TValue> & DensityProp & CustomValidityProp & {
+export type OnyxRadioButtonProps<TValue extends SelectOptionValue = SelectOptionValue> = Omit<SelectOption<TValue>, "hideLabel"> & DensityProp & CustomValidityProp & {
     /**
      * Identifier for the radio buttons in the group.
      * All radio buttons that should belong to the same radio group must have the same name.

package/dist/components/OnyxRadioButtonGroup/OnyxRadioButtonGroup.vue.d.ts

@@ -1,6 +1,6 @@
-import { SelectionOption, SelectionOptionValue } from '../OnyxRadioButton/types';
+import { SelectOptionValue } from '../../types';
 
-declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
+declare const _default: <TValue extends SelectOptionValue>(__VLS_props: {
     required?: boolean | undefined;
     density?: "default" | "compact" | "cozy" | undefined;
     disabled?: boolean | undefined;
@@ -8,16 +8,16 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
     customError?: string | undefined;
     name?: string | undefined;
     requiredMarker?: "required" | "optional" | undefined;
-    modelValue?: SelectionOption<TValue> | undefined;
-    "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
-    options: SelectionOption<TValue>[];
+    modelValue?: TValue | undefined;
+    "onUpdate:modelValue"?: ((selected: TValue) => any) | undefined;
+    options: import('./types').RadioButtonOption<TValue>[];
     headline?: string | undefined;
     direction?: "horizontal" | "vertical" | undefined;
     onValidityChange?: ((validity: ValidityState) => any) | undefined;
 } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
     attrs: any;
     slots: {};
-    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: TValue) => void);
 } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
     props: {
         required?: boolean | undefined;
@@ -27,9 +27,9 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
         customError?: string | undefined;
         name?: string | undefined;
         requiredMarker?: "required" | "optional" | undefined;
-        modelValue?: SelectionOption<TValue> | undefined;
-        "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
-        options: SelectionOption<TValue>[];
+        modelValue?: TValue | undefined;
+        "onUpdate:modelValue"?: ((selected: TValue) => any) | undefined;
+        options: import('./types').RadioButtonOption<TValue>[];
         headline?: string | undefined;
         direction?: "horizontal" | "vertical" | undefined;
         onValidityChange?: ((validity: ValidityState) => any) | undefined;
@@ -37,7 +37,7 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};
-    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
+    emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: TValue) => void);
 }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }> & {
@@ -50,9 +50,9 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
             customError?: string | undefined;
             name?: string | undefined;
             requiredMarker?: "required" | "optional" | undefined;
-            modelValue?: SelectionOption<TValue> | undefined;
-            "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
-            options: SelectionOption<TValue>[];
+            modelValue?: TValue | undefined;
+            "onUpdate:modelValue"?: ((selected: TValue) => any) | undefined;
+            options: import('./types').RadioButtonOption<TValue>[];
             headline?: string | undefined;
             direction?: "horizontal" | "vertical" | undefined;
             onValidityChange?: ((validity: ValidityState) => any) | undefined;
@@ -60,7 +60,7 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
         expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
         attrs: any;
         slots: {};
-        emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
+        emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: TValue) => void);
     } | undefined;
 };
 export default _default;

package/dist/components/OnyxRadioButtonGroup/types.d.ts

@@ -1,10 +1,13 @@
-import { SelectionOption, SelectionOptionValue } from '../OnyxRadioButton/types';
-import { Direction } from '../../types';
+import { Direction, SelectOption, SelectOptionValue } from '../../types';
 import { CustomValidityProp } from '../../composables/useCustomValidity';
 import { RequiredMarkerProp } from '../../composables/required';
 import { DensityProp } from '../../composables/density';
 
-export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue = SelectionOptionValue> = DensityProp & RequiredMarkerProp & CustomValidityProp & {
+export type OnyxRadioButtonGroupProps<TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & RequiredMarkerProp & CustomValidityProp & {
+    /**
+     * Options for the individual radio buttons of the group.
+     */
+    options: RadioButtonOption<TValue>[];
     /**
      * Unique name for the radio button group form element.
      * Will automatically filled, when it is not given.
@@ -14,7 +17,7 @@ export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue = Sele
     /**
      * The selected radio button option.
      */
-    modelValue?: SelectionOption<TValue>;
+    modelValue?: TValue;
     /**
      * Headline shown above the radio button group, which is also the fieldset legend.
      * It will also show the required indicator, if `require` is set to `true`
@@ -28,12 +31,9 @@ export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue = Sele
      * Direction of the checkboxes. Can be vertical (default) or horizontal.
      */
     direction?: Direction;
-    /**
-     * Options for the individual radio buttons of the group.
-     */
-    options: SelectionOption<TValue>[];
     /**
      * If set, the specified number of skeleton radio buttons will be shown.
      */
     skeleton?: number;
 };
+export type RadioButtonOption<TValue extends SelectOptionValue = SelectOptionValue> = Omit<SelectOption<TValue>, "hideLabel">;

package/dist/components/OnyxSelect/OnyxSelect.vue.d.ts

@@ -1,6 +1,7 @@
-import { Multiple, SelectModelValue } from './types';
+import { SelectMultiple } from './types';
+import { SelectOptionValue } from '../..';
 
-declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple extends Multiple>(__VLS_props: {
+declare const _default: <TValue extends SelectOptionValue, TMultiple extends SelectMultiple>(__VLS_props: {
     required?: boolean | undefined;
     label: string;
     density?: "default" | "compact" | "cozy" | undefined;
@@ -9,16 +10,17 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
     skeleton?: boolean | undefined;
     multiple?: TMultiple | undefined;
     placeholder?: string | undefined;
-    requiredMarker?: "required" | "optional" | undefined;
-    modelValue?: TValue | undefined;
     hideLabel?: boolean | undefined;
-    "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
+    requiredMarker?: "required" | "optional" | undefined;
+    modelValue?: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined;
+    "onUpdate:modelValue"?: ((value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => any) | undefined;
+    options: import('../..').SelectOption<TValue>[];
     readonly?: boolean | undefined;
     message?: string | undefined;
 } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
     attrs: any;
     slots: {};
-    emit: (evt: "update:modelValue", value: TValue | undefined) => void;
+    emit: (evt: "update:modelValue", value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => void;
 } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
     props: {
         required?: boolean | undefined;
@@ -29,17 +31,18 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
         skeleton?: boolean | undefined;
         multiple?: TMultiple | undefined;
         placeholder?: string | undefined;
-        requiredMarker?: "required" | "optional" | undefined;
-        modelValue?: TValue | undefined;
         hideLabel?: boolean | undefined;
-        "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
+        requiredMarker?: "required" | "optional" | undefined;
+        modelValue?: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined;
+        "onUpdate:modelValue"?: ((value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => any) | undefined;
+        options: import('../..').SelectOption<TValue>[];
         readonly?: boolean | undefined;
         message?: string | undefined;
     } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};
-    emit: (evt: "update:modelValue", value: TValue | undefined) => void;
+    emit: (evt: "update:modelValue", value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => void;
 }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }> & {
@@ -53,17 +56,18 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
             skeleton?: boolean | undefined;
             multiple?: TMultiple | undefined;
             placeholder?: string | undefined;
-            requiredMarker?: "required" | "optional" | undefined;
-            modelValue?: TValue | undefined;
             hideLabel?: boolean | undefined;
-            "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
+            requiredMarker?: "required" | "optional" | undefined;
+            modelValue?: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined;
+            "onUpdate:modelValue"?: ((value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => any) | undefined;
+            options: import('../..').SelectOption<TValue>[];
             readonly?: boolean | undefined;
             message?: string | undefined;
         } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
         expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
         attrs: any;
         slots: {};
-        emit: (evt: "update:modelValue", value: TValue | undefined) => void;
+        emit: (evt: "update:modelValue", value: (TMultiple extends false | undefined ? import('./types').SelectModelValue<TValue> : import('./types').SelectModelValue<TValue>[]) | undefined) => void;
     } | undefined;
 };
 export default _default;