sit-onyx 1.0.0-beta.98 → 1.0.0-dev-20250912111044

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

@@ -1,4 +1,4 @@
-import type { OnyxColor } from "../../types/colors";
+import { OnyxColor } from '../../types/colors.js';
 export type OnyxIconProps = IconSizeProp & {
     /**
      * SVG source of the icon. **Important**: Only provide trustworthy content, the SVG content will
@@ -9,6 +9,10 @@ export type OnyxIconProps = IconSizeProp & {
      * Icon color.
      */
     color?: OnyxColor | "currentColor";
+    /**
+     * In inline mode the icon will adapt to the font-size and align itself according to the line-height.
+     */
+    inline?: boolean;
 };
 export declare const ICON_SIZES: readonly ["12px", "16px", "24px", "32px", "48px", "64px", "96px"];
 export type IconSize = (typeof ICON_SIZES)[number];

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

@@ -0,0 +1,27 @@
+import { OnyxIconButtonProps } from './types.js';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /** Slot for an custom icon. Will have no effect if property `icon` is passed. */
+        default(): unknown;
+    }> & {
+        /** Slot for an custom icon. Will have no effect if property `icon` is passed. */
+        default(): unknown;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<OnyxIconButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<OnyxIconButtonProps> & Readonly<{}>, {
+    skeleton: import('../../composables/useSkeletonState.js', { with: { "resolution-mode": "import" } }).SkeletonInjected;
+    disabled: import('../OnyxForm/OnyxForm.core.js', { with: { "resolution-mode": "import" } }).FormInjected<boolean>;
+    type: import('../OnyxButton/types.js', { with: { "resolution-mode": "import" } }).ButtonType;
+    color: import('../OnyxButton/types.js', { with: { "resolution-mode": "import" } }).ButtonColor;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,9 +1,9 @@
-import type { DensityProp } from "../../composables/density";
-import type { SkeletonInjected } from "../../composables/useSkeletonState";
-import type { AutofocusProp } from "../../types";
-import type { ButtonColor, ButtonType } from "../OnyxButton/types";
-import type { FormInjected } from "../OnyxForm/OnyxForm.core";
-export type OnyxIconButtonProps = DensityProp & AutofocusProp & {
+import { DensityProp } from '../../composables/density.js';
+import { SkeletonInjected } from '../../composables/useSkeletonState.js';
+import { AutofocusProp } from '../../types/index.js';
+import { ButtonColor, ButtonType, OnyxButtonProps } from '../OnyxButton/types.js';
+import { FormInjected } from '../OnyxForm/OnyxForm.core.js';
+export type OnyxIconButtonProps = DensityProp & AutofocusProp & Pick<OnyxButtonProps, "link"> & {
     /**
      * The aria-label of the button.
      */

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

@@ -0,0 +1,6 @@
+import { OnyxImageProps } from './types.js';
+declare const _default: import('vue').DefineComponent<OnyxImageProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<OnyxImageProps> & Readonly<{}>, {
+    skeleton: import('../../composables/useSkeletonState.js', { with: { "resolution-mode": "import" } }).SkeletonInjected;
+    loading: import('./types.js', { with: { "resolution-mode": "import" } }).ImageLoading;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

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

@@ -0,0 +1,43 @@
+import { SkeletonInjected } from '../../composables/useSkeletonState.js';
+export type OnyxImageProps = {
+    /**
+     * Image URL to show.
+     * You can pass different images for light and dark mode.
+     */
+    src: string | {
+        light: string;
+        dark: string;
+    };
+    /**
+     * (Descriptive) Text that can replace the image, e.g. if it can not be loaded.
+     * Can be set to an empty string if the image is only used for decoration and NOT a key part of the content.
+     */
+    alt: string;
+    /**
+     * Width of the image in pixels. Can be customized via CSS to e.g. use 100% of the available width.
+     * Will be used by the browser to reserve space while the image is loading and is recommended to prevent a layout shift.
+     */
+    width: number;
+    /**
+     * Height of the image in pixels. Can be customized via CSS to e.g. use 100% of the available height.
+     * Will be used by the browser to reserve space while the image is loading and is recommended to prevent a layout shift.
+     */
+    height: number;
+    /**
+     * Defines how the image should be loaded.
+     * - lazy: Defers loading until the image reaches a browser-defined distance from the viewport
+     * - eager: Immediately loads the image, regardless of whether its currently in the visible viewport
+     */
+    loading?: ImageLoading;
+    /**
+     * Image border shape. If unset, the original image shape will be used.
+     */
+    shape?: ImageShape;
+    /**
+     * Whether to show a skeleton image.
+     */
+    skeleton?: SkeletonInjected;
+};
+export type ImageLoading = "eager" | "lazy";
+export declare const IMAGE_SHAPES: readonly ["rounded", "circle", "clip", "clip-inverted"];
+export type ImageShape = (typeof IMAGE_SHAPES)[number];

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

@@ -0,0 +1,42 @@
+import { OnyxInfoCardProps } from './types.js';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Slot to provide description / further information.
+         */
+        default?(): unknown;
+        /**
+         * Slot to provide optional buttons/actions.
+         */
+        buttons?(): unknown;
+    }> & {
+        /**
+         * Slot to provide description / further information.
+         */
+        default?(): unknown;
+        /**
+         * Slot to provide optional buttons/actions.
+         */
+        buttons?(): unknown;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<OnyxInfoCardProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<OnyxInfoCardProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {
+    icon: string | false;
+    color: import('../../index.js', { with: { "resolution-mode": "import" } }).OnyxColor;
+    closable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,21 @@
+import { DensityProp } from '../../composables/density.js';
+import { OnyxColor } from '../../types/index.js';
+export type OnyxInfoCardProps = DensityProp & {
+    /**
+     * Card headline.
+     */
+    headline?: string;
+    /**
+     * Card color.
+     */
+    color?: OnyxColor;
+    /**
+     * Icon to display. If unset, a default icon will be displayed.
+     * Can be set to `false` to hide the icon.
+     */
+    icon?: string | false;
+    /**
+     * Whether the info card can be closed. Will show an "x" icon.
+     */
+    closable?: boolean;
+};

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

@@ -0,0 +1,12 @@
+import { Nullable } from '../../types/utils.js';
+import { OnyxInfoTooltipProps } from './types.js';
+declare const _default: import('vue').DefineComponent<OnyxInfoTooltipProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (open: Nullable<boolean>) => any;
+}, string, import('vue').PublicProps, Readonly<OnyxInfoTooltipProps> & Readonly<{
+    "onUpdate:open"?: ((open: Nullable<boolean>) => any) | undefined;
+}>, {
+    open: boolean | null;
+    color: Extract<import('../../index.js', { with: { "resolution-mode": "import" } }).OnyxColor, "neutral" | "danger" | "success">;
+    trigger: import('../OnyxTooltip/types.js', { with: { "resolution-mode": "import" } }).TooltipTrigger;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+export default _default;

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

@@ -1,2 +1,2 @@
-import type { OnyxTooltipProps } from "../OnyxTooltip/types";
-export type OnyxInfoTooltipProps = Required<Pick<OnyxTooltipProps, "text">> & Pick<OnyxTooltipProps, "position" | "open" | "color">;
+import { OnyxTooltipProps } from '../OnyxTooltip/types.js';
+export type OnyxInfoTooltipProps = Required<Pick<OnyxTooltipProps, "text">> & Omit<OnyxTooltipProps, "text" | "fitParent">;

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

@@ -0,0 +1,62 @@
+import { OnyxInputProps } from './types.js';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Inline content rendered before the actual input area.
+         * Careful when using this slot, as it will shrink the space of the input.
+         */
+        leading?(): unknown;
+        /**
+         * Inline content rendered after the actual input area.
+         * Careful when using this slot, as it will shrink the space of the input.
+         */
+        trailing?(): unknown;
+    }> & {
+        /**
+         * Inline content rendered before the actual input area.
+         * Careful when using this slot, as it will shrink the space of the input.
+         */
+        leading?(): unknown;
+        /**
+         * Inline content rendered after the actual input area.
+         * Careful when using this slot, as it will shrink the space of the input.
+         */
+        trailing?(): unknown;
+    };
+    refs: {
+        inputRef: HTMLInputElement;
+    };
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<OnyxInputProps, {
+    input: Readonly<import('vue').ShallowRef<HTMLInputElement | null>>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    validityChange: (validity: ValidityState) => any;
+    "update:modelValue": (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<OnyxInputProps> & Readonly<{
+    onValidityChange?: ((validity: ValidityState) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    skeleton: import('../../composables/useSkeletonState.js', { with: { "resolution-mode": "import" } }).SkeletonInjected;
+    required: boolean;
+    disabled: import('../OnyxForm/OnyxForm.core.js', { with: { "resolution-mode": "import" } }).FormInjected<boolean>;
+    showError: import('../OnyxForm/OnyxForm.core.js', { with: { "resolution-mode": "import" } }).FormInjected<import('../../composables/useErrorClass.js', { with: { "resolution-mode": "import" } }).ShowErrorMode>;
+    requiredMarker: import('../OnyxForm/OnyxForm.core.js', { with: { "resolution-mode": "import" } }).FormInjected<import('../../composables/required.js', { with: { "resolution-mode": "import" } }).RequiredMarkerType>;
+    readonly: boolean;
+    loading: boolean;
+    autocapitalize: import('../../composables/useLenientMaxLengthValidation.js', { with: { "resolution-mode": "import" } }).Autocapitalize;
+    type: import('./types.js', { with: { "resolution-mode": "import" } }).InputType;
+    hideSuccessIcon: boolean;
+    hideClearIcon: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    inputRef: HTMLInputElement;
+}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,52 +1,16 @@
-import type { DensityProp } from "../../composables/density";
-import type { RequiredMarkerProp } from "../../composables/required";
-import type { CustomValidityProp } from "../../composables/useCustomValidity";
-import type { SkeletonInjected } from "../../composables/useSkeletonState";
-import type { AutofocusProp } from "../../types";
-import type { FormInjectedProps } from "../OnyxForm/OnyxForm.core";
-import type { SharedFormElementProps } from "../OnyxFormElement/types";
-export type OnyxInputProps = FormInjectedProps & DensityProp & RequiredMarkerProp & CustomValidityProp & Omit<SharedFormElementProps, "modelValue" | "errorMessages"> & AutofocusProp & {
-    /**
-     * Current value of the input.
-     */
-    modelValue?: string;
+import { SharedTextInputProps } from '../../composables/useLenientMaxLengthValidation.js';
+import { SharedFormElementProps } from '../OnyxFormElement/types.js';
+export type OnyxInputProps = SharedFormElementProps & SharedTextInputProps & {
     /**
      * Input type.
+     * For numeric inputs, we recommend using the [OnyxStepper](https://storybook.onyx.schwarz/?path=/docs/form-elements-stepper--docs).
+     * For date inputs, refer to the [OnyxDatePicker](https://storybook.onyx.schwarz/?path=/docs/form-elements-datepicker--docs).
      */
     type?: InputType;
-    /**
-     * Placeholder to show when the value is empty.
-     */
-    placeholder?: string;
-    /**
-     * If and how text should be automatically be capitalized when using non-physical keyboards
-     * (such as virtual keyboard on mobile devices or voice input).
-     *
-     * Has no effect when `type` is set to "url", "email" or "password".
-     *
-     * @see [MDN autocapitalize](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize)
-     */
-    autocapitalize?: Autocapitalize;
-    /**
-     * Specify how to provide automated assistance in filling out the input.
-     * Some autocomplete values might required specific browser permissions to be allowed by the user.
-     * Also browsers might require a `name` property.
-     *
-     * @see [MDN autocomplete](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete)
-     */
-    autocomplete?: Autocomplete;
     /**
      * Pattern the value must match to be valid.
      */
     pattern?: string | RegExp;
-    /**
-     * Whether the input should be readonly.
-     */
-    readonly?: boolean;
-    /**
-     * Whether the input is loading. User interaction will be disabled.
-     */
-    loading?: boolean;
     /**
      * Whether to hide the check icon when the input is in a success state.
      */
@@ -55,29 +19,6 @@ export type OnyxInputProps = FormInjectedProps & DensityProp & RequiredMarkerPro
      * Whether to hide the clear icon when the input is filled and focused.
      */
     hideClearIcon?: boolean;
-    /**
-     * Minimum number of characters that have to to be entered.
-     * Warning: when the value is (pre)set programmatically,
-     * the input invalidity will not be detected by the browser, it will only turn invalid
-     * as soon as a user interacts with the input (types something).
-     */
-    minlength?: number;
-    /**
-     * Whether to show a skeleton input.
-     */
-    skeleton?: SkeletonInjected;
 };
 export declare const INPUT_TYPES: readonly ["email", "password", "search", "tel", "text", "url"];
 export type InputType = (typeof INPUT_TYPES)[number];
-/**
- * @see [MDN autocapitalize](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize)
- */
-export declare const AUTOCAPITALIZE: readonly ["none", "sentences", "words", "characters"];
-export type Autocapitalize = (typeof AUTOCAPITALIZE)[number];
-/**
- * Same as TypeScript native "Autofill" type but without "AutoFillSection" because
- * the Vue compiler currently can not handle it (too complex union type).
- *
- * @since TypeScript version 5.2
- */
-export type Autocomplete = Exclude<AutoFill, AutoFillSection | "">;

package/dist/components/OnyxLink/{OnyxLink.vue.d.ts → OnyxLink.d.vue.ts}

@@ -1,4 +1,4 @@
-import type { OnyxLinkProps } from "./types";
+import { OnyxLinkProps } from './types.js';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: Readonly<{
@@ -16,10 +16,10 @@ declare function __VLS_template(): {
     rootEl: HTMLAnchorElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<OnyxLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<OnyxLinkProps> & Readonly<{}>, {
-    target: import("./types").LinkTarget;
+declare const __VLS_component: import('vue').DefineComponent<OnyxLinkProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<OnyxLinkProps> & Readonly<{}>, {
+    target: import('../../index.js', { with: { "resolution-mode": "import" } }).LinkTarget;
     withExternalIcon: boolean | "auto";
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLAnchorElement>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLAnchorElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1,10 +1,3 @@
-import type { OnyxExternalLinkIcon } from "../OnyxExternalLinkIcon/types";
-export type OnyxLinkProps = OnyxExternalLinkIcon & {
-    /**
-     * Where to display the linked URL (same tab, new tab etc.).
-     * For `_blank`, the `rel="noreferrer"` will be set automatically.
-     */
-    target?: LinkTarget;
-};
-export declare const LINK_TARGETS: readonly ["_self", "_blank", "_parent", "_top"];
-export type LinkTarget = (typeof LINK_TARGETS)[number];
+import { OnyxExternalLinkIconProps } from '../OnyxExternalLinkIcon/types.js';
+import { SharedLinkProps } from '../OnyxRouterLink/types.js';
+export type OnyxLinkProps = OnyxExternalLinkIconProps & SharedLinkProps;

package/dist/components/OnyxListItem/{OnyxListItem.vue.d.ts → OnyxListItem.d.vue.ts}

@@ -1,4 +1,4 @@
-import type { OnyxListItemProps } from "./types";
+import { OnyxListItemProps } from './types.js';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: Readonly<{
@@ -16,12 +16,12 @@ declare function __VLS_template(): {
     rootEl: HTMLLIElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<OnyxListItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<OnyxListItemProps> & Readonly<{}>, {
-    active: boolean;
+declare const __VLS_component: import('vue').DefineComponent<OnyxListItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<OnyxListItemProps> & Readonly<{}>, {
     disabled: boolean;
     checked: boolean;
     selected: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLLIElement>;
+    active: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLLIElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1,5 +1,5 @@
-import type { DensityProp } from "../../composables/density";
-import type { OnyxColor } from "../../types";
+import { DensityProp } from '../../composables/density.js';
+import { OnyxColor } from '../../types/index.js';
 export type OnyxListItemProps = DensityProp & {
     /**
      * Whether the option is currently selected (if the content includes interactive components like a checkbox, use `checked` instead).

package/dist/components/OnyxLoadingIndicator/OnyxCircleSpinner.d.vue.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/dist/components/OnyxLoadingIndicator/OnyxLoadingDots.d.vue.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

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

@@ -0,0 +1,5 @@
+import { OnyxLoadingIndicatorProps } from './types.js';
+declare const _default: import('vue').DefineComponent<OnyxLoadingIndicatorProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<OnyxLoadingIndicatorProps> & Readonly<{}>, {
+    type: "circle" | "dots";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

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

@@ -0,0 +1,16 @@
+import { OnyxMiniSearchProps } from './types.js';
+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<OnyxMiniSearchProps> & Readonly<{
+    onClear?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    inputRef: HTMLInputElement;
+}, any>;
+export default _default;

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

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

package/dist/components/OnyxMobileNavButton/{OnyxMobileNavButton.vue.d.ts → OnyxMobileNavButton.d.vue.ts}

@@ -1,4 +1,4 @@
-import type { OnyxMobileNavButtonProps } from "./types";
+import { OnyxMobileNavButtonProps } from './types.js';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: Readonly<{
@@ -16,13 +16,13 @@ declare function __VLS_template(): {
     rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<OnyxMobileNavButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import('vue').DefineComponent<OnyxMobileNavButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:open": (isOpen: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<OnyxMobileNavButtonProps> & Readonly<{
+}, string, import('vue').PublicProps, Readonly<OnyxMobileNavButtonProps> & Readonly<{
     "onUpdate:open"?: ((isOpen: boolean) => any) | undefined;
 }>, {
     open: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -16,4 +16,8 @@ export type OnyxMobileNavButtonProps = {
      * Headline of the mobile flyout
      */
     headline?: string;
+    /**
+     * Whether the nav button is disabled and can not be opened.
+     */
+    disabled?: boolean;
 };

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

@@ -0,0 +1,57 @@
+import { Nullable } from '../../types/index.js';
+import { OnyxModalProps } from './types.js';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Dialog content.
+         */
+        default(): unknown;
+        /**
+         * Optional slot to override the headline with custom content.
+         * If unset, the `label` property will be shown.
+         */
+        headline?(bindings: Pick<OnyxModalProps, "label">): unknown;
+        /**
+         * Optional slot to add custom content, e.g. a description to the dialog header (below the headline).
+         */
+        description?(): unknown;
+        /**
+         * Optional footer slot to e.g. show action buttons (see OnyxBottomBar component).
+         */
+        footer?(): unknown;
+    }> & {
+        /**
+         * Dialog content.
+         */
+        default(): unknown;
+        /**
+         * Optional slot to override the headline with custom content.
+         * If unset, the `label` property will be shown.
+         */
+        headline?(bindings: Pick<OnyxModalProps, "label">): unknown;
+        /**
+         * Optional slot to add custom content, e.g. a description to the dialog header (below the headline).
+         */
+        description?(): unknown;
+        /**
+         * Optional footer slot to e.g. show action buttons (see OnyxBottomBar component).
+         */
+        footer?(): unknown;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<OnyxModalProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (open: Nullable<boolean>) => any;
+}, string, import('vue').PublicProps, Readonly<OnyxModalProps> & Readonly<{
+    "onUpdate:open"?: ((open: Nullable<boolean>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,2 @@
+import { OnyxBasicDialogProps } from '../OnyxBasicDialog/types.js';
+export type OnyxModalProps = Omit<OnyxBasicDialogProps, "modal" | "alignment">;

package/dist/components/OnyxMoreList/{OnyxMoreList.vue.d.ts → OnyxMoreList.d.vue.ts}

@@ -1,4 +1,4 @@
-import type { MoreListSlotBindings, OnyxMoreListProps } from "./types";
+import { MoreListSlotBindings, OnyxMoreListProps } from './types.js';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: Readonly<{
@@ -29,16 +29,21 @@ declare function __VLS_template(): {
         }): unknown;
     };
     refs: {
-        parentRef: HTMLDivElement;
+        parentRefEl: unknown;
     };
-    rootEl: HTMLDivElement;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<OnyxMoreListProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import('vue').DefineComponent<OnyxMoreListProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     visibilityChange: (args_0: MoreListSlotBindings) => any;
-}, string, import("vue").PublicProps, Readonly<OnyxMoreListProps> & Readonly<{
+}, string, import('vue').PublicProps, Readonly<OnyxMoreListProps> & Readonly<{
     onVisibilityChange?: ((args_0: MoreListSlotBindings) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLDivElement>;
+}>, {
+    is: import('vue').Component | string;
+    direction: "rtl" | "ltr";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    parentRefEl: unknown;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1,18 +1,27 @@
-import type { MoreListInjectionKey } from "../../composables/useMoreList";
+import { Component } from 'vue';
+import { MoreListInjectionKey } from '../../composables/useMoreList.js';
 export type OnyxMoreListProps = {
     /**
      * Injection key to use. Must match the one used in the child components.
      * Will not be reactive so it must not be changed.
      */
     injectionKey: MoreListInjectionKey;
+    /**
+     * What the component should render as. Defaults to `div`.
+     */
+    is?: Component | string;
+    /**
+     * From which direction the more list items should be collapsed. Defaults to `rtl`.
+     */
+    direction?: "rtl" | "ltr";
 };
 export type MoreListSlotBindings = {
     /**
      * Number of currently fully visible elements.
      */
-    visibleElements: number;
+    visibleElements?: number;
     /**
      * Number of currently completely or partially hidden elements.
      */
-    hiddenElements: number;
+    hiddenElements?: number;
 };