@shlinkio/shlink-frontend-kit 1.2.1 → 1.3.0

package/dist/index.d.ts

@@ -424,6 +424,11 @@ export declare type NavPillsProps = PropsWithChildren<{
     className?: string;
 }>;
 
+/**
+ * Normalizes a tag, making it lowercase, trimmed and replacing space characters with dashes
+ */
+export declare const normalizeTag: (tag: string) => string;
+
 declare type NoTitleProps = {
     title?: never;
     titleSize?: never;
@@ -689,6 +694,36 @@ export declare type TagsAutocompleteProps = {
     searchMode?: 'startsWith' | 'includes';
 } & Pick<SearchComboboxProps<string>, 'placeholder' | 'size' | 'disabled' | 'aria-label'>;
 
+export declare type TagsSearchOptions = {
+    /** Full list of tags to search on */
+    tags: string[];
+    /** Tags that are already selected, to ignore them while searching */
+    selectedTags: string[];
+    /** How to do the search term matching on tags, via `startsWith` or `includes` */
+    searchMode: 'startsWith' | 'includes';
+    /** Max amount of matching tags to return. Defaults to 5 */
+    searchLimit?: number;
+    /**
+     * Whether new entries are allowed or not.
+     * When this is true, it will be allowed to add the search term verbatim in the search result.
+     */
+    allowAdding?: boolean;
+};
+
+export declare type TagsSearchResult = {
+    /**
+     * A Map with the list of tags that match the search result, with the tag used both as key and value.
+     * Returned as a Map for convenience to use with SearchCombobox.
+     *
+     * When no tags match the search term, or the search term is empty, then `undefined` is returned.
+     *
+     * @see {SearchCombobox}
+     */
+    searchResults: Map<string, string> | undefined;
+    /** A callback used to perform a search in the list of tags */
+    onSearch: (searchTerm: string) => void;
+};
+
 export declare type Theme = 'dark' | 'light';
 
 export declare type TimeoutToggle = typeof useTimeoutToggle;
@@ -751,6 +786,12 @@ export declare const useGoBack: () => () => void | Promise<void>;
 
 export declare const useParsedQuery: <T>() => T;
 
+/**
+ * Allows to search on a list of tags and only return the ones that match.
+ * Search can be done by `startsWith` or `includes`.
+ */
+export declare function useTagsSearch({ tags, selectedTags, searchMode, searchLimit, allowAdding }: TagsSearchOptions): TagsSearchResult;
+
 export declare const useTheme: (initialTheme?: Theme) => readonly [Theme, Dispatch<SetStateAction<Theme>>];
 
 export declare function useTimeout(defaultDelay: number,