@splunk/react-ui 5.0.0-beta.2 → 5.0.0-beta.4

package/types/src/Multiselect/Compact.d.ts

@@ -1,9 +1,8 @@
-import React, { Component } from 'react';
-import { Divider, Heading } from '@splunk/react-ui/Menu';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { MultiselectChangeHandler, MultiselectFilterChangeHandler, MultiselectScrollBottomHandler } from './Multiselect';
-import Option from './Option';
 import { SelectBaseProps } from '../Select/SelectBase';
-import { ClassComponentProps } from '../utils/types';
+import { ComponentProps } from '../utils/types';
 interface CompactPropsBase {
     animateLoading?: boolean;
     /**
@@ -126,6 +125,9 @@ interface CompactPropsBase {
     repositionMode?: 'none' | 'flip';
     /**
      * Determines how to display Select all/Clear all.
+     *
+     * @deprecatedValue 'buttongroup'
+     * The 'buttongroup' value is deprecated and will be removed in a future major version.
      */
     selectAllAppearance?: 'buttongroup' | 'checkbox';
     /**
@@ -148,23 +150,49 @@ interface CompactPropsBase {
     /** @private */
     toggle?: SelectBaseProps['toggle'];
 }
-declare const defaultProps: Required<Pick<CompactPropsBase, 'allowNewValues' | 'animateLoading' | 'defaultPlacement' | 'disabled' | 'inline' | 'isLoadingOptions' | 'menuStyle' | 'noOptionsMessage' | 'placeholder' | 'showSelectedValuesFirst' | 'tabConfirmsNewValue'>>;
-type CompactProps = ClassComponentProps<CompactPropsBase, typeof defaultProps, 'button'>;
-interface CompactState {
-    activeIndex: number;
-    filterKeyword: string;
-    open: boolean;
-    textHasFocus: boolean;
-    topValues: (string | number | boolean)[];
-    values: (string | number | boolean)[];
-}
-declare class Compact extends Component<CompactProps, CompactState> {
-    static propTypes: React.WeakValidationMap<CompactProps>;
-    static defaultProps: Required<Pick<CompactPropsBase, "placeholder" | "disabled" | "inline" | "defaultPlacement" | "animateLoading" | "noOptionsMessage" | "menuStyle" | "allowNewValues" | "isLoadingOptions" | "showSelectedValuesFirst" | "tabConfirmsNewValue">>;
-    static Option: typeof Option;
-    static Divider: typeof Divider;
-    static Heading: typeof Heading;
-    render(): React.JSX.Element;
+type CompactProps = ComponentProps<CompactPropsBase, 'button'>;
+declare function Compact({ allowNewValues, animateLoading, children, controlledFilter, defaultPlacement, defaultValues, describedBy, disabled, elementRef, error, filter, footerMessage, inline, inputId, inputRef, isLoadingOptions, labelledBy, loadingMessage, menuStyle, name, noOptionsMessage, onChange, onClose, onFilterChange, onOpen, onScroll, onScrollBottom, placeholder, repositionMode, selectAllAppearance, showSelectedValuesFirst, tabConfirmsNewValue, values, virtualization, ...otherProps }: CompactProps): React.JSX.Element;
+declare namespace Compact {
+    var propTypes: {
+        allowNewValues: PropTypes.Requireable<boolean>;
+        animateLoading: PropTypes.Requireable<boolean>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        controlledFilter: PropTypes.Requireable<boolean>;
+        defaultPlacement: PropTypes.Requireable<string>;
+        defaultValues: PropTypes.Requireable<any[]>;
+        describedBy: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        elementRef: PropTypes.Requireable<object>;
+        error: PropTypes.Requireable<boolean>;
+        filter: PropTypes.Requireable<string | boolean>;
+        footerMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        inline: PropTypes.Requireable<boolean>;
+        inputId: PropTypes.Requireable<string>;
+        inputRef: PropTypes.Requireable<object>;
+        isLoadingOptions: PropTypes.Requireable<boolean>;
+        labelledBy: PropTypes.Requireable<string>;
+        loadingMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        menuStyle: PropTypes.Requireable<object>;
+        name: PropTypes.Requireable<string>;
+        noOptionsMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+        onScrollBottom: PropTypes.Requireable<(...args: any[]) => any>;
+        placeholder: PropTypes.Requireable<string>;
+        repositionMode: PropTypes.Requireable<string>;
+        selectAllAppearance: PropTypes.Requireable<string>;
+        showSelectedValuesFirst: PropTypes.Requireable<string>;
+        tabConfirmsNewValue: PropTypes.Requireable<boolean>;
+        values: PropTypes.Requireable<any[]>;
+        /** @private */
+        virtualization: PropTypes.Requireable<number>;
+    };
+    var Option: typeof import("./Option").default;
+    var Divider: typeof import("@splunk/react-ui/Menu").Divider;
+    var Heading: typeof import("@splunk/react-ui/Menu").Heading;
 }
 export default Compact;
 export { CompactPropsBase };

package/types/src/Multiselect/Multiselect.d.ts

@@ -1,9 +1,10 @@
-import React, { Component } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { Heading, Divider } from '@splunk/react-ui/Menu';
 import { SelectBaseChangeReason } from '@splunk/react-ui/Select/SelectBase';
 import { CompactPropsBase } from './Compact';
 import Option from './Option';
-import { ClassComponentProps } from '../utils/types';
+import { ComponentProps } from '../utils/types';
 /** @public */
 type MultiselectFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement> | React.FocusEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent, data: {
     keyword: string;
@@ -17,11 +18,11 @@ type MultiselectChangeHandler = (event: React.MouseEvent<HTMLButtonElement> | Re
 /** @public */
 type MultiselectScrollBottomHandler = (event: React.UIEvent<HTMLDivElement> | React.KeyboardEvent<HTMLInputElement> | null) => void;
 interface MultiselectPropsBase {
-    animateLoading?: boolean;
     /**
      * Allow the user to add arbitrary values.
      */
     allowNewValues?: boolean;
+    animateLoading?: boolean;
     /**
      * When compact, options are shown as checkboxes and the input is a single line. This is
      * useful when placing the Multiselect in a horizontal bar, such as a filter.
@@ -97,13 +98,15 @@ interface MultiselectPropsBase {
      * the menu should it need to be wider than the toggle Button. */
     menuStyle?: React.CSSProperties;
     /** The name is returned with onChange events, which can be used to identify the
-     * control when multiple controls share an onChange callback. */
+     * control when multiple controls share an onChange callback.
+     */
     name?: string;
     /**
      * The noOptionsMessage is shown when there are no children and it's not loading, such as when
      * there are no Options matching the filter. This can be customized to the type of content,
      * for example: "No matching dashboards". You can insert other content, such as an error message, or
-     * communicate a minimum number of characters to enter to see results. */
+     * communicate a minimum number of characters to enter to see results.
+     */
     noOptionsMessage?: React.ReactNode;
     /**
      * A callback to receive the change events.  If values is set, this callback is required.
@@ -111,31 +114,31 @@ interface MultiselectPropsBase {
      */
     onChange?: MultiselectChangeHandler;
     /**
-     * A callback function invoked when the menu is scrolled.
-     */
-    onScroll?: React.UIEventHandler<Element>;
-    /**
-     * A callback function for loading additional list items.
-     * Called when the list is scrolled to the bottom or all items in the list are visible.
-     * This is called with an event argument if this is the result of a scroll.
-     *
-     * This should be set this to `null` when all items are loaded.
+     * A callback function invoked when the popover closes.
      */
-    onScrollBottom?: MultiselectScrollBottomHandler;
+    onClose?: () => void;
     /**
      * A callback with the change event and value of the filter box. Providing this callback and
      * setting controlledFilter to true enables you to filter and update the children by other
      * criteria.
      */
     onFilterChange?: MultiselectFilterChangeHandler;
-    /**
-     * A callback function invoked when the popover closes.
-     */
-    onClose?: () => void;
     /**
      * A callback function invoked when the popover opens.
      */
     onOpen?: () => void;
+    /**
+     * A callback function invoked when the menu is scrolled.
+     */
+    onScroll?: React.UIEventHandler<Element>;
+    /**
+     * A callback function for loading additional list items.
+     * Called when the list is scrolled to the bottom or all items in the list are visible.
+     * This is called with an event argument if this is the result of a scroll.
+     *
+     * This should be set this to `null` when all items are loaded.
+     */
+    onScrollBottom?: MultiselectScrollBottomHandler;
     /**
      * If 'value' is undefined or doesn't match an item, the Button will display this text.
      */
@@ -147,6 +150,9 @@ interface MultiselectPropsBase {
     /**
      * Determines how to display Select all/Clear all.
      * Only supported when `compact=true`.
+     *
+     * @deprecatedValue 'buttongroup'
+     * The 'buttongroup' value is deprecated and will be removed in a future major version.
      */
     selectAllAppearance?: 'buttongroup' | 'checkbox';
     /**
@@ -174,7 +180,6 @@ interface MultiselectPropsBase {
      */
     virtualization?: number;
 }
-declare const defaultProps: Required<Pick<MultiselectPropsBase, 'allowNewValues' | 'animateLoading' | 'compact' | 'defaultPlacement' | 'disabled' | 'inline' | 'isLoadingOptions' | 'menuStyle' | 'noOptionsMessage' | 'placeholder' | 'repositionMode' | 'tabConfirmsNewValue' | 'useClickawayOverlay'>>;
 interface MultiselectPropsBaseControlled extends MultiselectPropsBase {
     defaultValues?: never;
     onChange: MultiselectChangeHandler;
@@ -196,17 +201,55 @@ interface MultiselectPropsBaseCompact extends MultiselectPropsBase {
     /** @private */
     toggle?: CompactPropsBase['toggle'];
 }
-type MultiselectNormalProps = ClassComponentProps<(MultiselectPropsBaseControlled | MultiselectPropsBaseUncontrolled) & MultiselectPropsBaseNormal, typeof defaultProps, 'div'>;
-type MultiselectCompactProps = ClassComponentProps<(MultiselectPropsBaseControlled | MultiselectPropsBaseUncontrolled) & MultiselectPropsBaseCompact, typeof defaultProps, 'button'>;
+type MultiselectNormalProps = ComponentProps<(MultiselectPropsBaseControlled | MultiselectPropsBaseUncontrolled) & MultiselectPropsBaseNormal, 'div'>;
+type MultiselectCompactProps = ComponentProps<(MultiselectPropsBaseControlled | MultiselectPropsBaseUncontrolled) & MultiselectPropsBaseCompact, 'button'>;
 type MultiselectProps = MultiselectNormalProps | MultiselectCompactProps;
-declare class Multiselect extends Component<MultiselectProps, {}> {
-    static propTypes: React.WeakValidationMap<MultiselectProps>;
-    static defaultProps: Required<Pick<MultiselectPropsBase, "placeholder" | "disabled" | "inline" | "compact" | "defaultPlacement" | "repositionMode" | "animateLoading" | "noOptionsMessage" | "menuStyle" | "allowNewValues" | "isLoadingOptions" | "tabConfirmsNewValue" | "useClickawayOverlay">>;
-    static componentType: string;
-    static Option: typeof Option;
-    static Heading: typeof Heading;
-    static Divider: typeof Divider;
-    render(): React.JSX.Element;
+declare function Multiselect({ allowNewValues, animateLoading, compact, children, controlledFilter, defaultPlacement, defaultValues, describedBy, disabled, elementRef, error, filter, footerMessage, inline, inputId, inputRef, isLoadingOptions, labelledBy, loadingMessage, menuStyle, name, noOptionsMessage, onChange, onClose, onFilterChange, onOpen, onScroll, onScrollBottom, placeholder, repositionMode, selectAllAppearance, showSelectedValuesFirst, tabConfirmsNewValue, useClickawayOverlay, values, virtualization, ...otherProps }: MultiselectProps): React.JSX.Element;
+declare namespace Multiselect {
+    var componentType: string;
+    var Option: typeof import("./Option").default;
+    var Heading: typeof import("@splunk/react-ui/Menu").Heading;
+    var Divider: typeof import("@splunk/react-ui/Menu").Divider;
+    var propTypes: {
+        allowNewValues: PropTypes.Requireable<boolean>;
+        animateLoading: PropTypes.Requireable<boolean>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        compact: PropTypes.Requireable<boolean>;
+        controlledFilter: PropTypes.Requireable<boolean>;
+        defaultPlacement: PropTypes.Requireable<string>;
+        defaultValues: PropTypes.Requireable<any[]>;
+        describedBy: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        elementRef: PropTypes.Requireable<object>;
+        error: PropTypes.Requireable<boolean>;
+        filter: PropTypes.Requireable<string | boolean>;
+        footerMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        inline: PropTypes.Requireable<boolean>;
+        inputId: PropTypes.Requireable<string>;
+        inputRef: PropTypes.Requireable<object>;
+        isLoadingOptions: PropTypes.Requireable<boolean>;
+        labelledBy: PropTypes.Requireable<string>;
+        loadingMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        menuStyle: PropTypes.Requireable<object>;
+        name: PropTypes.Requireable<string>;
+        noOptionsMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+        onScrollBottom: PropTypes.Requireable<(...args: any[]) => any>;
+        placeholder: PropTypes.Requireable<string>;
+        repositionMode: PropTypes.Requireable<string>;
+        selectAllAppearance: PropTypes.Requireable<string>;
+        showSelectedValuesFirst: PropTypes.Requireable<string>;
+        tabConfirmsNewValue: PropTypes.Requireable<boolean>;
+        useClickawayOverlay: PropTypes.Requireable<boolean>;
+        values: PropTypes.Requireable<any[]>;
+        /** @private */
+        virtualization: PropTypes.Requireable<number>;
+    };
 }
 export default Multiselect;
 export { Divider, Heading, MultiselectChangeHandler, MultiselectFilterChangeHandler, MultiselectScrollBottomHandler, Option, };
+export type { MultiselectPropsBase, MultiselectProps };

package/types/src/Multiselect/Normal.d.ts

@@ -1,14 +1,13 @@
-import React, { Component } from 'react';
-import { Divider, Heading } from '@splunk/react-ui/Menu';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { MultiselectChangeHandler, MultiselectFilterChangeHandler, MultiselectScrollBottomHandler } from './Multiselect';
-import Option from './Option';
-import { ClassComponentProps } from '../utils/types';
+import { ComponentProps } from '../utils/types';
 interface NormalPropsBase {
-    animateLoading?: boolean;
     /**
      * Allow the user to add arbitrary values.
      */
     allowNewValues?: boolean;
+    animateLoading?: boolean;
     /**
      * `children` should be `Multiselect.Option`, `Multiselect.Heading`, or
      * `Multiselect.Divider`.
@@ -127,57 +126,47 @@ interface NormalPropsBase {
      */
     values?: (string | number | boolean)[];
 }
-declare const defaultProps: Required<Pick<NormalPropsBase, 'allowNewValues' | 'animateLoading' | 'defaultPlacement' | 'disabled' | 'inline' | 'isLoadingOptions' | 'menuStyle' | 'noOptionsMessage' | 'placeholder' | 'tabConfirmsNewValue' | 'useClickawayOverlay'>>;
-type NormalProps = ClassComponentProps<NormalPropsBase, typeof defaultProps, 'div'>;
-interface NormalState {
-    activeIndex: number;
-    el: HTMLDivElement | null;
-    filterKeyword: string;
-    hasFocus: boolean;
-    open: boolean;
-    values: (string | number | boolean)[];
-    loadingMoreMessage: string;
-}
-declare class Normal extends Component<NormalProps, NormalState> {
-    private activeItemId;
-    private activeValue?;
-    private availableOptionCount;
-    private children;
-    private controlledExternally;
-    private input;
-    private popoverId;
-    private previousActiveIndex;
-    static propTypes: React.WeakValidationMap<NormalProps>;
-    static defaultProps: Required<Pick<NormalPropsBase, "placeholder" | "disabled" | "inline" | "defaultPlacement" | "animateLoading" | "noOptionsMessage" | "menuStyle" | "allowNewValues" | "isLoadingOptions" | "tabConfirmsNewValue" | "useClickawayOverlay">>;
-    static Option: typeof Option;
-    static Divider: typeof Divider;
-    static Heading: typeof Heading;
-    constructor(props: Readonly<NormalProps>);
-    componentDidUpdate(prevProps: Readonly<NormalProps>, prevState: Readonly<NormalState>): void;
-    private getCurrentValues;
-    private handleClick;
-    private handleRequestRemove;
-    private open;
-    private handleInputFocus;
-    private handleInputKeyDown;
-    private handleInputChange;
-    private handleMenuOptionClick;
-    private handleInputBlur;
-    private handleRequestClose;
-    private handleScrollBottom;
-    private handleMount;
-    private handleInputMount;
-    private handleActiveOptionMount;
-    private isControlled;
-    /**
-     * Place focus on the text input.
-     */
-    focus(): void;
-    private addValue;
-    private removeValue;
-    private renderButtons;
-    private renderMenu;
-    private getSelectedItemsContent;
-    render(): React.JSX.Element;
+export declare const getInlineMenuStyle: (({ anchorWidth, maxHeight, menuStyle }: any) => any) & import("lodash").MemoizedFunction;
+type NormalProps = ComponentProps<NormalPropsBase, 'div'>;
+declare function Normal({ allowNewValues, animateLoading, children, controlledFilter, defaultPlacement, defaultValues, describedBy, disabled, elementRef, error, footerMessage, inline, inputId, inputRef: inputRefProp, isLoadingOptions, labelledBy, loadingMessage, menuStyle, name, noOptionsMessage, onChange, onClose, onFilterChange, onScroll, onScrollBottom, onOpen, placeholder, required, repositionMode, tabConfirmsNewValue, useClickawayOverlay, values, ...otherProps }: NormalProps): React.JSX.Element;
+declare namespace Normal {
+    var propTypes: {
+        allowNewValues: PropTypes.Requireable<boolean>;
+        animateLoading: PropTypes.Requireable<boolean>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        controlledFilter: PropTypes.Requireable<boolean>;
+        defaultPlacement: PropTypes.Requireable<string>;
+        defaultValues: PropTypes.Requireable<any[]>;
+        describedBy: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        elementRef: PropTypes.Requireable<object>;
+        error: PropTypes.Requireable<boolean>;
+        footerMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        inline: PropTypes.Requireable<boolean>;
+        inputId: PropTypes.Requireable<string>;
+        inputRef: PropTypes.Requireable<object>;
+        isLoadingOptions: PropTypes.Requireable<boolean>;
+        labelledBy: PropTypes.Requireable<string>;
+        loadingMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        menuStyle: PropTypes.Requireable<object>;
+        name: PropTypes.Requireable<string>;
+        noOptionsMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+        onScrollBottom: PropTypes.Requireable<(...args: any[]) => any>;
+        placeholder: PropTypes.Requireable<string>;
+        /** @private. */
+        required: PropTypes.Requireable<boolean>;
+        repositionMode: PropTypes.Requireable<string>;
+        tabConfirmsNewValue: PropTypes.Requireable<boolean>;
+        useClickawayOverlay: PropTypes.Requireable<boolean>;
+        values: PropTypes.Requireable<any[]>;
+    };
+    var Option: typeof import("./Option").default;
+    var Divider: typeof import("@splunk/react-ui/Menu").Divider;
+    var Heading: typeof import("@splunk/react-ui/Menu").Heading;
 }
 export default Normal;

package/types/src/Multiselect/Option.d.ts

@@ -1,5 +1,6 @@
-import React, { PureComponent } from 'react';
-import { ClassComponentProps } from '../utils/types';
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ComponentProps } from '../utils/types';
 type OptionClickHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
     value: string | number | boolean;
 }) => void;
@@ -28,6 +29,10 @@ interface OptionPropsBase {
      * If disabled=true, the option is grayed out and cannot be clicked.
      */
     disabled?: boolean;
+    /**
+     * A React ref which is set to the DOM element when the component mounts, and null when it unmounts.
+     */
+    elementRef?: React.Ref<HTMLAnchorElement | HTMLButtonElement>;
     /**
      * Adding hidden options can be useful for resolving the selected display label and icon,
      * when the option should not be in the list. This scenario can arise when Select's filter is
@@ -77,24 +82,43 @@ interface OptionPropsBase {
      */
     value: string | number | boolean;
 }
-declare const defaultProps: Required<Pick<OptionPropsBase, 'compact' | 'descriptionPosition' | 'disabled' | 'selected' | 'truncate'>>;
-type OptionProps = ClassComponentProps<OptionPropsBase, typeof defaultProps, 'button'>;
+type OptionProps = ComponentProps<OptionPropsBase, 'button'>;
 /**
- * An option within a `Multiselect`. This inherits from
- * [PureComponent](https://reactjs.org/docs/react-api.html#reactpurecomponent)
- * so any elements passed to it must also be pure.
+ * An option within a `Multiselect`.
  */
-declare class Option extends PureComponent<OptionProps, {}> {
-    private optionBaseRef;
-    static propTypes: React.WeakValidationMap<OptionProps>;
-    static defaultProps: Required<Pick<OptionPropsBase, "disabled" | "selected" | "compact" | "descriptionPosition" | "truncate">>;
-    private handleMount;
-    scrollIntoViewIfNeeded(): void;
-    /**
-     * Place focus on the button.
-     */
-    focus(): void;
-    render(): React.JSX.Element;
+declare function Option({ compact, children, description, descriptionPosition, disabled, elementRef, hidden, icon, label, matchRanges, role, selected, truncate, value, ...otherProps }: OptionProps): React.JSX.Element;
+declare namespace Option {
+    var propTypes: {
+        /** @private */
+        active: PropTypes.Requireable<boolean>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * @private this is passed down from Multiselect.
+         */
+        compact: PropTypes.Requireable<boolean>;
+        description: PropTypes.Requireable<string>;
+        descriptionPosition: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        elementRef: PropTypes.Requireable<object>;
+        hidden: PropTypes.Requireable<boolean>;
+        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        label: PropTypes.Validator<string>;
+        matchRanges: PropTypes.Requireable<(PropTypes.InferProps<{
+            start: PropTypes.Validator<number>;
+            end: PropTypes.Validator<number>;
+        }> | null | undefined)[]>;
+        /** @private */
+        onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        /** @private */
+        role: PropTypes.Requireable<string>;
+        /** @private */
+        selected: PropTypes.Requireable<boolean>;
+        selectedAppearance: PropTypes.Requireable<string>;
+        selectedBackgroundColor: PropTypes.Requireable<string>;
+        selectedForegroundColor: PropTypes.Requireable<string>;
+        truncate: PropTypes.Requireable<boolean>;
+        value: PropTypes.Validator<NonNullable<NonNullable<string | number | boolean | null | undefined>>>;
+    };
 }
 export default Option;
 export { OptionClickHandler };

package/types/src/Multiselect/docs/examples/Children.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class Children extends Component<{}, {
+declare class Children extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/Controlled.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class Controlled extends Component<{}, {
+declare class Controlled extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/CustomizeSelected.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class CustomizeSelected extends Component<{}, {
+declare class CustomizeSelected extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/Disabled.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class Disabled extends Component<{}, {
+declare class Disabled extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/Error.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class MultiselectError extends Component<{}, {
+declare class MultiselectError extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/Fetching.d.ts

@@ -7,9 +7,9 @@ interface ExampleState {
     options: MovieOption[];
     values: (string | number | boolean)[];
 }
-declare class Fetching extends Component<{}, ExampleState> {
+declare class Fetching extends Component<object, ExampleState> {
     private fetchOptions;
-    constructor(props: {});
+    constructor(props: object);
     componentDidMount(): void;
     componentWillUnmount(): void;
     handleChange: MultiselectChangeHandler;

package/types/src/Multiselect/docs/examples/LoadMoreOnScrollBottom.d.ts

@@ -8,9 +8,9 @@ interface ExampleState {
     options: MovieOption[];
     values: (string | number | boolean)[];
 }
-declare class LoadMoreOnScrollBottom extends Component<{}, ExampleState> {
+declare class LoadMoreOnScrollBottom extends Component<object, ExampleState> {
     private fetchOptions;
-    constructor(props: {});
+    constructor(props: object);
     componentDidMount(): void;
     componentWillUnmount(): void;
     handleChange: MultiselectChangeHandler;

package/types/src/Multiselect/docs/examples/NewValues.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class NewValues extends Component<{}, {
+declare class NewValues extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/Multiselect/docs/examples/TabInput.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { MultiselectChangeHandler } from '@splunk/react-ui/Multiselect';
-declare class TabInput extends Component<{}, {
+declare class TabInput extends Component<object, {
     values: (string | number | boolean)[];
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: MultiselectChangeHandler;
     render(): React.JSX.Element;
 }

package/types/src/NonInteractiveCheckbox/NonInteractiveCheckbox.d.ts

@@ -2,20 +2,21 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ComponentProps } from '../utils/types';
 interface NonInteractiveCheckboxPropsBase {
-    disabled?: boolean | 'dimmed';
+    disabled?: boolean;
     selected?: boolean | 'some';
 }
 type NonInteractiveCheckboxProps = ComponentProps<NonInteractiveCheckboxPropsBase, 'div'>;
 /**
- * NonInteractiveCheckbox is a private component that replaces our internal usage of Switch's interactive={false}
- * with react-icons instead in components like Menu.Item, Table.Toggle, etc. (SUI-6757)
+ * NonInteractiveCheckbox is a private component that replaced our internal usage of Switch's interactive={false}
+ * for components like Menu.Item, Table.Toggle, etc. (SUI-6757)
  *
  */
-declare function NonInteractiveCheckbox({ disabled, selected, ...otherProps }: NonInteractiveCheckboxProps): React.JSX.Element;
-declare namespace NonInteractiveCheckbox {
-    var propTypes: {
-        disabled: PropTypes.Requireable<NonNullable<string | boolean | null | undefined>>;
+declare const NonInteractiveCheckbox: {
+    ({ className, disabled, selected }: NonInteractiveCheckboxProps): React.JSX.Element;
+    propTypes: {
+        disabled: PropTypes.Requireable<boolean>;
         selected: PropTypes.Requireable<NonNullable<string | boolean | null | undefined>>;
     };
-}
+};
 export default NonInteractiveCheckbox;
+export { NonInteractiveCheckboxPropsBase };

package/types/src/Number/Number.d.ts

@@ -5,6 +5,7 @@ import { ComponentProps } from '../utils/types';
 type NumberChangeHandler = (event: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement> | React.MouseEvent<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>, data: {
     name?: string;
     value?: number;
+    reason: 'input' | 'stepButton';
 }) => void;
 /** @public */
 type NumberBlurHandler = (event: React.FocusEvent<HTMLInputElement>, data: {

package/types/src/Number/docs/examples/Basic.d.ts

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
 import { NumberChangeHandler } from '@splunk/react-ui/Number';
-declare class Basic extends Component<{}, {
+declare class Basic extends Component<object, {
     value?: number;
 }> {
-    constructor(props: {});
+    constructor(props: object);
     handleChange: NumberChangeHandler;
     render(): React.JSX.Element;
 }