sit-onyx 1.0.0-beta.183 → 1.0.0-beta.185

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

@@ -1,7 +1,8 @@
+import { type Nullable } from "../../composables/useVModel";
 import { type OnyxAccordionProps } from "./types";
 declare const _default: <TValue extends PropertyKey>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:modelValue"?: ((value: TValue[]) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value: Nullable<TValue[]>) => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & OnyxAccordionProps<TValue> & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
@@ -11,7 +12,7 @@ declare const _default: <TValue extends PropertyKey>(__VLS_props: NonNullable<Aw
          */
         default(): unknown;
     };
-    emit: (evt: "update:modelValue", value: TValue[]) => void;
+    emit: (evt: "update:modelValue", value: Nullable<TValue[]>) => void;
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -1,11 +1,12 @@
 import type { SkeletonInjected } from "src/composables/useSkeletonState";
 import type { InjectionKey, Ref } from "vue";
 import type { DensityProp } from "../../composables/density";
+import type { Nullable } from "../../composables/useVModel";
 export type OnyxAccordionProps<TValue extends PropertyKey> = DensityProp & {
     /**
      * Currently opened items. Will include the `value` property of the nested `OnyxAccordionItems`.
      */
-    modelValue?: TValue[];
+    modelValue?: Nullable<TValue[]>;
     /**
      *  if `true`, only one accordion item can be open at the same time.
      */

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

@@ -9,6 +9,10 @@ export type OnyxBreadcrumbProps = DensityProp & {
      * Custom home item.
      */
     home?: BreadcrumbHomeItem;
+    /**
+     * Whether to show all nested breadcrumb items as skeleton.
+     */
+    skeleton?: boolean;
 };
 export type BreadcrumbHomeItem = {
     /**

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

@@ -7,6 +7,7 @@ type __VLS_Slots = {
 };
 declare const __VLS_component: import("vue").DefineComponent<OnyxBreadcrumbItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<OnyxBreadcrumbItemProps> & Readonly<{}>, {
     active: boolean | "auto";
+    skeleton: import("../../composables/useSkeletonState").SkeletonInjected;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

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

@@ -1,4 +1,5 @@
 import type { DensityProp } from "../../composables/density";
+import type { SkeletonInjected } from "../../composables/useSkeletonState";
 export type OnyxBreadcrumbItemProps = DensityProp & {
     /**
      * Link to the corresponding page.
@@ -10,4 +11,8 @@ export type OnyxBreadcrumbItemProps = DensityProp & {
      * If "auto" and a [router](https://onyx.schwarz/development/router.html) is provided, the active state will be determined automatically based on the current route.
      */
     active?: boolean | "auto";
+    /**
+     * Whether to show a skeleton item.
+     */
+    skeleton?: SkeletonInjected;
 };

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

@@ -1,9 +1,10 @@
+import type { Nullable } from "../../composables/useVModel";
 import type { BaseSelectOption, SelectOptionValue } from "../../types";
 export type OnyxCheckboxProps<TValue extends SelectOptionValue = SelectOptionValue> = BaseSelectOption<TValue> & {
     /**
      * Whether the checkbox is checked.
      */
-    modelValue?: boolean;
+    modelValue?: Nullable<boolean>;
     /**
      * If `true`, an indeterminate indicator is shown.
      */

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

@@ -1,15 +1,16 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { SelectOptionValue } from "../../types";
 import type { OnyxCheckboxGroupProps } from "./types";
 declare const _default: <TValue extends SelectOptionValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:modelValue"?: ((value: TValue[]) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value?: Nullable<TValue[]>) => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & OnyxCheckboxGroupProps<TValue> & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
         inputs: import("vue").ComputedRef<HTMLInputElement[]>;
     }>): void;
     attrs: any;
     slots: {};
-    emit: (evt: "update:modelValue", value: TValue[]) => void;
+    emit: (evt: "update:modelValue", value?: Nullable<TValue[]>) => void;
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -1,5 +1,6 @@
 import type { RequiredProp } from "../../composables/required";
 import type { CustomValidityProp } from "../../composables/useCustomValidity";
