@muraldevkit/ui-toolkit 4.67.0-dev-Vc0V.1 → 4.68.0-dev-NFbt.1

package/dist/types/components/form/hooks/useIsEditable.d.ts

@@ -0,0 +1,28 @@
+import { InputStates } from '../constants';
+type UseIsEditableReturn = {
+    isEditable: boolean;
+    isEditing: boolean;
+    setIsEditable: (isEditable: boolean) => void;
+    setIsEditing: (isEditingUpdate: boolean) => void;
+};
+/**
+ * Custom hook used to track the edit state of a text input.
+ *
+ * isEditing represents if someone has actively decided to start editing a field.
+ * isEditable controls if the input field can be interacted with directly.
+ *
+ * This leaves open the possibility for a field to be editable even if someone has not explicitly decided to edit it.
+ * @param param - useIsEditable options
+ * @param param.changeHandler - optional set handler
+ * @param param.initialValue - the text input initial value
+ * @param param.state - the text input state
+ * @param param.value - optional control value
+ * @returns the isEditable, isEditing state and handler
+ */
+export declare function useIsEditable({ changeHandler, initialValue, state, value }: {
+    changeHandler?: (isEditableUpdate: boolean) => void;
+    initialValue: boolean;
+    state?: InputStates;
+    value?: boolean;
+}): UseIsEditableReturn;
+export {};

package/dist/types/components/form/index.d.ts

@@ -0,0 +1,19 @@
+export * from './legacy-select';
+export * from './legacy-select/MrlLegacySelectItem';
+export * from './legacy-select/MrlLegacySelectMenu';
+export * from './text-input/MrlTextInput';
+export * from './text-input/MrlEditableTextInput';
+export * from './label/MrlLabel';
+export * from './label/MrlLabelWithDescription';
+export * from './textarea/MrlTextarea';
+export * from './textarea/MrlEditableTextarea';
+export * from './fieldset/MrlFieldset';
+export * from './checkbox/MrlCheckbox';
+export * from './checkbox/MrlCheckboxStandalone';
+export * from './constants';
+export * from './radio/MrlRadioGroup';
+export * from './radio/MrlRadioButton';
+export * from './radio/MrlRadioButtonStandalone';
+export * from './switch';
+export * from './date-picker';
+export * from './select';

package/dist/types/components/form/label/MrlLabel/MrlLabel.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { AttrsObject } from '../../../../utils';
+import { LabelKind, LabelStates, StaticIconConfig } from '../../constants';
+interface MrlLabelProps extends React.HTMLAttributes<HTMLLabelElement> {
+    /** Applies additional HTML attributes to the label element */
+    attrs?: AttrsObject;
+    /** Informs the user of the form element's purpose */
+    text: string;
+    /** ID of the form elements so all users can understand the relationship between the two elements */
+    htmlFor?: string;
+    /** Label style based on the type of associated form element */
+    kind?: LabelKind;
+    /**
+     * Configures a leading icon within the label. This is only supported with an inline label
+     */
+    icon?: StaticIconConfig;
+    /**
+     * Changes the state of the label based on state of the associated input. Note, do not
+     * use this prop only for styling, it must match the state of the input for accessibility compliance.
+     */
+    state?: LabelStates;
+    /** Additional class to add to the label */
+    className?: string;
+}
+/**
+ * Provides a label for a form element
+ *
+ * @param {MrlLabelProps} props - the component props
+ * @returns a label element
+ */
+export declare function MrlLabel({ attrs, className, text, htmlFor, kind, icon, state, ...rest }: MrlLabelProps): JSX.Element;
+export {};

package/dist/types/components/form/label/MrlLabel/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlLabel';

package/dist/types/components/form/label/MrlLabelWithDescription/MrlLabelWithDescription.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { StaticIconConfig } from '../../constants';
+interface MrlLabelWithDescriptionProps {
+    /** Additional class to add to the container of the label and description */
+    className?: string;
+    /** Description text or a custom component */
+    description?: string | React.ReactNode;
+    /** The id that's linked to the form element "aria-describedby" attribute */
+    descriptionId?: string;
+    /** Disabled state */
+    isDisabled?: boolean;
+    /** Indeterminate state */
+    isIndeterminate?: boolean;
+    /** Selected state */
+    isSelected?: boolean;
+    /** Adjusts the styles of the label, icon, and description when the label is multiline */
+    hasMultilineLabel?: boolean;
+    /** ID of the form elements so all users can understand the relationship between the two elements */
+    htmlFor: string;
+    /** Leading label icon */
+    icon?: StaticIconConfig;
+    /** The text to display as the label */
+    label: string;
+}
+/**
+ * Form control label that can render a label, an icon and description text
+ *
+ * @param {MrlLabelWithDescriptionProps} props - the component props
+ * @returns a form control label with description
+ */
+export declare function MrlLabelWithDescription({ className, description, descriptionId, isDisabled, isIndeterminate, isSelected, hasMultilineLabel, htmlFor, icon, label, ...rest }: MrlLabelWithDescriptionProps): JSX.Element;
+export {};

