@mantine/core 9.3.2 → 9.4.1

package/lib/components/ComboboxPopover/ComboboxPopover.types.d.ts

@@ -0,0 +1,2 @@
+import { Primitive } from '../../core';
+export type ComboboxPopoverValue<Multiple extends boolean, Value extends Primitive = string> = Multiple extends true ? Value[] : Value | null;

package/lib/components/ComboboxPopover/ComboboxPopoverTarget.d.ts

@@ -0,0 +1,16 @@
+import { Factory } from '../../core';
+export interface ComboboxPopoverTargetProps {
+    children: React.ReactNode;
+    /** Key of the prop that is used to access element ref @default 'ref' */
+    refProp?: string;
+}
+export type ComboboxPopoverTargetFactory = Factory<{
+    props: ComboboxPopoverTargetProps;
+    ref: HTMLElement;
+    compound: true;
+}>;
+export declare const ComboboxPopoverTarget: import("../..").MantineComponent<{
+    props: ComboboxPopoverTargetProps;
+    ref: HTMLElement;
+    compound: true;
+}>;

package/lib/components/ComboboxPopover/index.d.ts

@@ -0,0 +1,14 @@
+import type { ComboboxPopoverFactory, ComboboxPopoverProps, ComboboxPopoverStylesNames } from './ComboboxPopover';
+import type { ComboboxPopoverValue } from './ComboboxPopover.types';
+import type { ComboboxPopoverTargetProps } from './ComboboxPopoverTarget';
+export { ComboboxPopover } from './ComboboxPopover';
+export { ComboboxPopoverTarget } from './ComboboxPopoverTarget';
+export type { ComboboxPopoverProps, ComboboxPopoverStylesNames, ComboboxPopoverFactory, ComboboxPopoverTargetProps, ComboboxPopoverValue, };
+export declare namespace ComboboxPopover {
+    type Props = ComboboxPopoverProps;
+    type StylesNames = ComboboxPopoverStylesNames;
+    type Factory = ComboboxPopoverFactory;
+    namespace Target {
+        type Props = ComboboxPopoverTargetProps;
+    }
+}

package/lib/components/DataList/DataList.context.d.ts

@@ -0,0 +1,6 @@
+import { GetStylesApi } from '../../core';
+import type { DataListFactory } from './DataList';
+export interface DataListContextValue {
+    getStyles: GetStylesApi<DataListFactory>;
+}
+export declare const DataListProvider: import("react").Context<DataListContextValue | null>, useDataListContext: () => DataListContextValue;

package/lib/components/DataList/DataList.d.ts

@@ -0,0 +1,44 @@
+import { BoxProps, ElementProps, Factory, MantineSize, MantineSpacing, StylesApiProps } from '../../core';
+import { DataListItem, DataListItemStylesNames } from './DataListItem/DataListItem';
+import { DataListItemLabel, DataListItemLabelStylesNames } from './DataListItemLabel/DataListItemLabel';
+import { DataListItemValue, DataListItemValueStylesNames } from './DataListItemValue/DataListItemValue';
+export type DataListStylesNames = 'root' | DataListItemStylesNames | DataListItemLabelStylesNames | DataListItemValueStylesNames;
+export type DataListCssVariables = {
+    root: '--data-list-fz' | '--data-list-lh' | '--data-list-gap' | '--data-list-label-width';
+};
+export interface DataListProps extends BoxProps, StylesApiProps<DataListFactory>, ElementProps<'dl'> {
+    /** DataList.Item components */
+    children?: React.ReactNode;
+    /** Controls `font-size` and `line-height` @default 'sm' */
+    size?: MantineSize;
+    /** Key of `theme.spacing` or any valid CSS value to set gap between items @default 'sm' */
+    gap?: MantineSpacing;
+    /** Controls arrangement of label and value within each item. `horizontal` renders label and value side by side, `vertical` stacks label on top of value @default 'horizontal' */
+    orientation?: 'horizontal' | 'vertical';
+    /** Adds border between items @default false */
+    withDivider?: boolean;
+    /** Controls min-width of the label (dt) element, any valid CSS value @default '120px' */
+    labelWidth?: React.CSSProperties['minWidth'];
+}
+export type DataListFactory = Factory<{
+    props: DataListProps;
+    ref: HTMLDListElement;
+    stylesNames: DataListStylesNames;
+    vars: DataListCssVariables;
+    staticComponents: {
+        Item: typeof DataListItem;
+        ItemLabel: typeof DataListItemLabel;
+        ItemValue: typeof DataListItemValue;
+    };
+}>;
+export declare const DataList: import("../..").MantineComponent<{
+    props: DataListProps;
+    ref: HTMLDListElement;
+    stylesNames: DataListStylesNames;
+    vars: DataListCssVariables;
+    staticComponents: {
+        Item: typeof DataListItem;
+        ItemLabel: typeof DataListItemLabel;
+        ItemValue: typeof DataListItemValue;
+    };
+}>;

