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

package/lib/components/Combobox/ComboboxFooter/ComboboxFooter.d.ts

@@ -0,0 +1,16 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type ComboboxFooterStylesNames = 'footer';
+export interface ComboboxFooterProps extends BoxProps, StylesApiProps<ComboboxFooterFactory>, ElementProps<'div'> {
+}
+export type ComboboxFooterFactory = Factory<{
+    props: ComboboxFooterProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxFooterStylesNames;
+    compound: true;
+}>;
+export declare const ComboboxFooter: import("../../../core").MantineComponent<{
+    props: ComboboxFooterProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxFooterStylesNames;
+    compound: true;
+}>;

package/lib/components/Combobox/ComboboxGroup/ComboboxGroup.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type ComboboxGroupStylesNames = 'group' | 'groupLabel';
+export interface ComboboxGroupProps extends BoxProps, StylesApiProps<ComboboxGroupFactory>, ElementProps<'div'> {
+    /** Group label */
+    label?: React.ReactNode;
+}
+export type ComboboxGroupFactory = Factory<{
+    props: ComboboxGroupProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxGroupStylesNames;
+    compound: true;
+}>;
+export declare const ComboboxGroup: import("../../../core").MantineComponent<{
+    props: ComboboxGroupProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxGroupStylesNames;
+    compound: true;
+}>;

package/lib/components/Combobox/ComboboxHeader/ComboboxHeader.d.ts

@@ -0,0 +1,16 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type ComboboxHeaderStylesNames = 'header';
+export interface ComboboxHeaderProps extends BoxProps, StylesApiProps<ComboboxHeaderFactory>, ElementProps<'div'> {
+}
+export type ComboboxHeaderFactory = Factory<{
+    props: ComboboxHeaderProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxHeaderStylesNames;
+    compound: true;
+}>;
+export declare const ComboboxHeader: import("../../../core").MantineComponent<{
+    props: ComboboxHeaderProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxHeaderStylesNames;
+    compound: true;
+}>;

package/lib/components/Combobox/ComboboxOption/ComboboxOption.d.ts

@@ -0,0 +1,24 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type ComboboxOptionStylesNames = 'option';
+export interface ComboboxOptionProps extends BoxProps, StylesApiProps<ComboboxOptionFactory>, ElementProps<'div'> {
+    /** Option value */
+    value: string;
+    /** Determines whether the option is selected */
+    active?: boolean;
+    /** Determines whether the option can be selected */
+    disabled?: boolean;
+    /** Determines whether item is selected, useful for virtualized comboboxes */
+    selected?: boolean;
+}
+export type ComboboxOptionFactory = Factory<{
+    props: ComboboxOptionProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxOptionStylesNames;
+    compound: true;
+}>;
+export declare const ComboboxOption: import("../../../core").MantineComponent<{
+    props: ComboboxOptionProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxOptionStylesNames;
+    compound: true;
+}>;

package/lib/components/Combobox/ComboboxOptions/ComboboxOptions.d.ts

@@ -0,0 +1,16 @@
+import { BoxProps, StylesApiProps, ElementProps, Factory } from '../../../core';
+export type ComboboxOptionsStylesNames = 'options';
+export interface ComboboxOptionsProps extends BoxProps, StylesApiProps<ComboboxOptionsFactory>, ElementProps<'div'> {
+}
+export type ComboboxOptionsFactory = Factory<{
+    props: ComboboxOptionsProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxOptionsStylesNames;
+    compound: true;
+}>;
+export declare const ComboboxOptions: import("../../../core").MantineComponent<{
+    props: ComboboxOptionsProps;
+    ref: HTMLDivElement;
+    stylesNames: ComboboxOptionsStylesNames;
+    compound: true;
+}>;

package/lib/components/Combobox/ComboboxSearch/ComboboxSearch.d.ts