+import type { Nullable } from "../../composables/useVModel";
 import type { AutofocusProp, BaseSelectOption, Direction, SelectOptionValue } from "../../types";
 import type { SharedFormElementProps } from "../OnyxFormElement/types";
 export type OnyxCheckboxGroupProps<TValue extends SelectOptionValue = SelectOptionValue> = Pick<BaseSelectOption, "truncation"> & Pick<SharedFormElementProps, "label" | "labelTooltip" | "hideLabel" | "density" | "skeleton" | "disabled" | "requiredMarker"> & {
@@ -10,7 +11,7 @@ export type OnyxCheckboxGroupProps<TValue extends SelectOptionValue = SelectOpti
     /**
      * Currently checked checkboxes.
      */
-    modelValue?: TValue[];
+    modelValue?: Nullable<TValue[]>;
     /**
      * Direction of the checkboxes.
      */

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

@@ -1,9 +1,10 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { OnyxDatePickerProps } from "./types";
 declare const _default: import("vue").DefineComponent<OnyxDatePickerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value?: string | undefined) => any;
+    "update:modelValue": (value?: Nullable<string | number | Date>) => any;
     validityChange: (validity: ValidityState) => any;
 }, string, import("vue").PublicProps, Readonly<OnyxDatePickerProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value?: string | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value?: Nullable<string | number | Date>) => any) | undefined;
     onValidityChange?: ((validity: ValidityState) => any) | undefined;
 }>, {
     required: boolean;

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

@@ -1,9 +1,10 @@
+import type { Nullable } from "../../composables/useVModel";
 import type { OnyxInputProps } from "../OnyxInput/types";
 export type OnyxDatePickerProps = Omit<OnyxInputProps, "type" | "modelValue" | "autocapitalize" | "maxlength" | "minlength" | "pattern" | "withCounter" | "placeholder" | "autocomplete"> & {
     /**
      * Current date value. Supports all data types that are parsable by `new Date()`.
      */
-    modelValue?: DateValue;
+    modelValue?: Nullable<DateValue>;
     /**
      * Whether the user should be able to select only date or date + time.
      */

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

@@ -0,0 +1,16 @@
+import { type Nullable } from "../../composables/useVModel";
+import type { OnyxTagProps } from "../OnyxTag/types";
+type __VLS_Props = Omit<OnyxTagProps, "color" | "clickable"> & {
+    /**
+     * If `true` the filter is selected, shows an 'x' icon and can be removed on click.
+     */
+    active?: Nullable<boolean>;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:active": (value: Nullable<boolean>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:active"?: ((value: Nullable<boolean>) => any) | undefined;
+}>, {
+    skeleton: import("../../composables/useSkeletonState").SkeletonInjected;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

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

@@ -1,16 +1,9 @@
+import { type Nullable } from "../../composables/useVModel";
+import type { OnyxFormElementProps } from "./types";
 declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:modelValue"?: ((value: T | undefined) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & (Omit<import("./types").SharedFormElementProps, "error" | "message" | "success"> & import("../../composables/useLenientMaxLengthValidation.ts").SharedTextInputProps & {
-        errorMessages?: import("../../composables/useCustomValidity.ts").FormMessages;
-        message?: import("../../composables/useCustomValidity.ts").FormMessages;
-        successMessages?: import("../../composables/useCustomValidity.ts").FormMessages;
-    } & {
-        /**
-         * Current value of the input.
-         */
-        modelValue?: T;
-    }) & Partial<{}>> & import("vue").PublicProps;
+        readonly "onUpdate:modelValue"?: ((value?: Nullable<T>) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & OnyxFormElementProps<T> & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
@@ -19,7 +12,7 @@ declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>
             id: string;
         }): unknown;
     };
-    emit: (evt: "update:modelValue", value: T | undefined) => void;
+    emit: (evt: "update:modelValue", value?: Nullable<T>) => void;
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -3,12 +3,14 @@ import type { RequiredProp } from "../../composables/required";
 import type { CustomMessageType, CustomValidityProp, FormMessages } from "../../composables/useCustomValidity";
 import type { SharedTextInputProps } from "../../composables/useLenientMaxLengthValidation";
 import type { SkeletonInjected } from "../../composables/useSkeletonState";
+import type { Nullable } from "../../composables/useVModel";
 import type { AutofocusProp } from "../../types";
 import type { FormInjectedProps } from "../OnyxForm/OnyxForm.core";