package/dist/types/components/form/label/MrlLabelWithDescription/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlLabelWithDescription';

package/dist/types/components/form/legacy-select/MrlLegacySelect/MrlLegacySelect.d.ts

@@ -0,0 +1,58 @@
+import * as React from 'react';
+import { SelectStates, InputKinds, InputSizes } from '../../constants';
+import { AttrsObject } from '../../../../utils';
+export interface MrlLegacySelectProptypes extends React.HTMLAttributes<HTMLDivElement> {
+    /** Additional function to be run when the value of the select changes */
+    hookChange?: (newValue?: string) => void | undefined;
+    /** State of the select element based on user actions or permissions */
+    state?: SelectStates;
+    /**
+     * By default, we will select the first item in the list.
+     * To select a different option by default, pass that item’s value as the defaultValue to the mrlSelect element.
+     */
+    defaultValue?: string;
+    /**
+     * Because this is a custom element, we can't use a standard "for" attribute setup. The label
+     * element needs to have an id and then we reference via the select with aria
+     */
+    labelId: string;
+    /**
+     * Changes the visual style of the select trigger; Use 'inline when your select is inline
+     * with other content
+     */
+    kind?: InputKinds;
+    /**
+     * Changes the visual size of the select trigger; Currently only supported when kind="inline"
+     */
+    size?: InputSizes;
+    /**
+     * Applies additional HTML attributes to the `mrl-select` element after the
+     * hydration process. It is recommended only to use when overwriting an attribute
+     * assigned internally by the design system.
+     * When using in a framework wrapper (e.g., React), treat it as an object and don't stringify.
+     * Otherwise, the value object needs to be stringified to not receive `"[Object object]"`.
+     * Example: `attrs='{ "tabindex": "1" }'`
+     */
+    attrs?: AttrsObject;
+    /**
+     * menu - list of options for the user to chose from; expects an `MrlLegacySelectMenu` component
+     */
+    children?: React.ReactNode;
+    /**
+     * optional id - we will generate a unique one if it isn't given.
+     * ID will be decorated with `${id}-mrl-select` to not conflict with aria controls.
+     */
+    id?: string;
+    /**
+     * optional value - control which item is selected by passing an `MrlLegacySelectItem` value (overrides `defaultValue`)
+     * Can be used in conjunction with `hookChange` to create a controlled component.
+     */
+    value?: string;
+}
+/**
+ * Creates and exports component class for Mural Select
+ *
+ * @param {MrlLegacySelectProptypes} props the props for your MrlLink
+ * @returns {React.ReactElement} an a element containing the text you pass
+ */
+export declare const MrlLegacySelect: ({ attrs, children, kind, labelId, size, ...theRest }: MrlLegacySelectProptypes) => React.ReactElement;

package/dist/types/components/form/legacy-select/MrlLegacySelect/index.d.ts

@@ -0,0 +1 @@
+export { MrlLegacySelect, type MrlLegacySelectProptypes } from './MrlLegacySelect';

package/dist/types/components/form/legacy-select/MrlLegacySelectItem/MrlLegacySelectItem.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { AttrsObject } from '../../../../utils';
+export interface MrlLegacySelectItemProptypes extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * value of the select item that is stored as the selected value of the select input
+     */
+    value: string;
+    /**
+     * index of the select item starting at 0
+     */
+    index?: number;
+    /**
+     * Applies additional HTML attributes to the `mrl-select-item` element after the
+     * hydration process. It is recommended only to use when overwriting an attribute
+     * assigned internally by the design system.
+     * When using in a framework wrapper (e.g., React), treat it as an object and don't stringify.
+     * Otherwise, the value object needs to be stringified to not receive `"[Object object]"`.
+     * Example: `attrs='{ "aria-disabled": "true" }'`
+     */
+    attrs?: AttrsObject;
+    /**
+     * Set the item to disabled, this will prevent click and enter events.
+     */
+    isDisabled?: boolean;
+    /**
+     * content for the item
+     */
+    children: React.ReactNode;
+}
+/**
+ * Renders a select component
+ *
+ * @param {MrlLegacySelectItemProptypes} props the props for your MrlLink
+ * @returns {React.ReactElement} an a element containing the text you pass
+ */
+export declare const MrlLegacySelectItem: ({ attrs, children, index, value, isDisabled, ...theRest }: MrlLegacySelectItemProptypes) => React.ReactElement;

