@atlaskit/quick-search 8.0.12 → 8.0.13

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/quick-search
 
+## 8.0.13
+
+### Patch Changes
+
+- [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
+
 ## 8.0.12
 
 ### Patch Changes

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/quick-search",
-	"version": "8.0.12"
+	"version": "8.0.13"
 }

package/dist/es2019/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/quick-search",
-	"version": "8.0.12"
+	"version": "8.0.13"
 }

package/dist/esm/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/quick-search",
-	"version": "8.0.12"
+	"version": "8.0.13"
 }

package/dist/types-ts4.0/components/QuickSearch.d.ts

@@ -0,0 +1,122 @@
+import React from 'react';
+import { ResultData, SelectedResultId } from './Results/types';
+import { ResultContextType } from './context';
+import { ResultBase } from './Results/ResultBase';
+export declare type Props = {
+    /** Search results in the form of ResultItemGroups containing Result components */
+    children: React.ReactNode;
+    /** Set search loading state */
+    isLoading?: boolean;
+    /** onBlur callback for search input */
+    onSearchBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /** onInput callback for search input */
+    onSearchInput?: (event: React.FormEvent<HTMLInputElement>, isAutocompleted?: boolean) => void;
+    /** onKeyDown callback for search input */
+    onSearchKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** Called when the user submits the search form without selecting a result */
+    onSearchSubmit?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** Placeholder text for search input field */
+    placeholder?: string;
+    /** Value of the search input field */
+    value?: string;
+    /** Corresponds to the `resultId` of the selected result */
+    selectedResultId?: SelectedResultId;
+    /** Optional way of being notified when the selected result changes due to keyboard nav */
+    onSelectedResultIdChanged?: (id: SelectedResultId) => void;
+    firePrivateAnalyticsEvent?: (eventName: string, eventData: Object) => void;
+    /** React component to be used for rendering links */
+    linkComponent?: React.ComponentType<any>;
+    /** The elements to render to the right of the search input. */
+    inputControls?: React.ReactNode;
+    /** One string that is used to autocomplete the current search query */
+    autocompleteText?: string;
+};
+export declare type State = {
+    selectedResultId: SelectedResultId;
+    context: ResultContextType;
+    value?: string;
+};
+export declare class QuickSearch extends React.Component<Props, State> {
+    static defaultProps: {
+        children: never[];
+        firePrivateAnalyticsEvent: (_: any) => void;
+        isLoading: boolean;
+        onSearchBlur: (_: any) => void;
+        onSearchKeyDown: (_: any) => void;
+        onSearchSubmit: (_: any) => void;
+        placeholder: string;
+        value: string;
+    };
+    inputSearchRef?: React.Ref<any>;
+    flatResults: Array<ResultBase>;
+    hasSearchQueryEventFired: boolean;
+    hasKeyDownEventFired: boolean;
+    lastKeyPressed: string;
+    constructor(props: Props);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    UNSAFE_componentWillReceiveProps(nextProps: Props): void;
+    fireKeyboardControlEvent(selectedResultId: SelectedResultId): void;
+    /**
+     * Uses the virtual list, this.flatResults, to move the selection across grouped results as if
+     * results were in a single, circular list.
+     *
+     * Process:
+     * 1. Finds the index of the selected result in the flatResults array,
+     * 2. Increments or decrements this index by the supplied adjustment amount,
+     * 3. Sets the new selectedResultId based on the modifed index
+     */
+    adjustSelectedResultIndex: (adjustment: number) => void;
+    /** Select next result */
+    selectNext: () => void;
+    /** Select previous result */
+    selectPrevious: () => void;
+    /**
+     * Callback for register results in flatResults
+     */
+    handleRegisterResult: (result: ResultBase) => void;
+    /**
+     * Callback for unregister results in flatResults
+     * It will reconcile a list of results for keyboard navigation after every update.
+     * 1. Component starts with an empty list of results
+     * 2. componentDidMount / componentDidUpdate lifecycle methods in ResultBase will be invoked
+     * 3. All ResultBase components call registerResult() in order to register itself in quick search
+     * 4. All ResultBase components call unregisterResult() in order to unregister itself in quick search
+     */
+    handleUnregisterResult: (result: ResultBase) => void;
+    /**
+     * Callback for mouseEnter events on individual results
+     * Move selection to hovered result
+     */
+    handleResultMouseEnter: (resultData: ResultData) => void;
+    /**
+     * Callback for mouseLeave events on individual results
+     * Clear result selection
+     */
+    handleResultMouseLeave: () => void;
+    /**
+     * Clear result selection when search input is blurred
+     */
+    handleSearchBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onInput: (event: React.FormEvent<HTMLInputElement>) => void;
+    /**
+     * Keyboard controls
+     * Up - Select previous result
+     * Down - Select next result
+     * Enter - Submit selected result
+     * Tab / ArrowRight - Accept autocomplete
+     */
+    handleSearchKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    acceptAutocomplete: (event: React.KeyboardEvent<HTMLInputElement>, text?: string | undefined) => void;
+    setSearchInputRef: (refs: any) => void;
+    focusSearchInput: () => void;
+    render(): JSX.Element;
+}
+declare const _default: React.ComponentClass<Props, any>;
+/**
+ * HOCs:
+ * `decorateWithAnalyticsData` - Wrapper that decorates analytics events with additional data.
+ * `withAnalytics` - Injects analytics firing methods that are picked up by
+ * @atlaskit/analytics/AnalyticsListener.
+ */
+export default _default;

