@mantine-vue/core 3.5.0 → 3.7.0

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

@@ -2,8 +2,8 @@ import type { TagsInputSlots } from './TagsInput.types';
 type __VLS_Slots = TagsInputSlots;
 declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     remove: (value: string) => any;
-    clear: () => any;
     change: (value: string[]) => any;
+    clear: () => any;
     "update:modelValue": (value: string[]) => any;
     "option-submit": (value: string) => any;
     "dropdown-open": () => any;
@@ -14,8 +14,8 @@ declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, impo
     duplicate: (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
     onRemove?: ((value: string) => any) | undefined;
-    onClear?: (() => any) | undefined;
     onChange?: ((value: string[]) => any) | undefined;
+    onClear?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
     "onOption-submit"?: ((value: string) => any) | undefined;
     "onDropdown-open"?: (() => any) | undefined;

package/lib/components/Text/Text.d.ts

@@ -1,5 +1,5 @@
 export declare const Text: import("../..").MantinePolymorphicComponent<{
-    props: Omit<import("./Text.types").TextProps, "component" | "rootRef">;
+    props: Omit<import("./Text.types").TextProps, "component">;
     slots: import("./Text.types").TextSlots;
     ref: HTMLParagraphElement;
     exposed: {

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

@@ -4,8 +4,6 @@ export type TextTruncate = 'end' | 'start' | boolean;
 export type TextVariant = 'text' | 'gradient';
 /** Props declared by `Text` itself. See `TextProps` for the full public type. */
 export interface TextOwnProps extends StylesApiProps<TextFactory> {
-    /** Receives the root DOM node. See the polymorphic components guide. */
-    rootRef?: VueRefTarget<Element>;
     /** Root element or component rendered by `Text`. */
     component?: MantineElementType;
     /**
@@ -68,9 +66,8 @@ export type TextStylesNames = 'root';
 export type TextCssVariables = {
     root: '--text-gradient' | '--text-line-clamp' | '--text-fz' | '--text-lh' | '--text-text-wrap';
 };
-import type { VueRefTarget } from '@mantine-vue/hooks';
 export type TextFactory = PolymorphicFactory<{
-    props: Omit<TextProps, 'component' | 'rootRef'>;
+    props: Omit<TextProps, 'component'>;
     slots: TextSlots;
     ref: HTMLParagraphElement;
     exposed: {

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

@@ -1,10 +1,11 @@
+import type { RootRefProps } from '../../core';
 import type { TextOwnProps, TextSlots } from './Text.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<TextOwnProps, {
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<TextOwnProps & RootRefProps<Element>, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TextOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, TextSlots>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TextOwnProps & RootRefProps<Element>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, TextSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/lib/components/Textarea/Textarea.d.ts

@@ -1,5 +1,5 @@
 export declare const Textarea: import("../..").MantineComponent<{
-    props: Omit<import("./Textarea.types").TextareaProps, "rootRef">;
+    props: import("./Textarea.types").TextareaProps;
     slots: import("./Textarea.types").TextareaSlots;
     emits: import("./Textarea.types").TextareaEmits;
     ref: HTMLTextAreaElement;

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

@@ -1,5 +1,4 @@
-import type { VueRefTarget } from '@mantine-vue/hooks';
-import type { VNodeChild } from 'vue';
+import type { HTMLAttributes, VNodeChild } from 'vue';
 import type { BoxProps, MantineNode, Factory } from '../../core';
 import type { InputBaseOwnProps, InputBaseSlots, InputBaseStylesNames } from '../InputBase';
 export type TextareaStylesNames = InputBaseStylesNames;
@@ -9,8 +8,6 @@ export interface TextareaSlots extends InputBaseSlots {
 }
 /** Props declared by `Textarea` itself. See `TextareaProps` for the full public type. */
 export interface TextareaOwnProps {
-    /** Receives the input element */
-    rootRef?: VueRefTarget<Element>;
     /** Controlled value, bound with `v-model`. */
     modelValue?: string;
     /** Uncontrolled initial value. */
@@ -40,7 +37,7 @@ export interface TextareaOwnProps {
      */
     bottomSection?: MantineNode;
     /** Props passed down to the `bottomSection` element. */
-    bottomSectionProps?: Record<string, any>;
+    bottomSectionProps?: HTMLAttributes;
     /**
      * Static selector used as the base of the generated class names.
      *
@@ -57,7 +54,7 @@ export interface TextareaEmits {
     change: [value: string];
 }
 export type TextareaFactory = Factory<{
-    props: Omit<TextareaProps, 'rootRef'>;
+    props: TextareaProps;
     slots: TextareaSlots;
     emits: TextareaEmits;
     ref: HTMLTextAreaElement;

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

@@ -1,11 +1,13 @@
+import type { RootRefProps } from '../../core';
 import type { TextareaOwnProps, TextareaSlots } from './Textarea.types';
+type __VLS_Props = TextareaOwnProps & RootRefProps<Element>;
 type __VLS_Slots = TextareaSlots;
-declare const __VLS_base: import("vue").DefineComponent<TextareaOwnProps, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (value: string) => any;
     "update:modelValue": (value: string) => any;
-}, string, import("vue").PublicProps, Readonly<TextareaOwnProps> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onChange?: ((value: string) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/lib/components/ThemeIcon/ThemeIcon.d.ts

@@ -1,5 +1,5 @@
 export declare const ThemeIcon: import("../..").MantineComponent<{
-    props: Omit<import("./ThemeIcon.types").ThemeIconProps, "rootRef">;
+    props: import("./ThemeIcon.types").ThemeIconProps;
     ref: HTMLDivElement;
     slots: import("./ThemeIcon.types").ThemeIconSlots;
     element: "div";

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

@@ -11,8 +11,6 @@ export interface ThemeIconSlots {
 }
 /** Props declared by `ThemeIcon` itself. See `ThemeIconProps` for the full public type. */
 export interface ThemeIconOwnProps extends StylesApiProps<ThemeIconFactory> {
-    /** Receives the root DOM node. */
-    rootRef?: VueRefTarget<Element>;
     /**
      * Controls width and height of the component. Numbers are converted to rem.
      * @default 'md'
@@ -48,7 +46,7 @@ export interface ThemeIconOwnProps extends StylesApiProps<ThemeIconFactory> {
 export interface ThemeIconProps extends Omit<BoxProps, keyof ThemeIconOwnProps>, ThemeIconOwnProps {
 }
 export type ThemeIconFactory = Factory<{
-    props: Omit<ThemeIconProps, 'rootRef'>;
+    props: ThemeIconProps;
     ref: HTMLDivElement;
     slots: ThemeIconSlots;
     element: 'div';
@@ -56,4 +54,3 @@ export type ThemeIconFactory = Factory<{
     vars: ThemeIconCssVariables;
     variant: ThemeIconVariant;
 }>;
-import type { VueRefTarget } from '@mantine-vue/hooks';

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

@@ -1,12 +1,13 @@
+import type { RootRefProps } from '../../core';
 import type { ThemeIconOwnProps, ThemeIconSlots } from './ThemeIcon.types';
 /** Module scope: created once, not per component instance. */
 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<ThemeIconOwnProps, {
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ThemeIconOwnProps & RootRefProps<Element>, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ThemeIconOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ThemeIconSlots>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ThemeIconOwnProps & RootRefProps<Element>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ThemeIconSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/lib/components/Timeline/Timeline.d.ts

@@ -1,6 +1,6 @@
 import { TimelineItem } from './TimelineItem/TimelineItem';
 export declare const Timeline: import("../..").MantineComponent<{
-    props: Omit<import("./Timeline.types").TimelineProps, "rootRef">;
+    props: import("./Timeline.types").TimelineProps;
     slots: import("./Timeline.types").TimelineSlots;
     ref: HTMLDivElement;
     exposed: {

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

@@ -1,11 +1,8 @@
 import type { TimelineItem } from './TimelineItem/TimelineItem';
-import type { VueRefTarget } from '@mantine-vue/hooks';
 import type { VNodeChild } from 'vue';
 import type { BoxMod, BoxProps, MantineColor, MantineRadius, StylesApiProps, Factory } from '../../core';
 /** Props declared by `Timeline` itself. See `TimelineProps` for the full public type. */
 export interface TimelineOwnProps extends StylesApiProps<TimelineFactory> {
-    /** Receives the root DOM node. */
-    rootRef?: VueRefTarget<Element>;
     /**
      * Index of the active element
      *
@@ -59,7 +56,7 @@ export type TimelineCssVariables = {
     root: '--tl-bullet-size' | '--tl-line-width' | '--tl-radius' | '--tl-color' | '--tl-icon-color';
 };
 export type TimelineFactory = Factory<{
-    props: Omit<TimelineProps, 'rootRef'>;
+    props: TimelineProps;
     slots: TimelineSlots;
     ref: HTMLDivElement;
     exposed: {

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

@@ -1,10 +1,11 @@
+import type { RootRefProps } from '../../core';
 import type { TimelineOwnProps, TimelineSlots } from './Timeline.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<TimelineOwnProps, {
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<TimelineOwnProps & RootRefProps<Element>, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TimelineOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, TimelineSlots>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TimelineOwnProps & RootRefProps<Element>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, TimelineSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/lib/components/Timeline/TimelineItem/TimelineItem.d.ts

@@ -1,5 +1,5 @@
 export declare const TimelineItem: import("../../..").MantineComponent<{
-    props: Omit<import("./TimelineItem.types").TimelineItemProps, "rootRef">;
+    props: import("./TimelineItem.types").TimelineItemProps;
     ref: HTMLSpanElement;
     slots: import("./TimelineItem.types").TimelineItemSlots;
     element: "span";

package/lib/components/Timeline/TimelineItem/TimelineItem.types.d.ts

@@ -17,8 +17,6 @@ export interface TimelineItemSlots {
  * See `TimelineItemProps` for the full public type.
  */
 export interface TimelineItemOwnProps {
-    /** Receives the root DOM node. */
-    rootRef?: VueRefTarget<Element>;
     /**
      * Active state assigned by the parent `Timeline` from its `active` index.
      * Set by `Timeline`; the explicit `active` prop takes precedence.
@@ -99,10 +97,9 @@ export interface TimelineItemOwnProps {
 export interface TimelineItemProps extends Omit<BoxProps, keyof TimelineItemOwnProps>, TimelineItemOwnProps {
 }
 export type TimelineItemFactory = Factory<{
-    props: Omit<TimelineItemProps, 'rootRef'>;
+    props: TimelineItemProps;
     ref: HTMLSpanElement;
     slots: TimelineItemSlots;
     element: 'span';
     stylesNames: TimelineItemStylesNames;
 }>;
-import type { VueRefTarget } from '@mantine-vue/hooks';

package/lib/components/Timeline/TimelineItem/TimelineItem.vue.d.ts

@@ -1,8 +1,10 @@
+import type { RootRefProps } from '../../../core';
 import type { TimelineItemOwnProps, TimelineItemSlots } from './TimelineItem.types';
+type __VLS_Props = TimelineItemOwnProps & RootRefProps<Element>;
 type __VLS_Slots = TimelineItemSlots;
-declare const __VLS_base: import("vue").DefineComponent<TimelineItemOwnProps, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TimelineItemOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/lib/components/Title/Title.d.ts

@@ -1,5 +1,5 @@
 export declare const Title: import("../..").MantineComponent<{
-    props: Omit<import("./Title.types").TitleProps, "rootRef">;
+    props: import("./Title.types").TitleProps;
     ref: HTMLHeadingElement;
     element: "h1";
     stylesNames: import("./Title.types").TitleStylesNames;

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

@@ -2,8 +2,6 @@ import type { BoxProps, StylesApiProps, Factory } from '../../core';
 import type { TitleOrder, TitleSize } from './get-title-size';
 /** Props declared by `Title` itself. See `TitleProps` for the full public type. */
 export interface TitleOwnProps extends StylesApiProps<TitleFactory> {
-    /** Receives the root DOM node. */
-    rootRef?: VueRefTarget<Element>;
     /**
      * Heading order (1-6), controls `font-size` style if `size` prop is not set
      *
@@ -28,10 +26,9 @@ export type TitleCssVariables = {
     root: '--title-fw' | '--title-lh' | '--title-fz' | '--title-line-clamp' | '--title-text-wrap';
 };
 export type TitleFactory = Factory<{
-    props: Omit<TitleProps, 'rootRef'>;
+    props: TitleProps;
     ref: HTMLHeadingElement;
     element: 'h1';
     stylesNames: TitleStylesNames;
     vars: TitleCssVariables;
 }>;
-import type { VueRefTarget } from '@mantine-vue/hooks';

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

@@ -1,11 +1,12 @@
+import type { RootRefProps } from '../../core';
 import type { TitleOwnProps } from './Title.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<TitleOwnProps, {
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<TitleOwnProps & RootRefProps<Element>, {
     rootElement: import("vue").Ref<Element | null, Element | null>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TitleOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TitleOwnProps & RootRefProps<Element>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;
 type __VLS_WithSlots<T, S> = T & {

package/lib/components/Toggle/Toggle.d.ts

@@ -0,0 +1,15 @@
+export declare const Toggle: import("../..").MantinePolymorphicComponent<{
+    props: Omit<import("./Toggle.types").ToggleProps, "component">;
+    slots: import("./Toggle.types").ToggleSlots;
+    emits: import("./Toggle.types").ToggleEmits;
+    ref: HTMLButtonElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    defaultComponent: "button";
+    defaultRef: HTMLButtonElement;
+    stylesNames: import("./Toggle.types").ToggleStylesNames;
+    vars: import("./Toggle.types").ToggleCssVariables;
+    variant: import("./Toggle.types").ToggleVariant;
+}, "button">;
+export type * from './Toggle.types';

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

@@ -0,0 +1,52 @@
+import type { VNodeChild } from 'vue';
+import type { BoxProps, MantineColor, MantineElementType, MantineRadius, MantineSize, PolymorphicFactory, StylesApiProps } from '../../core';
+export type ToggleStylesNames = 'root';
+export type ToggleVariant = 'light' | 'filled';
+export type ToggleCssVariables = {
+    root: '--toggle-size' | '--toggle-radius' | '--toggle-active-bg' | '--toggle-active-hover' | '--toggle-active-color';
+};
+export interface ToggleOwnProps extends StylesApiProps<ToggleFactory> {
+    /** Root element or Vue component rendered by the component. @default 'button' */
+    component?: MantineElementType;
+    /** Controlled active state */
+    active?: boolean;
+    /** Uncontrolled default active state */
+    defaultActive?: boolean;
+    /** If set, the toggle is disabled */
+    disabled?: boolean;
+    /** Controls toggle height and min-width, `'md'` by default */
+    size?: MantineSize | (string & {});
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, `theme.defaultRadius` by default */
+    radius?: MantineRadius;
+    /** If set, the toggle width adjusts to content instead of being square, `false` by default */
+    autoWidth?: boolean;
+    /** Key of `theme.colors` or any valid CSS color, `theme.primaryColor` by default */
+    color?: MantineColor;
+    /** Determines whether icon color with filled variant should be changed based on the given `color` prop */
+    autoContrast?: boolean;
+    /** Controls visual representation of the component. @default 'filled' */
+    variant?: ToggleVariant;
+}
+export interface ToggleProps extends Omit<BoxProps, keyof ToggleOwnProps>, ToggleOwnProps {
+}
+export interface ToggleSlots {
+    default?: () => VNodeChild;
+}
+export interface ToggleEmits {
+    'update:active': [active: boolean];
+    activeChange: [active: boolean];
+}
+export type ToggleFactory = PolymorphicFactory<{
+    props: Omit<ToggleProps, 'component'>;
+    slots: ToggleSlots;
+    emits: ToggleEmits;
+    ref: HTMLButtonElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    defaultComponent: 'button';
+    defaultRef: HTMLButtonElement;
+    stylesNames: ToggleStylesNames;
+    vars: ToggleCssVariables;
+    variant: ToggleVariant;
+}>;

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

@@ -0,0 +1,20 @@
+import type { RootRefProps } from '../../core';
+import type { ToggleOwnProps, ToggleSlots } from './Toggle.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<ToggleOwnProps & RootRefProps<Element>, {
+    rootElement: import("vue").Ref<Element | null, Element | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:active": (active: boolean) => any;
+    activeChange: (active: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<ToggleOwnProps & RootRefProps<Element>> & Readonly<{
+    "onUpdate:active"?: ((active: boolean) => any) | undefined;
+    onActiveChange?: ((active: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ToggleSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1 @@
+export * from './Toggle';

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

@@ -0,0 +1,12 @@
+export interface ToolbarContextValue {
+    getStyles: (selector: string, options?: Record<string, any>) => any;
+    orientation: 'horizontal' | 'vertical';
+}
+export declare const provideToolbarContext: (value: ToolbarContextValue) => void, useToolbarContext: () => ToolbarContextValue;
+export interface ToolbarToggleGroupContextValue {
+    value: string | string[] | null;
+    type: 'single' | 'multiple';
+    disabled: boolean;
+    onChange: (value: string) => void;
+}
+export declare const provideToolbarToggleGroupContext: (value: ToolbarToggleGroupContextValue) => void, useToolbarToggleGroupContext: () => ToolbarToggleGroupContextValue;

package/lib/components/Toolbar/Toolbar.d.ts

@@ -0,0 +1,26 @@
+import ToolbarGroup from './ToolbarGroup.vue';
+import ToolbarToggle from './ToolbarToggle.vue';
+import ToolbarToggleGroup from './ToolbarToggleGroup.vue';
+import ToolbarToggleItem from './ToolbarToggleItem.vue';
+import ToolbarDivider from './ToolbarDivider.vue';
+export { ToolbarGroup, ToolbarToggle, ToolbarToggleGroup, ToolbarToggleItem, ToolbarDivider };
+export declare const Toolbar: import("../..").MantineComponent<{
+    props: import("./Toolbar.types").ToolbarProps;
+    slots: import("./Toolbar.types").ToolbarSlots;
+    ref: HTMLDivElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    element: "div";
+    stylesNames: import("./Toolbar.types").ToolbarStylesNames;
+    vars: import("./Toolbar.types").ToolbarCssVariables;
+    variant: import("..").ToggleVariant;
+    staticComponents: {
+        Group: typeof ToolbarGroup;
+        Toggle: typeof ToolbarToggle;
+        ToggleGroup: typeof ToolbarToggleGroup;
+        ToggleItem: typeof ToolbarToggleItem;
+        Divider: typeof ToolbarDivider;
+    };
+}>;
+export type * from './Toolbar.types';

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

@@ -0,0 +1,87 @@
+import type { VNodeChild } from 'vue';
+import type { BoxProps, Factory, MantineColor, MantineRadius, MantineSize, StylesApiProps } from '../../core';
+import type { ToggleVariant } from '../Toggle';
+import type ToolbarDivider from './ToolbarDivider.vue';
+import type ToolbarGroup from './ToolbarGroup.vue';
+import type ToolbarToggle from './ToolbarToggle.vue';
+import type ToolbarToggleGroup from './ToolbarToggleGroup.vue';
+import type ToolbarToggleItem from './ToolbarToggleItem.vue';
+export type ToolbarStylesNames = 'root' | 'group' | 'toggle' | 'divider';
+export type ToolbarCssVariables = {
+    root: '--toolbar-toggle-size' | '--toolbar-padding' | '--toolbar-gap' | '--toolbar-radius';
+    toggle: '--toolbar-toggle-active-bg' | '--toolbar-toggle-active-hover' | '--toolbar-toggle-active-color';
+};
+export interface ToolbarOwnProps extends StylesApiProps<ToolbarFactory> {
+    /** Toolbar orientation, `'horizontal'` by default */
+    orientation?: 'horizontal' | 'vertical';
+    /** Whether arrow key navigation wraps from last to first item, `true` by default */
+    loop?: boolean;
+    /** Controls size of toggle components, padding, and gap, `'md'` by default */
+    size?: MantineSize | (string & {});
+    /** Key of `theme.radius` or any valid CSS value to set `border-radius`, propagated to all children, `theme.defaultRadius` by default */
+    radius?: MantineRadius;
+    /** Determines whether the toolbar has a border, `true` by default */
+    withBorder?: boolean;
+    /** Key of `theme.colors` or any valid CSS color, controls color of child toggle components */
+    color?: MantineColor;
+    /** Determines whether icon color with filled variant should be changed based on the given `color` prop */
+    autoContrast?: boolean;
+    /** Controls visual representation of child toggle components. @default 'filled' */
+    variant?: ToggleVariant;
+}
+export interface ToolbarProps extends Omit<BoxProps, keyof ToolbarOwnProps>, ToolbarOwnProps {
+}
+export interface ToolbarSlots {
+    default?: () => VNodeChild;
+}
+export type ToolbarFactory = Factory<{
+    props: ToolbarProps;
+    slots: ToolbarSlots;
+    ref: HTMLDivElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    element: 'div';
+    stylesNames: ToolbarStylesNames;
+    vars: ToolbarCssVariables;
+    variant: ToggleVariant;
+    staticComponents: {
+        Group: typeof ToolbarGroup;
+        Toggle: typeof ToolbarToggle;
+        ToggleGroup: typeof ToolbarToggleGroup;
+        ToggleItem: typeof ToolbarToggleItem;
+        Divider: typeof ToolbarDivider;
+    };
+}>;
+export interface ToolbarCompoundProps extends BoxProps {
+    classNames?: any;
+    styles?: any;
+}
+export type ToolbarGroupProps = ToolbarCompoundProps;
+export type ToolbarDividerProps = ToolbarCompoundProps;
+export interface ToolbarToggleProps extends ToolbarCompoundProps {
+    disabled?: boolean;
+    active?: boolean;
+    autoWidth?: boolean;
+    component?: any;
+}
+interface ToolbarToggleGroupBaseProps extends ToolbarCompoundProps {
+    disabled?: boolean;
+}
+export interface ToolbarToggleGroupSingleProps extends ToolbarToggleGroupBaseProps {
+    type: 'single';
+    modelValue?: string | null;
+    defaultValue?: string | null;
+}
+export interface ToolbarToggleGroupMultipleProps extends ToolbarToggleGroupBaseProps {
+    type: 'multiple';
+    modelValue?: string[];
+    defaultValue?: string[];
+}
+export type ToolbarToggleGroupProps = ToolbarToggleGroupSingleProps | ToolbarToggleGroupMultipleProps;
+export interface ToolbarToggleItemProps extends ToolbarCompoundProps {
+    value: string;
+    disabled?: boolean;
+    autoWidth?: boolean;
+}
+export {};

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

@@ -0,0 +1,14 @@
+import type { RootRefProps } from '../../core';
+import type { ToolbarOwnProps, ToolbarSlots } from './Toolbar.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<ToolbarOwnProps & RootRefProps<Element>, {
+    rootElement: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ToolbarOwnProps & RootRefProps<Element>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ToolbarSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/Toolbar/ToolbarDivider.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<import("./Toolbar.types").ToolbarCompoundProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("./Toolbar.types").ToolbarCompoundProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/lib/components/Toolbar/ToolbarGroup.vue.d.ts

@@ -0,0 +1,13 @@
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("./Toolbar.types").ToolbarCompoundProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("./Toolbar.types").ToolbarCompoundProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/Toolbar/ToolbarToggle.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ToolbarToggleProps } from './Toolbar.types';
+declare var __VLS_10: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ToolbarToggleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ToolbarToggleProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/Toolbar/ToolbarToggleGroup.vue.d.ts

@@ -0,0 +1,19 @@
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("./Toolbar.types").ToolbarToggleGroupSingleProps | import("./Toolbar.types").ToolbarToggleGroupMultipleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (value: string | string[] | null) => any;
+    "update:modelValue": (value: string | string[] | null) => any;
+}, string, import("vue").PublicProps, Readonly<import("./Toolbar.types").ToolbarToggleGroupSingleProps | import("./Toolbar.types").ToolbarToggleGroupMultipleProps> & Readonly<{
+    onChange?: ((value: string | string[] | null) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | string[] | null) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/Toolbar/ToolbarToggleItem.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ToolbarToggleItemProps } from './Toolbar.types';
+declare var __VLS_10: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ToolbarToggleItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ToolbarToggleItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1 @@
+export * from './Toolbar';