@mantine/core 7.0.0-alpha.2 → 7.0.0-alpha.21

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

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+export interface ScrollAreaContextValue {
+    type: 'auto' | 'always' | 'scroll' | 'hover' | 'never';
+    scrollHideDelay: number;
+    scrollArea: HTMLDivElement | null;
+    viewport: HTMLDivElement | null;
+    onViewportChange(viewport: HTMLDivElement | null): void;
+    content: HTMLDivElement | null;
+    onContentChange(content: HTMLDivElement): void;
+    scrollbarX: HTMLDivElement | null;
+    onScrollbarXChange(scrollbar: HTMLDivElement | null): void;
+    scrollbarXEnabled: boolean;
+    onScrollbarXEnabledChange(rendered: boolean): void;
+    scrollbarY: HTMLDivElement | null;
+    onScrollbarYChange(scrollbar: HTMLDivElement | null): void;
+    scrollbarYEnabled: boolean;
+    onScrollbarYEnabledChange(rendered: boolean): void;
+    onCornerWidthChange(width: number): void;
+    onCornerHeightChange(height: number): void;
+}
+export declare const ScrollAreaProvider: ({ children, value }: {
+    value: ScrollAreaContextValue;
+    children: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, useScrollAreaContext: () => ScrollAreaContextValue;

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

@@ -1,12 +1,11 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../core';
 export type ScrollAreaStylesNames = 'root' | 'viewport' | 'scrollbar' | 'thumb' | 'corner';
-export type ScrollAreaVariant = string;
 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 (1rem = 16px), default value is 0.75rem (12px) */
+    /** Scrollbar size, any valid CSS value for width/height, numbers are converted to rem, default value is 0.75rem */
     scrollbarSize?: number | string;
     /**
      * Defines scrollbars behavior, `hover` by default
@@ -19,11 +18,11 @@ export interface ScrollAreaProps extends BoxProps, StylesApiProps<ScrollAreaFact
     type?: 'auto' | 'always' | 'scroll' | 'hover' | 'never';
     /** Scroll hide delay in ms, applicable only when type is set to `hover` or `scroll`, `1000` by default */
     scrollHideDelay?: number;
-    /** Determines whether scrollbars should be offset with padding, `false` by default */
-    offsetScrollbars?: boolean;
+    /** Determines whether scrollbars should be offset with padding on given axis, `false` by default */
+    offsetScrollbars?: boolean | 'x' | 'y';
     /** Assigns viewport element (scrollable container) ref */
     viewportRef?: React.ForwardedRef<HTMLDivElement>;
-    /** Props spread to the viewport element */
+    /** Props passed down to the viewport element */
     viewportProps?: React.ComponentPropsWithRef<'div'>;
     /** Called with current position (`x` and `y` coordinates) when viewport is scrolled */
     onScrollPositionChange?(position: {

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

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+export type Sizes = {
+    content: number;
+    viewport: number;
+    scrollbar: {
+        size: number;
+        paddingStart: number;
+        paddingEnd: number;
+    };
+};
+export interface ScrollAreaScrollbarAxisPrivateProps {
+    hasThumb: boolean;
+    sizes: Sizes;
+    onSizesChange(sizes: Sizes): void;
+    onThumbChange(thumb: HTMLDivElement | null): void;
+    onThumbPointerDown(pointerPos: number): void;
+    onThumbPointerUp(): void;
+    onThumbPositionChange(): void;
+    onWheelScroll(scrollPos: number): void;
+    onDragScroll(pointerPos: number): void;
+}
+export interface ScrollAreaScrollbarAxisProps extends ScrollAreaScrollbarAxisPrivateProps, React.ComponentPropsWithoutRef<'div'> {
+}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+interface ScrollAreaCornerProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+export declare const Corner: React.ForwardRefExoticComponent<ScrollAreaCornerProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ScrollAreaCorner: React.ForwardRefExoticComponent<ScrollAreaCornerProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,29 @@
+import React from 'react';
+import { BoxProps, ElementProps, Factory } from '../../../core';
+export type ScrollAreaRootStylesNames = 'root' | 'viewport' | 'viewportInner' | 'scrollbar' | 'thumb' | 'corner';
+export type ScrollAreaRootCssVariables = {
+    root: '--sa-corner-width' | '--sa-corner-height';
+};
+export interface ScrollAreaRootStylesCtx {
+    cornerWidth: number;
+    cornerHeight: number;
+}
+export interface ScrollAreaRootProps extends BoxProps, ElementProps<'div'> {
+    /**
+     * 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
+     * */
+    type?: 'auto' | 'always' | 'scroll' | 'hover' | 'never';
+    /** Scroll hide delay in ms, applicable only when type is set to `hover` or `scroll`, `1000` by default */
+    scrollHideDelay?: number;
+}
+export type ScrollAreaRootFactory = Factory<{
+    props: ScrollAreaRootProps;
+    ref: HTMLDivElement;
+    stylesNames: ScrollAreaRootStylesNames;
+}>;
+export declare const ScrollAreaRoot: React.ForwardRefExoticComponent<ScrollAreaRootProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
+interface ScrollAreaScrollbarProps extends ScrollAreaScrollbarVisibleProps {
+    forceMount?: true;
+}
+export declare const ScrollAreaScrollbar: React.ForwardRefExoticComponent<ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
+export interface ScrollAreaScrollbarAutoProps extends ScrollAreaScrollbarVisibleProps {
+    forceMount?: true;
+}
+export declare const ScrollAreaScrollbarAuto: React.ForwardRefExoticComponent<ScrollAreaScrollbarAutoProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto';
+interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {
+    forceMount?: true;
+}
+export declare const ScrollAreaScrollbarHover: React.ForwardRefExoticComponent<ScrollAreaScrollbarHoverProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ScrollAreaScrollbarVisibleProps } from './ScrollAreaScrollbarVisible';
+interface ScrollAreaScrollbarScrollProps extends ScrollAreaScrollbarVisibleProps {
+    forceMount?: true;
+}
+export declare const ScrollAreaScrollbarScroll: React.ForwardRefExoticComponent<ScrollAreaScrollbarScrollProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ScrollAreaScrollbarAxisPrivateProps, ScrollAreaScrollbarAxisProps } from '../ScrollArea.types';
+export interface ScrollAreaScrollbarVisibleProps extends Omit<ScrollAreaScrollbarAxisProps, keyof ScrollAreaScrollbarAxisPrivateProps> {
+    orientation?: 'horizontal' | 'vertical';
+}
+export declare const ScrollAreaScrollbarVisible: React.ForwardRefExoticComponent<ScrollAreaScrollbarVisibleProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+export interface ScrollbarContextValue {
+    hasThumb: boolean;
+    scrollbar: HTMLDivElement | null;
+    onThumbChange(thumb: HTMLDivElement | null): void;
+    onThumbPointerUp(): void;
+    onThumbPointerDown(pointerPos: {
+        x: number;
+        y: number;
+    }): void;
+    onThumbPositionChange(): void;
+}
+export declare const ScrollbarProvider: ({ children, value }: {
+    value: ScrollbarContextValue;
+    children: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, useScrollbarContext: () => ScrollbarContextValue;

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import { Sizes } from '../ScrollArea.types';
+import { ScrollbarContextValue } from './Scrollbar.context';
+export interface ScrollbarPrivateProps {
+    sizes: Sizes;
+    hasThumb: boolean;
+    onThumbChange: ScrollbarContextValue['onThumbChange'];
+    onThumbPointerUp: ScrollbarContextValue['onThumbPointerUp'];
+    onThumbPointerDown: ScrollbarContextValue['onThumbPointerDown'];
+    onThumbPositionChange: ScrollbarContextValue['onThumbPositionChange'];
+    onWheelScroll(event: WheelEvent, maxScrollPos: number): void;
+    onDragScroll(pointerPos: {
+        x: number;
+        y: number;
+    }): void;
+    onResize(): void;
+}
+interface ScrollbarProps extends ScrollbarPrivateProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'onResize'> {
+}
+export declare const Scrollbar: React.ForwardRefExoticComponent<ScrollbarProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types';
+export declare const ScrollAreaScrollbarX: React.ForwardRefExoticComponent<ScrollAreaScrollbarAxisProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types';
+export declare const ScrollAreaScrollbarY: React.ForwardRefExoticComponent<ScrollAreaScrollbarAxisProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,9 @@
+import React from 'react';
+interface ThumbProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+export declare const Thumb: React.ForwardRefExoticComponent<ThumbProps & React.RefAttributes<HTMLDivElement>>;
+interface ScrollAreaThumbProps extends ThumbProps {
+    forceMount?: true;
+}
+export declare const ScrollAreaThumb: React.ForwardRefExoticComponent<ScrollAreaThumbProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,5 @@
+import React from 'react';
+import { BoxProps, ElementProps } from '../../../core';
+export interface ScrollAreaViewportProps extends BoxProps, ElementProps<'div'> {
+}
+export declare const ScrollAreaViewport: React.ForwardRefExoticComponent<ScrollAreaViewportProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -1,2 +1,2 @@
-export { ScrollArea } from './ScrollArea';
-export type { ScrollAreaProps, ScrollAreaAutosizeProps, ScrollAreaStylesNames, ScrollAreaCssVariables, ScrollAreaFactory, ScrollAreaVariant, } from './ScrollArea';
+export { ScrollArea, ScrollAreaAutosize } from './ScrollArea';
+export type { ScrollAreaProps, ScrollAreaAutosizeProps, ScrollAreaStylesNames, ScrollAreaCssVariables, ScrollAreaFactory, } from './ScrollArea';

package/lib/components/ScrollArea/use-resize-observer.d.ts

@@ -0,0 +1 @@
+export declare function useResizeObserver(element: HTMLElement | null, onResize: () => void): void;

package/lib/components/ScrollArea/utils/add-unlinked-scroll-listener.d.ts

@@ -0,0 +1 @@
+export declare function addUnlinkedScrollListener(node: HTMLElement, handler?: () => void): () => void;

package/lib/components/ScrollArea/utils/compose-event-handlers.d.ts

@@ -0,0 +1,3 @@
+export declare function composeEventHandlers<E>(originalEventHandler?: (event: E) => void, ourEventHandler?: (event: E) => void, { checkForDefaultPrevented }?: {
+    checkForDefaultPrevented?: boolean | undefined;
+}): (event: E) => void;

package/lib/components/ScrollArea/utils/get-scroll-position-from-pointer.d.ts

@@ -0,0 +1,2 @@
+import type { Sizes } from '../ScrollArea.types';
+export declare function getScrollPositionFromPointer(pointerPos: number, pointerOffset: number, sizes: Sizes, dir?: 'ltr' | 'rtl'): number;

package/lib/components/ScrollArea/utils/get-thumb-offset-from-scroll.d.ts

@@ -0,0 +1,2 @@
+import type { Sizes } from '../ScrollArea.types';
+export declare function getThumbOffsetFromScroll(scrollPos: number, sizes: Sizes, dir?: 'rtl' | 'ltr'): number;

package/lib/components/ScrollArea/utils/get-thumb-ratio.d.ts

@@ -0,0 +1 @@
+export declare function getThumbRatio(viewportSize: number, contentSize: number): number;

package/lib/components/ScrollArea/utils/get-thumb-size.d.ts

@@ -0,0 +1,2 @@
+import type { Sizes } from '../ScrollArea.types';
+export declare function getThumbSize(sizes: Sizes): number;

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

@@ -0,0 +1,8 @@
+export { isScrollingWithinScrollbarBounds } from './is-scrolling-within-scrollbar-bounds';
+export { getThumbRatio } from './get-thumb-ratio';
+export { getThumbSize } from './get-thumb-size';
+export { composeEventHandlers } from './compose-event-handlers';
+export { toInt } from './to-int';
+export { getThumbOffsetFromScroll } from './get-thumb-offset-from-scroll';
+export { getScrollPositionFromPointer } from './get-scroll-position-from-pointer';
+export { addUnlinkedScrollListener } from './add-unlinked-scroll-listener';

package/lib/components/ScrollArea/utils/is-scrolling-within-scrollbar-bounds.d.ts

@@ -0,0 +1 @@
+export declare function isScrollingWithinScrollbarBounds(scrollPos: number, maxScrollPos: number): boolean;

package/lib/components/ScrollArea/utils/linear-scale.d.ts

@@ -0,0 +1 @@
+export declare function linearScale(input: readonly [number, number], output: readonly [number, number]): (value: number) => number;

package/lib/components/ScrollArea/utils/to-int.d.ts

@@ -0,0 +1 @@
+export declare function toInt(value?: string): number;

package/lib/components/SegmentedControl/SegmentedControl.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineSize, MantineRadius, Factory } from '../../core';
 export type SegmentedControlStylesNames = 'root' | 'input' | 'label' | 'control' | 'indicator';
-export type SegmentedControlVariant = string;
 export type SegmentedControlCssVariables = {
     root: '--sc-radius' | '--sc-color' | '--sc-font-size' | '--sc-padding' | '--sc-shadow' | '--sc-transition-duration' | '--sc-transition-timing-function';
 };
@@ -19,9 +18,9 @@ export interface SegmentedControlProps extends BoxProps, StylesApiProps<Segmente
     defaultValue?: string;
     /** Called when value changes */
     onChange?(value: string): void;
-    /** Determines whether component is disabled */
+    /** Determines whether the component is disabled */
     disabled?: boolean;
-    /** Name of the radio group, by default random id is generated */
+    /** Name of the radio group, by default random name is generated */
     name?: string;
     /** Determines whether the component should take 100% width of its parent, `false` by default */
     fullWidth?: boolean;
@@ -29,15 +28,15 @@ export interface SegmentedControlProps extends BoxProps, StylesApiProps<Segmente
     color?: MantineColor;
     /** Controls `font-size`, `padding` and `height` properties, `'sm'` by default */
     size?: MantineSize | (string & {});
-    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem (1rem = 16px), `theme.defaultRadius` by default */
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem, `theme.defaultRadius` by default */
     radius?: MantineRadius | (string & {}) | number;
-    /** Indicator `transition-duration` in ms, set to 0 to turn off transitions, `200` by default */
+    /** Indicator `transition-duration` in ms, set `0` to turn off transitions, `200` by default */
     transitionDuration?: number;
     /** Indicator `transition-timing-function` property, `ease` by default */
     transitionTimingFunction?: string;
     /** Determines in which orientation component id displayed, `'horizontal'` by default */
     orientation?: 'vertical' | 'horizontal';
-    /** Determines whether value can be changed */
+    /** Determines whether the value can be changed */
     readOnly?: boolean;
 }
 export type SegmentedControlFactory = Factory<{

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

@@ -1,2 +1,2 @@
 export { SegmentedControl } from './SegmentedControl';
-export type { SegmentedControlCssVariables, SegmentedControlFactory, SegmentedControlItem, SegmentedControlProps, SegmentedControlStylesNames, SegmentedControlVariant, } from './SegmentedControl';
+export type { SegmentedControlCssVariables, SegmentedControlFactory, SegmentedControlItem, SegmentedControlProps, SegmentedControlStylesNames, } from './SegmentedControl';

package/lib/components/Select/Select.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../core';
+import { __InputStylesNames, __BaseInputProps, InputVariant } from '../Input';
+import { ComboboxLikeProps, ComboboxLikeStylesNames } from '../Combobox';
+export type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames;
+export interface SelectProps extends BoxProps, __BaseInputProps, ComboboxLikeProps, StylesApiProps<SelectFactory>, ElementProps<'input', 'onChange' | 'size' | 'value' | 'defaultValue'> {
+    /** Controlled component value */
+    value?: string | null;
+    /** Uncontrolled component default value */
+    defaultValue?: string | null;
+    /** Called when value changes */
+    onChange?(value: string | null): void;
+    /** Determines whether the select should be searchable, `false` by default */
+    searchable?: boolean;
+    /** Determines whether check icon should be displayed near the selected option label, `true` by default */
+    withCheckIcon?: boolean;
+    /** Position of the check icon relative to the option label, `'left'` by default */
+    checkIconPosition?: 'left' | 'right';
+    /** Message displayed when no option matched current search query, only applicable when `searchable` prop is set */
+    nothingFoundMessage?: React.ReactNode;
+}
+export type SelectFactory = Factory<{
+    props: SelectProps;
+    ref: HTMLInputElement;
+    stylesNames: SelectStylesNames;
+    variant: InputVariant;
+}>;
+export declare const Select: import("../../core").MantineComponent<{
+    props: SelectProps;
+    ref: HTMLInputElement;
+    stylesNames: SelectStylesNames;
+    variant: InputVariant;
+}>;

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

@@ -0,0 +1,2 @@
+export { Select } from './Select';
+export type { SelectProps, SelectStylesNames, SelectFactory } from './Select';

package/lib/components/SimpleGrid/SimpleGrid.d.ts

@@ -0,0 +1,20 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory, StyleProp, MantineSpacing } from '../../core';
+export type SimpleGridStylesNames = 'root';
+export interface SimpleGridProps extends BoxProps, StylesApiProps<SimpleGridFactory>, ElementProps<'div'> {
+    /** Number of columns, `1` by default */
+    cols?: StyleProp<number>;
+    /** Spacing between columns, `'md'` by default */
+    spacing?: StyleProp<MantineSpacing | (string & {}) | number>;
+    /** Spacing between rows, `'md'` by default */
+    verticalSpacing?: StyleProp<MantineSpacing | (string & {}) | number>;
+}
+export type SimpleGridFactory = Factory<{
+    props: SimpleGridProps;
+    ref: HTMLDivElement;
+    stylesNames: SimpleGridStylesNames;
+}>;
+export declare const SimpleGrid: import("../../core").MantineComponent<{
+    props: SimpleGridProps;
+    ref: HTMLDivElement;
+    stylesNames: SimpleGridStylesNames;
+}>;

package/lib/components/SimpleGrid/SimpleGridVariables.d.ts

@@ -0,0 +1,6 @@
+import type { SimpleGridProps } from './SimpleGrid';
+interface SimpleGridVariablesProps extends SimpleGridProps {
+    selector: string;
+}
+export declare function SimpleGridVariables({ spacing, verticalSpacing, cols, selector, }: SimpleGridVariablesProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,2 @@
+export { SimpleGrid } from './SimpleGrid';
+export type { SimpleGridFactory, SimpleGridProps, SimpleGridStylesNames } from './SimpleGrid';

package/lib/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../core';
+export type SkeletonStylesNames = 'root';
+export type SkeletonCssVariables = {
+    root: '--skeleton-width' | '--skeleton-height' | '--skeleton-radius';
+};
+export interface SkeletonProps extends BoxProps, StylesApiProps<SkeletonFactory>, ElementProps<'div'> {
+    /** Determines whether Skeleton overlay should be displayed, `true` by default */
+    visible?: boolean;
+    /** Skeleton `height`, numbers are converted to rem, `auto` by default */
+    height?: React.CSSProperties['height'];
+    /** Skeleton `width`, numbers are converted to rem, `100%` by default, ignored when `circle` prop is set */
+    width?: React.CSSProperties['width'];
+    /** If set, Skeleton `width` and `border-radius` are equal to its `height`, `false` by default */
+    circle?: boolean;
+    /** Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. `theme.defaultRadius` by default. */
+    radius?: React.CSSProperties['borderRadius'];
+    /** Determines whether Skeleton should be animated, `true` by default */
+    animate?: boolean;
+}
+export type SkeletonFactory = Factory<{
+    props: SkeletonProps;
+    ref: HTMLDivElement;
+    stylesNames: SkeletonStylesNames;
+    vars: SkeletonCssVariables;
+}>;
+export declare const Skeleton: import("../../core").MantineComponent<{
+    props: SkeletonProps;
+    ref: HTMLDivElement;
+    stylesNames: SkeletonStylesNames;
+    vars: SkeletonCssVariables;
+}>;

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

@@ -0,0 +1,2 @@
+export { Skeleton } from './Skeleton';
+export type { SkeletonCssVariables, SkeletonFactory, SkeletonProps, SkeletonStylesNames, } from './Skeleton';

package/lib/components/Slider/Marks/Marks.d.ts

@@ -11,7 +11,7 @@ export interface MarksProps {
     disabled: boolean | undefined;
     inverted: boolean | undefined;
 }
-export declare function Marks({ marks, min, max, disabled, value, offset, inverted }: MarksProps): JSX.Element | null;
+export declare function Marks({ marks, min, max, disabled, value, offset, inverted }: MarksProps): import("react/jsx-runtime").JSX.Element | null;
 export declare namespace Marks {
     var displayName: string;
 }

package/lib/components/Slider/RangeSlider/RangeSlider.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineRadius, MantineSize, Factory } from '../../../core';
-import { MantineTransition } from '../../Transition';
-import { SliderStylesNames, SliderCssVariables, SliderVariant } from '../Slider.context';
+import { TransitionOverride } from '../../Transition';
+import { SliderStylesNames, SliderCssVariables } from '../Slider.context';
 export type RangeSliderValue = [number, number];
 export interface RangeSliderProps extends BoxProps, StylesApiProps<RangeSliderFactory>, ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {
     /** Key of `theme.colors` or any valid CSS color, controls color of track and thumb, `theme.primaryColor` by default */
     color?: MantineColor;
-    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem (1rem = 16px), `'xl'` by default */
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem, `'xl'` by default */
     radius?: MantineRadius | (string & {}) | number;
     /** Controls size of the track, `'md'` by default */
     size?: MantineSize | (string & {}) | number;
@@ -28,32 +28,28 @@ export interface RangeSliderProps extends BoxProps, StylesApiProps<RangeSliderFa
     onChangeEnd?(value: RangeSliderValue): void;
     /** Hidden input name, use with uncontrolled component */
     name?: string;
-    /** Marks which will be placed on the track */
+    /** Marks displayed on the track */
     marks?: {
         value: number;
         label?: React.ReactNode;
     }[];
     /** Function to generate label or any react node to render instead, set to null to disable label */
     label?: React.ReactNode | ((value: number) => React.ReactNode);
-    /** Label appear/disappear transition, `'skew-down'` by default */
-    labelTransition?: MantineTransition;
-    /** Label appear/disappear transition duration in ms, `0` by default */
-    labelTransitionDuration?: number;
-    /** Label appear/disappear transition timing function, `'ease'` by default */
-    labelTransitionTimingFunction?: string;
-    /** Determines whether label should be visible when slider is not being dragged or hovered, `false` by default */
+    /** Props passed down to the `Transition` component, `{ transition: 'fade', duration: 0 }` by default */
+    labelTransitionProps?: TransitionOverride;
+    /** Determines whether the label should be visible when the slider is not being dragged or hovered, `false` by default */
     labelAlwaysOn?: boolean;
-    /** Determines whether thumb label should be displayed when slider is hovered, `true` by default */
+    /** Determines whether thumb label should be displayed when the slider is hovered, `true` by default */
     showLabelOnHover?: boolean;
     /** Content rendered inside thumb */
     thumbChildren?: React.ReactNode;
     /** Disables slider */
     disabled?: boolean;
-    /** Thumb width and height, by default value is computed based on `size` */
+    /** Thumb `width` and `height`, by default value is computed based on `size` prop */
     thumbSize?: number | string;
-    /** A transformation function, to change the scale of the slider */
+    /** A transformation function to change the scale of the slider */
     scale?(value: number): number;
-    /** Determines whether track value should be inverted, `false` by default */
+    /** Determines whether track values representation should be inverted, `false` by default */
     inverted?: boolean;
     /** Minimal range interval, `10` by default */
     minRange?: number;
@@ -69,12 +65,10 @@ export type RangeSliderFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: SliderStylesNames;
     vars: SliderCssVariables;
-    variant: SliderVariant;
 }>;
 export declare const RangeSlider: import("../../../core").MantineComponent<{
     props: RangeSliderProps;
     ref: HTMLDivElement;
     stylesNames: SliderStylesNames;
     vars: SliderCssVariables;
-    variant: SliderVariant;
 }>;

package/lib/components/Slider/Slider/Slider.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineRadius, MantineSize, Factory } from '../../../core';
-import { MantineTransition } from '../../Transition';
-import { SliderCssVariables, SliderStylesNames, SliderVariant } from '../Slider.context';
+import { TransitionOverride } from '../../Transition';
+import { SliderCssVariables, SliderStylesNames } from '../Slider.context';
 export interface SliderProps extends BoxProps, StylesApiProps<SliderFactory>, ElementProps<'div', 'onChange'> {
     /** Key of `theme.colors` or any valid CSS color, controls color of track and thumb, `theme.primaryColor` by default */
     color?: MantineColor;
-    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem (1rem = 16px), `'xl'` by default */
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem, `'xl'` by default */
     radius?: MantineRadius | (string & {}) | number;
     /** Controls size of the track, `'md'` by default */
     size?: MantineSize | (string & {}) | number;
@@ -27,34 +27,30 @@ export interface SliderProps extends BoxProps, StylesApiProps<SliderFactory>, El
     onChangeEnd?(value: number): void;
     /** Hidden input name, use with uncontrolled component */
     name?: string;
-    /** Marks which will be placed on the track */
+    /** Marks displayed on the track */
     marks?: {
         value: number;
         label?: React.ReactNode;
     }[];
     /** Function to generate label or any react node to render instead, set to null to disable label */
     label?: React.ReactNode | ((value: number) => React.ReactNode);
-    /** Label appear/disappear transition, `'skew-down'` by default */
-    labelTransition?: MantineTransition;
-    /** Label appear/disappear transition duration in ms, `0` by default */
-    labelTransitionDuration?: number;
-    /** Label appear/disappear transition timing function, `'ease'` by default */
-    labelTransitionTimingFunction?: string;
-    /** Determines whether label should be visible when slider is not being dragged or hovered, `false` by default */
+    /** Props passed down to the `Transition` component, `{ transition: 'fade', duration: 0 }` by default */
+    labelTransitionProps?: TransitionOverride;
+    /** Determines whether the label should be visible when the slider is not being dragged or hovered, `false` by default */
     labelAlwaysOn?: boolean;
     /** Thumb `aria-label` */
     thumbLabel?: string;
-    /** Determines whether thumb label should be displayed when slider is hovered, `true` by default */
+    /** Determines whether thumb label should be displayed when the slider is hovered, `true` by default */
     showLabelOnHover?: boolean;
     /** Content rendered inside thumb */
     thumbChildren?: React.ReactNode;
     /** Disables slider */
     disabled?: boolean;
-    /** Thumb width and height, by default value is computed based on `size` */
+    /** Thumb `width` and `height`, by default value is computed based on `size` prop */
     thumbSize?: number | string;
-    /** A transformation function, to change the scale of the slider */
+    /** A transformation function to change the scale of the slider */
     scale?(value: number): number;
-    /** Determines whether track value should be inverted, `false` by default */
+    /** Determines whether track value representation should be inverted, `false` by default */
     inverted?: boolean;
 }
 export type SliderFactory = Factory<{
@@ -62,12 +58,10 @@ export type SliderFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: SliderStylesNames;
     vars: SliderCssVariables;
-    variant: SliderVariant;
 }>;
 export declare const Slider: import("../../../core").MantineComponent<{
     props: SliderProps;
     ref: HTMLDivElement;
     stylesNames: SliderStylesNames;
     vars: SliderCssVariables;
-    variant: SliderVariant;
 }>;

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

@@ -1,9 +1,9 @@
+/// <reference types="react" />
 import { GetStylesApi } from '../../core';
 export type SliderStylesNames = 'root' | 'label' | 'thumb' | 'trackContainer' | 'track' | 'bar' | 'markWrapper' | 'mark' | 'markLabel';
 export type SliderCssVariables = {
     root: '--slider-size' | '--slider-color' | '--slider-thumb-size' | '--slider-radius';
 };
-export type SliderVariant = string;
 interface SliderContextValue {
     getStyles: GetStylesApi<{
         stylesNames: SliderStylesNames;
@@ -16,5 +16,5 @@ interface SliderContextValue {
 export declare const SliderProvider: ({ children, value }: {
     value: SliderContextValue;
     children: import("react").ReactNode;
-}) => JSX.Element, useSliderContext: () => SliderContextValue;
+}) => import("react/jsx-runtime").JSX.Element, useSliderContext: () => SliderContextValue;
 export {};