package/dist/types-ts4.0/components/ResultItem/ResultItem.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+declare type Props = {
+    /** Text to appear to the right of the text. It has a lower font-weight. */
+    caption?: string;
+    /** Location to link out to on click. This is passed down to the custom link component if one is provided. */
+    href?: string;
+    /** Target frame for item `href` link to be aimed at. */
+    target?: string;
+    /** React element to appear to the left of the text. This should be an @atlaskit/icon component. */
+    icon?: React.ReactNode;
+    /** Makes the navigation item appear with reduced padding and font size. */
+    isCompact?: boolean;
+    /** Set whether the item should be highlighted as selected. Selected items have a different background color. */
+    isSelected?: boolean;
+    /** Set whether the item has been highlighted using mouse navigation. Mouse selected items will not display the selectedIcon. */
+    isMouseSelected?: boolean;
+    /** Function to be called on click. This is passed down to a custom link component, if one is provided.  */
+    onClick?(e: MouseEvent): void;
+    /** Standard onmouseenter event */
+    onMouseEnter?: (e: MouseEvent) => void;
+    /** Standard onmouseleave event */
+    onMouseLeave?: (e: MouseEvent) => void;
+    /** Text to be shown alongside the main `text`. */
+    subText?: React.ReactNode;
+    /** Main text to be displayed as the item. Accepts a react component but in most cases this should just be a string. */
+    text?: React.ReactNode;
+    /** React component to be placed to the right of the main text. */
+    textAfter?: React.ReactNode;
+    /** React component to be placed to the right of the main text when the item is selected with keyboard navigation. */
+    selectedIcon?: React.ReactNode;
+    /** React component to be used for rendering links */
+    linkComponent?: React.ComponentType;
+};
+declare class ResultItem extends React.PureComponent<Props> {
+    static defaultProps: Partial<Props>;
+    render(): JSX.Element;
+}
+export default ResultItem;

package/dist/types-ts4.0/components/ResultItem/ResultItemGroup.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+declare type Props = {
+    /** Text to appear as heading above group. Will be auto-capitalised. */
+    title: React.ReactNode;
+    /** React Elements to be displayed within the group. This should generally be a collection of ResultItems. */
+    children?: React.ReactNode;
+};
+export default class ResultItemGroup extends React.Component<Props> {
+    render(): JSX.Element;
+}
+export {};

package/dist/types-ts4.0/components/ResultItem/styled.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare const ResultItemGroupHeader: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ResultItemGroupTitle: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ResultItemAfter: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    shouldTakeSpace: boolean;
+}, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    shouldTakeSpace: boolean;
+}>;
+export declare const ResultItemAfterWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ResultItemCaption: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, any, import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>>;
+export declare const ResultItemSubText: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, any, import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>>;
+export declare const ResultItemIcon: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ResultItemTextAfter: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;

package/dist/types-ts4.0/components/Results/ContainerResult.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { CommonResultProps } from './types';
+export declare type Props = CommonResultProps & {
+    /** Name of the container. Provides the main text to be displayed as the item. */
+    name: React.ReactNode;
+    /** Text to appear to the right of the text. It has a lower font-weight. */
+    caption?: string;
+    /** Set whether to display a lock on the result's icon */
+    isPrivate?: boolean;
+    /** Text to be shown alongside the main `text`. */
+    subText?: React.ReactNode;
+};
+/**
+ * Generic result type for Atlassian containers.
+ */
+export default class ContainerResult extends React.PureComponent<Props> {
+    getAvatar: () => {};
+    render(): JSX.Element;
+}