@@ -0,0 +1,19 @@
+import { ElementProps, Factory } from '../../../core';
+import { InputProps, InputStylesNames } from '../../Input/Input';
+export type ComboboxSearchStylesNames = InputStylesNames;
+export interface ComboboxSearchProps extends InputProps, ElementProps<'input', 'size'> {
+    /** Determines whether the search input should have `aria-` attribute, `true` by default */
+    withAriaAttributes?: boolean;
+    /** Determines whether the search input should handle keyboard navigation, `true` by default */
+    withKeyboardNavigation?: boolean;
+}
+export type ComboboxSearchFactory = Factory<{
+    props: ComboboxSearchProps;
+    ref: HTMLInputElement;
+    stylesNames: ComboboxSearchStylesNames;
+}>;
+export declare const ComboboxSearch: import("../../../core").MantineComponent<{
+    props: ComboboxSearchProps;
+    ref: HTMLInputElement;
+    stylesNames: ComboboxSearchStylesNames;
+}>;

package/lib/components/Combobox/ComboboxTarget/ComboboxTarget.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { Factory } from '../../../core';
+export interface ComboboxTargetProps {
+    /** Target element */
+    children: React.ReactNode;
+    /** Key of the prop that should be used to access element ref */
+    refProp?: string;
+    /** Determines whether component should respond to keyboard events, `true` by default */
+    withKeyboardNavigation?: boolean;
+    /** Determines whether the target should have `aria-` attributes, `true` by default */
+    withAriaAttributes?: boolean;
+    /** Determines which events should be handled by the target element.
+     * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.
+     * `input` by default.
+     * */
+    targetType?: 'button' | 'input';
+}
+export type ComboboxTargetFactory = Factory<{
+    props: ComboboxTargetProps;
+    ref: HTMLElement;
+    compound: true;
+}>;
+export declare const ComboboxTarget: import("../../../core").MantineComponent<{
+    props: ComboboxTargetProps;
+    ref: HTMLElement;
+    compound: true;
+}>;