package/dist/types/components/form/legacy-select/MrlLegacySelectItem/index.d.ts

@@ -0,0 +1 @@
+export { MrlLegacySelectItem } from './MrlLegacySelectItem';

package/dist/types/components/form/legacy-select/MrlLegacySelectMenu/MrlLegacySelectMenu.d.ts

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { ReactElement } from 'react';
+import { SelectMenuPositions } from '../../constants';
+import { AttrsObject } from '../../../../utils';
+export interface MrlLegacySelectMenuProptypes extends React.HTMLAttributes<HTMLDivElement> {
+    /** The placement of the menu in relation to its trigger */
+    position?: SelectMenuPositions;
+    /** Current value of the select input */
+    value?: string;
+    /**
+     * Allows the select component to pass through which item should be focused;
+     * Set it to the index of the focused item
+     */
+    focused?: number;
+    /**
+     * Applies additional HTML attributes to the `mrl-select-menu` elements
+     * It is recommended only to use when overwriting an attribute
+     * assigned internally by the design system.
+     * When using in a framework wrapper (e.g., React), treat it as an object and don't stringify.
+     * Otherwise, the value object needs to be stringified to not receive `"[Object object]"`.
+     * Example: `attrs='{ "tabindex": "0" }'`
+     */
+    attrs?: AttrsObject;
+    /**
+     * menu - list of options for the user to chose from; expects an `MrlLegacySelectMenu` component
+     */
+    children?: React.ReactNode;
+    /**
+     * label element needs to have an id and then we reference via the select with aria
+     */
+    labelId: string;
+}
+/**
+ * Creating and exporting component class for Mural Select Menu
+ * Note, this component doesn't doesn't handle any functionality
+ * For accessibility and keyboard support, all functionality is
+ * controlled by the wrapping mrl-select but we need this component
+ * within our HTML structure for valid aria usage.
+ *
+ * @param {MrlLegacySelectMenuProptypes} props MrlLegacySelectMenuProptypes
+ * @returns {React.ReactElement} returns a MrlLegacySelectMenu
+ */
+export declare const MrlLegacySelectMenu: ({ attrs, children, labelId, position, ...theRest }: MrlLegacySelectMenuProptypes) => React.ReactElement;

package/dist/types/components/form/legacy-select/MrlLegacySelectMenu/index.d.ts

@@ -0,0 +1 @@
+export { MrlLegacySelectMenu } from './MrlLegacySelectMenu';

package/dist/types/components/form/legacy-select/context/SelectContext.d.ts

@@ -0,0 +1,68 @@
+import * as React from 'react';
+import { SelectStates } from '../../constants';
+type Action = {
+    type: 'open';
+} | {
+    type: 'close';
+    payload: 'mouse' | 'keyboard' | undefined;
+} | {
+    type: 'focus';
+    payload: number;
+} | {
+    type: 'default';
+} | {
+    type: 'defaultValue';
+    payload: string;
+} | {
+    type: 'disabled';
+} | {
+    type: 'read-only';
+} | {
+    type: 'select';
+    payload: string;
+} | {
+    type: 'selectedText';
+    payload: React.ReactNode;
+} | {
+    type: 'controlledValue';
+    payload: string;
+};
+type Dispatch = (action: Action) => void;
+type State = {
+    actionType?: 'mouse' | 'keyboard';
+    open: boolean;
+    focus: boolean;
+    defaultValue?: string;
+    disabled: boolean;
+    focusIndex?: number;
+    readOnly: boolean;
+    selectedItem?: string;
+    selectedText?: React.ReactNode;
+    id?: string;
+    controlledValue?: string;
+};
+type SelectProviderProps = {
+    children: React.ReactNode;
+    hookChange?: (newValue?: string) => void | undefined;
+    id?: string;
+    selectState?: SelectStates;
+    defaultValue?: string;
+    value?: string;
+};
+/**
+ * Select provider
+ *
+ * @param {SelectProviderProps} props SelectProvider props
+ * @returns {React.ReactElement} returns a booted select provider.
+ */
+declare function SelectProvider({ children, hookChange, id, defaultValue, selectState, value }: SelectProviderProps): React.ReactElement;
+/**
+ * useSelect hook
+ *
+ * @returns returns hook for the select provider.
+ */
+declare function useSelect(): {
+    state: State;
+    dispatch: Dispatch;
+};
+export { SelectProvider, useSelect };