package/dist/types-ts4.0/components/Results/ObjectResult.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { CommonResultProps } from './types';
+export declare type Props = CommonResultProps & {
+    /** Name of the container. Provides the main text to be displayed as the item. */
+    name: React.ReactNode;
+    /** Text to appear to the right of the text. It has a lower font-weight. */
+    caption?: string;
+    /** Name of the container to which the object belongs. Displayed alongside the name */
+    containerName?: React.ReactNode;
+    /** Set whether to display a lock on the result's icon */
+    isPrivate?: boolean;
+    /** A key or identifier of the object. Ajoined to the `containerName` when provided. */
+    objectKey?: React.ReactNode;
+};
+/**
+ * Generic result type for Atlassian objects.
+ */
+export default class ObjectResult extends React.PureComponent<Props> {
+    getAvatar: () => {};
+    getSubtext(): {} | null | undefined;
+    render(): JSX.Element;
+}

package/dist/types-ts4.0/components/Results/PersonResult.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { CommonResultProps } from './types';
+export declare type Props = CommonResultProps & {
+    /** Name of the container. Provides the main text to be displayed as the item. */
+    name: React.ReactNode;
+    /** A user's custom handle. Appears to the right of their `name`. It has a lower font-weight. */
+    mentionName?: string;
+    /** A character with which to prefix the `mentionName`. Defaults to '@' */
+    mentionPrefix?: string;
+    /** Text to be shown alongside the main `text`. */
+    presenceMessage?: React.ReactNode;
+    /** Sets the appearance of the presence indicator */
+    presenceState?: 'online' | 'busy' | 'offline' | null;
+};
+export default class PersonResult extends React.PureComponent<Props> {
+    static defaultProps: Partial<Props>;
+    getMention: () => string | undefined;
+    getAvatar: () => {};
+    render(): JSX.Element;
+}

package/dist/types-ts4.0/components/Results/ResultBase.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+import { AnalyticsData, CommonResultProps } from './types';
+import { ResultContextType } from '../context';
+export declare type Props = CommonResultProps & {
+    /** Type of the result. This is passed as a parameter to certain callbacks. */
+    type: string;
+    /** Main text to be displayed as the item. */
+    text: React.ReactNode;
+    /** Text to be shown alongside the main `text`. */
+    subText?: React.ReactNode;
+    /** Text to appear to the right of the text. It has a lower font-weight. */
+    caption?: string;
+    /** React element to appear to the left of the text. */
+    icon?: React.ReactNode;
+    /** The context provided by QuickSearch. */
+    context?: ResultContextType;
+};
+declare type DefaultProps = {
+    context: ResultContextType;
+};
+export declare class ResultBase extends React.PureComponent<DefaultProps & Props> {
+    static defaultProps: Partial<Props>;
+    state: {
+        isMouseSelected: boolean;
+    };
+    registerResult(): void;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    getAnalyticsData(): AnalyticsData;
+    handleClick: (e: MouseEvent) => void;
+    handleMouseEnter: (event: MouseEvent) => void;
+    handleMouseLeave: () => void;
+    render(): JSX.Element;
+}
+declare const _default: (props: Props) => JSX.Element;
+export default _default;

package/dist/types-ts4.0/components/Results/index.d.ts

@@ -0,0 +1,4 @@
+export { default as ContainerResult } from './ContainerResult';
+export { default as ObjectResult } from './ObjectResult';
+export { default as PersonResult } from './PersonResult';
+export { default as ResultBase } from './ResultBase';

package/dist/types-ts4.0/components/Results/types.d.ts

@@ -0,0 +1,34 @@
+import { ReactNode } from 'react';
+export declare type AnalyticsData = Object;
+export declare type ResultId = string | number;
+export declare type SelectedResultId = ResultId | null;
+export declare type CancelableEvent = KeyboardEvent | MouseEvent | React.KeyboardEvent<HTMLInputElement> | React.MouseEvent<HTMLElement>;
+export declare type ResultData = {
+    resultId: ResultId;
+    type: string;
+    event: CancelableEvent;
+};
+export declare type CommonResultProps = {
+    /** Unique ID of the result. This is passed as a parameter to certain callbacks */
+    resultId: string | number;
+    /** Type of the result. This is passed as a parameter to certain callbacks. */
+    type?: string;
+    /** Src URL of the image to be used as the result's icon, overriden by avatar prop */
+    avatarUrl?: string;
+    /** React Component of the image to be used as the result's icon, takes precedence over avatarUrl */
+    avatar?: ReactNode;
+    /** Content to be shown after the main content. Shown to the right of content (or to the left in RTL mode). */
+    elemAfter?: ReactNode;
+    /** Icon to be shown after the main content when the result is selected */
+    selectedIcon?: ReactNode;
+    /** Location to link out to on click. */
+    href?: string;
+    /** Target to open the link in. */
+    target?: string;
+    /** Reduces padding and font size. */
+    isCompact?: boolean;
+    /** Triggered by mouseClick event. */
+    onClick?: (resultData: ResultData) => void;
+    /** key/value pairs of attributes to be send in analytics events. */
+    analyticsData?: AnalyticsData | (() => AnalyticsData);
+};

