@instructure/ui-simple-select 8.8.1-snapshot.8 → 8.9.1

package/src/SimpleSelect/props.ts

@@ -0,0 +1,247 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+import React from 'react'
+import PropTypes from 'prop-types'
+
+import { Children as ChildrenPropTypes } from '@instructure/ui-prop-types'
+import { FormPropTypes } from '@instructure/ui-form-field'
+import { PositionPropTypes } from '@instructure/ui-position'
+
+import { Group } from './Group'
+import { Option } from './Option'
+
+import type { FormMessage } from '@instructure/ui-form-field'
+import type { PropValidators } from '@instructure/shared-types'
+import type {
+  PlacementPropValues,
+  PositionConstraint,
+  PositionMountNode
+} from '@instructure/ui-position'
+
+type SimpleSelectOwnProps = {
+  renderLabel: React.ReactNode | ((...args: any[]) => any)
+  value?: string | number // TODO: it was using the "controllable" util, in the TS migration mimic that behaviour
+  defaultValue?: string
+  id?: string
+  size?: 'small' | 'medium' | 'large'
+  assistiveText?: string
+  placeholder?: string
+  interaction?: 'enabled' | 'disabled' | 'readonly'
+  isRequired?: boolean
+  isInline?: boolean
+  width?: string
+  optionsMaxWidth?: string
+  visibleOptionsCount?: number
+  messages?: FormMessage[]
+  placement?: PlacementPropValues
+  constrain?: PositionConstraint
+  mountNode?: PositionMountNode
+  onChange?: (...args: any[]) => any
+  onFocus?: (...args: any[]) => any
+  onBlur?: (...args: any[]) => any
+  onShowOptions?: (...args: any[]) => any
+  onHideOptions?: (...args: any[]) => any
+  inputRef?: (...args: any[]) => any
+  listRef?: (...args: any[]) => any
+  renderEmptyOption?: React.ReactNode | ((...args: any[]) => any)
+  renderBeforeInput?: React.ReactNode | ((...args: any[]) => any)
+  renderAfterInput?: React.ReactNode | ((...args: any[]) => any)
+  children?: React.ReactNode
+}
+
+type PropKeys = keyof SimpleSelectOwnProps
+
+type AllowedPropKeys = Readonly<Array<PropKeys>>
+
+type SimpleSelectProps = SimpleSelectOwnProps
+
+const propTypes: PropValidators<PropKeys> = {
+  /**
+   * The form field label.
+   */
+  renderLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
+  /**
+   * The value corresponding to the value of the selected option. If defined,
+   * the component will act controlled and will not manage its own state.
+   */
+  // TODO: it was using the "controllable" util, in the TS migration mimic that behaviour
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  /**
+   * The value of the option to select by default, when uncontrolled.
+   */
+  defaultValue: PropTypes.string,
+  /**
+   * The id of the text input. One is generated if not supplied.
+   */
+  id: PropTypes.string,
+  /**
+   * The size of the text input.
+   */
+  size: PropTypes.oneOf(['small', 'medium', 'large']),
+  /**
+   * Additional helpful text to provide to screen readers about the operation
+   * of the component. Provided via aria-describedby.
+   */
+  assistiveText: PropTypes.string,
+  /**
+   * Html placeholder text to display when the input has no value. This should
+   * be hint text, not a label replacement.
+   */
+  placeholder: PropTypes.string,
+  /**
+   * Specifies if interaction with the input is enabled, disabled, or readonly.
+   * When "disabled", the input changes visibly to indicate that it cannot
+   * receive user interactions. When "readonly" the input still cannot receive
+   * user interactions but it keeps the same styles as if it were enabled.
+   */
+  interaction: PropTypes.oneOf(['enabled', 'disabled', 'readonly']),
+  /**
+   * Whether or not the text input is required.
+   */
+  isRequired: PropTypes.bool,
+  /**
+   * Whether the input is rendered inline with other elements or if it
+   * is rendered as a block level element.
+   */
+  isInline: PropTypes.bool,
+  /**
+   * The width of the text input.
+   */
+  width: PropTypes.string,
+  /**
+   * The max width the options list can be before option text wraps. If not
+   * set, the list will only display as wide as the text input.
+   */
+  optionsMaxWidth: PropTypes.string,
+  /**
+   * The number of options that should be visible before having to scroll.
+   */
+  visibleOptionsCount: PropTypes.number,
+  /**
+   * Displays messages and validation for the input. It should be an object
+   * with the following shape:
+   * `{
+   *   text: PropTypes.string,
+   *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
+   * }`
+   */
+  messages: PropTypes.arrayOf(FormPropTypes.message),
+  /**
+   * The placement of the options list.
+   */
+  placement: PositionPropTypes.placement,
+  /**
+   * The parent in which to constrain the placement.
+   */
+  constrain: PositionPropTypes.constrain,
+  /**
+   * An element or a function returning an element to use mount the options
+   * list to in the DOM (defaults to `document.body`)
+   */
+  mountNode: PositionPropTypes.mountNode,
+  /**
+   * Callback fired when a new option is selected.
+   * @param {Object} event - the event object
+   * @param {Object} data - additional data
+   * @param data.value - the value of selected option
+   * @param data.id - the id of the selected option
+   */
+  onChange: PropTypes.func,
+  /**
+   * Callback fired when text input receives focus.
+   */
+  onFocus: PropTypes.func,
+  /**
+   * Callback fired when text input loses focus.
+   */
+  onBlur: PropTypes.func,
+  /**
+   * Callback fired when the options list is shown.
+   */
+  onShowOptions: PropTypes.func,
+  /**
+   * Callback fired when the options list is hidden.
+   */
+  onHideOptions: PropTypes.func,
+  /**
+   * A ref to the html `input` element.
+   */
+  inputRef: PropTypes.func,
+  /**
+   * A ref to the html `ul` element.
+   */
+  listRef: PropTypes.func,
+  /**
+   * Content to display in the list when no options are available.
+   */
+  renderEmptyOption: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+  /**
+   * Content to display before the text input. This will commonly be an icon.
+   */
+  renderBeforeInput: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+  /**
+   * Content to display after the text input. This content will replace the
+   * default arrow icons.
+   */
+  renderAfterInput: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+  /**
+   * Children of type `<SimpleSelect.Option />` or `<SimpleSelect.Group />`.
+   */
+  children: ChildrenPropTypes.oneOf([Group, Option])
+}
+
+const allowedProps: AllowedPropKeys = [
+  'renderLabel',
+  'value',
+  'defaultValue',
+  'id',
+  'size',
+  'assistiveText',
+  'placeholder',
+  'interaction',
+  'isRequired',
+  'isInline',
+  'width',
+  'optionsMaxWidth',
+  'visibleOptionsCount',
+  'messages',
+  'placement',
+  'constrain',
+  'mountNode',
+  'onChange',
+  'onFocus',
+  'onBlur',
+  'onShowOptions',
+  'onHideOptions',
+  'inputRef',
+  'listRef',
+  'renderEmptyOption',
+  'renderBeforeInput',
+  'renderAfterInput',
+  'children'
+]
+
+export type { SimpleSelectProps }
+export { propTypes, allowedProps }