package/dist/types/components/form/legacy-select/index.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { MrlLegacySelectProptypes } from './MrlLegacySelect';
+/**
+ * Creates and exports component class for Mural Select
+ *
+ * @param {MrlLegacySelectProptypes} props MrlLegacySelectProptypes
+ * @returns {React.ReactElement} returns a MrlLegacySelect wrapped in a select provider.
+ */
+export declare const MrlLegacySelect: ({ hookChange, id, defaultValue, state, children, value, ...rest }: MrlLegacySelectProptypes) => React.ReactElement;

package/dist/types/components/form/legacy-select/stories.data.d.ts

@@ -0,0 +1 @@
+export declare const countries: string[];

package/dist/types/components/form/radio/MrlRadioButton/MrlRadioButton.d.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { StaticIconConfig } from '../../constants';
+interface MrlRadioButtonProps extends React.ComponentPropsWithoutRef<'input'> {
+    /** Additional class to add to the container element */
+    className?: string;
+    /** Adjusts the styles of the label, icon and description when the label is multiline */
+    hasMultilineLabel?: boolean;
+    /** The text to display as the radio button's label */
+    label: string;
+    /** The radio button's name that will group it with others in a radio group */
+    name: string;
+    /** The radio button's value */
+    value: string;
+    /** Indicates if the radio button is disabled */
+    disabled?: boolean;
+    /** Indicates if the radio button has an error */
+    hasError?: boolean;
+    /** Leading label icon */
+    icon?: StaticIconConfig;
+    /** Styles applied to the container element */
+    style?: React.CSSProperties;
+    /**
+     * Description, additional context text for the user.
+     * It can be a string or a React component for custom render.
+     * When using a React component it's necessary to add an id to the custom element and
+     * pass it to the MrlRadioButton through "aria-describedby" to make it accessible
+     * to screen readers.
+     * Custom description should also implement the disabled state styles
+     * for text when the input is disabled or set color: inherit.
+     *
+     * @example
+     * <MrlRadioButton aria-describedby={customId} description={
+     *   <p id={customId}>description</p>
+     * }>
+     */
+    description?: string | React.ReactNode;
+    /** Data attribute for QA testing */
+    ['data-qa']?: string;
+}
+/**
+ * Form element with an associated text label and description that allows the user to select one
+ * option from a provided list
+ *
+ * @param {MrlRadioButtonProps} props - the component props
+ * @returns an input with type "radio" with an associated label
+ */
+export declare function MrlRadioButton({ className, description, hasMultilineLabel, name, value, icon, disabled, hasError, label, style, ...rest }: MrlRadioButtonProps): JSX.Element;
+export {};

package/dist/types/components/form/radio/MrlRadioButton/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlRadioButton';

package/dist/types/components/form/radio/MrlRadioButtonStandalone/MrlRadioButtonStandalone.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import './MrlRadioButtonStandalone.global.scss';
+interface MrlRadioButtonStandaloneProps extends React.ComponentPropsWithoutRef<'input'> {
+    /** The radio button's name that will group it with others in a radio group */
+    name: string;
+    /** The radio button's value */
+    value: string;
+    /** A ref to the input element */
+    ref?: React.Ref<HTMLInputElement>;
+    /** Indicates if the radio button is disabled */
+    disabled?: boolean;
+    /** Indicates if the radio button has an error */
+    hasError?: boolean;
+    /** Additional class to add to the label */
+    className?: string;
+}
+/**
+ * Input that allows the user to select one options from a provided radio group.
+ * Note, this component does not provide out of the box accessibility for ensuring
+ * an associated label and must be manually setup during adoption.
+ *
+ * @param {MrlRadioButtonStandaloneProps} props - the component props
+ * @returns an input element with type="radio"
+ */
+export declare function MrlRadioButtonStandalone({ className, disabled, hasError, id, name, ref, value, ...rest }: MrlRadioButtonStandaloneProps): JSX.Element;
+export {};

