@codecademy/gamut
72.2.472.2.5-alpha.619ec9.0
dist/Form/SelectDropdown/elements/containers.d.ts~
dist/Form/SelectDropdown/elements/containers.d.tsModified+15−2
Index: package/dist/Form/SelectDropdown/elements/containers.d.ts
===================================================================
--- package/dist/Form/SelectDropdown/elements/containers.d.ts
+++ package/dist/Form/SelectDropdown/elements/containers.d.ts
@@ -1,12 +1,21 @@
+import { ReactNode } from 'react';
import { components as SelectDropdownElements, GroupBase, Props } from 'react-select';
import { CustomSelectComponentProps, SelectDropdownContextValueTypes, TypedReactSelectProps } from '../types';
/**
* React context for sharing state between SelectDropdown components.
* Provides access to focus state and refs for keyboard navigation.
*/
export declare const SelectDropdownContext: import("react").Context<SelectDropdownContextValueTypes>;
/**
+ * Wraps react-select's `NoOptionsMessage` to report its text via
+ * `onAnnouncementChange` for screen-reader announcement (see
+ * `useNoOptionsAnnouncement`). react-select controls this component's
+ * mount/unmount, so a mount/unmount effect is the only way to detect the
+ * "no options" state - there's no prop or event exposed for it.
+ */
+export declare const createNoOptionsMessage: (onAnnouncementChange: (announcement: ReactNode) => void) => (props: CustomSelectComponentProps<typeof SelectDropdownElements.NoOptionsMessage>) => import("react/jsx-runtime").JSX.Element;
+/**
* Custom container component that adds a hidden input for form submission.
* Renders the selected values as a comma-separated string in the hidden input.
*/
export declare const CustomContainer: ({ children, ...rest }: CustomSelectComponentProps<typeof SelectDropdownElements.SelectContainer>) => import("react/jsx-runtime").JSX.Element;
@@ -23,7 +32,11 @@
*/
export declare const CustomInput: ({ ...rest }: CustomSelectComponentProps<typeof SelectDropdownElements.Input>) => import("react/jsx-runtime").JSX.Element;
/**
* Typed wrapper around react-select component.
- * Provides type safety for the underlying react-select implementation.
+ * Renders CreatableSelect when isCreatable is true, ReactSelect otherwise.
+ * Creatable-only props (formatCreateLabel, isValidNewOption) are stripped from
+ * the non-creatable path so they don't reach ReactSelect. `onCreateOption` is
+ * handled in SelectDropdown's changeHandler — do not pass it to CreatableSelect
+ * or react-select will skip onChange on create.
*/
-export declare function TypedReactSelect<OptionType, IsMulti extends boolean = false, GroupType extends GroupBase<OptionType> = GroupBase<OptionType>>({ selectRef, ...props }: Props<OptionType, IsMulti, GroupType> & TypedReactSelectProps): import("react/jsx-runtime").JSX.Element;
+export declare function TypedReactSelect<OptionType, IsMulti extends boolean = false, GroupType extends GroupBase<OptionType> = GroupBase<OptionType>>({ selectRef, isCreatable, formatCreateLabel, isValidNewOption, ...props }: Props<OptionType, IsMulti, GroupType> & TypedReactSelectProps): import("react/jsx-runtime").JSX.Element;