package/src/index.ts

@@ -24,6 +24,6 @@
 
 export { SimpleSelect } from './SimpleSelect'
 
-export type { SimpleSelectProps } from './SimpleSelect/types'
-export type { SimpleSelectGroupProps } from './SimpleSelect/Group/types'
-export type { SimpleSelectOptionProps } from './SimpleSelect/Option/types'
+export type { SimpleSelectProps } from './SimpleSelect/props'
+export type { SimpleSelectGroupProps } from './SimpleSelect/Group/props'
+export type { SimpleSelectOptionProps } from './SimpleSelect/Option/props'

package/types/SimpleSelect/Group/index.d.ts

@@ -1,6 +1,5 @@
 import { Component } from 'react';
-import PropTypes from 'prop-types';
-import { SimpleSelectGroupProps } from './types';
+import type { SimpleSelectGroupProps } from './props';
 /**
 ---
 parent: SimpleSelect
@@ -9,19 +8,14 @@ id: SimpleSelect.Group
 **/
 declare class Group extends Component<SimpleSelectGroupProps> {
     static readonly componentId = "SimpleSelect.Group";
-    static propTypes: {
-        /**
-         * The label associated with the group options.
-         */
-        renderLabel: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Children of type `<SimpleSelect.Option />` that will be considered part of the group.
-         */
-        children: {
-            (props: Record<string, any>, propName: string, componentName: string): Error | null;
-            isRequired: (props: Record<string, any>, propName: string, componentName: string, location?: string | undefined, propFullName?: string | undefined) => Error | null;
-        };
-    };
+    static allowedProps: readonly (keyof {
+        renderLabel: import("react").ReactNode | ((...args: any[]) => any);
+        children?: import("react").ReactNode;
+    })[];
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        renderLabel: import("react").ReactNode | ((...args: any[]) => any);
+        children?: import("react").ReactNode;
+    }>;
     static defaultProps: {
         children: null;
     };