package/dist/types/components/form/radio/MrlRadioButtonStandalone/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlRadioButtonStandalone';

package/dist/types/components/form/radio/MrlRadioGroup/MrlRadioGroup.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+interface MrlRadioGroupProps extends React.ComponentPropsWithoutRef<'fieldset'> {
+    /** List of radio buttons */
+    children: React.ReactNode;
+    /** Additional class to add to the fieldset element */
+    className?: string;
+    /** The radio group label, text for the fieldset's legend  */
+    label: string;
+    /**
+     * Adds the "aria-required" and "aria-invalid" attributes to the fieldset
+     * element to announce the error state to screen readers
+     */
+    hasError?: boolean;
+}
+/**
+ * Radio button group that allows the user to select one option from a provided list
+ * @param {MrlRadioGroupProps} props - the component props
+ * @returns a radio group
+ */
+export declare function MrlRadioGroup({ className, children, label, hasError, ...rest }: MrlRadioGroupProps): JSX.Element;
+export {};

package/dist/types/components/form/radio/MrlRadioGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlRadioGroup';

package/dist/types/components/form/select/MrlCreatableSelect/MrlCreatableSelect.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { CreatableProps } from 'react-select/creatable';
+import { GroupBase } from 'react-select';
+import { SelectKind } from '../types';
+export interface MrlCreatableSelectProps<Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> extends CreatableProps<Option, IsMulti, Group> {
+    hasError?: boolean;
+    isReadOnly?: boolean;
+    kind?: SelectKind;
+    /**
+     * The data-qa prefix, it will be used to add data-qa attributes to different sub components of the MrlCreatableSelect component.
+     *
+     * Available subcomponents:
+     * - container, <data-qa-prefix>-container
+     * - value-container, <data-qa-prefix>-value-container
+     */
+    ['data-qa']?: string;
+    showClearIndicatorIcon?: boolean;
+}
+export declare const CREATABLE_SELECT_CLASS_NAME_PREFIX = "MrlCreatableSelect";
+export declare const CREATABLE_SELECT_MENU_LIST_CLASS_NAME: string;
+/**
+ * MrlCreatableSelect component that supports creating extra options with user input. Option creating could be async too.
+ * @param props - the component props
+ * @returns the select component
+ */
+export declare function MrlCreatableSelect<T>(props: MrlCreatableSelectProps<T>): JSX.Element;

package/dist/types/components/form/select/MrlCreatableSelect/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlCreatableSelect';