-export type OnyxFormElementProps = Omit<SharedFormElementProps, "error" | "message" | "success"> & SharedTextInputProps & {
+export type OnyxFormElementProps<T> = Omit<SharedFormElementProps, "error" | "message" | "success"> & Omit<SharedTextInputProps, "modelValue"> & {
     errorMessages?: FormMessages;
     message?: FormMessages;
     successMessages?: FormMessages;
+    modelValue?: Nullable<T>;
 };
 export type SharedFormElementProps = FormInjectedProps & RequiredProp & DensityProp & CustomValidityProp & AutofocusProp & {
     /**

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

@@ -1,5 +1,5 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { OnyxInputProps } from "./types";
-type __VLS_Props = OnyxInputProps;
 type __VLS_Slots = {
     /**
      * Inline content rendered before the actual input area.
@@ -12,19 +12,13 @@ type __VLS_Slots = {
      */
     trailing?(): unknown;
 };
-type __VLS_PublicProps = __VLS_Props & {
-    /**
-     * Current value of the input.
-     */
-    modelValue?: string;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {
+declare const __VLS_component: import("vue").DefineComponent<OnyxInputProps, {
     input: Readonly<import("vue").ShallowRef<HTMLInputElement | null>>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: string) => any;
+    "update:modelValue": (value?: Nullable<string>) => any;
     validityChange: (validity: ValidityState) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}, string, import("vue").PublicProps, Readonly<OnyxInputProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value?: Nullable<string>) => any) | undefined;
     onValidityChange?: ((validity: ValidityState) => any) | undefined;
 }>, {
     required: boolean;

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

@@ -1,21 +1,15 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { OnyxMiniSearchProps } from "./types";
-type __VLS_Props = OnyxMiniSearchProps;
-type __VLS_PublicProps = __VLS_Props & {
-    /**
-     * Current input/search value.
-     */
-    modelValue?: string;
-};
-declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {
+declare const _default: import("vue").DefineComponent<OnyxMiniSearchProps, {
     /**
      * Focuses the input.
      */
     focus: () => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     clear: () => any;
-    "update:modelValue": (value: string) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "update:modelValue": (value?: Nullable<string>) => any;
+}, string, import("vue").PublicProps, Readonly<OnyxMiniSearchProps> & Readonly<{
     onClear?: (() => any) | undefined;
-    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value?: Nullable<string>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

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

@@ -1,8 +1,13 @@
 import type { DensityProp } from "../../composables/density";
+import type { Nullable } from "../../composables/useVModel";
 export type OnyxMiniSearchProps = DensityProp & {
     /**
      * (Aria) label of the input.
      */
     label: string;
     autofocus?: boolean;
+    /**
+     * Current search input.
+     */
+    modelValue?: Nullable<string>;
 };

package/dist/components/OnyxNavBar/modules/OnyxFlyoutMenu/OnyxFlyoutMenu.vue.d.ts

@@ -1,14 +1,10 @@
+import { type Nullable } from "../../../../composables/useVModel";
 import type { SelectOptionValue } from "../../../../types";
 import type { OnyxFlyoutMenuProps } from "./types";
 declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:open"> & (OnyxFlyoutMenuProps & {
-        /**
-         * If the flyout is expanded or not.
-         */
-        open?: boolean;
-    }) & Partial<{}>> & import("vue").PublicProps;
+        readonly "onUpdate:open"?: ((value?: Nullable<boolean>) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:open"> & OnyxFlyoutMenuProps & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
@@ -34,7 +30,7 @@ declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(_
          */
         footer?(): unknown;
     };
-    emit: (evt: "update:open", value: boolean) => void;
+    emit: (evt: "update:open", value?: Nullable<boolean>) => void;
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

package/dist/components/OnyxNavBar/modules/OnyxFlyoutMenu/types.d.ts

@@ -1,3 +1,4 @@
+import type { Nullable } from "../../../../composables/useVModel";
 export type OnyxFlyoutMenuProps = {
     /**
      * If the flyout is expanded on click or hover.
@@ -8,4 +9,8 @@ export type OnyxFlyoutMenuProps = {
      * Aria label for the flyout.
      */
     label: string;
+    /**
+     * Indicates whether the element is expanded or collapsed.
+     */
+    open?: Nullable<boolean>;
 };

package/dist/components/OnyxNavBar/modules/OnyxNavButton/NavButtonLayout.vue.d.ts

@@ -1,3 +1,4 @@
+import { type Nullable } from "../../../../composables/useVModel";
 import type { OnyxNavButtonProps } from "./types";
 type __VLS_Props = OnyxNavButtonProps & {
     /**
@@ -17,14 +18,13 @@ type __VLS_Slots = {
     }): unknown;
     options?(): unknown;
 };
-type __VLS_PublicProps = __VLS_Props & {
-    "mobileChildrenOpen"?: boolean;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:mobileChildrenOpen": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:mobileChildrenOpen"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:mobileChildrenOpen": (value: Nullable<boolean>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:mobileChildrenOpen"?: ((value: Nullable<boolean>) => any) | undefined;
+}>, {
+    mobileChildrenOpen: boolean | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/components/OnyxNavBar/modules/OnyxNavButton/OnyxNavButton.vue.d.ts

@@ -1,5 +1,5 @@
+import { type Nullable } from "../../../../composables/useVModel";
 import type { OnyxNavButtonProps } from "./types";
-type __VLS_Props = OnyxNavButtonProps;
 type __VLS_Slots = {
     /**
      * An optional slot to override the label content.
@@ -10,18 +10,13 @@ type __VLS_Slots = {
      */
     children?(): unknown;
 };
-type __VLS_PublicProps = __VLS_Props & {
-    /**
-     * Controls the open state for the mobile children.
-     */
-    "mobileChildrenOpen"?: boolean;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:mobileChildrenOpen": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:mobileChildrenOpen"?: ((value: boolean) => any) | undefined;
+declare const __VLS_component: import("vue").DefineComponent<OnyxNavButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:mobileChildrenOpen": (value: Nullable<boolean>) => any;
+}, string, import("vue").PublicProps, Readonly<OnyxNavButtonProps> & Readonly<{
+    "onUpdate:mobileChildrenOpen"?: ((value: Nullable<boolean>) => any) | undefined;
 }>, {
     active: boolean | "auto";
+    mobileChildrenOpen: boolean | null;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/components/OnyxNavBar/modules/OnyxNavButton/types.d.ts

@@ -1,3 +1,4 @@
+import type { Nullable } from "../../../../composables/useVModel";
 import type { WithLinkProp } from "../../../OnyxRouterLink/types";
 export type OnyxNavButtonProps = WithLinkProp<true> & {
     /**
@@ -11,4 +12,8 @@ export type OnyxNavButtonProps = WithLinkProp<true> & {
      * If "auto" and a [router](https://onyx.schwarz/development/router.html) is provided, the active state will be determined automatically based on the current route.
      */
     active?: boolean | "auto";
+    /**
+     * Controls whether child elements are open on mobile devices.
+     */
+    mobileChildrenOpen?: Nullable<boolean>;
 };

package/dist/components/OnyxNavBar/modules/OnyxUserMenu/OnyxUserMenu.vue.d.ts

@@ -1,5 +1,5 @@
+import { type Nullable } from "../../../../composables/useVModel";
 import type { OnyxUserMenuProps } from "./types";
-type __VLS_Props = OnyxUserMenuProps;
 type __VLS_Slots = {
     /**
      * Slot for the menu options. Its recommended to use the `OnyxMenuItem` component here.
@@ -10,17 +10,13 @@ type __VLS_Slots = {
      */
     footer?(): unknown;
 };
-type __VLS_PublicProps = __VLS_Props & {
-    /**
-     * If the flyout is expanded or not. Only has an effect in desktop (non-mobile) mode.
-     */
-    "flyoutOpen"?: boolean;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:flyoutOpen": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:flyoutOpen"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<OnyxUserMenuProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:flyoutOpen": (value: Nullable<boolean>) => any;
+}, string, import("vue").PublicProps, Readonly<OnyxUserMenuProps> & Readonly<{
+    "onUpdate:flyoutOpen"?: ((value: Nullable<boolean>) => any) | undefined;
+}>, {
+    flyoutOpen: boolean | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/components/OnyxNavBar/modules/OnyxUserMenu/UserMenuLayout.vue.d.ts

@@ -1,18 +1,18 @@
+import { type Nullable } from "../../../../composables/useVModel";
 import type { SelectOptionValue } from "../../../../types";
 declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:flyoutOpen"?: ((value: boolean) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:flyoutOpen"> & ({
+        readonly "onUpdate:flyoutOpen"?: ((value?: Nullable<boolean>) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:flyoutOpen"> & {
         /**
          * If the mobile layout should be used instead of the desktop layout.
          */
         isMobile: boolean;
-    } & {
         /**
-         * Controls the open state of the user menu flyout.
+         * Controls whether the flyout menu is open.
          */
-        flyoutOpen?: boolean;
-    }) & Partial<{}>> & import("vue").PublicProps;
+        flyoutOpen?: Nullable<boolean>;
+    } & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
@@ -29,7 +29,7 @@ declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(_
         options?(): unknown;
         footer?(): unknown;
     };
-    emit: (evt: "update:flyoutOpen", value: boolean) => void;
+    emit: (evt: "update:flyoutOpen", value?: Nullable<boolean>) => void;
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

package/dist/components/OnyxNavBar/modules/OnyxUserMenu/types.d.ts

@@ -1,3 +1,4 @@
+import type { Nullable } from "../../../../composables/useVModel";
 import type { OnyxAvatarProps } from "../../../OnyxAvatar/types";
 export type OnyxUserMenuProps = {
     /**
@@ -14,4 +15,8 @@ export type OnyxUserMenuProps = {
      * Optional user description that is displayed when the menu is opened.
      */
     description?: string;
+    /**
+     * Controls whether the flyout menu is open.
+     */
+    flyoutOpen?: Nullable<boolean>;
 };

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

@@ -1,8 +1,9 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { SelectOptionValue } from "../../types";
 import type { OnyxRadioGroupProps } from "./types";
 declare const _default: <TValue extends SelectOptionValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:modelValue"?: ((selected: TValue) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((selected?: Nullable<TValue>) => any) | undefined;
         readonly onValidityChange?: ((validity: ValidityState) => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onValidityChange"> & OnyxRadioGroupProps<TValue> & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
@@ -10,7 +11,7 @@ declare const _default: <TValue extends SelectOptionValue>(__VLS_props: NonNulla
     }>): void;
     attrs: any;
     slots: {};
-    emit: ((evt: "update:modelValue", selected: TValue) => void) & ((evt: "validityChange", validity: ValidityState) => void);
+    emit: ((evt: "update:modelValue", selected?: Nullable<TValue>) => void) & ((evt: "validityChange", validity: ValidityState) => void);
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -1,3 +1,4 @@
+import type { Nullable } from "../../composables/useVModel";
 import type { AutofocusProp, BaseSelectOption, Direction, SelectOptionValue } from "../../types";
 import type { SharedFormElementProps } from "../OnyxFormElement/types";
 export type OnyxRadioGroupProps<TValue extends SelectOptionValue = SelectOptionValue> = Pick<BaseSelectOption, "truncation"> & Pick<SharedFormElementProps, "skeleton" | "label" | "labelTooltip" | "hideLabel" | "name" | "density" | "customError" | "required" | "requiredMarker" | "disabled"> & {
@@ -8,7 +9,7 @@ export type OnyxRadioGroupProps<TValue extends SelectOptionValue = SelectOptionV
     /**
      * The selected radio button option.
      */
-    modelValue?: TValue;
+    modelValue?: Nullable<TValue>;
     /**
      * Direction of the checkboxes. Can be vertical (default) or horizontal.
      */

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

@@ -1,43 +1,14 @@
+import { type Nullable } from "../../composables/useVModel";
 import type { SelectOptionValue } from "../../types";
-import type { OnyxSelectInputProps } from "../OnyxSelectInput/types";
-import type { SelectOption } from "./types";
+import type { OnyxSelectProps, SelectOption } from "./types";
 declare const _default: <TModelValue extends SelectOptionValue | SelectOptionValue[], TMultiple extends TModelValue extends any[] ? true : false | undefined, TValue extends TModelValue extends (infer TInner)[] ? TInner : TModelValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly "onUpdate:modelValue"?: ((value: TModelValue | undefined) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value?: Nullable<TModelValue>) => any) | undefined;
         readonly onValidityChange?: ((validity: ValidityState) => any) | undefined;
         readonly "onUpdate:open"?: ((value: boolean) => any) | undefined;
-        readonly "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
         readonly onLazyLoad?: (() => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onValidityChange" | "onUpdate:open" | "onUpdate:searchTerm" | "onLazyLoad"> & (import("../../index.ts").DensityProp & Omit<OnyxSelectInputProps, "disabled" | "density" | "modelValue" | "showFocus"> & import("../../types").AutofocusProp & Pick<import("../../types").BaseSelectOption, "truncation"> & {
-        noFilter?: boolean;
-        withSearch?: boolean;
-        multiple?: TMultiple | undefined;
-        withCheckAll?: (TMultiple extends true ? boolean | {
-            label?: string;
-        } : never) | undefined;
-        disabled?: import("../OnyxForm/OnyxForm.core").FormInjected<boolean>;
-        valueLabel?: string | string[];
-        alignment?: import("./types").SelectAlignment;
-        listLabel: string;
-        listDescription?: string;
-        options: SelectOption<TValue>[];
-        lazyLoading?: import("./types").SelectLazyLoading;
-    } & {
-        /**
-         * Value of the currently selected option or an array of values when the `multiple` prop is `true`.
-         */
-        modelValue?: TModelValue;
-        /**
-         * Value of the search input, when `withSearch` is `true`.
-         *
-         * Hint: Cover `valueLabel` to prevent the disappearance of the current selections label
-         */
-        searchTerm?: string;
-        /**
-         * If true, the select popover is expanded and visible.
-         */
-        open?: boolean;
-    }) & Partial<{}>> & import("vue").PublicProps;
+        readonly "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onValidityChange" | "onUpdate:open" | "onLazyLoad" | "onUpdate:searchTerm"> & OnyxSelectProps<TModelValue, TMultiple, TValue> & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
         input: import("vue").ComputedRef<HTMLInputElement | null | undefined>;
     }>): void;
@@ -62,7 +33,7 @@ declare const _default: <TModelValue extends SelectOptionValue | SelectOptionVal
          */
         option?(props: SelectOption<TValue>): unknown;
     };