package/lib/components/DataList/DataListItem/DataListItem.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type DataListItemStylesNames = 'item';
+export interface DataListItemProps extends BoxProps, CompoundStylesApiProps<DataListItemFactory>, ElementProps<'div'> {
+    /** Item content */
+    children?: React.ReactNode;
+}
+export type DataListItemFactory = Factory<{
+    props: DataListItemProps;
+    ref: HTMLDivElement;
+    stylesNames: DataListItemStylesNames;
+    compound: true;
+}>;
+export declare const DataListItem: import("../../..").MantineComponent<{
+    props: DataListItemProps;
+    ref: HTMLDivElement;
+    stylesNames: DataListItemStylesNames;
+    compound: true;
+}>;

package/lib/components/DataList/DataListItemLabel/DataListItemLabel.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type DataListItemLabelStylesNames = 'itemLabel';
+export interface DataListItemLabelProps extends BoxProps, CompoundStylesApiProps<DataListItemLabelFactory>, ElementProps<'dt'> {
+    /** Label content */
+    children?: React.ReactNode;
+}
+export type DataListItemLabelFactory = Factory<{
+    props: DataListItemLabelProps;
+    ref: HTMLElement;
+    stylesNames: DataListItemLabelStylesNames;
+    compound: true;
+}>;
+export declare const DataListItemLabel: import("../../..").MantineComponent<{
+    props: DataListItemLabelProps;
+    ref: HTMLElement;
+    stylesNames: DataListItemLabelStylesNames;
+    compound: true;
+}>;

package/lib/components/DataList/DataListItemValue/DataListItemValue.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type DataListItemValueStylesNames = 'itemValue';
+export interface DataListItemValueProps extends BoxProps, CompoundStylesApiProps<DataListItemValueFactory>, ElementProps<'dd'> {
+    /** Value content */
+    children?: React.ReactNode;
+}
+export type DataListItemValueFactory = Factory<{
+    props: DataListItemValueProps;
+    ref: HTMLElement;
+    stylesNames: DataListItemValueStylesNames;
+    compound: true;
+}>;
+export declare const DataListItemValue: import("../../..").MantineComponent<{
+    props: DataListItemValueProps;
+    ref: HTMLElement;
+    stylesNames: DataListItemValueStylesNames;
+    compound: true;
+}>;

package/lib/components/DataList/index.d.ts

@@ -0,0 +1,32 @@
+import type { DataListCssVariables, DataListFactory, DataListProps, DataListStylesNames } from './DataList';
+import type { DataListContextValue } from './DataList.context';
+import type { DataListItemFactory, DataListItemProps, DataListItemStylesNames } from './DataListItem/DataListItem';
+import type { DataListItemLabelFactory, DataListItemLabelProps, DataListItemLabelStylesNames } from './DataListItemLabel/DataListItemLabel';
+import type { DataListItemValueFactory, DataListItemValueProps, DataListItemValueStylesNames } from './DataListItemValue/DataListItemValue';
+export { DataList } from './DataList';
+export { DataListItem } from './DataListItem/DataListItem';
+export { DataListItemLabel } from './DataListItemLabel/DataListItemLabel';
+export { DataListItemValue } from './DataListItemValue/DataListItemValue';
+export { useDataListContext } from './DataList.context';
+export type { DataListProps, DataListStylesNames, DataListCssVariables, DataListFactory, DataListItemProps, DataListItemStylesNames, DataListItemFactory, DataListItemLabelProps, DataListItemLabelStylesNames, DataListItemLabelFactory, DataListItemValueProps, DataListItemValueStylesNames, DataListItemValueFactory, DataListContextValue, };
+export declare namespace DataList {
+    type Props = DataListProps;
+    type StylesNames = DataListStylesNames;
+    type CssVariables = DataListCssVariables;
+    type Factory = DataListFactory;
+    namespace Item {
+        type Props = DataListItemProps;
+        type StylesNames = DataListItemStylesNames;
+        type Factory = DataListItemFactory;
+    }
+    namespace ItemLabel {
+        type Props = DataListItemLabelProps;
+        type StylesNames = DataListItemLabelStylesNames;
+        type Factory = DataListItemLabelFactory;
+    }
+    namespace ItemValue {
+        type Props = DataListItemValueProps;
+        type StylesNames = DataListItemValueStylesNames;
+        type Factory = DataListItemValueFactory;
+    }
+}

