@mantine/core 7.0.0-alpha.17 → 7.0.0-alpha.18

package/lib/components/Modal/Modal.d.ts

@@ -9,7 +9,6 @@ import { ModalContent } from './ModalContent';
 import { ModalTitle } from './ModalTitle';
 import { ModalHeader } from './ModalHeader';
 export type ModalStylesNames = ModalRootStylesNames;
-export type ModalVariant = string;
 export type ModalCssVariables = ModalRootCssVariables;
 export interface ModalProps extends ModalRootProps {
     __staticSelector?: string;
@@ -31,7 +30,6 @@ export type ModalFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: ModalStylesNames;
     vars: ModalCssVariables;
-    variant: ModalVariant;
     staticComponents: {
         Root: typeof ModalRoot;
         Overlay: typeof ModalOverlay;
@@ -47,7 +45,6 @@ export declare const Modal: import("../../core").MantineComponent<{
     ref: HTMLDivElement;
     stylesNames: ModalStylesNames;
     vars: ModalCssVariables;
-    variant: ModalVariant;
     staticComponents: {
         Root: typeof ModalRoot;
         Overlay: typeof ModalOverlay;

package/lib/components/Modal/ModalRoot.d.ts

@@ -3,7 +3,6 @@ import { StylesApiProps, Factory, MantineRadius } from '../../core';
 import { ModalBaseProps, ModalBaseStylesNames } from '../ModalBase';
 import { ScrollAreaComponent } from './Modal.context';
 export type ModalRootStylesNames = ModalBaseStylesNames;
-export type ModalRootVariant = string;
 export type ModalRootCssVariables = {
     root: '--modal-radius' | '--modal-size' | '--modal-y-offset' | '--modal-x-offset';
 };
@@ -27,7 +26,6 @@ export type ModalRootFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: ModalRootStylesNames;
     vars: ModalRootCssVariables;
-    variant: ModalRootVariant;
     compound: true;
 }>;
 export declare const ModalRoot: import("../../core").MantineComponent<{
@@ -35,6 +33,5 @@ export declare const ModalRoot: import("../../core").MantineComponent<{
     ref: HTMLDivElement;
     stylesNames: ModalRootStylesNames;
     vars: ModalRootCssVariables;
-    variant: ModalRootVariant;
     compound: true;
 }>;

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

@@ -6,7 +6,7 @@ export { ModalContent } from './ModalContent';
 export { ModalHeader } from './ModalHeader';
 export { ModalOverlay } from './ModalOverlay';
 export { ModalTitle } from './ModalTitle';
-export type { ModalCssVariables, ModalFactory, ModalProps, ModalStylesNames, ModalVariant, } from './Modal';
+export type { ModalCssVariables, ModalFactory, ModalProps, ModalStylesNames } from './Modal';
 export type { ModalRootProps } from './ModalRoot';
 export type { ModalBodyProps } from './ModalBody';
 export type { ModalCloseButtonProps } from './ModalCloseButton';

package/lib/components/Notification/Notification.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, Factory, MantineRadius, MantineColor } from '../../core';
 export type NotificationStylesNames = 'root' | 'icon' | 'loader' | 'body' | 'title' | 'description' | 'closeButton';
-export type NotificationVariant = string;
 export type NotificationCssVariables = {
     root: '--notification-radius' | '--notification-color';
 };
@@ -33,12 +32,10 @@ export type NotificationFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: NotificationStylesNames;
     vars: NotificationCssVariables;
-    variant: NotificationVariant;
 }>;
 export declare const Notification: import("../../core").MantineComponent<{
     props: NotificationProps;
     ref: HTMLDivElement;
     stylesNames: NotificationStylesNames;
     vars: NotificationCssVariables;
-    variant: NotificationVariant;
 }>;

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

@@ -1,2 +1,2 @@
 export { Notification } from './Notification';
-export type { NotificationCssVariables, NotificationFactory, NotificationProps, NotificationStylesNames, NotificationVariant, } from './Notification';
+export type { NotificationCssVariables, NotificationFactory, NotificationProps, NotificationStylesNames, } from './Notification';

package/lib/components/Overlay/Overlay.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, PolymorphicFactory, MantineRadius } from '../../core';
 export type OverlayStylesNames = 'root';
-export type OverlayVariant = string;
 export type OverlayCssVariables = {
     root: '--overlay-bg' | '--overlay-filter' | '--overlay-radius' | '--overlay-z-index';
 };
@@ -31,7 +30,6 @@ export type OverlayFactory = PolymorphicFactory<{
     defaultComponent: 'div';
     stylesNames: OverlayStylesNames;
     vars: OverlayCssVariables;
-    variant: OverlayVariant;
 }>;
 export declare const Overlay: (<C = "div">(props: import("../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, OverlayProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(OverlayProps & {
     component?: any;
@@ -45,12 +43,10 @@ export declare const Overlay: (<C = "div">(props: import("../../core/factory/cre
     defaultComponent: 'div';
     stylesNames: OverlayStylesNames;
     vars: OverlayCssVariables;
-    variant: OverlayVariant;
 }> & import("../../core/factory/factory").ComponentClasses<{
     props: OverlayProps;
     defaultRef: HTMLDivElement;
     defaultComponent: 'div';
     stylesNames: OverlayStylesNames;
     vars: OverlayCssVariables;
-    variant: OverlayVariant;
 }> & Record<string, never>;

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

@@ -1,2 +1,2 @@
 export { Overlay } from './Overlay';
-export type { OverlayCssVariables, OverlayFactory, OverlayProps, OverlayStylesNames, OverlayVariant, } from './Overlay';
+export type { OverlayCssVariables, OverlayFactory, OverlayProps, OverlayStylesNames, } from './Overlay';

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

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { GetStylesApi } from '../../core';
+import type { PaginationRootFactory } from './PaginationRoot/PaginationRoot';
+interface PaginationContext {
+    total: number;
+    range: (number | 'dots')[];
+    active: number;
+    disabled: boolean | undefined;
+    getItemProps?(page: number): Record<string, any>;
+    onChange(page: number): void;
+    onNext(): void;
+    onPrevious(): void;
+    onFirst(): void;
+    onLast(): void;
+    getStyles: GetStylesApi<PaginationRootFactory>;
+}
+export declare const PaginationProvider: ({ children, value }: {
+    value: PaginationContext;
+    children: import("react").ReactNode;
+}) => JSX.Element, usePaginationContext: () => PaginationContext;
+export {};

package/lib/components/Pagination/Pagination.d.ts

@@ -0,0 +1,61 @@
+import { Factory, MantineSize } from '../../core';
+import { PaginationRoot, PaginationRootCssVariables, PaginationRootProps, PaginationRootStylesNames } from './PaginationRoot/PaginationRoot';
+import { PaginationControl } from './PaginationControl/PaginationControl';
+import { PaginationDots } from './PaginationDots/PaginationDots';
+import { PaginationFirst, PaginationLast, PaginationNext, PaginationPrevious } from './PaginationEdges/PaginationEdges';
+import { PaginationItems } from './PaginationItems/PaginationItems';
+import { PaginationIcon } from './Pagination.icons';
+export type PaginationStylesNames = PaginationRootStylesNames;
+export type PaginationCssVariables = PaginationRootCssVariables;
+export interface PaginationProps extends PaginationRootProps {
+    /** Determines whether first/last controls should be rendered, false by default */
+    withEdges?: boolean;
+    /** Determines whether next/previous controls should be rendered, true by default */
+    withControls?: boolean;
+    /** Adds props to next/previous/first/last controls */
+    getControlProps?(control: 'first' | 'previous' | 'last' | 'next'): Record<string, any>;
+    /** Next control icon component */
+    nextIcon?: PaginationIcon;
+    /** Previous control icon component */
+    previousIcon?: PaginationIcon;
+    /** Last control icon component */
+    lastIcon?: PaginationIcon;
+    /** First control icon component */
+    firstIcon?: PaginationIcon;
+    /** Dots icon component */
+    dotsIcon?: PaginationIcon;
+    /** Key of `theme.spacing`, gap between controls, `8` by default */
+    gap?: MantineSize | (string & {}) | number;
+}
+export type PaginationFactory = Factory<{
+    props: PaginationProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationStylesNames;
+    vars: PaginationCssVariables;
+    staticComponents: {
+        Root: typeof PaginationRoot;
+        Control: typeof PaginationControl;
+        Dots: typeof PaginationDots;
+        First: typeof PaginationFirst;
+        Last: typeof PaginationLast;
+        Next: typeof PaginationNext;
+        Previous: typeof PaginationPrevious;
+        Items: typeof PaginationItems;
+    };
+}>;
+export declare const Pagination: import("../../core").MantineComponent<{
+    props: PaginationProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationStylesNames;
+    vars: PaginationCssVariables;
+    staticComponents: {
+        Root: typeof PaginationRoot;
+        Control: typeof PaginationControl;
+        Dots: typeof PaginationDots;
+        First: typeof PaginationFirst;
+        Last: typeof PaginationLast;
+        Next: typeof PaginationNext;
+        Previous: typeof PaginationPrevious;
+        Items: typeof PaginationItems;
+    };
+}>;

package/lib/components/Pagination/Pagination.icons.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+interface _PaginationIconProps extends React.ComponentPropsWithoutRef<'svg'> {
+    path: string;
+}
+export type PaginationIconProps = Omit<_PaginationIconProps, 'path'>;
+export type PaginationIcon = React.FC<PaginationIconProps>;
+export declare const PaginationNextIcon: (props: PaginationIconProps) => JSX.Element;
+export declare const PaginationPreviousIcon: (props: PaginationIconProps) => JSX.Element;
+export declare const PaginationFirstIcon: (props: PaginationIconProps) => JSX.Element;
+export declare const PaginationLastIcon: (props: PaginationIconProps) => JSX.Element;
+export declare const PaginationDotsIcon: (props: PaginationIconProps) => JSX.Element;
+export {};

package/lib/components/Pagination/PaginationControl/PaginationControl.d.ts

@@ -0,0 +1,20 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type PaginationControlStylesNames = 'control';
+export interface PaginationControlProps extends BoxProps, StylesApiProps<PaginationControlFactory>, ElementProps<'button'> {
+    /** Determines whether control should have active styles */
+    active?: boolean;
+    /** Determines whether control should have padding, true by default */
+    withPadding?: boolean;
+}
+export type PaginationControlFactory = Factory<{
+    props: PaginationControlProps;
+    ref: HTMLButtonElement;
+    stylesNames: PaginationControlStylesNames;
+    compound: true;
+}>;
+export declare const PaginationControl: import("../../../core").MantineComponent<{
+    props: PaginationControlProps;
+    ref: HTMLButtonElement;
+    stylesNames: PaginationControlStylesNames;
+    compound: true;
+}>;

package/lib/components/Pagination/PaginationDots/PaginationDots.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+import { PaginationIconProps } from '../Pagination.icons';
+export type PaginationDotsStylesNames = 'dots';
+export interface PaginationDotsProps extends BoxProps, StylesApiProps<PaginationDotsFactory>, ElementProps<'div'> {
+    /** Custom dots icon component, must accept svg element props and size prop */
+    icon?: React.FC<PaginationIconProps>;
+}
+export type PaginationDotsFactory = Factory<{
+    props: PaginationDotsProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationDotsStylesNames;
+    compound: true;
+}>;
+export declare const PaginationDots: import("../../../core").MantineComponent<{
+    props: PaginationDotsProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationDotsStylesNames;
+    compound: true;
+}>;

package/lib/components/Pagination/PaginationEdges/PaginationEdges.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+import { BoxProps } from '../../../core';
+import { PaginationIconProps } from '../Pagination.icons';
+export interface CreateEdgeComponent {
+    icon: React.FC<PaginationIconProps>;
+    name: string;
+    action: 'onNext' | 'onPrevious' | 'onFirst' | 'onLast';
+    type: 'next' | 'previous';
+}
+export interface PaginationEdgeProps extends BoxProps {
+    icon?: React.FC<PaginationIconProps>;
+}
+export declare function createEdgeComponent({ icon, name, action, type }: CreateEdgeComponent): (<C = "button">(props: import("../../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, PaginationEdgeProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(PaginationEdgeProps & {
+    component?: any;
+} & Omit<Omit<any, "ref">, "component" | keyof PaginationEdgeProps> & {
+    ref?: any;
+}) | (PaginationEdgeProps & {
+    component: React.ElementType<any>;
+})>, never> & Record<string, never>;
+export declare const PaginationNext: (<C = "button">(props: import("../../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, PaginationEdgeProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(PaginationEdgeProps & {
+    component?: any;
+} & Omit<Omit<any, "ref">, "component" | keyof PaginationEdgeProps> & {
+    ref?: any;
+}) | (PaginationEdgeProps & {
+    component: React.ElementType<any>;
+})>, never> & Record<string, never>;
+export declare const PaginationPrevious: (<C = "button">(props: import("../../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, PaginationEdgeProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(PaginationEdgeProps & {
+    component?: any;
+} & Omit<Omit<any, "ref">, "component" | keyof PaginationEdgeProps> & {
+    ref?: any;
+}) | (PaginationEdgeProps & {
+    component: React.ElementType<any>;
+})>, never> & Record<string, never>;
+export declare const PaginationFirst: (<C = "button">(props: import("../../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, PaginationEdgeProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(PaginationEdgeProps & {
+    component?: any;
+} & Omit<Omit<any, "ref">, "component" | keyof PaginationEdgeProps> & {
+    ref?: any;
+}) | (PaginationEdgeProps & {
+    component: React.ElementType<any>;
+})>, never> & Record<string, never>;
+export declare const PaginationLast: (<C = "button">(props: import("../../../core/factory/create-polymorphic-component").PolymorphicComponentProps<C, PaginationEdgeProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & Omit<React.FunctionComponent<(PaginationEdgeProps & {
+    component?: any;
+} & Omit<Omit<any, "ref">, "component" | keyof PaginationEdgeProps> & {
+    ref?: any;
+}) | (PaginationEdgeProps & {
+    component: React.ElementType<any>;
+})>, never> & Record<string, never>;

package/lib/components/Pagination/PaginationItems/PaginationItems.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { PaginationIcon } from '../Pagination.icons';
+export interface PaginationItemsProps {
+    /** Dots icon component */
+    dotsIcon?: PaginationIcon;
+}
+export declare function PaginationItems({ dotsIcon }: PaginationItemsProps): JSX.Element;
+export declare namespace PaginationItems {
+    var displayName: string;
+}

package/lib/components/Pagination/PaginationRoot/PaginationRoot.d.ts

@@ -0,0 +1,49 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory, MantineSize, MantineColor, MantineRadius } from '../../../core';
+export type PaginationRootStylesNames = 'root' | 'control' | 'dots';
+export type PaginationRootCssVariables = {
+    root: '--pagination-control-size' | '--pagination-control-radius' | '--pagination-control-fz' | '--pagination-active-bg';
+};
+export interface PaginationRootProps extends BoxProps, StylesApiProps<PaginationRootFactory>, ElementProps<'div', 'value' | 'onChange'> {
+    /** `height` and `min-width` of controls, `'md'` by default */
+    size?: MantineSize | (string & {}) | number;
+    /** Total number of pages, must be an integer */
+    total: number;
+    /** Active page for controlled component, must be an integer in [0, total] interval */
+    value?: number;
+    /** Active page for uncontrolled component, must be an integer in [0, total] interval */
+    defaultValue?: number;
+    /** Called when page changes */
+    onChange?(value: number): void;
+    /** Determines whether all controls should be disabled, `false` by default */
+    disabled?: boolean;
+    /** Number of siblings displayed on the left/right side of the selected page, `1` by default */
+    siblings?: number;
+    /** Number of elements visible on the left/right edges, `1` by default */
+    boundaries?: number;
+    /** Key of `theme.colors`, active item color, `theme.primaryColor` by default */
+    color?: MantineColor;
+    /** 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;
+    /** Called when next page control is clicked */
+    onNextPage?(): void;
+    /** Called when previous page control is clicked */
+    onPreviousPage?(): void;
+    /** Called when first page control is clicked */
+    onFirstPage?(): void;
+    /** Called when last page control is clicked */
+    onLastPage?(): void;
+    /** Additional props passed down to controls */
+    getItemProps?(page: number): Record<string, any>;
+}
+export type PaginationRootFactory = Factory<{
+    props: PaginationRootProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationRootStylesNames;
+    vars: PaginationRootCssVariables;
+}>;
+export declare const PaginationRoot: import("../../../core").MantineComponent<{
+    props: PaginationRootProps;
+    ref: HTMLDivElement;
+    stylesNames: PaginationRootStylesNames;
+    vars: PaginationRootCssVariables;
+}>;

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

@@ -0,0 +1,12 @@
+export { Pagination } from './Pagination';
+export { PaginationControl } from './PaginationControl/PaginationControl';
+export { PaginationDots } from './PaginationDots/PaginationDots';
+export { PaginationFirst, PaginationLast, PaginationNext, PaginationPrevious, } from './PaginationEdges/PaginationEdges';
+export { PaginationItems } from './PaginationItems/PaginationItems';
+export { PaginationRoot } from './PaginationRoot/PaginationRoot';
+export type { PaginationCssVariables, PaginationFactory, PaginationProps, PaginationStylesNames, } from './Pagination';
+export type { PaginationRootProps } from './PaginationRoot/PaginationRoot';
+export type { PaginationControlProps } from './PaginationControl/PaginationControl';
+export type { PaginationDotsProps } from './PaginationDots/PaginationDots';
+export type { PaginationEdgeProps } from './PaginationEdges/PaginationEdges';
+export type { PaginationItemsProps } from './PaginationItems/PaginationItems';

package/lib/components/Paper/Paper.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, MantineShadow, MantineRadius, PolymorphicFactory } from '../../core';
 export type PaperStylesNames = 'root';
-export type PaperVariant = string;
 export type PaperCssVariables = {
     root: '--paper-radius' | '--paper-shadow';
 };

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

@@ -1,2 +1,2 @@
 export { Paper } from './Paper';
-export type { PaperProps, PaperStylesNames, PaperCssVariables, PaperFactory, PaperVariant, } from './Paper';
+export type { PaperProps, PaperStylesNames, PaperCssVariables, PaperFactory } from './Paper';

package/lib/components/Pill/PillGroup/PillGroup.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, StylesApiProps, ElementProps, Factory, MantineSize } from '../../../core';
-export type PillGroupStylesNames = 'root';
+export type PillGroupStylesNames = 'group';
 export type PillGroupCssVariables = {
-    root: '--pg-gap';
+    group: '--pg-gap';
 };
 export interface PillGroupProps extends BoxProps, StylesApiProps<PillGroupFactory>, ElementProps<'div'> {
     /** Controls spacing between pills, by default controlled by `size` */

package/lib/components/PillsInput/PillsInputField/PillsInputField.d.ts

@@ -1,5 +1,5 @@
 import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
-export type PillsInputFieldStylesNames = 'root';
+export type PillsInputFieldStylesNames = 'field';
 export interface PillsInputFieldProps extends BoxProps, StylesApiProps<PillsInputFieldFactory>, ElementProps<'input', 'type'> {
     /** Controls input styles when focused. If `auto` the input is hidden when not focused. If `visible` the input will always remain visible. `'visible'` by default  */
     type?: 'auto' | 'visible' | 'hidden';

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

@@ -1,7 +1,6 @@
 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';
 };

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

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, ElementProps, Factory } from '../../../core';
 export type ScrollAreaRootStylesNames = 'root' | 'viewport' | 'viewportInner' | 'scrollbar' | 'thumb' | 'corner';
-export type ScrollAreaRootVariant = string;
 export type ScrollAreaRootCssVariables = {
     root: '--sa-corner-width' | '--sa-corner-height';
 };

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

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

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';
 };

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/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/RangeSlider/RangeSlider.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineRadius, MantineSize, Factory } from '../../../core';
 import { TransitionOverride } from '../../Transition';
-import { SliderStylesNames, SliderCssVariables, SliderVariant } from '../Slider.context';
+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 */
@@ -65,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,7 +1,7 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineRadius, MantineSize, Factory } from '../../../core';
 import { TransitionOverride } from '../../Transition';
-import { SliderCssVariables, SliderStylesNames, SliderVariant } from '../Slider.context';
+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;
@@ -58,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

@@ -4,7 +4,6 @@ export type SliderStylesNames = 'root' | 'label' | 'thumb' | 'trackContainer' |
 export type SliderCssVariables = {
     root: '--slider-size' | '--slider-color' | '--slider-thumb-size' | '--slider-radius';
 };
-export type SliderVariant = string;
 interface SliderContextValue {
     getStyles: GetStylesApi<{
         stylesNames: SliderStylesNames;

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

@@ -2,4 +2,4 @@ export { Slider } from './Slider/Slider';
 export { RangeSlider } from './RangeSlider/RangeSlider';
 export type { SliderFactory, SliderProps } from './Slider/Slider';
 export type { RangeSliderFactory, RangeSliderProps, RangeSliderValue, } from './RangeSlider/RangeSlider';
-export type { SliderStylesNames, SliderCssVariables, SliderVariant } from './Slider.context';
+export type { SliderStylesNames, SliderCssVariables } from './Slider.context';

package/lib/components/Stack/Stack.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps, StylesApiProps, ElementProps, MantineSpacing, Factory } from '../../core';
 export type StackStylesNames = 'root';
-export type StackVariant = string;
 export type StackCssVariables = {
     root: '--stack-gap' | '--stack-align' | '--stack-justify';
 };
@@ -18,12 +17,10 @@ export type StackFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: StackStylesNames;
     vars: StackCssVariables;
-    variant: StackVariant;
 }>;
 export declare const Stack: import("../../core").MantineComponent<{
     props: StackProps;
     ref: HTMLDivElement;
     stylesNames: StackStylesNames;
     vars: StackCssVariables;
-    variant: StackVariant;
 }>;

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

@@ -1,2 +1,2 @@
 export { Stack } from './Stack';
-export type { StackCssVariables, StackFactory, StackStylesNames, StackProps, StackVariant, } from './Stack';
+export type { StackCssVariables, StackFactory, StackStylesNames, StackProps } from './Stack';

package/lib/components/Switch/Switch.d.ts

@@ -3,7 +3,6 @@ import { BoxProps, StylesApiProps, ElementProps, MantineColor, MantineSize, Mant
 import { InlineInputStylesNames } from '../InlineInput';
 import { SwitchGroup } from './SwitchGroup/SwitchGroup';
 export type SwitchStylesNames = 'root' | 'track' | 'trackLabel' | 'thumb' | 'input' | InlineInputStylesNames;
-export type SwitchVariant = string;
 export type SwitchCssVariables = {
     root: '--switch-radius' | '--switch-height' | '--switch-width' | '--switch-thumb-size' | '--switch-label-font-size' | '--switch-track-label-padding' | '--switch-color';
 };
@@ -38,7 +37,6 @@ export type SwitchFactory = Factory<{
     ref: HTMLInputElement;
     stylesNames: SwitchStylesNames;
     vars: SwitchCssVariables;
-    variant: SwitchVariant;
     staticComponents: {
         Group: typeof SwitchGroup;
     };
@@ -48,7 +46,6 @@ export declare const Switch: import("../../core").MantineComponent<{
     ref: HTMLInputElement;
     stylesNames: SwitchStylesNames;
     vars: SwitchCssVariables;
-    variant: SwitchVariant;
     staticComponents: {
         Group: typeof SwitchGroup;
     };

package/lib/components/Switch/SwitchGroup/SwitchGroup.d.ts

@@ -2,7 +2,6 @@ import React from 'react';
 import { MantineSize, Factory } from '../../../core';
 import { InputWrapperStylesNames, InputWrapperProps } from '../../Input';
 export type SwitchGroupStylesNames = InputWrapperStylesNames;
-export type SwitchGroupVariant = string;
 export interface SwitchGroupProps extends Omit<InputWrapperProps, 'onChange'> {
     /** `Switch` components */
     children: React.ReactNode;

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

@@ -1,4 +1,4 @@
 export { Switch } from './Switch';
 export { SwitchGroup } from './SwitchGroup/SwitchGroup';
-export type { SwitchCssVariables, SwitchFactory, SwitchProps, SwitchStylesNames, SwitchVariant, } from './Switch';
-export type { SwitchGroupFactory, SwitchGroupProps, SwitchGroupStylesNames, SwitchGroupVariant, } from './SwitchGroup/SwitchGroup';
+export type { SwitchCssVariables, SwitchFactory, SwitchProps, SwitchStylesNames } from './Switch';
+export type { SwitchGroupFactory, SwitchGroupProps, SwitchGroupStylesNames, } from './SwitchGroup/SwitchGroup';