@mantine/core 8.3.13 → 9.0.0-alpha.0

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

@@ -1,12 +1,37 @@
+import type { RadioCssVariables, RadioFactory, RadioProps, RadioStylesNames, RadioVariant } from './Radio';
+import type { RadioCardContextValue, RadioCardCssVariables, RadioCardFactory, RadioCardProps, RadioCardStylesNames } from './RadioCard/RadioCard';
+import type { RadioGroupContextValue, RadioGroupFactory, RadioGroupProps, RadioGroupStylesNames } from './RadioGroup/RadioGroup';
+import type { RadioIconProps } from './RadioIcon';
+import type { RadioIndicatorCssVariables, RadioIndicatorFactory, RadioIndicatorProps, RadioIndicatorStylesNames, RadioIndicatorVariant } from './RadioIndicator/RadioIndicator';
 export { Radio } from './Radio';
-export { RadioGroup } from './RadioGroup/RadioGroup';
+export { RadioGroup, RadioGroupContext } from './RadioGroup/RadioGroup';
 export { RadioIcon } from './RadioIcon';
-export { RadioCard } from './RadioCard/RadioCard';
-export { useRadioCardContext } from './RadioCard/RadioCard.context';
+export { RadioCard, RadioCardContext } from './RadioCard/RadioCard';
 export { RadioIndicator } from './RadioIndicator/RadioIndicator';
-export type { RadioIconProps } from './RadioIcon';
-export type { RadioCardContextValue } from './RadioCard/RadioCard.context';
-export type { RadioCssVariables, RadioFactory, RadioProps, RadioStylesNames, RadioVariant, } from './Radio';
-export type { RadioGroupFactory, RadioGroupProps, RadioGroupStylesNames, } from './RadioGroup/RadioGroup';
-export type { RadioCardCssVariables, RadioCardFactory, RadioCardProps, RadioCardStylesNames, } from './RadioCard/RadioCard';
-export type { RadioIndicatorCssVariables, RadioIndicatorFactory, RadioIndicatorProps, RadioIndicatorStylesNames, RadioIndicatorVariant, } from './RadioIndicator/RadioIndicator';
+export type { RadioProps, RadioStylesNames, RadioFactory, RadioCssVariables, RadioVariant, RadioIconProps, RadioGroupProps, RadioGroupStylesNames, RadioGroupFactory, RadioGroupContextValue, RadioCardProps, RadioCardStylesNames, RadioCardFactory, RadioCardCssVariables, RadioCardContextValue, RadioIndicatorProps, RadioIndicatorStylesNames, RadioIndicatorFactory, RadioIndicatorCssVariables, RadioIndicatorVariant, };
+export declare namespace Radio {
+    type Props = RadioProps;
+    type StylesNames = RadioStylesNames;
+    type Factory = RadioFactory;
+    type Variant = RadioVariant;
+    namespace Group {
+        type Props = RadioGroupProps;
+        type StylesNames = RadioGroupStylesNames;
+        type Factory = RadioGroupFactory;
+        type ContextValue = RadioGroupContextValue;
+    }
+    namespace Card {
+        type Props = RadioCardProps;
+        type StylesNames = RadioCardStylesNames;
+        type Factory = RadioCardFactory;
+        type CssVariables = RadioCardCssVariables;
+        type ContextValue = RadioCardContextValue;
+    }
+    namespace Indicator {
+        type Props = RadioIndicatorProps;
+        type StylesNames = RadioIndicatorStylesNames;
+        type Factory = RadioIndicatorFactory;
+        type CssVariables = RadioIndicatorCssVariables;
+        type Variant = RadioIndicatorVariant;
+    }
+}

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

@@ -3,8 +3,5 @@ import type { RatingFactory } from './Rating';
 interface RatingContextValue {
     getStyles: GetStylesApi<RatingFactory>;
 }