package/dist/types-ts4.0/components/Search/Search.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+export declare const controlKeys: string[];
+declare type Props = {
+    /** The elements to render as options to search from. */
+    children?: React.ReactNode;
+    /** The elements to render to the right of the search input. */
+    inputControls?: React.ReactNode;
+    /** Set whether the loading state should be shown. */
+    isLoading?: boolean;
+    /** Function to be called when the search input loses focus. */
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /** Function to be called when a input action occurs (native `oninput` event). */
+    onInput?: (event: React.FormEvent<HTMLInputElement>) => void;
+    /** Function to be called when the user hits the escape key.  */
+    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** Placeholder text for search field. */
+    placeholder?: string;
+    /** Current value of search field. */
+    value?: string;
+    /** Autocomplete information */
+    autocompleteText?: string;
+};
+export default class Search extends React.PureComponent<Props> {
+    static defaultProps: Partial<Props>;
+    onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    setInputRef: (ref: React.Ref<any>) => void;
+    renderInputControls: () => JSX.Element | null;
+    inputRef?: React.Ref<any>;
+    render(): JSX.Element;
+}
+export {};

package/dist/types-ts4.0/components/Search/styled.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const SearchBox: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const SearchFieldBaseOuter: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const SearchFieldBaseInner: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const SearchInner: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const getPlaceholderStyle: (style: any) => import("styled-components").InterpolationValue[];
+export declare const getPlaceholderColor: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<import("@atlaskit/theme").ThemeProps | undefined, any>>[];
+export declare const SearchInput: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>, any, import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>>;
+export declare const SearchInputTypeAhead: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>, any, import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>>;
+export declare const SearchInputControlsContainer: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, any, import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>>;

package/dist/types-ts4.0/components/constants.d.ts

@@ -0,0 +1,6 @@
+export declare const ATLASKIT_QUICKSEARCH_NS = "atlaskit.navigation.quick-search";
+export declare const QS_ANALYTICS_EV_CLOSE: string;
+export declare const QS_ANALYTICS_EV_KB_CTRLS_USED: string;
+export declare const QS_ANALYTICS_EV_OPEN: string;
+export declare const QS_ANALYTICS_EV_QUERY_ENTERED: string;
+export declare const QS_ANALYTICS_EV_SUBMIT: string;

package/dist/types-ts4.0/components/context.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { ComponentType } from 'react';
+import { ResultData, ResultId, SelectedResultId } from './Results/types';
+import { ResultBase } from './Results/ResultBase';
+export declare type ResultContextType = {
+    /** Register result as keyboard navigation target */
+    registerResult: (result: ResultBase) => void;
+    /** Unregister result as keyboard navigation target */
+    unregisterResult: (result: ResultBase) => void;
+    /** Triggered by mouseEnter event. */
+    onMouseEnter: (resultData: ResultData) => void;
+    /** Standard onMouseLeave event. */
+    onMouseLeave: () => void;
+    /** Fires an analytics event */
+    sendAnalytics?: (eventName: string, eventData: Object) => void;
+    /** get the index of the search result in the list of result */
+    getIndex: (resultId: ResultId) => number | null;
+    /** React component to be used for rendering links */
+    linkComponent?: ComponentType;
+};
+export declare const ResultContext: React.Context<ResultContextType>;
+export declare const SelectedResultIdContext: React.Context<SelectedResultId>;

package/dist/types-ts4.0/components/decorateWithAnalyticsData.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { Props } from './QuickSearch';
+export default function decorateWithAnalyticsData(WrappedQuickSearch: React.ComponentClass<Props>): React.ComponentClass<Props>;

package/dist/types-ts4.0/components/isReactElement.d.ts