package/types/SimpleSelect/Group/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Group/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,SAAS,MAAM,YAAY,CAAA;AAIlC,OAAO,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAEhD;;;;;GAKG;AACH,cAAM,KAAM,SAAQ,SAAS,CAAC,sBAAsB,CAAC;IACnD,MAAM,CAAC,QAAQ,CAAC,WAAW,wBAAuB;IAElD,MAAM,CAAC,SAAS;QACd;;WAEG;;QAGH;;WAEG;;;;;MAEJ;IAED,MAAM,CAAC,YAAY;;MAElB;IAGD,MAAM;CAKP;AAED,eAAe,KAAK,CAAA;AACpB,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Group/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD;;;;;GAKG;AACH,cAAM,KAAM,SAAQ,SAAS,CAAC,sBAAsB,CAAC;IACnD,MAAM,CAAC,QAAQ,CAAC,WAAW,wBAAuB;IAClD,MAAM,CAAC,YAAY;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;MAElB;IAGD,MAAM;CAKP;AAED,eAAe,KAAK,CAAA;AACpB,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/types/SimpleSelect/Group/props.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { PropValidators } from '@instructure/shared-types';
+declare type SimpleSelectGroupOwnProps = {
+    renderLabel: React.ReactNode | ((...args: any[]) => any);
+    children?: React.ReactNode;
+};
+declare type PropKeys = keyof SimpleSelectGroupOwnProps;
+declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
+declare type SimpleSelectGroupProps = SimpleSelectGroupOwnProps;
+declare const propTypes: PropValidators<PropKeys>;
+declare const allowedProps: AllowedPropKeys;
+export type { SimpleSelectGroupProps };
+export { propTypes, allowedProps };
+//# sourceMappingURL=props.d.ts.map

package/types/SimpleSelect/Group/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Group/props.ts"],"names":[],"mappings":"AAuBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE/D,aAAK,yBAAyB,GAAG;IAC/B,WAAW,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AACD,aAAK,QAAQ,GAAG,MAAM,yBAAyB,CAAA;AAE/C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,sBAAsB,GAAG,yBAAyB,CAAA;AAEvD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CASvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAA6C,CAAA;AAEjE,YAAY,EAAE,sBAAsB,EAAE,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/SimpleSelect/Option/index.d.ts

@@ -1,6 +1,5 @@
 import { Component } from 'react';
