@mantine-vue/core 3.0.0 → 3.2.0

package/lib/components/FloatingWindow/FloatingWindow.d.ts

@@ -1,244 +1,65 @@
-import { type PropType, type Ref } from 'vue';
-import { type FloatingWindowPosition, type FloatingWindowPositionConfig, type SetFloatingWindowPosition } from '@mantine-vue/hooks';
-import { type FloatingWindowDimensions, type FloatingWindowSize } from './FloatingWindow.context';
-export type FloatingWindowStylesNames = 'root';
-export declare const FloatingWindow: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    enabled: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    constrainToViewport: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    constrainOffset: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    dragHandleSelector: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    excludeDragHandleSelector: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    axis: {
-        type: PropType<"x" | "y">;
-        default: undefined;
-    };
-    initialPosition: {
-        type: PropType<FloatingWindowPositionConfig>;
-        default: undefined;
-    };
-    onPositionChange: {
-        type: PropType<(position: FloatingWindowPosition) => void>;
-        default: undefined;
-    };
-    onDragStart: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    onDragEnd: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    setPositionRef: {
-        type: PropType<Ref<SetFloatingWindowPosition | null>>;
-        default: undefined;
-    };
-    withinPortal: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    portalProps: {
-        type: PropType<Record<string, any>>;
-        default: undefined;
-    };
-    zIndex: {
-        type: PropType<string | number>;
-        default: undefined;
-    };
-    dimensions: {
-        type: PropType<FloatingWindowDimensions>;
-        default: undefined;
-    };
-    onSizeChange: {
-        type: PropType<(size: FloatingWindowSize) => void>;
-        default: undefined;
-    };
-    onResizeStart: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    onResizeEnd: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    shadow: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    radius: {
-        type: PropType<string | number>;
-        default: undefined;
-    };
-    withBorder: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    mod: {
-        type: PropType<any>;
-        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<{
-    enabled: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    constrainToViewport: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    constrainOffset: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    dragHandleSelector: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    excludeDragHandleSelector: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    axis: {
-        type: PropType<"x" | "y">;
-        default: undefined;
-    };
-    initialPosition: {
-        type: PropType<FloatingWindowPositionConfig>;
-        default: undefined;
-    };
-    onPositionChange: {
-        type: PropType<(position: FloatingWindowPosition) => void>;
-        default: undefined;
-    };
-    onDragStart: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    onDragEnd: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    setPositionRef: {
-        type: PropType<Ref<SetFloatingWindowPosition | null>>;
-        default: undefined;
-    };
-    withinPortal: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    portalProps: {
-        type: PropType<Record<string, any>>;
-        default: undefined;
-    };
-    zIndex: {
-        type: PropType<string | number>;
-        default: undefined;
-    };
-    dimensions: {
-        type: PropType<FloatingWindowDimensions>;
-        default: undefined;
-    };
-    onSizeChange: {
-        type: PropType<(size: FloatingWindowSize) => void>;
-        default: undefined;
-    };
-    onResizeStart: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    onResizeEnd: {
-        type: PropType<() => void>;
-        default: undefined;
-    };
-    shadow: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    radius: {
-        type: PropType<string | number>;
-        default: undefined;
-    };
-    withBorder: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    mod: {
-        type: PropType<any>;
-        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<{}>, {
-    radius: string | number;
-    shadow: string;
-    classNames: Function | Record<string, any>;
-    styles: Function | Record<string, any>;
-    axis: "x" | "y";
-    mod: any;
-    enabled: boolean;
-    zIndex: string | number;
-    onSizeChange: (size: FloatingWindowSize) => void;
-    onResizeStart: () => void;
-    onResizeEnd: () => void;
-    vars: Function | Record<string, any>;
-    unstyled: boolean;
-    withinPortal: boolean;
-    withBorder: boolean;
-    portalProps: Record<string, any>;
-    constrainToViewport: boolean;
-    constrainOffset: number;
-    dragHandleSelector: string;
-    excludeDragHandleSelector: string;
-    initialPosition: FloatingWindowPositionConfig;
-    onPositionChange: (position: FloatingWindowPosition) => void;
-    onDragStart: () => void;
-    onDragEnd: () => void;
-    setPositionRef: Ref<SetFloatingWindowPosition | null, SetFloatingWindowPosition | null>;
-    dimensions: FloatingWindowDimensions;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export declare const FloatingWindow: {
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./FloatingWindow.types").FloatingWindowOwnProps> & Readonly<{
+        "onPosition-change"?: ((position: import("@mantine-vue/hooks").FloatingWindowPosition) => any) | undefined;
+        "onDrag-start"?: (() => any) | undefined;
+        "onDrag-end"?: (() => any) | undefined;
+        "onSize-change"?: ((size: import("./FloatingWindow.context.js").FloatingWindowSize) => any) | undefined;
+        "onResize-start"?: (() => any) | undefined;
+        "onResize-end"?: (() => any) | undefined;
+    }>, {
+        setPosition: import("@mantine-vue/hooks").SetFloatingWindowPosition;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "position-change": (position: import("@mantine-vue/hooks").FloatingWindowPosition) => any;
+        "drag-start": () => any;
+        "drag-end": () => any;
+        "size-change": (size: import("./FloatingWindow.context.js").FloatingWindowSize) => any;
+        "resize-start": () => any;
+        "resize-end": () => any;
+    }, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("./FloatingWindow.types").FloatingWindowOwnProps> & Readonly<{
+        "onPosition-change"?: ((position: import("@mantine-vue/hooks").FloatingWindowPosition) => any) | undefined;
+        "onDrag-start"?: (() => any) | undefined;
+        "onDrag-end"?: (() => any) | undefined;
+        "onSize-change"?: ((size: import("./FloatingWindow.context.js").FloatingWindowSize) => any) | undefined;
+        "onResize-start"?: (() => any) | undefined;
+        "onResize-end"?: (() => any) | undefined;
+    }>, {
+        setPosition: import("@mantine-vue/hooks").SetFloatingWindowPosition;
+    }, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("./FloatingWindow.types").FloatingWindowOwnProps> & Readonly<{
+    "onPosition-change"?: ((position: import("@mantine-vue/hooks").FloatingWindowPosition) => any) | undefined;
+    "onDrag-start"?: (() => any) | undefined;
+    "onDrag-end"?: (() => any) | undefined;
+    "onSize-change"?: ((size: import("./FloatingWindow.context.js").FloatingWindowSize) => any) | undefined;
+    "onResize-start"?: (() => any) | undefined;
+    "onResize-end"?: (() => any) | undefined;
+}>, {
+    setPosition: import("@mantine-vue/hooks").SetFloatingWindowPosition;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "position-change": (position: import("@mantine-vue/hooks").FloatingWindowPosition) => any;
+    "drag-start": () => any;
+    "drag-end": () => any;
+    "size-change": (size: import("./FloatingWindow.context.js").FloatingWindowSize) => any;
+    "resize-start": () => any;
+    "resize-end": () => any;
+}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: import("./FloatingWindow.types").FloatingWindowSlots;
+}) & {
+    classes: Record<string, string>;
+    ResizeHandle: import("../../index.js").MantineComponent<{
+        props: Omit<import("./FloatingWindowResizeHandle.types.js").FloatingWindowResizeHandleProps, "rootRef">;
+        ref: HTMLDivElement;
+        slots: import("./FloatingWindowResizeHandle.types.js").FloatingWindowResizeHandleSlots;
+        element: "div";
+    }>;
+};
+export type { FloatingWindowOwnProps, FloatingWindowProps, FloatingWindowSlots, FloatingWindowStylesNames, } from './FloatingWindow.types';

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

@@ -0,0 +1,66 @@
+import type { Ref, VNodeChild } from 'vue';
+import type { FloatingWindowPositionConfig, SetFloatingWindowPosition } from '@mantine-vue/hooks';
+import type { BoxMod, BoxProps, StylesApiProps } from '../../core';
+import type { FloatingWindowDimensions } from './FloatingWindow.context';
+export type FloatingWindowStylesNames = 'root';
+export interface FloatingWindowSlots {
+    /** Content of the window, usually including a `FloatingWindow.ResizeHandle`. */
+    default?: () => VNodeChild;
+}
+/** Props declared by `FloatingWindow` itself. See `FloatingWindowProps` for the full public type. */
+export interface FloatingWindowOwnProps extends StylesApiProps<FloatingWindowProps> {
+    /**
+     * If set, the window can be dragged.
+     *
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * If set, the window cannot be dragged outside the viewport.
+     *
+     * @default true
+     */
+    constrainToViewport?: boolean;
+    /** Margin in px kept between the window and the viewport edges. */
+    constrainOffset?: number;
+    /** CSS selector of the element that starts a drag. The whole window drags when not set. */
+    dragHandleSelector?: string;
+    /** CSS selector of elements inside the drag handle that must not start a drag. */
+    excludeDragHandleSelector?: string;
+    /** Restricts dragging to a single axis. */
+    axis?: 'x' | 'y';
+    /** Position the window starts at. */
+    initialPosition?: FloatingWindowPositionConfig;
+    /** Ref assigned a function that moves the window programmatically. */
+    setPositionRef?: Ref<SetFloatingWindowPosition | null>;
+    /**
+     * If set, the window is rendered inside a `Portal`.
+     *
+     * @default true
+     */
+    withinPortal?: boolean;
+    /** Props passed down to the `Portal` when `withinPortal` is set. */
+    portalProps?: Record<string, any>;
+    /**
+     * `z-index` of the window.
+     *
+     * @default getDefaultZIndex('overlay')
+     */
+    zIndex?: string | number;
+    /** Initial size and the bounds the window can be resized within. */
+    dimensions?: FloatingWindowDimensions;
+    /** Key of `theme.shadows` or any valid CSS value to set the shadow. */
+    shadow?: string;
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`. */
+    radius?: string | number;
+    /**
+     * If set, the window has a border.
+     *
+     * @default false
+     */
+    withBorder?: boolean;
+    /** Element modifiers transformed into `data-` attributes, for example, `{ 'data-size': 'xl' }`, falsy values are removed */
+    mod?: BoxMod;
+}
+export interface FloatingWindowProps extends Omit<BoxProps, keyof FloatingWindowOwnProps>, FloatingWindowOwnProps {
+}

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

@@ -0,0 +1,35 @@
+import type { FloatingWindowPosition } from '@mantine-vue/hooks';
+import { type FloatingWindowSize } from './FloatingWindow.context';
+import type { FloatingWindowOwnProps, FloatingWindowSlots } from './FloatingWindow.types';
+declare const defaultProps: {
+    readonly constrainToViewport: true;
+    readonly withinPortal: true;
+    readonly zIndex: number;
+};
+/** The initial size is clamped so it cannot start outside the configured bounds. */
+declare function clampDimension(value: number, min?: number, max?: number): number;
+export { defaultProps, clampDimension };
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FloatingWindowOwnProps, {
+    setPosition: import("@mantine-vue/hooks").SetFloatingWindowPosition;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "position-change": (position: FloatingWindowPosition) => any;
+    "drag-start": () => any;
+    "drag-end": () => any;
+    "size-change": (size: FloatingWindowSize) => any;
+    "resize-start": () => any;
+    "resize-end": () => any;
+}, string, import("vue").PublicProps, Readonly<FloatingWindowOwnProps> & Readonly<{
+    "onPosition-change"?: ((position: FloatingWindowPosition) => any) | undefined;
+    "onDrag-start"?: (() => any) | undefined;
+    "onDrag-end"?: (() => any) | undefined;
+    "onSize-change"?: ((size: FloatingWindowSize) => any) | undefined;
+    "onResize-start"?: (() => any) | undefined;
+    "onResize-end"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FloatingWindowSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/FloatingWindow/FloatingWindowResizeHandle.d.ts

@@ -1,27 +1,7 @@
-import { type PropType } from 'vue';
-export declare const FloatingWindowResizeHandle: import("../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    ariaLabel: {
-        type: StringConstructor;
-        default: string;
-    };
-    tabindex: {
-        type: NumberConstructor;
-        default: number;
-    };
-    onKeydown: PropType<(event: KeyboardEvent) => void>;
-}>, () => 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<{
-    ariaLabel: {
-        type: StringConstructor;
-        default: string;
-    };
-    tabindex: {
-        type: NumberConstructor;
-        default: number;
-    };
-    onKeydown: PropType<(event: KeyboardEvent) => void>;
-}>> & Readonly<{}>, {
-    tabindex: number;
-    ariaLabel: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+export declare const FloatingWindowResizeHandle: import("../..").MantineComponent<{
+    props: Omit<import("./FloatingWindowResizeHandle.types").FloatingWindowResizeHandleProps, "rootRef">;
+    ref: HTMLDivElement;
+    slots: import("./FloatingWindowResizeHandle.types").FloatingWindowResizeHandleSlots;
+    element: "div";
+}>;
+export type { FloatingWindowResizeHandleOwnProps, FloatingWindowResizeHandleProps, FloatingWindowResizeHandleSlots, FloatingWindowResizeHandleFactory, } from './FloatingWindowResizeHandle.types';

package/lib/components/FloatingWindow/FloatingWindowResizeHandle.types.d.ts

@@ -0,0 +1,36 @@
+import type { VNodeChild } from 'vue';
+import type { BoxProps, Factory } from '../../core';
+export interface FloatingWindowResizeHandleSlots {
+    /** Content of the handle, usually a grip icon. */
+    default?: () => VNodeChild;
+}
+/**
+ * Props declared by `FloatingWindow.ResizeHandle` itself. See
+ * `FloatingWindowResizeHandleProps` for the full public type.
+ */
+export interface FloatingWindowResizeHandleOwnProps {
+    /** Receives the root DOM node. */
+    rootRef?: VueRefTarget<Element>;
+    /**
+     * `aria-label` of the handle. A consumer `aria-label` attribute takes precedence.
+     *
+     * @default 'Resize window'
+     */
+    ariaLabel?: string;
+    /**
+     * `tabindex` of the handle. The handle is focusable so the window can be resized with
+     * the arrow keys.
+     *
+     * @default 0
+     */
+    tabindex?: number;
+}
+export interface FloatingWindowResizeHandleProps extends Omit<BoxProps, keyof FloatingWindowResizeHandleOwnProps>, FloatingWindowResizeHandleOwnProps {
+}
+export type FloatingWindowResizeHandleFactory = Factory<{
+    props: Omit<FloatingWindowResizeHandleProps, 'rootRef'>;
+    ref: HTMLDivElement;
+    slots: FloatingWindowResizeHandleSlots;
+    element: 'div';
+}>;
+import type { VueRefTarget } from '@mantine-vue/hooks';

package/lib/components/FloatingWindow/FloatingWindowResizeHandle.vue.d.ts

@@ -0,0 +1,23 @@
+import type { FloatingWindowResizeHandleOwnProps, FloatingWindowResizeHandleSlots } from './FloatingWindowResizeHandle.types';
+/** Pixels the window grows or shrinks by with each arrow key press. */
+declare const KEYBOARD_STEP = 10;
+/**
+ * Clamps a dimension to the configured bounds and, when the window is constrained, to
+ * the space left in the viewport.
+ */
+declare function clampDimension(value: number, min: number | undefined, max: number | undefined, viewportMax: number | undefined): number;
+export { KEYBOARD_STEP, clampDimension };
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FloatingWindowResizeHandleOwnProps, {
+    rootElement: import("vue").Ref<Element | null, Element | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    keydown: (event: KeyboardEvent) => any;
+}, string, import("vue").PublicProps, Readonly<FloatingWindowResizeHandleOwnProps> & Readonly<{
+    onKeydown?: ((event: KeyboardEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FloatingWindowResizeHandleSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,4 +1,5 @@
 export { FloatingWindow } from './FloatingWindow';
-export type { FloatingWindowStylesNames } from './FloatingWindow';
+export type { FloatingWindowOwnProps, FloatingWindowProps, FloatingWindowSlots, FloatingWindowStylesNames, } from './FloatingWindow';
 export type { FloatingWindowDimensions, FloatingWindowSize } from './FloatingWindow.context';
 export { FloatingWindowResizeHandle } from './FloatingWindowResizeHandle';
+export type { FloatingWindowResizeHandleFactory, FloatingWindowResizeHandleOwnProps, FloatingWindowResizeHandleProps, FloatingWindowResizeHandleSlots, } from './FloatingWindowResizeHandle';