@@ -0,0 +1,6 @@
+declare const _default: (element: any) => boolean;
+/**
+ * Heuristically check whether an element is a react element or not.
+ * React elements have constructors for their type property but native elements use strings.
+ */
+export default _default;

package/dist/types-ts4.0/index.d.ts

@@ -0,0 +1,17 @@
+import * as resultTypes from './components/Results';
+export { default as AkNavigationItemGroup } from './components/ResultItem/ResultItemGroup';
+export { default as AkNavigationItem } from './components/ResultItem/ResultItem';
+export { default as AkQuickSearch } from './components/QuickSearch';
+export { default as AkSearch } from './components/Search/Search';
+export { resultTypes as quickSearchResultTypes };
+export { default as QuickSearch } from './components/QuickSearch';
+export { default as ResultItemGroup } from './components/ResultItem/ResultItemGroup';
+export { default as ObjectResult } from './components/Results/ObjectResult';
+export type { Props as ObjectResultProps } from './components/Results/ObjectResult';
+export { default as PersonResult } from './components/Results/PersonResult';
+export type { Props as PersonResultProps } from './components/Results/PersonResult';
+export { default as ContainerResult } from './components/Results/ContainerResult';
+export type { Props as ContainerResultProps } from './components/Results/ContainerResult';
+export { default as ResultBase } from './components/Results/ResultBase';
+export type { Props as ResultBaseProps } from './components/Results/ResultBase';
+export type { CancelableEvent, ResultData } from './components/Results/types';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/quick-search",
-  "version": "8.0.12",
+  "version": "8.0.13",
   "description": "A quick-search component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -12,6 +12,13 @@
   "module": "dist/esm/index.js",
   "module:es2019": "dist/es2019/index.js",
   "types": "dist/types/index.d.ts",
+  "typesVersions": {
+    ">=4.0 <4.5": {
+      "*": [
+        "dist/types-ts4.0/*"
+      ]
+    }
+  },
   "atlaskit:src": "src/index.ts",
   "atlassian": {
     "team": "Search Platform: Search Experience",
@@ -26,7 +33,7 @@
     "@atlaskit/avatar": "^21.0.0",
     "@atlaskit/item": "^12.0.0",
     "@atlaskit/spinner": "^15.0.0",
-    "@atlaskit/theme": "^12.1.0",
+    "@atlaskit/theme": "^12.2.0",
     "@babel/runtime": "^7.0.0",
     "keycode": "^2.1.7"
   },
@@ -37,7 +44,7 @@
   "devDependencies": {
     "@atlaskit/avatar": "^21.0.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/drawer": "^7.1.0",
+    "@atlaskit/drawer": "^7.2.0",
     "@atlaskit/icon": "^21.10.0",
     "@atlaskit/navigation": "^37.0.0",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
@@ -45,7 +52,7 @@
     "prop-types": "^15.5.10",
     "react": "^16.8.0",
     "sinon": "^2.2.0",
-    "typescript": "4.3.5",
+    "typescript": "4.5.5",
     "uuid": "^3.1.0"
   },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"

package/report.api.md

@@ -1,6 +1,10 @@
-## API Report File for "@atlaskit/quick-search".
+## API Report File for "@atlaskit/quick-search"
 
-> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+<!--
+	Generated API Report version: 2.0
+-->
 
 [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
 
@@ -9,219 +13,179 @@ import { ComponentType } from 'react';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
 
-export declare class AkNavigationItem extends React_2.PureComponent<Props_2> {
+// @public (undocumented)
+export class AkNavigationItem extends React_2.PureComponent<Props_2> {
+  // (undocumented)
   static defaultProps: Partial<Props_2>;
+  // (undocumented)
   render(): JSX.Element;
 }
 
-export declare class AkSearch extends React_2.PureComponent<Props_4> {
+// @public (undocumented)
+export class AkSearch extends React_2.PureComponent<Props_4> {
+  // (undocumented)
   static defaultProps: Partial<Props_4>;
-  onInputKeyDown: (event: React_2.KeyboardEvent<HTMLInputElement>) => void;
-  setInputRef: (ref: React_2.Ref<any>) => void;
-  renderInputControls: () => JSX.Element | null;
+  // (undocumented)
   inputRef?: React_2.Ref<any>;
+  // (undocumented)
+  onInputKeyDown: (event: React_2.KeyboardEvent<HTMLInputElement>) => void;
+  // (undocumented)
   render(): JSX.Element;
+  // (undocumented)
+  renderInputControls: () => JSX.Element | null;
+  // (undocumented)
+  setInputRef: (ref: React_2.Ref<any>) => void;
 }
 
-declare type AnalyticsData = Object;
+// @public (undocumented)
+type AnalyticsData = Object;
 
-export declare type CancelableEvent =
+// @public (undocumented)
+export type CancelableEvent =
   | KeyboardEvent
   | MouseEvent
   | React.KeyboardEvent<HTMLInputElement>
   | React.MouseEvent<HTMLElement>;
 
-declare type CommonResultProps = {
-  /** Unique ID of the result. This is passed as a parameter to certain callbacks */
+// @public (undocumented)
+type CommonResultProps = {
   resultId: string | number;
-  /** Type of the result. This is passed as a parameter to certain callbacks. */
   type?: string;
-  /** Src URL of the image to be used as the result's icon, overriden by avatar prop */
   avatarUrl?: string;
-  /** React Component of the image to be used as the result's icon, takes precedence over avatarUrl */
   avatar?: ReactNode;
-  /** Content to be shown after the main content. Shown to the right of content (or to the left in RTL mode). */
   elemAfter?: ReactNode;
-  /** Icon to be shown after the main content when the result is selected */
   selectedIcon?: ReactNode;
-  /** Location to link out to on click. */
   href?: string;
-  /** Target to open the link in. */
   target?: string;
-  /** Reduces padding and font size. */
   isCompact?: boolean;
-  /** Triggered by mouseClick event. */
   onClick?: (resultData: ResultData) => void;
-  /** key/value pairs of attributes to be send in analytics events. */
   analyticsData?: AnalyticsData | (() => AnalyticsData);
 };
 
-/**
- * Generic result type for Atlassian containers.
- */
-export declare class ContainerResult extends React_2.PureComponent<
+// @public
+export class ContainerResult extends React_2.PureComponent<
   ContainerResultProps
 > {
+  // (undocumented)
   getAvatar: () => {};
+  // (undocumented)
   render(): JSX.Element;
 }
 
-export declare type ContainerResultProps = CommonResultProps & {
-  /** Name of the container. Provides the main text to be displayed as the item. */
+// @public (undocumented)
+export type ContainerResultProps = CommonResultProps & {
   name: React_2.ReactNode;
-  /** Text to appear to the right of the text. It has a lower font-weight. */
   caption?: string;
-  /** Set whether to display a lock on the result's icon */
   isPrivate?: boolean;
-  /** Text to be shown alongside the main `text`. */
   subText?: React_2.ReactNode;
 };
 
-declare const _default: React_2.ComponentClass<Props_3, any>;
+// @public (undocumented)
+const _default: React_2.ComponentClass<Props_3, any>;
 export { _default as AkQuickSearch };
 export { _default as QuickSearch };
 
-declare type DefaultProps = {
+// @public (undocumented)
+type DefaultProps = {
   context: ResultContextType;
 };
 
-/**
- * Generic result type for Atlassian objects.
- */
-export declare class ObjectResult extends React_2.PureComponent<
-  ObjectResultProps
-> {
+// @public
+export class ObjectResult extends React_2.PureComponent<ObjectResultProps> {
+  // (undocumented)
   getAvatar: () => {};
+  // (undocumented)
   getSubtext(): {} | null | undefined;
+  // (undocumented)
   render(): JSX.Element;
 }
 
-export declare type ObjectResultProps = CommonResultProps & {
-  /** Name of the container. Provides the main text to be displayed as the item. */
+// @public (undocumented)
+export type ObjectResultProps = CommonResultProps & {
   name: React_2.ReactNode;
-  /** Text to appear to the right of the text. It has a lower font-weight. */
   caption?: string;
-  /** Name of the container to which the object belongs. Displayed alongside the name */
   containerName?: React_2.ReactNode;
-  /** Set whether to display a lock on the result's icon */
   isPrivate?: boolean;
-  /** A key or identifier of the object. Ajoined to the `containerName` when provided. */
   objectKey?: React_2.ReactNode;
 };
 
-export declare class PersonResult extends React_2.PureComponent<
-  PersonResultProps
-> {
+// @public (undocumented)
+export class PersonResult extends React_2.PureComponent<PersonResultProps> {
+  // (undocumented)
   static defaultProps: Partial<PersonResultProps>;
-  getMention: () => string | undefined;
+  // (undocumented)
   getAvatar: () => {};
+  // (undocumented)
+  getMention: () => string | undefined;
+  // (undocumented)
   render(): JSX.Element;
 }
 
-export declare type PersonResultProps = CommonResultProps & {
-  /** Name of the container. Provides the main text to be displayed as the item. */
+// @public (undocumented)
+export type PersonResultProps = CommonResultProps & {
   name: React_2.ReactNode;
-  /** A user's custom handle. Appears to the right of their `name`. It has a lower font-weight. */
   mentionName?: string;
-  /** A character with which to prefix the `mentionName`. Defaults to '@' */
   mentionPrefix?: string;
-  /** Text to be shown alongside the main `text`. */
   presenceMessage?: React_2.ReactNode;
-  /** Sets the appearance of the presence indicator */
   presenceState?: 'online' | 'busy' | 'offline' | null;
 };
 
-declare type Props = {
-  /** Text to appear as heading above group. Will be auto-capitalised. */
+// @public (undocumented)
+type Props = {
   title: React_2.ReactNode;
-  /** React Elements to be displayed within the group. This should generally be a collection of ResultItems. */
   children?: React_2.ReactNode;
 };
 
-declare type Props_2 = {
-  /** Text to appear to the right of the text. It has a lower font-weight. */
+// @public (undocumented)
+type Props_2 = {
   caption?: string;
-  /** Location to link out to on click. This is passed down to the custom link component if one is provided. */
   href?: string;
-  /** Target frame for item `href` link to be aimed at. */
   target?: string;
-  /** React element to appear to the left of the text. This should be an @atlaskit/icon component. */
   icon?: React_2.ReactNode;
-  /** Makes the navigation item appear with reduced padding and font size. */
   isCompact?: boolean;
-  /** Set whether the item should be highlighted as selected. Selected items have a different background color. */
   isSelected?: boolean;
-  /** Set whether the item has been highlighted using mouse navigation. Mouse selected items will not display the selectedIcon. */
   isMouseSelected?: boolean;
-  /** Function to be called on click. This is passed down to a custom link component, if one is provided.  */
   onClick?(e: MouseEvent): void;
-  /** Standard onmouseenter event */
   onMouseEnter?: (e: MouseEvent) => void;
-  /** Standard onmouseleave event */
   onMouseLeave?: (e: MouseEvent) => void;
-  /** Text to be shown alongside the main `text`. */
   subText?: React_2.ReactNode;
-  /** Main text to be displayed as the item. Accepts a react component but in most cases this should just be a string. */
   text?: React_2.ReactNode;
-  /** React component to be placed to the right of the main text. */
   textAfter?: React_2.ReactNode;
-  /** React component to be placed to the right of the main text when the item is selected with keyboard navigation. */
   selectedIcon?: React_2.ReactNode;
-  /** React component to be used for rendering links */
   linkComponent?: React_2.ComponentType;
 };
 
-declare type Props_3 = {
-  /** Search results in the form of ResultItemGroups containing Result components */
+// @public (undocumented)
+type Props_3 = {
   children: React_2.ReactNode;
-  /** Set search loading state */
   isLoading?: boolean;
-  /** onBlur callback for search input */
   onSearchBlur?: (event: React_2.FocusEvent<HTMLInputElement>) => void;
-  /** onInput callback for search input */
   onSearchInput?: (
     event: React_2.FormEvent<HTMLInputElement>,
     isAutocompleted?: boolean,
   ) => void;
-  /** onKeyDown callback for search input */
   onSearchKeyDown?: (event: React_2.KeyboardEvent<HTMLInputElement>) => void;
-  /** Called when the user submits the search form without selecting a result */
   onSearchSubmit?: (event: React_2.KeyboardEvent<HTMLInputElement>) => void;
-  /** Placeholder text for search input field */
   placeholder?: string;
-  /** Value of the search input field */
   value?: string;
-  /** Corresponds to the `resultId` of the selected result */
   selectedResultId?: SelectedResultId;
-  /** Optional way of being notified when the selected result changes due to keyboard nav */
   onSelectedResultIdChanged?: (id: SelectedResultId) => void;
   firePrivateAnalyticsEvent?: (eventName: string, eventData: Object) => void;
-  /** React component to be used for rendering links */
   linkComponent?: React_2.ComponentType<any>;
-  /** The elements to render to the right of the search input. */
   inputControls?: React_2.ReactNode;
-  /** One string that is used to autocomplete the current search query */
   autocompleteText?: string;
 };
 
-declare type Props_4 = {
-  /** The elements to render as options to search from. */
+// @public (undocumented)
+type Props_4 = {
   children?: React_2.ReactNode;
-  /** The elements to render to the right of the search input. */
   inputControls?: React_2.ReactNode;
-  /** Set whether the loading state should be shown. */
   isLoading?: boolean;
-  /** Function to be called when the search input loses focus. */
   onBlur?: (event: React_2.FocusEvent<HTMLInputElement>) => void;
-  /** Function to be called when a input action occurs (native `oninput` event). */
   onInput?: (event: React_2.FormEvent<HTMLInputElement>) => void;
-  /** Function to be called when the user hits the escape key.  */
   onKeyDown?: (event: React_2.KeyboardEvent<HTMLInputElement>) => void;
-  /** Placeholder text for search field. */
   placeholder?: string;
-  /** Current value of search field. */
   value?: string;
-  /** Autocomplete information */
   autocompleteText?: string;
 };
 
@@ -230,73 +194,80 @@ declare namespace quickSearchResultTypes {
 }
 export { quickSearchResultTypes };
 
-export declare const ResultBase: (props: ResultBaseProps) => JSX.Element;
+// @public (undocumented)
+export const ResultBase: (props: ResultBaseProps) => JSX.Element;
 
-declare class ResultBase_2 extends React_2.PureComponent<
+// @public (undocumented)
+class ResultBase_2 extends React_2.PureComponent<
   DefaultProps & ResultBaseProps
 > {
-  static defaultProps: Partial<ResultBaseProps>;
-  state: {
-    isMouseSelected: boolean;
-  };
-  registerResult(): void;
+  // (undocumented)
   componentDidMount(): void;
+  // (undocumented)
   componentDidUpdate(): void;
+  // (undocumented)
   componentWillUnmount(): void;
+  // (undocumented)
+  static defaultProps: Partial<ResultBaseProps>;
+  // (undocumented)
   getAnalyticsData(): AnalyticsData;
+  // (undocumented)
   handleClick: (e: MouseEvent) => void;
+  // (undocumented)
   handleMouseEnter: (event: MouseEvent) => void;
+  // (undocumented)
   handleMouseLeave: () => void;
+  // (undocumented)
+  registerResult(): void;
+  // (undocumented)
   render(): JSX.Element;
+  // (undocumented)
+  state: {
+    isMouseSelected: boolean;
+  };
 }
 
-export declare type ResultBaseProps = CommonResultProps & {
-  /** Type of the result. This is passed as a parameter to certain callbacks. */
+// @public (undocumented)
+export type ResultBaseProps = CommonResultProps & {
   type: string;
-  /** Main text to be displayed as the item. */
   text: React_2.ReactNode;
-  /** Text to be shown alongside the main `text`. */
   subText?: React_2.ReactNode;
-  /** Text to appear to the right of the text. It has a lower font-weight. */
   caption?: string;
-  /** React element to appear to the left of the text. */
   icon?: React_2.ReactNode;
-  /** The context provided by QuickSearch. */
   context?: ResultContextType;
 };
 
-declare type ResultContextType = {
-  /** Register result as keyboard navigation target */
+// @public (undocumented)
+type ResultContextType = {
   registerResult: (result: ResultBase_2) => void;
-  /** Unregister result as keyboard navigation target */
   unregisterResult: (result: ResultBase_2) => void;
-  /** Triggered by mouseEnter event. */
   onMouseEnter: (resultData: ResultData) => void;
-  /** Standard onMouseLeave event. */
   onMouseLeave: () => void;
-  /** Fires an analytics event */
   sendAnalytics?: (eventName: string, eventData: Object) => void;
-  /** get the index of the search result in the list of result */
   getIndex: (resultId: ResultId) => number | null;
-  /** React component to be used for rendering links */
   linkComponent?: ComponentType;
 };
 
-export declare type ResultData = {
+// @public (undocumented)
+export type ResultData = {
   resultId: ResultId;
   type: string;
   event: CancelableEvent;
 };
 
-declare type ResultId = string | number;
+// @public (undocumented)
+type ResultId = string | number;
 
-declare class ResultItemGroup extends React_2.Component<Props> {
+// @public (undocumented)
+class ResultItemGroup extends React_2.Component<Props> {
+  // (undocumented)
   render(): JSX.Element;
 }
 export { ResultItemGroup as AkNavigationItemGroup };
 export { ResultItemGroup };
 
-declare type SelectedResultId = ResultId | null;
+// @public (undocumented)
+type SelectedResultId = ResultId | null;
 
-export {};
+// (No @packageDocumentation comment for this package)
 ```