-    emit: (((evt: "validityChange", validity: ValidityState) => void) & ((evt: "lazyLoad") => void)) & (((evt: "update:modelValue", value: TModelValue | undefined) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "update:searchTerm", value: string) => void));
+    emit: ((evt: "update:modelValue", value?: Nullable<TModelValue>) => void) & ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "lazyLoad") => void) & ((evt: "update:searchTerm", value: string) => void);
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -1,9 +1,10 @@
 import type { DensityProp } from "../../composables/density";
+import type { Nullable } from "../../composables/useVModel";
 import type { AutofocusProp, BaseSelectOption, SelectOptionValue } from "../../types";
 import type { FormInjected } from "../OnyxForm/OnyxForm.core";
 import type { OnyxSelectInputProps } from "../OnyxSelectInput/types";
 import type { OnyxSelectOptionProps } from "../OnyxSelectOption/types";
-export type OnyxSelectProps<TMultiple extends boolean | undefined, TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & Omit<OnyxSelectInputProps, "density" | "modelValue" | "showFocus" | "disabled"> & AutofocusProp & Pick<BaseSelectOption, "truncation"> & {
+export type OnyxSelectProps<TModelValue, TMultiple extends boolean | undefined, TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & Omit<OnyxSelectInputProps, "density" | "modelValue" | "showFocus" | "disabled"> & AutofocusProp & Pick<BaseSelectOption, "truncation"> & {
     /**
      * Disables the implicit options filtering when the user changes the search term.
      */
@@ -66,6 +67,13 @@ export type OnyxSelectProps<TMultiple extends boolean | undefined, TValue extend
      * If you want to use a button instead, use the `optionsEnd` slot.
      */
     lazyLoading?: SelectLazyLoading;
+} & {
+    /**
+     * Currently selected options. Can be either a single value or an array of values.
+     */
+    modelValue?: Nullable<TModelValue>;
+    open?: Nullable<boolean>;
+    searchTerm?: Nullable<string>;
 };
 export type SelectOption<TValue extends SelectOptionValue = SelectOptionValue> = Pick<BaseSelectOption<TValue>, "value" | "label" | "truncation"> & Pick<OnyxSelectOptionProps, "icon"> & {
     /**