package/dist/types/components/form/select/MrlMultiCreatableSelect/MrlMultiCreatableSelect.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { CreatableProps } from 'react-select/creatable';
+import { GroupBase } from 'react-select';
+import { DefaultOption, SelectKind } from '../types';
+export interface MrlMultiCreatableSelectProps<Option, IsMulti extends boolean = true, Group extends GroupBase<Option> = GroupBase<Option>> extends CreatableProps<Option, IsMulti, Group> {
+    hasError?: boolean;
+    isReadOnly?: boolean;
+    kind?: SelectKind;
+    /**
+     * The data-qa prefix, it will be used to add data-qa attributes to different sub components of the MrlMultiCreatableSelect component.
+     *
+     * Available subcomponents:
+     * - container, <data-qa-prefix>-container
+     * - value-container, <data-qa-prefix>-value-container
+     */
+    ['data-qa']?: string;
+    showClearIndicatorIcon?: boolean;
+}
+export declare const MULTI_CREATABLE_SELECT_CLASS_NAME_PREFIX = "MrlMultiCreatableSelect";
+export declare const MULTI_CREATABLE_SELECT_MENU_LIST_CLASS_NAME: string;
+/**
+ * MrlMultiCreatableSelect component that supports creating extra options with user input. Option creating could be async too.
+ * @param props - the component props
+ * @returns the select component
+ */
+export declare function MrlMultiCreatableSelect<T extends DefaultOption, IsMulti extends boolean = true, Group extends GroupBase<T> = GroupBase<T>>(props: MrlMultiCreatableSelectProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/MrlMultiCreatableSelect/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlMultiCreatableSelect';

package/dist/types/components/form/select/MrlMultiSelect/MrlMultiSelect.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { GroupBase, Props } from 'react-select';
+import { DefaultOption, SelectKind } from '../types';
+export interface MrlMultiSelectProps<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>> extends Omit<Props<T, IsMulti, Group>, 'isMulti' | 'hideSelectedOptions'> {
+    hasError?: boolean;
+    isReadOnly?: boolean;
+    kind?: SelectKind;
+    /**
+     * The data-qa prefix, it will be used to add data-qa attributes to different sub components of the MrlMultiSelect component.
+     *
+     * Available subcomponents:
+     * - container, <data-qa-prefix>-container
+     * - value-container, <data-qa-prefix>-value-container
+     */
+    ['data-qa']?: string;
+}
+export declare const MULTI_SELECT_CLASS_NAME_PREFIX = "MrlMultiSelect";
+export declare const MULTI_SELECT_MENU_LIST_CLASS_NAME: string;
+/**
+ * MrlSelect component
+ * @param props - the component props
+ * @returns the select component
+ */
+export declare function MrlMultiSelect<T extends DefaultOption, IsMulti extends boolean, Group extends GroupBase<T> = GroupBase<T>>(props: MrlMultiSelectProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/MrlMultiSelect/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlMultiSelect';

package/dist/types/components/form/select/MrlSelect/MrlSelect.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { GroupBase, Props } from 'react-select';
+import { SelectKind } from '../types';
+export interface MrlSelectProps<Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> extends Props<Option, IsMulti, Group> {
+    hasError?: boolean;
+    isReadOnly?: boolean;
+    kind?: SelectKind;
+    /**
+     * The data-qa prefix, it will be used to add data-qa attributes to different sub components of the MrlSelect component.
+     *
+     * Available subcomponents:
+     * - container, <data-qa-prefix>-container
+     * - value-container, <data-qa-prefix>-value-container
+     */
+    ['data-qa']?: string;
+}
+export declare const SELECT_CLASS_NAME_PREFIX = "MrlSelect";
+export declare const SELECT_MENU_LIST_CLASS_NAME: string;
+/**
+ * MrlSelect component
+ * @param props - the component props
+ * @returns the select component
+ */
+export declare function MrlSelect<T>(props: MrlSelectProps<T>): JSX.Element;

package/dist/types/components/form/select/MrlSelect/index.d.ts

@@ -0,0 +1 @@
+export * from './MrlSelect';

package/dist/types/components/form/select/components/MrlSelectClearIndicator.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ClearIndicatorProps, GroupBase } from 'react-select';
+/**
+ * MrlSelectClearIndicator component
+ * @param props the react-select clear indicator props
+ * @returns the select clear indicator
+ */
+export declare function MrlSelectClearIndicator<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: ClearIndicatorProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/components/MrlSelectContainer.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { GroupBase, ContainerProps } from 'react-select';
+/**
+ * MrlSelectContainer component
+ *
+ * @param props - the react-select container props
+ * @returns a select container
+ */
+export declare function MrlSelectContainer<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: ContainerProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/components/MrlSelectDropdownIndicator.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { DropdownIndicatorProps, GroupBase } from 'react-select';
+/**
+ * MrlSelectDropdownIndicator component
+ *
+ * @param props - the react-select dropdown indicator props
+ * @returns the select dropdown indicator
+ */
+export declare function MrlSelectDropdownIndicator<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: DropdownIndicatorProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/components/MrlSelectMultiValue.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { GroupBase, MultiValueProps } from 'react-select';
+import { DefaultOption } from '../types';
+/**
+ * MrlSelectMultiValue component
+ *
+ * @param props - the react-select multi value props
+ * @returns a multi value component
+ */
+export declare function MrlSelectMultiValue<T extends DefaultOption, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: MultiValueProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/components/MrlSelectMultiValueRemove.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { GroupBase, MultiValueRemoveProps } from 'react-select';
+/**
+ * MrlSelectMultiValueRemove component
+ *
+ * @param props - the react-select multi value remove props
+ * @returns a multi value remove component
+ */
+export declare function MrlSelectMultiValueRemove<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: MultiValueRemoveProps<T, IsMulti, Group>): JSX.Element;

package/dist/types/components/form/select/components/MrlSelectOption.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { GroupBase, OptionProps } from 'react-select';
+/**
+ * MrlSelectOption component
+ *
+ * @param props - the react-select option props
+ * @returns a select option
+ */
+export declare function MrlSelectOption<T, IsMulti extends boolean = false, Group extends GroupBase<T> = GroupBase<T>>(props: OptionProps<T, IsMulti, Group>): JSX.Element;