@juspay/svelte-ui-components 4.16.0 → 4.18.0

package/dist/Select/properties.d.ts

@@ -20,12 +20,52 @@ export type MandatorySelectProperties = {
     items: SelectItem[] | string[];
 };
 export type SelectHierarchy = 'default' | 'ghost';
+/** Placement of the `searchable` filter input. See `searchPosition`. */
+export type SelectSearchPosition = 'trigger' | 'menu';
 export type OptionalSelectProperties = {
     value?: string[];
     multiple?: boolean;
     searchable?: boolean;
+    /**
+     * Where the `searchable` filter input lives. `'trigger'` (the default) keeps
+     * today's behaviour: the input replaces the trigger's label and is focused
+     * automatically on open.
+     *
+     * `'menu'` puts it inside the open dropdown instead, which is what the
+     * design-system keyboard contract specifies — the trigger stays a plain
+     * combobox, and the search box is reached by Tab AFTER opening rather than
+     * by being focused for you. That difference is the point: with the input in
+     * the trigger there is no way to open the menu and keep focus on the
+     * combobox, so a keyboard user who wanted to arrow through the options had
+     * to type first.
+     *
+     * No effect unless `searchable` is also set.
+     */
+    searchPosition?: SelectSearchPosition;
     placeholder?: string;
     disabled?: boolean;
+    /**
+     * Renders the error treatment on the trigger — a red border that outranks
+     * the hover and focus border colours, so the field still reads as invalid
+     * while the user is in it. Independent of any validation the consumer runs;
+     * this is the server- or form-driven flag, matching `Input.forceError`.
+     */
+    error?: boolean;
+    /**
+     * Message shown below the trigger while `error` is true, in a `role="alert"`
+     * region wired to the combobox through `aria-describedby`. A string rather
+     * than a snippet, following `Input`'s `onErrorMessage`: the content is a
+     * sentence, and making it a snippet would mean every consumer rebuilds the
+     * alert semantics that make it announce.
+     */
+    errorMessage?: string;
+    /**
+     * Adds a clear (×) button to the trigger whenever there is a selection. It
+     * resets the value WITHOUT opening the menu, which is the whole point —
+     * clearing through the menu costs an open, a hunt and a second click.
+     * Hidden while `disabled`, and never rendered when nothing is selected.
+     */
+    clearable?: boolean;
     bottomContent?: Snippet;
     /**
      * Snippet for rendering a custom multi-select option indicator, receiving `{ checked, indeterminate }`.
@@ -97,6 +137,12 @@ export type OptionalSelectProperties = {
 };
 export type SelectEventProperties = {
     onchange?: (value: string[]) => void;
+    /**
+     * Fires when the clear button empties the selection, after `onchange` has
+     * already reported the new empty value. Use it to distinguish "cleared" from
+     * "deselected the last item", which `onchange` alone cannot tell apart.
+     */
+    onclear?: () => void;
     onopen?: () => void;
     onclose?: () => void;
 };