sit-onyx 1.0.0-beta.16 → 1.0.0-beta.18

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

@@ -3,13 +3,13 @@ import type { OnyxSelectProps, SelectOption } from "./types";
 declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_Prettify<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_Prettify<Pick<Partial<{}> & Omit<{
         onValidityChange?: ((validity: ValidityState) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: SelectOption<TValue> | SelectOption<TValue>[] | undefined) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: TValue | TValue[] | undefined) => any) | undefined;
         "onUpdate:open"?: ((open: boolean) => any) | undefined;
         "onUpdate:searchTerm"?: ((searchTerm: string) => any) | undefined;
         onLazyLoad?: (() => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{}>> & {
         onValidityChange?: ((validity: ValidityState) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: SelectOption<TValue> | SelectOption<TValue>[] | undefined) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: TValue | TValue[] | undefined) => any) | undefined;
         "onUpdate:open"?: ((open: boolean) => any) | undefined;
         "onUpdate:searchTerm"?: ((searchTerm: string) => any) | undefined;
         onLazyLoad?: (() => any) | undefined;
@@ -55,7 +55,7 @@ declare const _default: <TValue extends SelectOptionValue = SelectOptionValue>(_
          */
         option?(props: SelectOption<TValue>): unknown;
     }>;
-    emit: (((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", value: SelectOption<TValue> | SelectOption<TValue>[] | undefined) => void) & ((evt: "update:open", open: boolean) => void) & ((evt: "update:searchTerm", searchTerm: string) => void) & ((evt: "lazyLoad") => void)) & {};
+    emit: (((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", value: TValue | TValue[] | undefined) => void) & ((evt: "update:open", open: boolean) => void) & ((evt: "update:searchTerm", searchTerm: string) => void) & ((evt: "lazyLoad") => void)) & {};
 }>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }> & {

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

@@ -15,9 +15,18 @@ export type SelectSearchProps = {
      * Property is managed internally, when undefined.
      */
     searchTerm?: string;
+    /**
+     * As default, onyx will handle the search by comparing
+     * the option labels with the `searchTerm`.
+     * When `manualSearch` is set, this behavior is disabled.
+     * Handle your own filtering by reducing the `options` as desired.
+     * Hint: Cover `valueLabel` to prevent the disappearance of the current selections label
+     */
+    manualSearch?: boolean;
 } | {
     withSearch?: false;
     searchTerm?: never;
+    manualSearch?: never;
 };
 export type SelectModelValueProps<TValue extends SelectOptionValue> = {
     /**
@@ -25,9 +34,9 @@ export type SelectModelValueProps<TValue extends SelectOptionValue> = {
      */
     multiple?: false;
     /**
-     * Current value.
+     * Value of the currently selected option.
      */
-    modelValue?: SelectOption<TValue>;
+    modelValue?: TValue;
     withCheckAll?: never;
 } | {
     /**
@@ -35,9 +44,9 @@ export type SelectModelValueProps<TValue extends SelectOptionValue> = {
      */
     multiple: true;
     /**
-     * Current value / selected option(s).
+     * Values of the currently selected options.
      */
-    modelValue?: SelectOption<TValue>[];
+    modelValue?: TValue[];
     /**
      * If true, a checkbox will be displayed to check/uncheck all options.
      * Disabled and skeleton checkboxes will be excluded from the check/uncheck behavior.
@@ -51,7 +60,14 @@ export type SelectModelValueProps<TValue extends SelectOptionValue> = {
         label?: string;
     };
 };
-export type OnyxSelectProps<TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & SelectModelValueProps<TValue> & SelectSearchProps & Omit<OnyxSelectInputProps<TValue>, "density" | "modelValue"> & AutofocusProp & Pick<BaseSelectOption, "truncation"> & {
+export type OnyxSelectProps<TValue extends SelectOptionValue = SelectOptionValue> = DensityProp & SelectModelValueProps<TValue> & SelectSearchProps & Omit<OnyxSelectInputProps, "density" | "modelValue"> & AutofocusProp & Pick<BaseSelectOption, "truncation"> & {
+    /**
+     * Label that will be shown in the input of OnyxSelect.
+     * If unset, will be managed internally by comparing `modelValue` with `options`.
+     * Recommended to be used if not all options can be provided at once
+     * or a manual search is implemented.
+     */
+    valueLabel?: string | string[];
     /**
      * If true, the select popover is expanded and visible.
      * Property is managed internally, when undefined.

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

@@ -7,7 +7,7 @@ declare const _default: <TValue extends SelectOptionValue>(__VLS_props: NonNulla
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{}>> & {
         onClick?: (() => any) | undefined;
         onValidityChange?: ((validity: ValidityState) => any) | undefined;
-    }, never>, "onClick" | "onValidityChange"> & OnyxSelectInputProps<TValue>> & import("vue").PublicProps;
+    }, never>, "onClick" | "onValidityChange"> & OnyxSelectInputProps> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
         focus: () => void | undefined;
     }>): void;

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

@@ -1,29 +1,22 @@
-import type { SelectOption } from "../..";
 import type { DensityProp } from "../../composables/density";
 import type { RequiredMarkerProp } from "../../composables/required";
 import type { CustomValidityProp } from "../../composables/useCustomValidity";
-import type { AutofocusProp, SelectOptionValue } from "../../types";
+import type { AutofocusProp } from "../../types";
 import type { OnyxFormElementProps } from "../OnyxFormElement/types";
 export declare const MULTISELECT_TEXT_MODE: readonly ["summary", "preview"];
 export type MultiselectTextMode = (typeof MULTISELECT_TEXT_MODE)[number];
-/**
- * Whether multiple values can be selected.
- */
-export type SelectionInput<TValue extends SelectOptionValue = SelectOptionValue> = {
+export type OnyxSelectInputProps = DensityProp & RequiredMarkerProp & CustomValidityProp & AutofocusProp & Omit<OnyxFormElementProps, "modelValue" | "maxlength" | "withCounter"> & {
     /**
-     * Current value of the select.
+     * Current label(s) of the select.
      */
-    modelValue?: SelectInputModelValue<TValue>[];
+    modelValue?: string[];
     /**
-     * How a multiselect value will be displayed in the input.
+     * How multiselect labels will be displayed in the input.
      * - summary (default): will show "x Selected" if more than 1 is selected.
      * - preview: will show the names of the selection as a truncated list.
      *            A number-badge appears next to it including a tooltip with all selected names.
      */
     textMode?: MultiselectTextMode;
-};
-export type SelectInputModelValue<TValue extends SelectOptionValue = SelectOptionValue> = Pick<SelectOption<TValue>, "value" | "label">;
-export type OnyxSelectInputProps<TValue extends SelectOptionValue> = DensityProp & RequiredMarkerProp & CustomValidityProp & SelectionInput<TValue> & AutofocusProp & Omit<OnyxFormElementProps, "modelValue" | "maxlength" | "withCounter"> & {
     /**
      * Whether the select should be disabled.
      */