@neovici/cosmoz-autocomplete 13.3.1 → 13.4.0

package/dist/autocomplete/autocomplete-keybindings.d.ts

@@ -1,5 +1,6 @@
-import type { Activity } from '@neovici/cosmoz-utils/keybindings';
+import { Activity, ANY_KEY } from '@neovici/cosmoz-utils/keybindings';
 export declare const AUTOCOMPLETE_DESELECT_LAST: Activity;
+export declare const AUTOCOMPLETE_SEARCH_WHEN_SELECTED: Activity;
 export declare const autocompleteKeybindings: readonly [readonly [{
     readonly key: "ArrowUp";
 }, [symbol], {
@@ -28,4 +29,11 @@ export declare const autocompleteKeybindings: readonly [readonly [{
     readonly description: "Remove the last selected item";
 }, {
     readonly allowInEditable: true;
+}], readonly [{
+    readonly key: typeof ANY_KEY;
+}, [symbol], {
+    readonly title: "Start searching";
+    readonly description: "Start searching when you start typing when an item is selected";
+}, {
+    readonly allowInEditable: true;
 }]];

package/dist/autocomplete/autocomplete-keybindings.js

@@ -1,5 +1,7 @@
+import { ANY_KEY, } from '@neovici/cosmoz-utils/keybindings';
 import { listboxKeybindings } from '../listbox/listbox-keybindings';
 export const AUTOCOMPLETE_DESELECT_LAST = Symbol('autocomplete.deselect.last');
+export const AUTOCOMPLETE_SEARCH_WHEN_SELECTED = Symbol('autocomplete.search.when.selected');
 export const autocompleteKeybindings = [
     ...listboxKeybindings,
     [
@@ -11,4 +13,13 @@ export const autocompleteKeybindings = [
         },
         { allowInEditable: true },
     ],
+    [
+        { key: ANY_KEY },
+        [AUTOCOMPLETE_SEARCH_WHEN_SELECTED],
+        {
+            title: 'Start searching',
+            description: 'Start searching when you start typing when an item is selected',
+        },
+        { allowInEditable: true },
+    ],
 ];

package/dist/autocomplete/use-autocomplete.js

@@ -5,7 +5,7 @@ import { usePromise } from '@neovici/cosmoz-utils/hooks/use-promise';
 import { useActivity } from '@neovici/cosmoz-utils/keybindings';
 import { prop, strProp } from '@neovici/cosmoz-utils/object';
 import { useCallback, useEffect, useMemo, useProperty, useState, } from '@pionjs/pion';
-import { AUTOCOMPLETE_DESELECT_LAST } from './autocomplete-keybindings';
+import { AUTOCOMPLETE_DESELECT_LAST, AUTOCOMPLETE_SEARCH_WHEN_SELECTED, } from './autocomplete-keybindings';
 import { EMPTY, normalize, notify, search } from './util';
 const useNotify = (host, fn, name) => useCallback((val) => {
     fn?.(val);
@@ -33,6 +33,19 @@ export const useAutocomplete = ({ value: _value, text, onChange: _onChange, onTe
         check: () => !disabled && empty && host.matches(':focus-within'),
         element: () => host,
     }, []);
+    useActivity({
+        activity: AUTOCOMPLETE_SEARCH_WHEN_SELECTED,
+        callback: (ev) => {
+            const values = array(value);
+            const isOne = limit === 1;
+            if (values.length > 0 && isOne && ev.key.length === 1) {
+                onChange(values.slice(0, -1));
+            }
+        },
+        allowDefault: true,
+        check: () => !disabled && empty && host.matches(':focus-within'),
+        element: () => host,
+    }, [limit]);
     // Clear query when popover closes
     useEffect(() => {
         if (!opened && !keepQuery)

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@neovici/cosmoz-autocomplete",
-	"version": "13.3.1",
+	"version": "13.4.0",
 	"type": "module",
 	"description": "A autocomplete input web component",
 	"keywords": [
@@ -81,7 +81,7 @@
 		"@lit-labs/virtualizer": "^2.0.0",
 		"@neovici/cosmoz-dropdown": "^7.5.0",
 		"@neovici/cosmoz-input": "^5.6.0",
-		"@neovici/cosmoz-utils": "^6.19.0",
+		"@neovici/cosmoz-utils": "^6.20.0",
 		"@pionjs/pion": "^2.7.1",
 		"i18next": "^23.16.8",
 		"lit-html": "^2.0.0 || ^3.0.0"