package/lib/components/EmptyState/EmptyState.context.d.ts

@@ -0,0 +1,8 @@
+import { GetStylesApi } from '../../core';
+import type { EmptyStateFactory } from './EmptyState';
+interface EmptyStateContextValue {
+    getStyles: GetStylesApi<EmptyStateFactory>;
+    withIndicatorBackground: boolean | undefined;
+}
+export declare const EmptyStateProvider: import("react").Context<EmptyStateContextValue | null>, useEmptyStateContext: () => EmptyStateContextValue;
+export type { EmptyStateContextValue };

package/lib/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,83 @@
+import { BoxProps, ElementProps, Factory, MantineColor, MantineSize, StylesApiProps } from '../../core';
+import { EmptyStateActions, EmptyStateActionsFactory, EmptyStateActionsProps, EmptyStateActionsStylesNames } from './EmptyStateActions/EmptyStateActions';
+import { EmptyStateDescription, EmptyStateDescriptionFactory, EmptyStateDescriptionProps, EmptyStateDescriptionStylesNames } from './EmptyStateDescription/EmptyStateDescription';
+import { EmptyStateIndicator, EmptyStateIndicatorFactory, EmptyStateIndicatorProps, EmptyStateIndicatorStylesNames } from './EmptyStateIndicator/EmptyStateIndicator';
+import { EmptyStateTitle, EmptyStateTitleFactory, EmptyStateTitleProps, EmptyStateTitleStylesNames } from './EmptyStateTitle/EmptyStateTitle';
+export type EmptyStateStylesNames = 'root' | 'body' | EmptyStateIndicatorStylesNames | EmptyStateTitleStylesNames | EmptyStateDescriptionStylesNames | EmptyStateActionsStylesNames;
+export type EmptyStateVariant = 'filled' | 'light';
+export type EmptyStateCssVariables = {
+    root: '--empty-state-indicator-size' | '--empty-state-gap' | '--empty-state-title-fz' | '--empty-state-description-fz' | '--empty-state-indicator-bg' | '--empty-state-indicator-color';
+};
+export interface EmptyStateProps extends BoxProps, StylesApiProps<EmptyStateFactory>, ElementProps<'div', 'title'> {
+    /** Controls indicator size, gap between elements and font sizes of title and description @default 'md' */
+    size?: MantineSize;
+    /** Content alignment. `center` stacks the content in a centered column, `left`/`right` place the indicator on the side with the content next to it @default 'center' */
+    align?: 'left' | 'center' | 'right';
+    /** Controls the indicator appearance. `filled` and `light` display a colored circular background behind the icon. If not set, the icon is displayed with dimmed color */
+    variant?: EmptyStateVariant;
+    /** Key of `theme.colors` or any valid CSS color, used by `filled` and `light` variants @default theme.primaryColor */
+    color?: MantineColor;
+    /** Title content, rendered inside `EmptyState.Title` */
+    title?: React.ReactNode;
+    /** Description content, rendered inside `EmptyState.Description` */
+    description?: React.ReactNode;
+    /** Icon or illustration, rendered inside `EmptyState.Indicator` */
+    icon?: React.ReactNode;
+    /** If set, a neutral circular background is displayed behind the indicator. Setting `variant` always displays a colored background regardless of this prop @default false */
+    withIndicatorBackground?: boolean;
+    /** `EmptyState` compound components, rendered after the shorthand props content */
+    children?: React.ReactNode;
+}
+export type EmptyStateFactory = Factory<{
+    props: EmptyStateProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateStylesNames;
+    vars: EmptyStateCssVariables;
+    variant: EmptyStateVariant;
+    staticComponents: {
+        Indicator: typeof EmptyStateIndicator;
+        Title: typeof EmptyStateTitle;
+        Description: typeof EmptyStateDescription;
+        Actions: typeof EmptyStateActions;
+    };
+}>;
+export declare const EmptyState: import("../..").MantineComponent<{
+    props: EmptyStateProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateStylesNames;
+    vars: EmptyStateCssVariables;
+    variant: EmptyStateVariant;
+    staticComponents: {
+        Indicator: typeof EmptyStateIndicator;
+        Title: typeof EmptyStateTitle;
+        Description: typeof EmptyStateDescription;
+        Actions: typeof EmptyStateActions;
+    };
+}>;
+export declare namespace EmptyState {
+    type Props = EmptyStateProps;
+    type StylesNames = EmptyStateStylesNames;
+    type CssVariables = EmptyStateCssVariables;
+    type Variant = EmptyStateVariant;
+    type Factory = EmptyStateFactory;
+    namespace Indicator {
+        type Props = EmptyStateIndicatorProps;
+        type StylesNames = EmptyStateIndicatorStylesNames;
+        type Factory = EmptyStateIndicatorFactory;
+    }
+    namespace Title {
+        type Props = EmptyStateTitleProps;
+        type StylesNames = EmptyStateTitleStylesNames;
+        type Factory = EmptyStateTitleFactory;
+    }
+    namespace Description {
+        type Props = EmptyStateDescriptionProps;
+        type StylesNames = EmptyStateDescriptionStylesNames;
+        type Factory = EmptyStateDescriptionFactory;
+    }
+    namespace Actions {
+        type Props = EmptyStateActionsProps;
+        type StylesNames = EmptyStateActionsStylesNames;
+        type Factory = EmptyStateActionsFactory;
+    }
+}