-import PropTypes from 'prop-types';
-import { SimpleSelectOptionProps } from './types';
+import type { SimpleSelectOptionProps } from './props';
 /**
 ---
 parent: SimpleSelect
@@ -9,36 +8,24 @@ id: SimpleSelect.Option
 **/
 declare class Option extends Component<SimpleSelectOptionProps> {
     static readonly componentId = "SimpleSelect.Option";
-    static propTypes: {
-        /**
-         * The id for the option.
-         */
-        id: PropTypes.Validator<string>;
-        /**
-         * The value for the option.
-         */
-        value: PropTypes.Validator<string | number>;
-        /**
-         * Whether or not this option is disabled.
-         */
-        isDisabled: PropTypes.Requireable<boolean>;
-        /**
-         * Content to display before the option label, such as an icon.
-         */
-        renderBeforeLabel: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Content to display after the option label, such as an icon.
-         */
-        renderAfterLabel: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Content to display as the option label.
-         */
-        children: PropTypes.Requireable<string>;
-    };
+    static allowedProps: readonly (keyof {
+        id: string;
+        value: string | number;
+        isDisabled?: boolean | undefined;
+        renderBeforeLabel?: import("react").ReactNode | ((...args: any[]) => any);
+        renderAfterLabel?: import("react").ReactNode | ((...args: any[]) => any);
+        children?: import("react").ReactNode;
+    })[];
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        id: string;
+        value: string | number;
+        isDisabled?: boolean | undefined;
+        renderBeforeLabel?: import("react").ReactNode | ((...args: any[]) => any);
+        renderAfterLabel?: import("react").ReactNode | ((...args: any[]) => any);
+        children?: import("react").ReactNode;
+    }>;
     static defaultProps: {
         isDisabled: boolean;
-        renderBeforeLabel: undefined;
-        renderAfterLabel: undefined;
         children: null;
     };
     render(): null;

package/types/SimpleSelect/Option/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Option/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,SAAS,MAAM,YAAY,CAAA;AAClC,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAEjD;;;;;GAKG;AACH,cAAM,MAAO,SAAQ,SAAS,CAAC,uBAAuB,CAAC;IACrD,MAAM,CAAC,QAAQ,CAAC,WAAW,yBAAwB;IAEnD,MAAM,CAAC,SAAS;QACd;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;MAEJ;IAED,MAAM,CAAC,YAAY;;;;;MAKlB;IAGD,MAAM;CAKP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Option/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD;;;;;GAKG;AACH,cAAM,MAAO,SAAQ,SAAS,CAAC,uBAAuB,CAAC;IACrD,MAAM,CAAC,QAAQ,CAAC,WAAW,yBAAwB;IAEnD,MAAM,CAAC,YAAY;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;MAGlB;IAGD,MAAM;CAKP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/types/SimpleSelect/Option/props.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { PropValidators } from '@instructure/shared-types';
+declare type SimpleSelectOptionOwnProps = {
+    id: string;
+    value: string | number;
+    isDisabled?: boolean;
+    renderBeforeLabel?: React.ReactNode | ((...args: any[]) => any);
+    renderAfterLabel?: React.ReactNode | ((...args: any[]) => any);
+    children?: React.ReactNode;
+};
+declare type PropKeys = keyof SimpleSelectOptionOwnProps;
+declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
+declare type SimpleSelectOptionProps = SimpleSelectOptionOwnProps;
+declare const propTypes: PropValidators<PropKeys>;
+declare const allowedProps: AllowedPropKeys;
+export type { SimpleSelectOptionProps };
+export { propTypes, allowedProps };
+//# sourceMappingURL=props.d.ts.map

package/types/SimpleSelect/Option/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/SimpleSelect/Option/props.ts"],"names":[],"mappings":"AAuBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE/D,aAAK,0BAA0B,GAAG;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IAC/D,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IAC9D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AACD,aAAK,QAAQ,GAAG,MAAM,0BAA0B,CAAA;AAEhD,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,uBAAuB,GAAG,0BAA0B,CAAA;AAEzD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAyBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAOnB,CAAA;AAED,YAAY,EAAE,uBAAuB,EAAE,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/SimpleSelect/index.d.ts