-export declare const RatingProvider: ({ children, value }: {
-    value: RatingContextValue;
-    children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useRatingContext: () => RatingContextValue;
+export declare const RatingProvider: import("react").Context<RatingContextValue | null>, useRatingContext: () => RatingContextValue;
 export {};

package/lib/components/Rating/Rating.d.ts

@@ -10,27 +10,29 @@ export interface RatingProps extends BoxProps, StylesApiProps<RatingFactory>, El
     value?: number;
     /** Called when value changes */
     onChange?: (value: number) => void;
-    /** Icon displayed when the symbol is empty */
+    /** Icon displayed for unselected rating items. Can be a function that receives the rating value. */
     emptySymbol?: React.ReactNode | ((value: number) => React.ReactNode);
-    /** Icon displayed when the symbol is full */
+    /** Icon displayed for selected rating items. Can be a function that receives the rating value. */
     fullSymbol?: React.ReactNode | ((value: number) => React.ReactNode);
-    /** Number of fractions each item can be divided into @default `1` */
+    /** Number of fractions each item can be divided into, default is 1 */
     fractions?: number;
-    /** Controls component size @default `'sm'` */
+    /** Controls component size @default 'sm' */
     size?: MantineSize | number | (string & {});
-    /** Number of controls @default `5` */
+    /** Number of rating items (stars), default is 5 */
     count?: number;
-    /** Called when one of the controls is hovered */
+    /** Called when rating item is hovered. Receives -1 when hover ends. */
     onHover?: (value: number) => void;
-    /** A function to assign `aria-label` of the the control at index given in the argument. If not specified, control index is used as `aria-label`. */
+    /** Function to generate aria-label for each rating value. Receives the rating value as argument, default is (value) => String(value) */
     getSymbolLabel?: (index: number) => string;
-    /** `name` attribute passed down to all inputs. By default, `name` is generated randomly. */
+    /** Name attribute for form submission. If not provided, a unique id will be generated. */
     name?: string;
-    /** If set, the user cannot interact with the component @default `false` */
+    /** When true, rating cannot be changed by user interaction, default is false */
     readOnly?: boolean;
-    /** If set, only the selected symbol changes to full symbol when selected @default `false` */
+    /** When true, clicking the same rating value clears the rating to 0, default is false */
+    allowClear?: boolean;
+    /** When true, only the clicked rating item is highlighted, not all items up to the selected value, default is false */
     highlightSelectedOnly?: boolean;
-    /** Key of `theme.colors` or any CSS color value @default `'yellow'` */
+    /** Key of theme.colors or any CSS color value, default is 'yellow' */
     color?: MantineColor;
 }
 export type RatingFactory = Factory<{

package/lib/components/Rating/StarSymbol/StarIcon.d.ts

@@ -1,4 +1,4 @@
-export declare function StarIcon(props: React.ComponentPropsWithoutRef<'svg'>): import("react/jsx-runtime").JSX.Element;
+export declare function StarIcon(props: React.ComponentProps<'svg'>): import("react/jsx-runtime").JSX.Element;
 export declare namespace StarIcon {
     var displayName: string;
 }

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

@@ -1,2 +1,8 @@
+import type { RatingCssVariables, RatingFactory, RatingProps, RatingStylesNames } from './Rating';
 export { Rating } from './Rating';
-export type { RatingCssVariables, RatingFactory, RatingProps, RatingStylesNames } from './Rating';
+export type { RatingCssVariables, RatingFactory, RatingProps, RatingStylesNames };
+export declare namespace Rating {
+    type Props = RatingProps;
+    type StylesNames = RatingStylesNames;
+    type Factory = RatingFactory;
+}

package/lib/components/RingProgress/Curve/Curve.d.ts

@@ -1,6 +1,6 @@
 import { GetStylesApi, MantineColor } from '../../../core';
 import type { RingProgressFactory } from '../RingProgress';
-interface CurveProps extends React.ComponentPropsWithRef<'circle'> {
+interface CurveProps extends React.ComponentProps<'circle'> {
     value?: number;
     size: number;
     offset: number;

package/lib/components/RingProgress/RingProgress.d.ts

@@ -1,5 +1,5 @@
-import { BoxProps, ElementProps, Factory, MantineColor, StylesApiProps } from '../../core';
-interface RingProgressSection extends React.ComponentPropsWithRef<'circle'> {
+import { BoxProps, DataAttributes, ElementProps, Factory, MantineColor, StylesApiProps } from '../../core';
+export interface RingProgressSection extends React.ComponentProps<'circle'>, DataAttributes {
     value: number;
     color: MantineColor;
     tooltip?: React.ReactNode;
@@ -7,22 +7,30 @@ interface RingProgressSection extends React.ComponentPropsWithRef<'circle'> {
 export type RingProgressStylesNames = 'root' | 'svg' | 'label' | 'curve';
 export type RingProgressCssVariables = {
     root: '--rp-size' | '--rp-label-offset' | '--rp-transition-duration';
+    svg: '--rp-start-angle';
 };
 export interface RingProgressProps extends BoxProps, StylesApiProps<RingProgressFactory>, ElementProps<'div'> {
     /** Label displayed in the center of the ring */
     label?: React.ReactNode;
-    /** Ring thickness @default 12 */
+    /** Ring thickness in pixels. Cannot exceed size / 4 and will be automatically clamped if necessary @default 12 */
     thickness?: number;
     /** Width and height of the progress ring @default 120 */
     size?: number;
-    /** Sets whether the edges of the progress circle are rounded */
+    /** Applies rounded line caps to the start and end of visible sections @default false */
     roundCaps?: boolean;
-    /** Ring sections */
+    /**
+     * Array of sections to display in the ring. Each section should have a `value` (0-100),
+     * `color`, and optional `tooltip`. Sections can also receive any valid SVG circle element props.
+     */
     sections: RingProgressSection[];
-    /** Color of the root section, key of theme.colors or CSS color value */
+    /** Color of the unfilled portion of the ring (background). Defaults to gray-2 in light mode, dark-4 in dark mode */
     rootColor?: MantineColor;
-    /** Transition duration of filled section styles changes in ms @default `0` */
+    /** Transition duration in milliseconds for section value and color changes @default 0 */
     transitionDuration?: number;
+    /** Gap between sections in degrees. Reduces the visual size of each section @default 0 */
+    sectionGap?: number;
+    /** Starting angle in degrees. 0 = right, 90 = bottom, 180 = left, 270 = top @default 270 */
+    startAngle?: number;
 }
 export type RingProgressFactory = Factory<{
     props: RingProgressProps;
@@ -36,4 +44,3 @@ export declare const RingProgress: import("../..").MantineComponent<{
     stylesNames: RingProgressStylesNames;
     vars: RingProgressCssVariables;
 }>;
-export {};

package/lib/components/RingProgress/get-curves/get-curves.d.ts

@@ -1,10 +1,11 @@
-import type { MantineColor } from '../../../core';
-interface CurveData extends React.ComponentPropsWithRef<'circle'> {
+import type { DataAttributes, MantineColor } from '../../../core';
+interface CurveData extends React.ComponentProps<'circle'>, DataAttributes {
     value: number;
     color: MantineColor;
     tooltip?: React.ReactNode;
 }
-interface RootCurveData extends React.ComponentPropsWithRef<'circle'> {
+interface RootCurveData extends React.ComponentProps<'circle'>, DataAttributes {
+    value?: never;
     color?: MantineColor;
 }
 interface GetCurves {
@@ -13,6 +14,7 @@ interface GetCurves {
     thickness: number;
     renderRoundedLineCaps: boolean | undefined;
     rootColor?: MantineColor;
+    sectionGap?: number;
 }
 interface Curve {
     sum: number;
@@ -21,5 +23,5 @@ interface Curve {
     data: CurveData | RootCurveData;
     lineRoundCaps?: boolean;
 }
-export declare function getCurves({ size, thickness, sections, renderRoundedLineCaps, rootColor, }: GetCurves): Curve[];
+export declare function getCurves({ size, thickness, sections, renderRoundedLineCaps, rootColor, sectionGap, }: GetCurves): Curve[];
 export {};

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

@@ -1,2 +1,10 @@
+import type { RingProgressCssVariables, RingProgressFactory, RingProgressProps, RingProgressSection, RingProgressStylesNames } from './RingProgress';
 export { RingProgress } from './RingProgress';
-export type { RingProgressCssVariables, RingProgressFactory, RingProgressProps, RingProgressStylesNames, } from './RingProgress';
+export type { RingProgressProps, RingProgressStylesNames, RingProgressFactory, RingProgressCssVariables, RingProgressSection, };
+export declare namespace RingProgress {
+    type Props = RingProgressProps;
+    type StylesNames = RingProgressStylesNames;
+    type Factory = RingProgressFactory;
+    type CssVariables = RingProgressCssVariables;
+    type Section = RingProgressSection;
+}

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

@@ -20,7 +20,4 @@ export interface ScrollAreaContextValue {
     onCornerHeightChange: (height: number) => void;
     getStyles: GetStylesApi<ScrollAreaFactory>;
 }
-export declare const ScrollAreaProvider: ({ children, value }: {
-    value: ScrollAreaContextValue;
-    children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useScrollAreaContext: () => ScrollAreaContextValue;
+export declare const ScrollAreaProvider: import("react").Context<ScrollAreaContextValue | null>, useScrollAreaContext: () => ScrollAreaContextValue;

package/lib/components/ScrollArea/ScrollArea.d.ts

@@ -4,36 +4,57 @@ export type ScrollAreaCssVariables = {
     root: '--scrollarea-scrollbar-size';
 };
 export interface ScrollAreaProps extends BoxProps, StylesApiProps<ScrollAreaFactory>, ElementProps<'div'> {
-    /** Scrollbar size, any valid CSS value for width/height, numbers are converted to rem, default value is 0.75rem */
+    /** Scrollbar size, any valid CSS value for width/height, numbers are converted to rem, default value is 12px (0.75rem) */
     scrollbarSize?: number | string;
     /**
-     * Defines scrollbars behavior, `hover` by default
-     * - `hover` – scrollbars are visible when mouse is over the scroll area
-     * - `scroll` – scrollbars are visible when the scroll area is scrolled
-     * - `always` – scrollbars are always visible
-     * - `never` – scrollbars are always hidden
-     * - `auto` – similar to `overflow: auto` – scrollbars are always visible when the content is overflowing
+     * Defines scrollbars behavior
+     * - `'hover'` – scrollbars visible on hover (default)
+     * - `'scroll'` – scrollbars visible during scrolling
+     * - `'auto'` – scrollbars visible only when content overflows (like CSS overflow: auto)
+     * - `'always'` – scrollbars always visible, even when content doesn't overflow
+     * - `'never'` – scrollbars always hidden
+     * @default 'hover'
      * */
     type?: 'auto' | 'always' | 'scroll' | 'hover' | 'never';
-    /** Scroll hide delay in ms, applicable only when type is set to `hover` or `scroll` @default `1000` */
+    /** Scroll hide delay in ms, applicable only when type is set to `hover` or `scroll` @default 1000 */
     scrollHideDelay?: number;
-    /** Axis at which scrollbars must be rendered @default `'xy'` */
+    /**
+     * Axis at which scrollbars must be rendered
+     * - `'x'` - horizontal scrollbar only
+     * - `'y'` - vertical scrollbar only
+     * - `'xy'` - both scrollbars
+     * - `false` - no scrollbars rendered (content remains scrollable via mouse/touch)
+     * @default 'xy'
+     */
     scrollbars?: 'x' | 'y' | 'xy' | false;
-    /** Determines whether scrollbars should be offset with padding on given axis @default `false` */
+    /**
+     * Determines whether scrollbars should be offset with padding on given axis
+     * - `true` - adds padding to offset both scrollbars (always)
+     * - `'x'` - adds padding to offset horizontal scrollbar (always)
+     * - `'y'` - adds padding to offset vertical scrollbar (always)
+     * - `'present'` - adds padding only when scrollbars are visible (dynamic)
+     * @default false
+     */
     offsetScrollbars?: boolean | 'x' | 'y' | 'present';
     /** Assigns viewport element (scrollable container) ref */
-    viewportRef?: React.ForwardedRef<HTMLDivElement>;
+    viewportRef?: React.Ref<HTMLDivElement>;
     /** Props passed down to the viewport element */
-    viewportProps?: React.ComponentPropsWithRef<'div'>;
+    viewportProps?: React.ComponentProps<'div'>;
     /** Called with current position (`x` and `y` coordinates) when viewport is scrolled */
     onScrollPositionChange?: (position: {
         x: number;
         y: number;
     }) => void;
-    /** Called when scrollarea is scrolled all the way to the bottom */
+    /**
+     * Called when scrollarea is scrolled to the bottom (within 0.8px tolerance for sub-pixel rendering)
+     */
     onBottomReached?: () => void;
     /** Called when scrollarea is scrolled all the way to the top */
     onTopReached?: () => void;
+    /** Called when scrollarea is scrolled to the left (within 0.8px tolerance for sub-pixel rendering) */
+    onLeftReached?: () => void;
+    /** Called when scrollarea is scrolled to the right (within 0.8px tolerance for sub-pixel rendering) */
+    onRightReached?: () => void;
     /** Defines `overscroll-behavior` of the viewport */
     overscrollBehavior?: React.CSSProperties['overscrollBehavior'];
 }

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

@@ -18,5 +18,5 @@ export interface ScrollAreaScrollbarAxisPrivateProps {
     onWheelScroll: (scrollPos: number) => void;
     onDragScroll: (pointerPos: number) => void;
 }
-export interface ScrollAreaScrollbarAxisProps extends ScrollAreaScrollbarAxisPrivateProps, React.ComponentPropsWithoutRef<'div'> {
+export interface ScrollAreaScrollbarAxisProps extends ScrollAreaScrollbarAxisPrivateProps, React.ComponentProps<'div'> {
 }

package/lib/components/ScrollArea/ScrollAreaCorner/ScrollAreaCorner.d.ts

@@ -1,5 +1,5 @@
-interface ScrollAreaCornerProps extends React.ComponentPropsWithoutRef<'div'> {
+interface ScrollAreaCornerProps extends React.ComponentProps<'div'> {
 }
-export declare const Corner: import("react").ForwardRefExoticComponent<ScrollAreaCornerProps & import("react").RefAttributes<HTMLDivElement>>;
-export declare const ScrollAreaCorner: import("react").ForwardRefExoticComponent<ScrollAreaCornerProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Corner(props: ScrollAreaCornerProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function ScrollAreaCorner(props: ScrollAreaCornerProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/lib/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.d.ts

@@ -19,4 +19,7 @@ export type ScrollAreaRootFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: ScrollAreaRootStylesNames;
 }>;
-export declare const ScrollAreaRoot: import("react").ForwardRefExoticComponent<ScrollAreaRootProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaRoot(_props: ScrollAreaRootProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ScrollAreaRoot {
+    var displayName: string;
+}

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.d.ts

@@ -2,5 +2,8 @@ import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
 interface ScrollAreaScrollbarProps extends ScrollAreaScrollbarVisibleProps {
     forceMount?: true;
 }
-export declare const ScrollAreaScrollbar: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbar(props: ScrollAreaScrollbarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ScrollAreaScrollbar {
+    var displayName: string;
+}
 export {};

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.d.ts

@@ -2,4 +2,7 @@ import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
 export interface ScrollAreaScrollbarAutoProps extends ScrollAreaScrollbarVisibleProps {
     forceMount?: true;
 }
-export declare const ScrollAreaScrollbarAuto: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarAutoProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbarAuto(props: ScrollAreaScrollbarAutoProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ScrollAreaScrollbarAuto {
+    var displayName: string;
+}

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarHover.d.ts

@@ -2,5 +2,8 @@ import { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto';
 interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {
     forceMount?: true;
 }
-export declare const ScrollAreaScrollbarHover: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarHoverProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbarHover(props: ScrollAreaScrollbarHoverProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ScrollAreaScrollbarHover {
+    var displayName: string;
+}
 export {};

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.d.ts

@@ -2,5 +2,5 @@ import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
 interface ScrollAreaScrollbarScrollProps extends ScrollAreaScrollbarVisibleProps {
     forceMount?: true;
 }
-export declare const ScrollAreaScrollbarScroll: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarScrollProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbarScroll(props: ScrollAreaScrollbarScrollProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.d.ts

@@ -2,4 +2,7 @@ import { ScrollAreaScrollbarAxisPrivateProps, ScrollAreaScrollbarAxisProps } fro
 export interface ScrollAreaScrollbarVisibleProps extends Omit<ScrollAreaScrollbarAxisProps, keyof ScrollAreaScrollbarAxisPrivateProps> {
     orientation?: 'horizontal' | 'vertical';
 }
-export declare const ScrollAreaScrollbarVisible: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarVisibleProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbarVisible(props: ScrollAreaScrollbarVisibleProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ScrollAreaScrollbarVisible {
+    var displayName: string;
+}

package/lib/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.context.d.ts

@@ -9,7 +9,4 @@ export interface ScrollbarContextValue {
     }) => void;
     onThumbPositionChange: () => void;
 }
-export declare const ScrollbarProvider: ({ children, value }: {
-    value: ScrollbarContextValue;
-    children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useScrollbarContext: () => ScrollbarContextValue;
+export declare const ScrollbarProvider: import("react").Context<ScrollbarContextValue | null>, useScrollbarContext: () => ScrollbarContextValue;

package/lib/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.d.ts

@@ -14,7 +14,7 @@ export interface ScrollbarPrivateProps {
     }) => void;
     onResize: () => void;
 }
-interface ScrollbarProps extends ScrollbarPrivateProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'onResize'> {
+interface ScrollbarProps extends ScrollbarPrivateProps, Omit<React.ComponentProps<'div'>, 'onResize'> {
 }
-export declare const Scrollbar: import("react").ForwardRefExoticComponent<ScrollbarProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Scrollbar(props: ScrollbarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.d.ts

@@ -1,2 +1,5 @@
 import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types';
-export declare const ScrollAreaScrollbarX: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarAxisProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const ScrollAreaScrollbarX: {
+    (props: ScrollAreaScrollbarAxisProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/lib/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.d.ts

@@ -1,2 +1,5 @@
 import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types';
-export declare const ScrollAreaScrollbarY: import("react").ForwardRefExoticComponent<ScrollAreaScrollbarAxisProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaScrollbarY(props: ScrollAreaScrollbarAxisProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ScrollAreaScrollbarY {
+    var displayName: string;
+}

package/lib/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.d.ts

@@ -1,8 +1,14 @@
-interface ThumbProps extends React.ComponentPropsWithoutRef<'div'> {
+interface ThumbProps extends React.ComponentProps<'div'> {
+}
+export declare function Thumb(props: ThumbProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Thumb {
+    var displayName: string;
 }
-export declare const Thumb: import("react").ForwardRefExoticComponent<ThumbProps & import("react").RefAttributes<HTMLDivElement>>;
 interface ScrollAreaThumbProps extends ThumbProps {
     forceMount?: true;
 }
-export declare const ScrollAreaThumb: import("react").ForwardRefExoticComponent<ScrollAreaThumbProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaThumb(props: ScrollAreaThumbProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ScrollAreaThumb {
+    var displayName: string;
+}
 export {};

package/lib/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.d.ts

@@ -1,4 +1,7 @@
 import { BoxProps, ElementProps } from '../../../core';
 export interface ScrollAreaViewportProps extends BoxProps, ElementProps<'div'> {
 }
-export declare const ScrollAreaViewport: import("react").ForwardRefExoticComponent<ScrollAreaViewportProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function ScrollAreaViewport({ children, style, ref, onWheel, ...others }: ScrollAreaViewportProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ScrollAreaViewport {
+    var displayName: string;
+}

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

@@ -1,2 +1,14 @@
+import type { ScrollAreaAutosizeProps, ScrollAreaCssVariables, ScrollAreaFactory, ScrollAreaProps, ScrollAreaStylesNames } from './ScrollArea';
 export { ScrollArea, ScrollAreaAutosize } from './ScrollArea';
-export type { ScrollAreaProps, ScrollAreaAutosizeProps, ScrollAreaStylesNames, ScrollAreaCssVariables, ScrollAreaFactory, } from './ScrollArea';
+export { useScrollAreaContext } from './ScrollArea.context';
+export type { ScrollAreaProps, ScrollAreaAutosizeProps, ScrollAreaStylesNames, ScrollAreaCssVariables, ScrollAreaFactory, };
+export declare namespace ScrollArea {
+    type Props = ScrollAreaProps;
+    type AutosizeProps = ScrollAreaAutosizeProps;
+    type StylesNames = ScrollAreaStylesNames;
+    type CssVariables = ScrollAreaCssVariables;
+    type Factory = ScrollAreaFactory;
+    namespace Autosize {
+        type Props = ScrollAreaAutosizeProps;
+    }
+}

package/lib/components/Scroller/Scroller.d.ts

@@ -0,0 +1,44 @@
+import { Ref } from 'react';
+import { BoxProps, ElementProps, Factory, StylesApiProps } from '../../core';
+export type ScrollerStylesNames = 'root' | 'container' | 'content' | 'control' | 'chevron';
+export type ScrollerCssVariables = {
+    root: '--scroller-control-size' | '--scroller-background-color';
+};
+export interface ScrollerProps extends BoxProps, StylesApiProps<ScrollerFactory>, ElementProps<'div'> {
+    /** Content to display */
+    children: React.ReactNode;
+    /** Amount of pixels to scroll when clicking the control buttons, `200` by default */
+    scrollAmount?: number;
+    /** Size of the control buttons, @default 60px */
+    controlSize?: string | number;
+    /** Background color for the gradient fade on controls, `'var(--mantine-color-body)'` by default */
+    edgeGradientColor?: string;
+    /** Props passed to the start control button */
+    startControlProps?: React.ComponentProps<'button'>;
+    /** Props passed to the end control button */
+    endControlProps?: React.ComponentProps<'button'>;
+    /** Icon component for the start control, AccordionChevron by default */
+    startControlIcon?: React.ReactNode;
+    /** Icon component for the end control, AccordionChevron by default */
+    endControlIcon?: React.ReactNode;
+    /** Determines whether start control should always be visible regardless of scroll position, `false` by default */
+    showStartControl?: boolean;
+    /** Determines whether end control should always be visible regardless of scroll position, `false` by default */
+    showEndControl?: boolean;
+    /** Determines whether content can be scrolled by dragging with mouse, `true` by default */
+    draggable?: boolean;
+    /** Ref for the scroll container element */
+    ref?: Ref<HTMLDivElement>;
+}
+export type ScrollerFactory = Factory<{
+    props: ScrollerProps;
+    ref: HTMLDivElement;
+    stylesNames: ScrollerStylesNames;
+    vars: ScrollerCssVariables;
+}>;
+export declare const Scroller: import("../..").MantineComponent<{
+    props: ScrollerProps;
+    ref: HTMLDivElement;
+    stylesNames: ScrollerStylesNames;
+    vars: ScrollerCssVariables;
+}>;

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

@@ -0,0 +1,9 @@
+import type { ScrollerCssVariables, ScrollerFactory, ScrollerProps, ScrollerStylesNames } from './Scroller';
+export { Scroller } from './Scroller';
+export type { ScrollerProps, ScrollerStylesNames, ScrollerCssVariables, ScrollerFactory };
+export declare namespace Scroller {
+    type Props = ScrollerProps;
+    type StylesNames = ScrollerStylesNames;
+    type CssVariables = ScrollerCssVariables;
+    type Factory = ScrollerFactory;
+}