package/lib/components/EmptyState/EmptyStateActions/EmptyStateActions.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type EmptyStateActionsStylesNames = 'actions';
+export interface EmptyStateActionsProps extends BoxProps, CompoundStylesApiProps<EmptyStateActionsFactory>, ElementProps<'div'> {
+    /** Action buttons or controls */
+    children?: React.ReactNode;
+}
+export type EmptyStateActionsFactory = Factory<{
+    props: EmptyStateActionsProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateActionsStylesNames;
+    compound: true;
+}>;
+export declare const EmptyStateActions: import("../../..").MantineComponent<{
+    props: EmptyStateActionsProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateActionsStylesNames;
+    compound: true;
+}>;

package/lib/components/EmptyState/EmptyStateDescription/EmptyStateDescription.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type EmptyStateDescriptionStylesNames = 'description';
+export interface EmptyStateDescriptionProps extends BoxProps, CompoundStylesApiProps<EmptyStateDescriptionFactory>, ElementProps<'p'> {
+    /** Description content */
+    children?: React.ReactNode;
+}
+export type EmptyStateDescriptionFactory = Factory<{
+    props: EmptyStateDescriptionProps;
+    ref: HTMLParagraphElement;
+    stylesNames: EmptyStateDescriptionStylesNames;
+    compound: true;
+}>;
+export declare const EmptyStateDescription: import("../../..").MantineComponent<{
+    props: EmptyStateDescriptionProps;
+    ref: HTMLParagraphElement;
+    stylesNames: EmptyStateDescriptionStylesNames;
+    compound: true;
+}>;

package/lib/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.d.ts

@@ -0,0 +1,18 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type EmptyStateIndicatorStylesNames = 'indicator';
+export interface EmptyStateIndicatorProps extends BoxProps, CompoundStylesApiProps<EmptyStateIndicatorFactory>, ElementProps<'div'> {
+    /** Icon or illustration displayed inside the indicator */
+    children?: React.ReactNode;
+}
+export type EmptyStateIndicatorFactory = Factory<{
+    props: EmptyStateIndicatorProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateIndicatorStylesNames;
+    compound: true;
+}>;
+export declare const EmptyStateIndicator: import("../../..").MantineComponent<{
+    props: EmptyStateIndicatorProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateIndicatorStylesNames;
+    compound: true;
+}>;

package/lib/components/EmptyState/EmptyStateTitle/EmptyStateTitle.d.ts