@@ -1,8 +1,7 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import { Option } from './Option';
 import { Group } from './Group';
-import { SimpleSelectProps } from './types';
+import type { SimpleSelectProps } from './props';
 /**
 ---
 category: components
@@ -13,161 +12,73 @@ declare class SimpleSelect extends Component<SimpleSelectProps> {
     static readonly componentId = "SimpleSelect";
     static Option: typeof Option;
     static Group: typeof Group;
-    static propTypes: {
-        /**
-         * The form field label.
-         */
-        renderLabel: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * The value corresponding to the value of the selected option. If defined,
-         * the component will act controlled and will not manage its own state.
-         */
-        value: PropTypes.Requireable<string | number>;
-        /**
-         * The value of the option to select by default, when uncontrolled.
-         */
-        defaultValue: PropTypes.Requireable<string>;
-        /**
-         * The id of the text input. One is generated if not supplied.
-         */
-        id: PropTypes.Requireable<string>;
-        /**
-         * The size of the text input.
-         */
-        size: PropTypes.Requireable<string>;
-        /**
-         * Additional helpful text to provide to screen readers about the operation
-         * of the component. Provided via aria-describedby.
-         */
-        assistiveText: PropTypes.Requireable<string>;
-        /**
-         * Html placeholder text to display when the input has no value. This should
-         * be hint text, not a label replacement.
-         */
-        placeholder: PropTypes.Requireable<string>;
-        /**
-         * Specifies if interaction with the input is enabled, disabled, or readonly.
-         * When "disabled", the input changes visibly to indicate that it cannot
-         * receive user interactions. When "readonly" the input still cannot receive
-         * user interactions but it keeps the same styles as if it were enabled.
-         */
-        interaction: PropTypes.Requireable<string>;
-        /**
-         * Whether or not the text input is required.
-         */
-        isRequired: PropTypes.Requireable<boolean>;
-        /**
-         * Whether the input is rendered inline with other elements or if it
-         * is rendered as a block level element.
-         */
-        isInline: PropTypes.Requireable<boolean>;
-        /**
-         * The width of the text input.
-         */
-        width: PropTypes.Requireable<string>;
-        /**
-         * The max width the options list can be before option text wraps. If not
-         * set, the list will only display as wide as the text input.
-         */
-        optionsMaxWidth: PropTypes.Requireable<string>;
-        /**
-         * The number of options that should be visible before having to scroll.
-         */
-        visibleOptionsCount: PropTypes.Requireable<number>;
-        /**
-         * Displays messages and validation for the input. It should be an object
-         * with the following shape:
-         * `{
-         *   text: PropTypes.string,
-         *   type: PropTypes.oneOf(['error', 'hint', 'success', 'screenreader-only'])
-         * }`
-         */
-        messages: PropTypes.Requireable<(PropTypes.InferProps<{
-            text: PropTypes.Requireable<string>;
-            type: PropTypes.Requireable<string>;
-        }> | null | undefined)[]>;
-        /**
-         * The placement of the options list.
-         */
-        placement: PropTypes.Requireable<string>;
-        /**
-         * The parent in which to constrain the placement.
-         */
-        constrain: PropTypes.Requireable<string | PropTypes.ReactElementLike | Element | ((...args: any[]) => any)>;
-        /**
-         * An element or a function returning an element to use mount the options
-         * list to in the DOM (defaults to `document.body`)
-         */
-        mountNode: PropTypes.Requireable<PropTypes.ReactElementLike | Element | ((...args: any[]) => any)>;
-        /**
-         * Callback fired when a new option is selected.
-         * @param {Object} event - the event object
-         * @param {Object} data - additional data
-         * @param data.value - the value of selected option
-         * @param data.id - the id of the selected option
-         */
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Callback fired when text input receives focus.
-         */
-        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Callback fired when text input loses focus.
-         */
-        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Callback fired when the options list is shown.
-         */
-        onShowOptions: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Callback fired when the options list is hidden.
-         */
-        onHideOptions: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * A ref to the html `input` element.
-         */
-        inputRef: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * A ref to the html `ul` element.
-         */
-        listRef: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Content to display in the list when no options are available.
-         */
-        renderEmptyOption: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Content to display before the text input. This will commonly be an icon.
-         */
-        renderBeforeInput: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Content to display after the text input. This content will replace the
-         * default arrow icons.
-         */
-        renderAfterInput: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Children of type `<SimpleSelect.Option />` or `<SimpleSelect.Group />`.
-         */
-        children: {
-            (props: Record<string, any>, propName: string, componentName: string): Error | null;
-            isRequired: (props: Record<string, any>, propName: string, componentName: string, location?: string | undefined, propFullName?: string | undefined) => Error | null;
-        };
-    };
+    static allowedProps: readonly (keyof {
+        renderLabel: React.ReactNode | ((...args: any[]) => any);
+        value?: string | number | undefined;
+        defaultValue?: string | undefined;
+        id?: string | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        assistiveText?: string | undefined;
+        placeholder?: string | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        isRequired?: boolean | undefined;
+        isInline?: boolean | undefined;
+        width?: string | undefined;
+        optionsMaxWidth?: string | undefined;
+        visibleOptionsCount?: number | undefined;
+        messages?: import("@instructure/ui-form-field").FormMessage[] | undefined;
+        placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
+        constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
+        mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
+        onChange?: ((...args: any[]) => any) | undefined;
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        onShowOptions?: ((...args: any[]) => any) | undefined;
+        onHideOptions?: ((...args: any[]) => any) | undefined;
+        inputRef?: ((...args: any[]) => any) | undefined;
+        listRef?: ((...args: any[]) => any) | undefined;
+        renderEmptyOption?: React.ReactNode | ((...args: any[]) => any);
+        renderBeforeInput?: React.ReactNode | ((...args: any[]) => any);
+        renderAfterInput?: React.ReactNode | ((...args: any[]) => any);
+        children?: React.ReactNode;
+    })[];
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        renderLabel: React.ReactNode | ((...args: any[]) => any);
+        value?: string | number | undefined;
+        defaultValue?: string | undefined;
+        id?: string | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        assistiveText?: string | undefined;
+        placeholder?: string | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        isRequired?: boolean | undefined;
+        isInline?: boolean | undefined;
+        width?: string | undefined;
+        optionsMaxWidth?: string | undefined;
+        visibleOptionsCount?: number | undefined;
+        messages?: import("@instructure/ui-form-field").FormMessage[] | undefined;
+        placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
+        constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
+        mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
+        onChange?: ((...args: any[]) => any) | undefined;
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        onShowOptions?: ((...args: any[]) => any) | undefined;
+        onHideOptions?: ((...args: any[]) => any) | undefined;
+        inputRef?: ((...args: any[]) => any) | undefined;
+        listRef?: ((...args: any[]) => any) | undefined;
+        renderEmptyOption?: React.ReactNode | ((...args: any[]) => any);
+        renderBeforeInput?: React.ReactNode | ((...args: any[]) => any);
+        renderAfterInput?: React.ReactNode | ((...args: any[]) => any);
+        children?: React.ReactNode;
+    }>;
     static defaultProps: {
-        value: undefined;
-        defaultValue: undefined;
-        id: undefined;
         size: string;
-        assistiveText: undefined;
         placeholder: null;
-        interaction: undefined;
         isRequired: boolean;
         isInline: boolean;
-        width: undefined;
-        optionsMaxWidth: undefined;
         visibleOptionsCount: number;
-        messages: undefined;
         placement: string;
-        mountNode: undefined;
         constrain: string;
         onChange: (event: any, data: any) => void;
         onFocus: (event: any) => void;