@mantine-vue/core 2.4.0 → 3.1.0

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

@@ -0,0 +1,91 @@
+import type { VNodeChild } from 'vue';
+import type { BoxProps, MantineRadius, MantineSize, MantineSpacing, StylesApiProps } from '../../core';
+import type { AffixPosition } from '../Affix';
+import type { MantineTransition } from '../Transition';
+/** Props declared by `Dialog` itself. See `DialogProps` for the full public type. */
+export interface DialogOwnProps extends StylesApiProps<DialogProps> {
+    /** Opened state */
+    opened: boolean;
+    /**
+     * If set, the component uses `display: none` to hide the root element instead of removing the DOM node
+     *
+     * @default false
+     */
+    keepMounted?: boolean;
+    /**
+     * If set, displays the close button
+     *
+     * @default false
+     */
+    withCloseButton?: boolean;
+    /**
+     * Props passed down to the underlying `Transition` component
+     *
+     * @default { transition: 'pop-top-right', duration: 200 }
+     */
+    transitionProps?: {
+        transition?: MantineTransition;
+        duration?: number;
+        keepMounted?: boolean;
+    };
+    /**
+     * Controls `width` of the dialog
+     *
+     * @default 'md'
+     */
+    size?: MantineSize | (string & {}) | number;
+    /**
+     * Root element `z-index` property
+     *
+     * @default 200
+     */
+    zIndex?: string | number;
+    /**
+     * Determines whether the component is rendered within `Portal`
+     *
+     * @default true
+     */
+    withinPortal?: boolean;
+    /** Props passed down to the `Portal` component. Ignored when `withinPortal` is `false`. */
+    portalProps?: Record<string, any>;
+    /**
+     * Affix position on screen
+     *
+     * @default { bottom: 30, right: 30 }
+     */
+    position?: AffixPosition;
+    /**
+     * Key of `theme.shadows` or any valid CSS value to set `box-shadow`
+     *
+     * @default 'md'
+     */
+    shadow?: string;
+    /**
+     * Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem
+     *
+     * @default theme.defaultRadius
+     */
+    radius?: MantineRadius;
+    /**
+     * Adds border to the root element
+     *
+     * @default true
+     */
+    withBorder?: boolean;
+    /**
+     * Padding, theme key: theme.spacing
+     *
+     * @default 'md'
+     */
+    p?: MantineSpacing;
+}
+export interface DialogProps extends Omit<BoxProps, keyof DialogOwnProps>, DialogOwnProps {
+}
+export interface DialogSlots {
+    /** Dialog content. */
+    default?: () => VNodeChild;
+}
+export type DialogStylesNames = 'root' | 'closeButton';
+export type DialogCssVariables = {
+    root: '--dialog-size';
+};

package/lib/components/Dialog/Dialog.vue.d.ts

@@ -0,0 +1,14 @@
+import type { DialogOwnProps, DialogSlots } from './Dialog.types';
+export declare const varsResolver: (theme: import("../..").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DialogOwnProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<DialogOwnProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DialogSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,2 +1 @@
-export { Dialog } from './Dialog';
-export type { DialogStylesNames } from './Dialog';
+export * from './Dialog';

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

@@ -1,96 +1,10 @@
-import { type PropType, type SlotsType, type VNodeChild } from 'vue';
-import { type MantineColor, type MantineNode, type MantineSize } from '../../core';
-export type DividerVariant = 'solid' | 'dashed' | 'dotted';
-export interface DividerSlots {
-    default?: () => VNodeChild;
-    label?: () => VNodeChild;
-}
-export declare const Divider: import("../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    color: {
-        type: PropType<MantineColor>;
-        default: undefined;
-    };
-    size: PropType<MantineSize | number | (string & {})>;
-    label: {
-        type: PropType<MantineNode>;
-        default: undefined;
-    };
-    labelPosition: {
-        type: PropType<"left" | "center" | "right">;
-        default: undefined;
-    };
-    orientation: {
-        type: PropType<"horizontal" | "vertical">;
-        default: undefined;
-    };
-    variant: {
-        type: PropType<DividerVariant>;
-        default: undefined;
-    };
-    classNames: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    styles: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    vars: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    unstyled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    color: {
-        type: PropType<MantineColor>;
-        default: undefined;
-    };
-    size: PropType<MantineSize | number | (string & {})>;
-    label: {
-        type: PropType<MantineNode>;
-        default: undefined;
-    };
-    labelPosition: {
-        type: PropType<"left" | "center" | "right">;
-        default: undefined;
-    };
-    orientation: {
-        type: PropType<"horizontal" | "vertical">;
-        default: undefined;
-    };
-    variant: {
-        type: PropType<DividerVariant>;
-        default: undefined;
-    };
-    classNames: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    styles: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    vars: {
-        type: (ObjectConstructor | FunctionConstructor)[];
-        default: undefined;
-    };
-    unstyled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    label: MantineNode;
-    orientation: "vertical" | "horizontal";
-    color: MantineColor;
-    variant: DividerVariant;
-    classNames: Function | Record<string, any>;
-    styles: Function | Record<string, any>;
-    vars: Function | Record<string, any>;
-    unstyled: boolean;
-    labelPosition: "center" | "left" | "right";
-}, SlotsType<DividerSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+export declare const Divider: import("../..").MantineComponent<{
+    props: Omit<import("./Divider.types").DividerProps, "rootRef">;
+    ref: HTMLSpanElement;
+    slots: import("./Divider.types").DividerSlots;
+    element: "span";
+    stylesNames: import("./Divider.types").DividerStylesNames;
+    vars: import("./Divider.types").DividerCssVariables;
+    variant: import("./Divider.types").DividerVariant;
+}>;
+export type { DividerOwnProps, DividerProps, DividerSlots, DividerVariant, DividerFactory, } from './Divider.types';

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