@@ -0,0 +1,20 @@
+import { BoxProps, CompoundStylesApiProps, ElementProps, Factory } from '../../../core';
+export type EmptyStateTitleStylesNames = 'title';
+export interface EmptyStateTitleProps extends BoxProps, CompoundStylesApiProps<EmptyStateTitleFactory>, ElementProps<'div'> {
+    /** Title content */
+    children?: React.ReactNode;
+    /** Heading order, renders the title as `h1`–`h6` element. By default, the title is rendered as a `div` without semantic heading level */
+    order?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+export type EmptyStateTitleFactory = Factory<{
+    props: EmptyStateTitleProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateTitleStylesNames;
+    compound: true;
+}>;
+export declare const EmptyStateTitle: import("../../..").MantineComponent<{
+    props: EmptyStateTitleProps;
+    ref: HTMLDivElement;
+    stylesNames: EmptyStateTitleStylesNames;
+    compound: true;
+}>;

package/lib/components/EmptyState/index.d.ts

@@ -0,0 +1,13 @@
+import type { EmptyStateCssVariables, EmptyStateFactory, EmptyStateProps, EmptyStateStylesNames, EmptyStateVariant } from './EmptyState';
+import type { EmptyStateContextValue } from './EmptyState.context';
+import type { EmptyStateActionsFactory, EmptyStateActionsProps, EmptyStateActionsStylesNames } from './EmptyStateActions/EmptyStateActions';
+import type { EmptyStateDescriptionFactory, EmptyStateDescriptionProps, EmptyStateDescriptionStylesNames } from './EmptyStateDescription/EmptyStateDescription';
+import type { EmptyStateIndicatorFactory, EmptyStateIndicatorProps, EmptyStateIndicatorStylesNames } from './EmptyStateIndicator/EmptyStateIndicator';
+import type { EmptyStateTitleFactory, EmptyStateTitleProps, EmptyStateTitleStylesNames } from './EmptyStateTitle/EmptyStateTitle';
+export { EmptyState } from './EmptyState';
+export { EmptyStateIndicator } from './EmptyStateIndicator/EmptyStateIndicator';
+export { EmptyStateTitle } from './EmptyStateTitle/EmptyStateTitle';
+export { EmptyStateDescription } from './EmptyStateDescription/EmptyStateDescription';
+export { EmptyStateActions } from './EmptyStateActions/EmptyStateActions';
+export { useEmptyStateContext } from './EmptyState.context';
+export type { EmptyStateProps, EmptyStateStylesNames, EmptyStateCssVariables, EmptyStateFactory, EmptyStateVariant, EmptyStateContextValue, EmptyStateIndicatorProps, EmptyStateIndicatorStylesNames, EmptyStateIndicatorFactory, EmptyStateTitleProps, EmptyStateTitleStylesNames, EmptyStateTitleFactory, EmptyStateDescriptionProps, EmptyStateDescriptionStylesNames, EmptyStateDescriptionFactory, EmptyStateActionsProps, EmptyStateActionsStylesNames, EmptyStateActionsFactory, };

package/lib/components/Input/Input.d.ts

@@ -5,6 +5,7 @@ import { InputDescription, type InputDescriptionProps, type InputDescriptionStyl
 import { InputError, type InputErrorProps, type InputErrorStylesNames, type InputErrorCssVariables, type InputErrorFactory } from './InputError/InputError';
 import { InputLabel, type InputLabelProps, type InputLabelStylesNames, type InputLabelCssVariables, type InputLabelFactory } from './InputLabel/InputLabel';
 import { InputPlaceholder, type InputPlaceholderProps, type InputPlaceholderStylesNames, type InputPlaceholderFactory } from './InputPlaceholder/InputPlaceholder';
+import { InputSuccess } from './InputSuccess/InputSuccess';
 import { __InputWrapperProps, InputWrapper, InputWrapperStylesNames, type InputWrapperProps, type InputWrapperFactory } from './InputWrapper/InputWrapper';
 type WrapperProps = React.ComponentProps<'div'> & DataAttributes;
 export interface __BaseInputProps extends __InputWrapperProps, __InputProps {
@@ -50,6 +51,8 @@ export interface __InputProps {
     pointer?: boolean;
     /** Determines whether the input should have red border and red text color when the `error` prop is set @default true */
     withErrorStyles?: boolean;
+    /** Determines whether the input should have green border when the `success` prop is set @default true */
+    withSuccessStyles?: boolean;
     /** HTML `size` attribute for the input element (number of visible characters) */
     inputSize?: string;
     /** Section to be displayed when the input is `__clearable` and `rightSection` is not defined */
@@ -75,6 +78,8 @@ export interface InputProps extends BoxProps, __InputProps, StylesApiProps<Input
     __stylesApiProps?: Record<string, any>;
     /** Determines whether the input should have error styles and `aria-invalid` attribute */
     error?: React.ReactNode;
+    /** Determines whether the input should have success styles */
+    success?: React.ReactNode;
     /** Adjusts padding and sizing calculations for multiline inputs (use with `component="textarea"`). Does not make the input multiline by itself. @default false */
     multiline?: boolean;
     /** Input element id */
@@ -97,6 +102,7 @@ export type InputFactory = PolymorphicFactory<{
     staticComponents: {
         Label: typeof InputLabel;
         Error: typeof InputError;
+        Success: typeof InputSuccess;
         Description: typeof InputDescription;
         Placeholder: typeof InputPlaceholder;
         Wrapper: typeof InputWrapper;
@@ -122,6 +128,7 @@ export declare const Input: (<C = "input">(props: import("../..").PolymorphicCom
     staticComponents: {
         Label: typeof InputLabel;
         Error: typeof InputError;
+        Success: typeof InputSuccess;
         Description: typeof InputDescription;
         Placeholder: typeof InputPlaceholder;
         Wrapper: typeof InputWrapper;
@@ -138,6 +145,7 @@ export declare const Input: (<C = "input">(props: import("../..").PolymorphicCom
     staticComponents: {
         Label: typeof InputLabel;
         Error: typeof InputError;
+        Success: typeof InputSuccess;
         Description: typeof InputDescription;
         Placeholder: typeof InputPlaceholder;
         Wrapper: typeof InputWrapper;
@@ -155,6 +163,7 @@ export declare const Input: (<C = "input">(props: import("../..").PolymorphicCom
         staticComponents: {
             Label: typeof InputLabel;
             Error: typeof InputError;
+            Success: typeof InputSuccess;
             Description: typeof InputDescription;
             Placeholder: typeof InputPlaceholder;
             Wrapper: typeof InputWrapper;
@@ -172,6 +181,7 @@ export declare const Input: (<C = "input">(props: import("../..").PolymorphicCom
     staticComponents: {
         Label: typeof InputLabel;
         Error: typeof InputError;
+        Success: typeof InputSuccess;
         Description: typeof InputDescription;
         Placeholder: typeof InputPlaceholder;
         Wrapper: typeof InputWrapper;
@@ -180,6 +190,7 @@ export declare const Input: (<C = "input">(props: import("../..").PolymorphicCom
 }> & {
     Label: typeof InputLabel;
     Error: typeof InputError;
+    Success: typeof InputSuccess;
     Description: typeof InputDescription;
     Placeholder: typeof InputPlaceholder;
     Wrapper: typeof InputWrapper;

package/lib/components/Input/InputSuccess/InputSuccess.d.ts

@@ -0,0 +1,23 @@
+import { BoxProps, ElementProps, Factory, MantineFontSize, StylesApiProps } from '../../../core';
+export type InputSuccessStylesNames = 'success';
+export type InputSuccessCssVariables = {
+    success: '--input-success-size';
+};
+export interface InputSuccessProps extends BoxProps, StylesApiProps<InputSuccessFactory>, ElementProps<'div'> {
+    __staticSelector?: string;
+    __inheritStyles?: boolean;
+    /** Controls success `font-size` @default 'sm' */
+    size?: MantineFontSize;
+}
+export type InputSuccessFactory = Factory<{
+    props: InputSuccessProps;
+    ref: HTMLParagraphElement;
+    stylesNames: InputSuccessStylesNames;
+    vars: InputSuccessCssVariables;
+}>;
+export declare const InputSuccess: import("../../..").MantineComponent<{
+    props: InputSuccessProps;
+    ref: HTMLParagraphElement;
+    stylesNames: InputSuccessStylesNames;
+    vars: InputSuccessCssVariables;
+}>;

package/lib/components/Input/InputWrapper/InputWrapper.d.ts

@@ -2,8 +2,9 @@ import { BoxProps, DataAttributes, ElementProps, Factory, MantineFontSize, Style
 import { InputDescriptionCssVariables, InputDescriptionProps, InputDescriptionStylesNames } from '../InputDescription/InputDescription';
 import { InputErrorCssVariables, InputErrorProps, InputErrorStylesNames } from '../InputError/InputError';
 import { InputLabelCssVariables, InputLabelProps, InputLabelStylesNames } from '../InputLabel/InputLabel';
-export type InputWrapperCssVariables = InputLabelCssVariables & InputErrorCssVariables & InputDescriptionCssVariables;
-export type InputWrapperStylesNames = 'root' | InputLabelStylesNames | InputDescriptionStylesNames | InputErrorStylesNames;
+import { InputSuccessCssVariables, InputSuccessProps, InputSuccessStylesNames } from '../InputSuccess/InputSuccess';
+export type InputWrapperCssVariables = InputLabelCssVariables & InputErrorCssVariables & InputSuccessCssVariables & InputDescriptionCssVariables;
+export type InputWrapperStylesNames = 'root' | InputLabelStylesNames | InputDescriptionStylesNames | InputErrorStylesNames | InputSuccessStylesNames;
 export interface __InputWrapperProps {
     /** Contents of `Input.Label` component. If not set, label is not displayed. */
     label?: React.ReactNode;
@@ -11,6 +12,8 @@ export interface __InputWrapperProps {
     description?: React.ReactNode;
     /** Contents of `Input.Error` component. If not set, error is not displayed. */
     error?: React.ReactNode;
+    /** Contents of `Input.Success` component. If not set, success is not displayed. */
+    success?: React.ReactNode;
     /** Adds required attribute to the input and a red asterisk on the right side of label @default false */
     required?: boolean;
     /** If set, the required asterisk is displayed next to the label. Overrides `required` prop. Does not add required attribute to the input. @default false */
@@ -21,6 +24,8 @@ export interface __InputWrapperProps {
     descriptionProps?: InputDescriptionProps & DataAttributes;
     /** Props passed down to the `Input.Error` component */
     errorProps?: InputErrorProps & DataAttributes;
+    /** Props passed down to the `Input.Success` component */
+    successProps?: InputSuccessProps & DataAttributes;
     /** Render function to wrap the input element. Useful for adding tooltips, popovers, or other wrappers around the input. @default React.Fragment */
     inputContainer?: (children: React.ReactNode) => React.ReactNode;
     /** Controls order and visibility of wrapper elements. Only elements included in this array will be rendered. @default ['label', 'description', 'input', 'error'] */

package/lib/components/Input/index.d.ts

@@ -3,6 +3,7 @@ import type { InputClearButtonFactory, InputClearButtonProps } from './InputClea
 import type { ClearSectionMode, InputClearSectionProps } from './InputClearSection/InputClearSection';
 import type { InputDescriptionCssVariables, InputDescriptionFactory, InputDescriptionProps, InputDescriptionStylesNames } from './InputDescription/InputDescription';
 import type { InputErrorCssVariables, InputErrorFactory, InputErrorProps, InputErrorStylesNames } from './InputError/InputError';
+import type { InputSuccessCssVariables, InputSuccessFactory, InputSuccessProps, InputSuccessStylesNames } from './InputSuccess/InputSuccess';
 import type { InputLabelCssVariables, InputLabelFactory, InputLabelProps, InputLabelStylesNames } from './InputLabel/InputLabel';
 import type { InputPlaceholderFactory, InputPlaceholderProps, InputPlaceholderStylesNames } from './InputPlaceholder/InputPlaceholder';
 import type { __InputWrapperProps, InputWrapperFactory, InputWrapperProps, InputWrapperStylesNames } from './InputWrapper/InputWrapper';
@@ -10,10 +11,11 @@ export { Input } from './Input';
 export { InputWrapper } from './InputWrapper/InputWrapper';
 export { InputDescription } from './InputDescription/InputDescription';
 export { InputError } from './InputError/InputError';
+export { InputSuccess } from './InputSuccess/InputSuccess';
 export { InputLabel } from './InputLabel/InputLabel';
 export { InputPlaceholder } from './InputPlaceholder/InputPlaceholder';
 export { InputClearButton } from './InputClearButton/InputClearButton';
 export { InputClearSection } from './InputClearSection/InputClearSection';
 export { useInputProps } from './use-input-props';
 export { InputWrapperContext } from './InputWrapper.context';
-export type { InputProps, __InputProps, __BaseInputProps, InputStylesNames, __InputStylesNames, InputVariant, InputCssVariables, InputFactory, InputWrapperProps, __InputWrapperProps, InputWrapperStylesNames, InputWrapperFactory, InputDescriptionProps, InputDescriptionCssVariables, InputDescriptionStylesNames, InputDescriptionFactory, InputErrorProps, InputErrorCssVariables, InputErrorStylesNames, InputErrorFactory, InputLabelProps, InputLabelCssVariables, InputLabelStylesNames, InputLabelFactory, InputPlaceholderProps, InputPlaceholderStylesNames, InputPlaceholderFactory, InputClearButtonProps, InputClearButtonFactory, InputClearSectionProps, ClearSectionMode, };
+export type { InputProps, __InputProps, __BaseInputProps, InputStylesNames, __InputStylesNames, InputVariant, InputCssVariables, InputFactory, InputWrapperProps, __InputWrapperProps, InputWrapperStylesNames, InputWrapperFactory, InputDescriptionProps, InputDescriptionCssVariables, InputDescriptionStylesNames, InputDescriptionFactory, InputErrorProps, InputErrorCssVariables, InputErrorStylesNames, InputErrorFactory, InputSuccessProps, InputSuccessCssVariables, InputSuccessStylesNames, InputSuccessFactory, InputLabelProps, InputLabelCssVariables, InputLabelStylesNames, InputLabelFactory, InputPlaceholderProps, InputPlaceholderStylesNames, InputPlaceholderFactory, InputClearButtonProps, InputClearButtonFactory, InputClearSectionProps, ClearSectionMode, };

package/lib/components/Input/use-input-props.d.ts

@@ -8,7 +8,7 @@ interface BaseProps extends __BaseInputProps, BoxProps, StylesApiProps<{
     __stylesApiProps?: Record<string, any>;
     id?: string;
 }
-export declare function useInputProps<T extends BaseProps, U extends Partial<T> | null>(component: string, defaultProps: U, _props: T): Omit<T & (U extends null | undefined ? {} : { [Key in Extract<keyof T, keyof U>]-?: U[Key] | NonNullable<T[Key]>; }), "label" | "style" | "size" | "styles" | "className" | "id" | "vars" | "variant" | "unstyled" | "attributes" | "classNames" | "mod" | "description" | "error" | "__staticSelector" | "required" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "wrapperProps"> & {
+export declare function useInputProps<T extends BaseProps, U extends Partial<T> | null>(component: string, defaultProps: U, _props: T): Omit<T & (U extends null | undefined ? {} : { [Key in Extract<keyof T, keyof U>]-?: U[Key] | NonNullable<T[Key]>; }), "label" | "style" | "size" | "styles" | "className" | "id" | "vars" | "variant" | "unstyled" | "attributes" | "classNames" | "mod" | "error" | "description" | "__staticSelector" | "required" | "success" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "successProps" | "inputContainer" | "inputWrapperOrder" | "wrapperProps"> & {
     classNames: Partial<Record<string, string | undefined>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string | undefined>>) | undefined;
     styles: Partial<Record<string, import("../..").CSSProperties>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../..").CSSProperties>>) | undefined;
     unstyled: boolean | undefined;
@@ -298,18 +298,20 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         label: import("react").ReactNode;
         description: import("react").ReactNode;
         error: import("react").ReactNode;
+        success: import("react").ReactNode;
         required: boolean | undefined;
         classNames: Partial<Record<string, string | undefined>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string | undefined>>) | undefined;
         __staticSelector: string | undefined;
         __stylesApiProps: Record<string, any> | BaseProps;
         errorProps: (import(".").InputErrorProps & import("../..").DataAttributes) | undefined;
+        successProps: (import(".").InputSuccessProps & import("../..").DataAttributes) | undefined;
         labelProps: (import(".").InputLabelProps & import("../..").DataAttributes) | undefined;
         descriptionProps: (import(".").InputDescriptionProps & import("../..").DataAttributes) | undefined;
         unstyled: boolean | undefined;
         styles: Partial<Record<string, import("../..").CSSProperties>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../..").CSSProperties>>) | undefined;
         size: (string & {}) | import("../..").MantineSize | undefined;
         inputContainer: ((children: React.ReactNode) => React.ReactNode) | undefined;
-        inputWrapperOrder: ("input" | "label" | "description" | "error")[] | undefined;
+        inputWrapperOrder: ("input" | "label" | "error" | "description")[] | undefined;
         withAsterisk: boolean | undefined;
         variant: string | undefined;
         mod: import("../..").BoxMod | undefined;
@@ -326,6 +328,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         __staticSelector: string | undefined;
         __stylesApiProps: Record<string, any> | BaseProps;
         error: import("react").ReactNode;
+        success: import("react").ReactNode;
         variant: string | undefined;
         id: string | undefined;
         attributes: {

package/lib/components/MaskInput/use-mask-input-props.d.ts

@@ -71,11 +71,13 @@ export declare function useMaskInputProps(props: MaskInputProps & {
         label?: React.ReactNode;
         description?: React.ReactNode;
         error?: React.ReactNode;
+        success?: React.ReactNode;
         required?: boolean;
         withAsterisk?: boolean;
         labelProps?: import("..").InputLabelProps & import("../..").DataAttributes;
         descriptionProps?: import("..").InputDescriptionProps & import("../..").DataAttributes;
         errorProps?: import("..").InputErrorProps & import("../..").DataAttributes;
+        successProps?: import("..").InputSuccessProps & import("../..").DataAttributes;
         inputContainer?: (children: React.ReactNode) => React.ReactNode;
         inputWrapperOrder?: ("label" | "input" | "description" | "error")[];
         leftSection?: React.ReactNode;
@@ -91,6 +93,7 @@ export declare function useMaskInputProps(props: MaskInputProps & {
         size?: import("../..").MantineSize | (string & {});
         pointer?: boolean;
         withErrorStyles?: boolean;
+        withSuccessStyles?: boolean;
         inputSize?: string;
         __clearSection?: React.ReactNode;
         __clearable?: boolean;
@@ -115,9 +118,10 @@ export declare function useMaskInputProps(props: MaskInputProps & {
             label?: Record<string, any> | undefined;
             section?: Record<string, any> | undefined;
             root?: Record<string, any> | undefined;
-            description?: Record<string, any> | undefined;
             error?: Record<string, any> | undefined;
+            description?: Record<string, any> | undefined;
             required?: Record<string, any> | undefined;
+            success?: Record<string, any> | undefined;
             wrapper?: Record<string, any> | undefined;
             bottomSection?: Record<string, any> | undefined;
         } | undefined;