package/lib/components/Combobox/OptionsDropdown/OptionsDropdown.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { ComboboxItem, ComboboxParsedItem } from '../Combobox.types';
+import { FilterOptionsInput } from './default-options-filter';
+export type OptionsFilter = (input: FilterOptionsInput) => ComboboxParsedItem[];
+export interface OptionsGroup {
+    group: string;
+    items: ComboboxItem[];
+}
+export type OptionsData = (ComboboxItem | OptionsGroup)[];
+export interface OptionsDropdownProps {
+    data: OptionsData;
+    filter: OptionsFilter | undefined;
+    search: string | undefined;
+    limit: number | undefined;
+    withScrollArea: boolean | undefined;
+    maxDropdownHeight: number | string | undefined;
+    hidden?: boolean;
+    hiddenWhenEmpty?: boolean;
+    filterOptions?: boolean;
+    withCheckIcon?: boolean;
+    value?: string | string[] | null;
+    checkIconPosition?: 'left' | 'right';
+    nothingFoundMessage?: React.ReactNode;
+}
+export declare function OptionsDropdown({ data, hidden, hiddenWhenEmpty, filter, search, limit, maxDropdownHeight, withScrollArea, filterOptions, withCheckIcon, value, checkIconPosition, nothingFoundMessage, }: OptionsDropdownProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/Combobox/OptionsDropdown/default-options-filter.d.ts

@@ -0,0 +1,7 @@
+import { ComboboxParsedItem } from '../Combobox.types';
+export interface FilterOptionsInput {
+    options: ComboboxParsedItem[];
+    search: string;
+    limit: number;
+}
+export declare function defaultOptionsFilter({ options, search, limit, }: FilterOptionsInput): ComboboxParsedItem[];

package/lib/components/Combobox/OptionsDropdown/is-empty-combobox-data.d.ts

@@ -0,0 +1,2 @@
+import { ComboboxParsedItem } from '../Combobox.types';
+export declare function isEmptyComboboxData(data: ComboboxParsedItem[]): boolean;

package/lib/components/Combobox/OptionsDropdown/is-options-group.d.ts

@@ -0,0 +1,2 @@
+import { ComboboxParsedItem, ComboboxParsedItemGroup } from '../Combobox.types';
+export declare function isOptionsGroup(item: ComboboxParsedItem): item is ComboboxParsedItemGroup;

package/lib/components/Combobox/OptionsDropdown/validate-options.d.ts

@@ -0,0 +1 @@
+export declare function validateOptions(options: any[], valuesSet?: Set<unknown>): void;

package/lib/components/Combobox/get-options-lockup/get-options-lockup.d.ts

@@ -0,0 +1,3 @@
+import { ComboboxParsedItem, ComboboxItem } from '../Combobox.types';
+export declare function getOptionsLockup(options: ComboboxParsedItem[]): Record<string, ComboboxItem>;
+export declare function getLabelsLockup(options: ComboboxParsedItem[]): Record<string, string>;

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

@@ -1,3 +1,37 @@
 export { getParsedComboboxData } from './get-parsed-combobox-data/get-parsed-combobox-data';
+export { getOptionsLockup, getLabelsLockup } from './get-options-lockup/get-options-lockup';
 export { ComboboxChevron } from './ComboboxChevron/ComboboxChevron';
-export type { ComboboxItem, ComboboxData, ComboboxParsedItem, ComboboxItemGroup, ComboboxParsedItemGroup, } from './Combobox.types';
+export { Combobox } from './Combobox';
+export { ComboboxDropdown } from './ComboboxDropdown/ComboboxDropdown';
+export { ComboboxOptions } from './ComboboxOptions/ComboboxOptions';
+export { ComboboxOption } from './ComboboxOption/ComboboxOption';
+export { ComboboxTarget } from './ComboboxTarget/ComboboxTarget';
+export { ComboboxSearch } from './ComboboxSearch/ComboboxSearch';
+export { ComboboxEmpty } from './ComboboxEmpty/ComboboxEmpty';
+export { ComboboxFooter } from './ComboboxFooter/ComboboxFooter';
+export { ComboboxHeader } from './ComboboxHeader/ComboboxHeader';
+export { ComboboxEventsTarget } from './ComboboxEventsTarget/ComboboxEventsTarget';
+export { ComboboxDropdownTarget } from './ComboboxDropdownTarget/ComboboxDropdownTarget';
+export { ComboboxGroup } from './ComboboxGroup/ComboboxGroup';
+export { OptionsDropdown } from './OptionsDropdown/OptionsDropdown';
+export { useCombobox } from './use-combobox/use-combobox';
+export { useVirtualizedCombobox } from './use-combobox/use-virtualized-combobox';
+export { useComboboxTargetProps } from './use-combobox-target-props/use-combobox-target-props';
+export { isOptionsGroup } from './OptionsDropdown/is-options-group';
+export { defaultOptionsFilter } from './OptionsDropdown/default-options-filter';
+export type { ComboboxStore, ComboboxDropdownEventSource, UseComboboxOptions, } from './use-combobox/use-combobox';
+export type { ComboboxItem, ComboboxData, ComboboxParsedItem, ComboboxItemGroup, ComboboxParsedItemGroup, ComboboxLikeProps, ComboboxLikeStylesNames, } from './Combobox.types';
+export type { ComboboxFactory, ComboboxProps, ComboboxStylesNames } from './Combobox';
+export type { ComboboxDropdownProps } from './ComboboxDropdown/ComboboxDropdown';
+export type { ComboboxOptionsProps } from './ComboboxOptions/ComboboxOptions';
+export type { ComboboxOptionProps } from './ComboboxOption/ComboboxOption';
+export type { ComboboxTargetProps } from './ComboboxTarget/ComboboxTarget';
+export type { ComboboxChevronProps } from './ComboboxChevron/ComboboxChevron';
+export type { ComboboxEmptyProps } from './ComboboxEmpty/ComboboxEmpty';
+export type { ComboboxSearchProps } from './ComboboxSearch/ComboboxSearch';
+export type { ComboboxFooterProps } from './ComboboxFooter/ComboboxFooter';
+export type { ComboboxHeaderProps } from './ComboboxHeader/ComboboxHeader';
+export type { ComboboxDropdownTargetProps } from './ComboboxDropdownTarget/ComboboxDropdownTarget';
+export type { ComboboxEventsTargetProps } from './ComboboxEventsTarget/ComboboxEventsTarget';
+export type { ComboboxGroupProps } from './ComboboxGroup/ComboboxGroup';
+export type { OptionsDropdownProps, OptionsData, OptionsFilter, } from './OptionsDropdown/OptionsDropdown';

package/lib/components/Combobox/use-combobox/get-index/get-index.d.ts

@@ -0,0 +1,3 @@
+export declare function getPreviousIndex(currentIndex: number, elements: NodeListOf<HTMLDivElement> | HTMLDivElement[], loop: boolean): number;
+export declare function getNextIndex(currentIndex: number, elements: NodeListOf<HTMLDivElement> | HTMLDivElement[], loop: boolean): number;
+export declare function getFirstIndex(elements: NodeListOf<HTMLDivElement> | HTMLDivElement[]): number;

package/lib/components/Combobox/use-combobox/get-index/get-virtualized-index.d.ts

@@ -0,0 +1,14 @@
+interface GetIndexProps {
+    currentIndex: number;
+    isOptionDisabled: (index: number) => boolean;
+    totalOptionsCount: number;
+    loop: boolean;
+}
+export declare function getPreviousIndex({ currentIndex, isOptionDisabled, totalOptionsCount, loop, }: GetIndexProps): number;
+export declare function getNextIndex({ currentIndex, isOptionDisabled, totalOptionsCount, loop, }: GetIndexProps): number;
+interface GetFirstIndexOptions {
+    totalOptionsCount: number;
+    isOptionDisabled: (index: number) => boolean;
+}
+export declare function getFirstIndex({ totalOptionsCount, isOptionDisabled }: GetFirstIndexOptions): number;
+export {};

package/lib/components/Combobox/use-combobox/use-combobox.d.ts

@@ -0,0 +1,72 @@
+/// <reference types="react" />
+export type ComboboxDropdownEventSource = 'keyboard' | 'mouse' | 'unknown';
+export interface ComboboxStore {
+    /** Current dropdown opened state */
+    dropdownOpened: boolean;
+    /** Opens dropdown */
+    openDropdown(eventSource?: ComboboxDropdownEventSource): void;
+    /** Closes dropdown */
+    closeDropdown(eventSource?: ComboboxDropdownEventSource): void;
+    /** Toggles dropdown opened state */
+    toggleDropdown(eventSource?: ComboboxDropdownEventSource): void;
+    /** Selected option index */
+    selectedOptionIndex: number;
+    /** Selects `Combobox.Option` by index */
+    selectOption(index: number): void;
+    /** Selects first `Combobox.Option` with `active` prop.
+     *  If there are no such options, the function does nothing.
+     */
+    selectActiveOption(): string | null;
+    /** Selects first `Combobox.Option` that is not disabled.
+     *  If there are no such options, the function does nothing.
+     * */
+    selectFirstOption(): string | null;
+    /** Selects next `Combobox.Option` that is not disabled.
+     *  If the current option is the last one, the function selects first option, if `loop` is true.
+     */
+    selectNextOption(): string | null;
+    /** Selects previous `Combobox.Option` that is not disabled.
+     *  If the current option is the first one, the function selects last option, if `loop` is true.
+     * */
+    selectPreviousOption(): string | null;
+    /** Resets selected option index to -1, removes `data-combobox-selected` from selected option */
+    resetSelectedOption(): void;
+    /** Triggers `onClick` event of selected option.
+     *  If there is no selected option, the function does nothing.
+     */
+    clickSelectedOption(): void;
+    /** Updates selected option index to currently selected or active option.
+     *  The function is required to be used with searchable components to update selected option index
+     *  when options list changes based on search query.
+     */
+    updateSelectedOptionIndex(target?: 'active' | 'selected'): void;
+    /** List id, used for `aria-*` attributes */
+    listId: string | null;
+    /** Sets list id */
+    setListId(id: string): void;
+    /** Ref of `Combobox.Search` input */
+    searchRef: React.MutableRefObject<HTMLInputElement | null>;
+    /** Moves focus to `Combobox.Search` input */
+    focusSearchInput(): void;
+    /** Ref of the target element */
+    targetRef: React.MutableRefObject<HTMLElement | null>;
+    /** Moves focus to the target element */
+    focusTarget(): void;
+}
+export interface UseComboboxOptions {
+    /** Default value for `dropdownOpened`, `false` by default */
+    defaultOpened?: boolean;
+    /** Controlled `dropdownOpened` state */
+    opened?: boolean;
+    /** Called when `dropdownOpened` state changes */
+    onOpenedChange?(opened: boolean): void;
+    /** Called when dropdown closes with event source: keyboard, mouse or unknown */
+    onDropdownClose?(eventSource: ComboboxDropdownEventSource): void;
+    /** Called when dropdown opens with event source: keyboard, mouse or unknown */
+    onDropdownOpen?(eventSource: ComboboxDropdownEventSource): void;
+    /** Determines whether arrow key presses should loop though items (first to last and last to first), `true` by default */
+    loop?: boolean;
+    /** `behavior` passed down to `element.scrollIntoView`, `'instant'` by default */
+    scrollBehavior?: ScrollBehavior;
+}
+export declare function useCombobox({ defaultOpened, opened, onOpenedChange, onDropdownClose, onDropdownOpen, loop, scrollBehavior, }?: UseComboboxOptions): ComboboxStore;

package/lib/components/Combobox/use-combobox/use-virtualized-combobox.d.ts

@@ -0,0 +1,25 @@
+import { ComboboxStore } from './use-combobox';
+interface UseComboboxOptions {
+    /** Default value for `dropdownOpened`, `false` by default */
+    defaultOpened?: boolean;
+    /** Controlled `dropdownOpened` state */
+    opened?: boolean;
+    /** Called when `dropdownOpened` state changes */
+    onOpenedChange?(opened: boolean): void;
+    /** Called when dropdown closes */
+    onDropdownClose?(): void;
+    /** Called when dropdown opens */
+    onDropdownOpen?(): void;
+    /** Determines whether arrow key presses should loop though items (first to last and last to first), `true` by default */
+    loop?: boolean;
+    /** Function to determine whether the option is disabled */
+    isOptionDisabled?(optionIndex: number): boolean;
+    totalOptionsCount: number;
+    getOptionId(index: number): string | null;
+    selectedOptionIndex: number;
+    setSelectedOptionIndex(index: number): void;
+    activeOptionIndex?: number;
+    onSelectedOptionSubmit(index: number): void;
+}
+export declare function useVirtualizedCombobox({ defaultOpened, opened, onOpenedChange, onDropdownClose, onDropdownOpen, loop, totalOptionsCount, isOptionDisabled, getOptionId, selectedOptionIndex, setSelectedOptionIndex, activeOptionIndex, onSelectedOptionSubmit, }?: UseComboboxOptions): ComboboxStore;
+export {};

package/lib/components/Combobox/use-combobox-target-props/use-combobox-target-props.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+interface UseComboboxTargetPropsInput {
+    targetType: 'input' | 'button' | undefined;
+    withAriaAttributes: boolean | undefined;
+    withKeyboardNavigation: boolean | undefined;
+    onKeyDown: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+}
+export declare function useComboboxTargetProps({ onKeyDown, withKeyboardNavigation, withAriaAttributes, targetType, }: UseComboboxTargetPropsInput): {
+    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    'aria-haspopup': string;
+    'aria-expanded': boolean | undefined;
+    'aria-controls': string | null;
+    'aria-activedescendant': string | undefined;
+    autoComplete: string;
+    'data-expanded': boolean | undefined;
+} | {
+    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    'aria-haspopup'?: undefined;
+    'aria-expanded'?: undefined;
+    'aria-controls'?: undefined;
+    'aria-activedescendant'?: undefined;
+    autoComplete?: undefined;
+    'data-expanded'?: undefined;
+};
+export {};

package/lib/components/Container/Container.d.ts

@@ -1,11 +1,10 @@
 import { BoxProps, StylesApiProps, ElementProps, MantineSize, Factory } from '../../core';
 export type ContainerStylesNames = 'root';
-export type ContainerVariant = string;
 export type ContainerCssVariables = {
     root: '--container-size';
 };
 export interface ContainerProps extends BoxProps, StylesApiProps<ContainerFactory>, ElementProps<'div'> {
-    /** Sets `max-width` of the container, value is not responsive – it is set for all screen sizes. Numbers are converted to rem `1rem = 16px`. Ignored when `fluid` prop is set. `'md'` by default */
+    /** Sets `max-width` of the container, value is not responsive – it is the same for all screen sizes. Numbers are converted to rem. Ignored when `fluid` prop is set. `'md'` by default */
     size?: MantineSize | (string & {}) | number;
     /** Determines whether the container should take 100% of its parent width. If set, `size` prop is ignored. `false` by default. */
     fluid?: boolean;
@@ -15,12 +14,10 @@ export type ContainerFactory = Factory<{
     ref: HTMLDivElement;
     stylesNames: ContainerStylesNames;
     vars: ContainerCssVariables;
-    variant: ContainerVariant;
 }>;
 export declare const Container: import("../../core").MantineComponent<{
     props: ContainerProps;
     ref: HTMLDivElement;
     stylesNames: ContainerStylesNames;
     vars: ContainerCssVariables;
-    variant: ContainerVariant;
 }>;

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

@@ -1,2 +1,2 @@
 export { Container } from './Container';
-export type { ContainerProps, ContainerCssVariables, ContainerFactory, ContainerStylesNames, ContainerVariant, } from './Container';
+export type { ContainerProps, ContainerCssVariables, ContainerFactory, ContainerStylesNames, } from './Container';

package/lib/components/CopyButton/CopyButton.d.ts

@@ -5,12 +5,12 @@ export interface CopyButtonProps {
         copied: boolean;
         copy(): void;
     }): React.ReactNode;
-    /** Value that will be copied to the clipboard when button is clicked */
+    /** Value that will be copied to the clipboard when the button is clicked */
     value: string;
     /** Copied status timeout in ms, `1000` by default */
     timeout?: number;
 }