@@ -0,0 +1,58 @@
+import type { VNodeChild } from 'vue';
+import type { BoxProps, MantineColor, MantineNode, MantineSize, StylesApiProps, Factory } from '../../core';
+export type DividerVariant = 'solid' | 'dashed' | 'dotted';
+/** Props declared by `Divider` itself. See `DividerProps` for the full public type. */
+export interface DividerOwnProps extends StylesApiProps<DividerFactory> {
+    /** Receives the root DOM node. */
+    rootRef?: VueRefTarget<Element>;
+    /** Key of `theme.colors` or any valid CSS color value */
+    color?: MantineColor;
+    /**
+     * Controls width/height (depends on orientation)
+     *
+     * @default 'xs'
+     */
+    size?: MantineSize | number | (string & {});
+    /** Divider label, visible only with `orientation="horizontal"` */
+    label?: MantineNode;
+    /**
+     * Label position
+     *
+     * @default 'center'
+     */
+    labelPosition?: 'left' | 'center' | 'right';
+    /**
+     * Divider orientation
+     *
+     * @default 'horizontal'
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Controls visual representation of the component. Rendered as the `data-variant` attribute and passed to the Styles API.
+     *
+     * @default 'solid'
+     */
+    variant?: DividerVariant;
+}
+export interface DividerSlots {
+    /** Label fallback, used when the `label` prop and named slot are not set. */
+    default?: () => VNodeChild;
+    /** Divider label. Used when the `label` prop is not set. */
+    label?: () => VNodeChild;
+}
+export interface DividerProps extends Omit<BoxProps, keyof DividerOwnProps>, DividerOwnProps {
+}
+export type DividerStylesNames = 'root' | 'label';
+export type DividerCssVariables = {
+    root: '--divider-color' | '--divider-border-style' | '--divider-size';
+};
+export type DividerFactory = Factory<{
+    props: Omit<DividerProps, 'rootRef'>;
+    ref: HTMLSpanElement;
+    slots: DividerSlots;
+    element: 'span';
+    stylesNames: DividerStylesNames;
+    vars: DividerCssVariables;
+    variant: DividerVariant;
+}>;
+import type { VueRefTarget } from '@mantine-vue/hooks';

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

@@ -0,0 +1,13 @@
+import type { DividerOwnProps, DividerSlots } from './Divider.types';
+declare const varsResolver: (theme: import("../..").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
+export { varsResolver };
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DividerOwnProps, {
+    rootElement: import("vue").Ref<Element | null, Element | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DividerOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DividerSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,124 @@
+export declare const DrawerBody: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const DrawerCloseButton: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const DrawerHeader: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const DrawerOverlay: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const DrawerTitle: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/**
+ * The content also needs the `inner` styles that position the drawer, and the radius,
+ * which lives on the root rather than on the content itself.
+ */
+export declare const DrawerContent: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    transitionProps: ObjectConstructor;
+    __hidden: BooleanConstructor;
+}>> & Readonly<{}>, {
+    visible: boolean;
+    __hidden: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

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

@@ -0,0 +1,28 @@
+import { type InjectionKey } from 'vue';
+export interface DrawerContextValue {
+    /** Styles API accessor of the owning `Drawer.Root`. */
+    getStyles: any;
+    /** `border-radius` of the drawer, forwarded to the content. */
+    radius?: string | number;
+    /** Component used to render the scrollable area of the content. */
+    scrollAreaComponent?: any;
+}
+export declare const provideDrawerContext: (value: DrawerContextValue) => void, useDrawerContext: () => DrawerContextValue;
+export interface DrawerStackContextValue {
+    /** Ids of the drawers currently open, in the order they were opened. */
+    stack: string[];
+    /** Adds a drawer to the stack. */
+    addModal: (id: string, zIndex: string | number) => void;
+    /** Removes a drawer from the stack. */
+    removeModal: (id: string) => void;
+    /** `z-index` of a drawer, derived from its position in the stack. */
+    getZIndex: (id: string) => string;
+    /** Id of the drawer on top of the stack. */
+    currentId: string;
+    /** Highest `z-index` any drawer of the stack has asked for. */
+    maxZIndex: string | number;
+}
+export declare const DrawerStackContextKey: InjectionKey<DrawerStackContextValue>;
+/** Returns `null` outside a `Drawer.Stack`, which is the normal case for a lone drawer. */
+export declare function useDrawerStackContext(): DrawerStackContextValue | null;
+export declare function provideDrawerStackContext(value: DrawerStackContextValue): void;