-export declare function CopyButton(props: CopyButtonProps): JSX.Element;
+export declare function CopyButton(props: CopyButtonProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace CopyButton {
     var displayName: string;
 }

package/lib/components/Divider/Divider.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { BoxProps, StylesApiProps, ElementProps, Factory, MantineColor, MantineSize } from '../../core';
+export type DividerStylesNames = 'root' | 'label';
+export type DividerVariant = 'solid' | 'dashed' | 'dotted';
+export type DividerCssVariables = {
+    root: '--divider-color' | '--divider-border-style' | '--divider-size';
+};
+export interface DividerProps extends BoxProps, StylesApiProps<DividerFactory>, ElementProps<'div'> {
+    /** Key of `theme.colors` or any valid CSS color value, by default value depends on color scheme */
+    color?: MantineColor;
+    /** Controls width/height (depends on orientation), `'xs'` by default */
+    size?: MantineSize | number | (string & {});
+    /** Divider label, visible only when `orientation` is `horizontal` */
+    label?: React.ReactNode;
+    /** Controls label position, `'left'` by default */
+    labelPosition?: 'left' | 'center' | 'right';
+    /** Controls orientation, `'horizontal'` by default */
+    orientation?: 'horizontal' | 'vertical';
+}
+export type DividerFactory = Factory<{
+    props: DividerProps;
+    ref: HTMLDivElement;
+    stylesNames: DividerStylesNames;
+    vars: DividerCssVariables;
+    variant: DividerVariant;
+}>;
+export declare const Divider: import("../../core").MantineComponent<{
+    props: DividerProps;
+    ref: HTMLDivElement;
+    stylesNames: DividerStylesNames;
+    vars: DividerCssVariables;
+    variant: DividerVariant;
+}>;

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

@@ -0,0 +1,2 @@
+export { Divider } from './Divider';
+export type { DividerCssVariables, DividerFactory, DividerProps, DividerStylesNames, DividerVariant, } from './Divider';

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { GetStylesApi } from '../../core';
+import type { DrawerRootFactory } from './DrawerRoot';
+export type ScrollAreaComponent = React.FC<any>;
+interface DrawerContext {
+    scrollAreaComponent: ScrollAreaComponent | undefined;
+    getStyles: GetStylesApi<DrawerRootFactory>;
+}
+export declare const DrawerProvider: ({ children, value }: {
+    value: DrawerContext;
+    children: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, useDrawerContext: () => DrawerContext;
+export {};

package/lib/components/Drawer/Drawer.d.ts

@@ -0,0 +1,56 @@
+import React from 'react';
+import { Factory } from '../../core';
+import { ModalBaseOverlayProps, ModalBaseCloseButtonProps } from '../ModalBase';
+import { DrawerRoot, DrawerRootProps, DrawerRootCssVariables, DrawerRootStylesNames } from './DrawerRoot';
+import { DrawerBody } from './DrawerBody';
+import { DrawerCloseButton } from './DrawerCloseButton';
+import { DrawerOverlay } from './DrawerOverlay';
+import { DrawerContent } from './DrawerContent';
+import { DrawerTitle } from './DrawerTitle';
+import { DrawerHeader } from './DrawerHeader';
+export type DrawerStylesNames = DrawerRootStylesNames;
+export type DrawerCssVariables = DrawerRootCssVariables;
+export interface DrawerProps extends DrawerRootProps {
+    /** Drawer title */
+    title?: React.ReactNode;
+    /** Determines whether the overlay should be rendered, `true` by default */
+    withOverlay?: boolean;
+    /** Props passed down to the `Overlay` component, can be used to configure opacity, `background-color`, styles and other properties */
+    overlayProps?: ModalBaseOverlayProps;
+    /** Drawer content */
+    children?: React.ReactNode;
+    /** Determines whether the close button should be rendered, `true` by default */
+    withCloseButton?: boolean;
+    /** Props passed down to the close button */
+    closeButtonProps?: ModalBaseCloseButtonProps;
+}
+export type DrawerFactory = Factory<{
+    props: DrawerProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerStylesNames;
+    vars: DrawerCssVariables;
+    staticComponents: {
+        Root: typeof DrawerRoot;
+        Overlay: typeof DrawerOverlay;
+        Content: typeof DrawerContent;
+        Body: typeof DrawerBody;
+        Header: typeof DrawerHeader;
+        Title: typeof DrawerTitle;
+        CloseButton: typeof DrawerCloseButton;
+    };
+}>;
+export declare const Drawer: import("../../core").MantineComponent<{
+    props: DrawerProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerStylesNames;
+    vars: DrawerCssVariables;
+    staticComponents: {
+        Root: typeof DrawerRoot;
+        Overlay: typeof DrawerOverlay;
+        Content: typeof DrawerContent;
+        Body: typeof DrawerBody;
+        Header: typeof DrawerHeader;
+        Title: typeof DrawerTitle;
+        CloseButton: typeof DrawerCloseButton;
+    };
+}>;

package/lib/components/Drawer/DrawerBody.d.ts

@@ -0,0 +1,17 @@
+import { StylesApiProps, Factory } from '../../core';
+import { ModalBaseBodyProps } from '../ModalBase';
+export type DrawerBodyStylesNames = 'body';
+export interface DrawerBodyProps extends ModalBaseBodyProps, StylesApiProps<DrawerBodyFactory> {
+}
+export type DrawerBodyFactory = Factory<{
+    props: DrawerBodyProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerBodyStylesNames;
+    compound: true;
+}>;
+export declare const DrawerBody: import("../../core").MantineComponent<{
+    props: DrawerBodyProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerBodyStylesNames;
+    compound: true;
+}>;

package/lib/components/Drawer/DrawerCloseButton.d.ts

@@ -0,0 +1,17 @@
+import { StylesApiProps, Factory } from '../../core';
+import { ModalBaseCloseButtonProps } from '../ModalBase';
+export type DrawerCloseButtonStylesNames = 'close';
+export interface DrawerCloseButtonProps extends ModalBaseCloseButtonProps, StylesApiProps<DrawerCloseButtonFactory> {
+}
+export type DrawerCloseButtonFactory = Factory<{
+    props: DrawerCloseButtonProps;
+    ref: HTMLButtonElement;
+    stylesNames: DrawerCloseButtonStylesNames;
+    compound: true;
+}>;
+export declare const DrawerCloseButton: import("../../core").MantineComponent<{
+    props: DrawerCloseButtonProps;
+    ref: HTMLButtonElement;
+    stylesNames: DrawerCloseButtonStylesNames;
+    compound: true;
+}>;

package/lib/components/Drawer/DrawerContent.d.ts

@@ -0,0 +1,17 @@
+import { StylesApiProps, Factory } from '../../core';
+import { ModalBaseContentProps } from '../ModalBase';
+export type DrawerContentStylesNames = 'content' | 'inner';
+export interface DrawerContentProps extends ModalBaseContentProps, StylesApiProps<DrawerContentFactory> {
+}
+export type DrawerContentFactory = Factory<{
+    props: DrawerContentProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerContentStylesNames;
+    compound: true;
+}>;
+export declare const DrawerContent: import("../../core").MantineComponent<{
+    props: DrawerContentProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerContentStylesNames;
+    compound: true;
+}>;

package/lib/components/Drawer/DrawerHeader.d.ts

@@ -0,0 +1,17 @@
+import { StylesApiProps, Factory } from '../../core';
+import { ModalBaseHeaderProps } from '../ModalBase';
+export type DrawerHeaderStylesNames = 'header';
+export interface DrawerHeaderProps extends ModalBaseHeaderProps, StylesApiProps<DrawerHeaderFactory> {
+}
+export type DrawerHeaderFactory = Factory<{
+    props: DrawerHeaderProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerHeaderStylesNames;
+    compound: true;
+}>;
+export declare const DrawerHeader: import("../../core").MantineComponent<{
+    props: DrawerHeaderProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerHeaderStylesNames;
+    compound: true;
+}>;

package/lib/components/Drawer/DrawerOverlay.d.ts

@@ -0,0 +1,17 @@
+import { StylesApiProps, Factory } from '../../core';
+import { ModalBaseOverlayProps } from '../ModalBase';
+export type DrawerOverlayStylesNames = 'overlay';
+export interface DrawerOverlayProps extends ModalBaseOverlayProps, StylesApiProps<DrawerOverlayFactory> {
+}
+export type DrawerOverlayFactory = Factory<{
+    props: DrawerOverlayProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerOverlayStylesNames;
+    compound: true;
+}>;
+export declare const DrawerOverlay: import("../../core").MantineComponent<{
+    props: DrawerOverlayProps;
+    ref: HTMLDivElement;
+    stylesNames: DrawerOverlayStylesNames;
+    compound: true;
+}>;