@mantine/core 9.0.0-alpha.7 → 9.0.1

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

@@ -1,10 +1,3 @@
 import type { TableOfContentsCssVariables, TableOfContentsFactory, TableOfContentsProps, TableOfContentsStylesNames, TableOfContentsVariant } from './TableOfContents';
 export { TableOfContents } from './TableOfContents';
 export type { TableOfContentsProps, TableOfContentsStylesNames, TableOfContentsCssVariables, TableOfContentsFactory, TableOfContentsVariant, };
-export declare namespace TableOfContents {
-    type Props = TableOfContentsProps;
-    type StylesNames = TableOfContentsStylesNames;
-    type CssVariables = TableOfContentsCssVariables;
-    type Factory = TableOfContentsFactory;
-    type Variant = TableOfContentsVariant;
-}

package/lib/components/Tabs/Tabs.d.ts

@@ -1,7 +1,8 @@
 import { BoxProps, ElementProps, Factory, MantineColor, MantineRadius, StylesApiProps } from '../../core';
-import { TabsList, TabsListStylesNames } from './TabsList/TabsList';
-import { TabsPanel, TabsPanelStylesNames } from './TabsPanel/TabsPanel';
-import { TabsTab, TabsTabStylesNames } from './TabsTab/TabsTab';
+import { type TabsContextValue } from './Tabs.context';
+import { TabsList, TabsListStylesNames, type TabsListProps } from './TabsList/TabsList';
+import { TabsPanel, TabsPanelStylesNames, type TabsPanelProps } from './TabsPanel/TabsPanel';
+import { TabsTab, TabsTabStylesNames, type TabsTabProps } from './TabsTab/TabsTab';
 export type TabsStylesNames = 'root' | TabsListStylesNames | TabsPanelStylesNames | TabsTabStylesNames;
 export type TabsVariant = 'default' | 'outline' | 'pills';
 export type TabsCssVariables = {
@@ -63,3 +64,23 @@ export declare const Tabs: import("../..").MantineComponent<{
         List: typeof TabsList;
     };
 }>;
+export declare namespace Tabs {
+    type Props = TabsProps;
+    type StylesNames = TabsStylesNames;
+    type CssVariables = TabsCssVariables;
+    type Factory = TabsFactory;
+    type Variant = TabsVariant;
+    type ContextValue = TabsContextValue;
+    namespace Tab {
+        type Props = TabsTabProps;
+        type StylesNames = TabsTabStylesNames;
+    }
+    namespace Panel {
+        type Props = TabsPanelProps;
+        type StylesNames = TabsPanelStylesNames;
+    }
+    namespace List {
+        type Props = TabsListProps;
+        type StylesNames = TabsListStylesNames;
+    }
+}

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

@@ -9,23 +9,3 @@ export { TabsTab } from './TabsTab/TabsTab';
 export { TabsPanel } from './TabsPanel/TabsPanel';
 export { useTabsContext } from './Tabs.context';
 export type { TabsProps, TabsStylesNames, TabsCssVariables, TabsFactory, TabsVariant, TabsTabProps, TabsTabStylesNames, TabsPanelProps, TabsPanelStylesNames, TabsListProps, TabsListStylesNames, TabsContextValue, };
-export declare namespace Tabs {
-    type Props = TabsProps;
-    type StylesNames = TabsStylesNames;
-    type CssVariables = TabsCssVariables;
-    type Factory = TabsFactory;
-    type Variant = TabsVariant;
-    type ContextValue = TabsContextValue;
-    namespace Tab {
-        type Props = TabsTabProps;
-        type StylesNames = TabsTabStylesNames;
-    }
-    namespace Panel {
-        type Props = TabsPanelProps;
-        type StylesNames = TabsPanelStylesNames;
-    }
-    namespace List {
-        type Props = TabsListProps;
-        type StylesNames = TabsListStylesNames;
-    }
-}

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

@@ -65,3 +65,8 @@ export declare const TagsInput: import("../..").MantineComponent<{
     ref: HTMLInputElement;
     stylesNames: TagsInputStylesNames;
 }>;
+export declare namespace TagsInput {
+    type Props = TagsInputProps;
+    type StylesNames = TagsInputStylesNames;
+    type Factory = TagsInputFactory;
+}

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

@@ -1,8 +1,3 @@
 import type { TagsInputFactory, TagsInputProps, TagsInputStylesNames } from './TagsInput';
 export { TagsInput } from './TagsInput';
 export type { TagsInputProps, TagsInputStylesNames, TagsInputFactory };
-export declare namespace TagsInput {
-    type Props = TagsInputProps;
-    type StylesNames = TagsInputStylesNames;
-    type Factory = TagsInputFactory;
-}

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

@@ -69,4 +69,11 @@ export declare const Text: (<C = "p">(props: import("../..").PolymorphicComponen
     vars: TextCssVariables;
     variant: TextVariant;
 }> & Record<string, never>;
+export declare namespace Text {
+    type Props = TextProps;
+    type StylesNames = TextStylesNames;
+    type CssVariables = TextCssVariables;
+    type Factory = TextFactory;
+    type Variant = TextVariant;
+}
 export {};

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

@@ -1,10 +1,3 @@
 import type { TextCssVariables, TextFactory, TextProps, TextStylesNames, TextVariant } from './Text';
 export { Text } from './Text';
 export type { TextProps, TextStylesNames, TextCssVariables, TextFactory, TextVariant };
-export declare namespace Text {
-    type Props = TextProps;
-    type StylesNames = TextStylesNames;
-    type CssVariables = TextCssVariables;
-    type Factory = TextFactory;
-    type Variant = TextVariant;
-}

package/lib/components/TextInput/TextInput.d.ts

@@ -14,3 +14,7 @@ export declare const TextInput: import("../..").MantineComponent<{
     ref: HTMLInputElement;
     stylesNames: __InputStylesNames;
 }>;
+export declare namespace TextInput {
+    type Props = TextInputProps;
+    type Factory = TextInputFactory;
+}

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

@@ -1,7 +1,3 @@
 import type { TextInputFactory, TextInputProps } from './TextInput';
 export { TextInput } from './TextInput';
 export type { TextInputProps, TextInputFactory };
-export declare namespace TextInput {
-    type Props = TextInputProps;
-    type Factory = TextInputFactory;
-}

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

@@ -21,3 +21,7 @@ export declare const Textarea: import("../..").MantineComponent<{
     ref: HTMLTextAreaElement;
     stylesNames: __InputStylesNames;
 }>;
+export declare namespace Textarea {
+    type Props = TextareaProps;
+    type Factory = TextareaFactory;
+}

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

@@ -1,7 +1,3 @@
 import type { TextareaFactory, TextareaProps } from './Textarea';
 export { Textarea } from './Textarea';
 export type { TextareaProps, TextareaFactory };
-export declare namespace Textarea {
-    type Props = TextareaProps;
-    type Factory = TextareaFactory;
-}

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

@@ -32,3 +32,10 @@ export declare const ThemeIcon: import("../..").MantineComponent<{
     vars: ThemeIconCssVariables;
     variant: ThemeIconVariant;
 }>;
+export declare namespace ThemeIcon {
+    type Props = ThemeIconProps;
+    type StylesNames = ThemeIconStylesNames;
+    type Factory = ThemeIconFactory;
+    type Variant = ThemeIconVariant;
+    type CssVariables = ThemeIconCssVariables;
+}

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

@@ -1,10 +1,3 @@
 import type { ThemeIconCssVariables, ThemeIconFactory, ThemeIconProps, ThemeIconStylesNames, ThemeIconVariant } from './ThemeIcon';
 export { ThemeIcon } from './ThemeIcon';
 export type { ThemeIconProps, ThemeIconStylesNames, ThemeIconFactory, ThemeIconVariant, ThemeIconCssVariables, };
-export declare namespace ThemeIcon {
-    type Props = ThemeIconProps;
-    type StylesNames = ThemeIconStylesNames;
-    type Factory = ThemeIconFactory;
-    type Variant = ThemeIconVariant;
-    type CssVariables = ThemeIconCssVariables;
-}

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

@@ -1,5 +1,5 @@
 import { BoxProps, ElementProps, Factory, MantineColor, MantineRadius, StylesApiProps } from '../../core';
-import { TimelineItem, TimelineItemStylesNames } from './TimelineItem/TimelineItem';
+import { TimelineItem, TimelineItemStylesNames, type TimelineItemProps, type TimelineItemFactory } from './TimelineItem/TimelineItem';
 export type TimelineStylesNames = 'root' | TimelineItemStylesNames;
 export type TimelineCssVariables = {
     root: '--tl-line-width' | '--tl-bullet-size' | '--tl-color' | '--tl-icon-color' | '--tl-radius';
@@ -42,3 +42,14 @@ export declare const Timeline: import("../..").MantineComponent<{
         Item: typeof TimelineItem;
     };
 }>;
+export declare namespace Timeline {
+    type Props = TimelineProps;
+    type StylesNames = TimelineStylesNames;
+    type CssVariables = TimelineCssVariables;
+    type Factory = TimelineFactory;
+    namespace Item {
+        type Props = TimelineItemProps;
+        type StylesNames = TimelineItemStylesNames;
+        type Factory = TimelineItemFactory;
+    }
+}

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

@@ -3,14 +3,3 @@ import type { TimelineItemFactory, TimelineItemProps, TimelineItemStylesNames }
 export { Timeline } from './Timeline';
 export { TimelineItem } from './TimelineItem/TimelineItem';
 export type { TimelineProps, TimelineStylesNames, TimelineCssVariables, TimelineFactory, TimelineItemProps, TimelineItemStylesNames, TimelineItemFactory, };
-export declare namespace Timeline {
-    type Props = TimelineProps;
-    type StylesNames = TimelineStylesNames;
-    type CssVariables = TimelineCssVariables;
-    type Factory = TimelineFactory;
-    namespace Item {
-        type Props = TimelineItemProps;
-        type StylesNames = TimelineItemStylesNames;
-        type Factory = TimelineItemFactory;
-    }
-}

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

@@ -27,3 +27,11 @@ export declare const Title: import("../..").MantineComponent<{
     stylesNames: TitleStylesNames;
     vars: TitleCssVariables;
 }>;
+export declare namespace Title {
+    type Props = TitleProps;
+    type Order = TitleOrder;
+    type Size = TitleSize;
+    type StylesNames = TitleStylesNames;
+    type CssVariables = TitleCssVariables;
+    type Factory = TitleFactory;
+}

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

@@ -1,11 +1,3 @@
 import type { TitleCssVariables, TitleFactory, TitleOrder, TitleProps, TitleSize, TitleStylesNames } from './Title';
 export { Title } from './Title';
 export type { TitleProps, TitleOrder, TitleSize, TitleStylesNames, TitleCssVariables, TitleFactory, };
-export declare namespace Title {
-    type Props = TitleProps;
-    type Order = TitleOrder;
-    type Size = TitleSize;
-    type StylesNames = TitleStylesNames;
-    type CssVariables = TitleCssVariables;
-    type Factory = TitleFactory;
-}

package/lib/components/Tooltip/Tooltip.d.ts

@@ -2,8 +2,8 @@ import { Factory } from '../../core';
 import { ArrowPosition, FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';
 import { TransitionOverride } from '../Transition';
 import { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from './Tooltip.types';
-import { TooltipFloating } from './TooltipFloating/TooltipFloating';
-import { TooltipGroup } from './TooltipGroup/TooltipGroup';
+import { TooltipFloating, type TooltipFloatingProps } from './TooltipFloating/TooltipFloating';
+import { TooltipGroup, type TooltipGroupProps, type TooltipGroupContextValue } from './TooltipGroup/TooltipGroup';
 export interface TooltipProps extends TooltipBaseProps {
     /** Called when tooltip position changes */
     onPositionChange?: (position: FloatingPosition) => void;
@@ -66,3 +66,16 @@ export declare const Tooltip: import("../..").MantineComponent<{
         Group: typeof TooltipGroup;
     };
 }>;
+export declare namespace Tooltip {
+    type Props = TooltipProps;
+    type Factory = TooltipFactory;
+    type CssVariables = TooltipCssVariables;
+    type StylesNames = TooltipStylesNames;
+    namespace Group {
+        type Props = TooltipGroupProps;
+        type ContextValue = TooltipGroupContextValue;
+    }
+    namespace Floating {
+        type Props = TooltipFloatingProps;
+    }
+}

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

@@ -6,16 +6,3 @@ export { Tooltip } from './Tooltip';
 export { TooltipGroup, TooltipGroupContext } from './TooltipGroup/TooltipGroup';
 export { TooltipFloating } from './TooltipFloating/TooltipFloating';
 export type { TooltipProps, TooltipFactory, TooltipCssVariables, TooltipStylesNames, TooltipGroupProps, TooltipGroupContextValue, TooltipFloatingProps, };
-export declare namespace Tooltip {
-    type Props = TooltipProps;
-    type Factory = TooltipFactory;
-    type CssVariables = TooltipCssVariables;
-    type StylesNames = TooltipStylesNames;
-    namespace Group {
-        type Props = TooltipGroupProps;
-        type ContextValue = TooltipGroupContextValue;
-    }
-    namespace Floating {
-        type Props = TooltipFloatingProps;
-    }
-}

package/lib/components/Tree/Tree.d.ts

@@ -69,3 +69,10 @@ export declare const Tree: import("../..").MantineComponent<{
     stylesNames: TreeStylesNames;
     vars: TreeCssVariables;
 }>;
+export declare namespace Tree {
+    type Props = TreeProps;
+    type StylesNames = TreeStylesNames;
+    type Factory = TreeFactory;
+    type NodeData = TreeNodeData;
+    type RenderNodePayload = RenderTreeNodePayload;
+}

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

@@ -4,10 +4,3 @@ import type { UseTreeInput, UseTreeReturnType } from './use-tree';
 export { Tree } from './Tree';
 export { useTree, getTreeExpandedState } from './use-tree';
 export type { TreeProps, TreeStylesNames, TreeFactory, TreeCssVariables, TreeNodeData, RenderTreeNodePayload, UseTreeInput, UseTreeReturnType, CheckedNodeStatus, };
-export declare namespace Tree {
-    type Props = TreeProps;
-    type StylesNames = TreeStylesNames;
-    type Factory = TreeFactory;
-    type NodeData = TreeNodeData;
-    type RenderNodePayload = RenderTreeNodePayload;
-}

package/lib/components/Typography/Typography.d.ts

@@ -12,3 +12,8 @@ export declare const Typography: import("../..").MantineComponent<{
     ref: HTMLDivElement;
     stylesNames: TypographyStylesNames;
 }>;
+export declare namespace Typography {
+    type Props = TypographyProps;
+    type StylesNames = TypographyStylesNames;
+    type Factory = TypographyFactory;
+}

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

@@ -1,8 +1,3 @@
 import type { TypographyFactory, TypographyProps, TypographyStylesNames } from './Typography';
 export { Typography } from './Typography';
 export type { TypographyProps, TypographyStylesNames, TypographyFactory };
-export declare namespace Typography {
-    type Props = TypographyProps;
-    type StylesNames = TypographyStylesNames;
-    type Factory = TypographyFactory;
-}

package/lib/components/UnstyledButton/UnstyledButton.d.ts

@@ -33,3 +33,8 @@ export declare const UnstyledButton: (<C = "button">(props: import("../..").Poly
     defaultComponent: "button";
     defaultRef: HTMLButtonElement;
 }> & Record<string, never>;
+export declare namespace UnstyledButton {
+    type Props = UnstyledButtonProps;
+    type StylesNames = UnstyledButtonStylesNames;
+    type Factory = UnstyledButtonFactory;
+}

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

@@ -1,8 +1,3 @@
 import type { UnstyledButtonFactory, UnstyledButtonProps, UnstyledButtonStylesNames } from './UnstyledButton';
 export { UnstyledButton } from './UnstyledButton';
 export type { UnstyledButtonProps, UnstyledButtonStylesNames, UnstyledButtonFactory };
-export declare namespace UnstyledButton {
-    type Props = UnstyledButtonProps;
-    type StylesNames = UnstyledButtonStylesNames;
-    type Factory = UnstyledButtonFactory;
-}

package/lib/components/VisuallyHidden/VisuallyHidden.d.ts

@@ -12,3 +12,6 @@ export declare const VisuallyHidden: import("../..").MantineComponent<{
     ref: HTMLSpanElement;
     stylesNames: VisuallyHiddenStylesNames;
 }>;
+export declare namespace VisuallyHidden {
+    type Props = VisuallyHiddenProps;
+}

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

@@ -1,6 +1,3 @@
 import type { VisuallyHiddenProps } from './VisuallyHidden';
 export { VisuallyHidden } from './VisuallyHidden';
 export type { VisuallyHiddenProps };
-export declare namespace VisuallyHidden {
-    type Props = VisuallyHiddenProps;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/core",
-  "version": "9.0.0-alpha.7",
+  "version": "9.0.1",
   "description": "React components library focused on usability, accessibility and developer experience",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -43,7 +43,7 @@
     "directory": "packages/@mantine/core"
   },
   "peerDependencies": {
-    "@mantine/hooks": "9.0.0-alpha.7",
+    "@mantine/hooks": "9.0.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"
   },

package/styles/Accordion.css

@@ -100,10 +100,6 @@
     margin-inline-start: var(--mantine-spacing-lg);
   }
 
-.m_9bd7b098 {
-  overflow: hidden;
-}
-
 :where([data-mantine-color-scheme='light']) .m_9bd7b098 {
     --item-border-color: var(--mantine-color-gray-3);
     --item-filled-color: var(--mantine-color-gray-0);

package/styles/Accordion.layer.css

@@ -100,10 +100,6 @@
     margin-inline-start: var(--mantine-spacing-lg);
   }
 
-.m_9bd7b098 {
-  overflow: hidden;
-}
-
 :where([data-mantine-color-scheme='light']) .m_9bd7b098 {
     --item-border-color: var(--mantine-color-gray-3);
     --item-filled-color: var(--mantine-color-gray-0);

package/styles/Button.css

@@ -137,6 +137,8 @@
   display: flex;
   align-items: center;
   opacity: 1;
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_811560b9:where([data-loading]) {

package/styles/Button.layer.css

@@ -137,6 +137,8 @@
   display: flex;
   align-items: center;
   opacity: 1;
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_811560b9:where([data-loading]) {

package/styles/Chip.css

@@ -54,6 +54,8 @@
   -webkit-tap-highlight-color: transparent;
   border: 1px solid transparent;
   color: var(--mantine-color-text);
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_be049a53:where([data-checked]) {

package/styles/Chip.layer.css

@@ -54,6 +54,8 @@
   -webkit-tap-highlight-color: transparent;
   border: 1px solid transparent;
   color: var(--mantine-color-text);
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_be049a53:where([data-checked]) {

package/styles/Pill.css

@@ -64,9 +64,12 @@
 .m_1e0e6180 {
   cursor: inherit;
   overflow: hidden;
-  height: 100%;
-  line-height: var(--pill-height);
   text-overflow: ellipsis;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_ae386778 {

package/styles/Pill.layer.css

@@ -64,9 +64,12 @@
 .m_1e0e6180 {
   cursor: inherit;
   overflow: hidden;
-  height: 100%;
-  line-height: var(--pill-height);
   text-overflow: ellipsis;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  text-box-trim: trim-both;
+  text-box-edge: cap alphabetic;
 }
 
 .m_ae386778 {

package/styles/SegmentedControl.css

@@ -45,7 +45,7 @@
   position: absolute;
   display: block;
   z-index: 1;
-  border-radius: var(--sc-radius, var(--mantine-radius-default));
+  border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
 }
 
 :where([data-mantine-color-scheme='light']) .m_9e182ccd {
@@ -67,7 +67,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
   user-select: none;
-  border-radius: var(--sc-radius, var(--mantine-radius-default));
+  border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
   font-size: var(--sc-font-size);
   padding: var(--sc-padding);
   transition: color var(--sc-transition-duration) var(--sc-transition-timing-function);
@@ -112,7 +112,7 @@ fieldset:disabled .m_1738fcb2,
       inset: 0;
       z-index: 0;
       position: absolute;
-      border-radius: var(--sc-radius, var(--mantine-radius-default));
+      border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
 }
 
 :where([data-mantine-color-scheme='light']) .m_1738fcb2:where([data-active])::before {

package/styles/SegmentedControl.layer.css

@@ -45,7 +45,7 @@
   position: absolute;
   display: block;
   z-index: 1;
-  border-radius: var(--sc-radius, var(--mantine-radius-default));
+  border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
 }
 
 :where([data-mantine-color-scheme='light']) .m_9e182ccd {
@@ -67,7 +67,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
   user-select: none;
-  border-radius: var(--sc-radius, var(--mantine-radius-default));
+  border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
   font-size: var(--sc-font-size);
   padding: var(--sc-padding);
   transition: color var(--sc-transition-duration) var(--sc-transition-timing-function);
@@ -112,7 +112,7 @@ fieldset:disabled .m_1738fcb2,
       inset: 0;
       z-index: 0;
       position: absolute;
-      border-radius: var(--sc-radius, var(--mantine-radius-default));
+      border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);
 }
 
 :where([data-mantine-color-scheme='light']) .m_1738fcb2:where([data-active])::before {

package/styles/Slider.css

@@ -57,7 +57,7 @@
     background-color: var(--mantine-color-dark-4);
 }
 
-:where([data-orientation='vertical']) .m_c9357328 {
+:where(.m_dd36362e[data-orientation='vertical']) .m_c9357328 {
     top: auto;
     inset-inline-start: calc(100% + 8px);
   }
@@ -111,7 +111,7 @@ fieldset:disabled .m_c9a9a60a,
     background-color: var(--slider-color);
 }
 
-:where([data-orientation='vertical']) .m_c9a9a60a {
+:where(.m_dd36362e[data-orientation='vertical']) .m_c9a9a60a {
     left: 50%;
     top: auto;
     right: auto;
@@ -119,11 +119,11 @@ fieldset:disabled .m_c9a9a60a,
     transform: translate(-50%, 50%);
   }
 
-:where([data-orientation='vertical']) .m_c9a9a60a:where([data-dragging]) {
+:where(.m_dd36362e[data-orientation='vertical']) .m_c9a9a60a:where([data-dragging]) {
       transform: translate(-50%, 50%) scale(1.05);
     }
 
-:where([dir="rtl"]) :where([data-orientation='vertical']) .m_c9a9a60a {
+:where([dir="rtl"]) :where(.m_dd36362e[data-orientation='vertical']) .m_c9a9a60a {
       left: 50%;
       right: auto;
 }
@@ -141,7 +141,7 @@ fieldset:disabled .m_a8645c2,
     cursor: not-allowed;
   }
 
-:where([data-orientation='vertical']) .m_a8645c2 {
+:where(.m_dd36362e[data-orientation='vertical']) .m_a8645c2 {
     flex-direction: column;
     width: calc(var(--slider-size) * 2);
     height: 100%;
@@ -173,12 +173,12 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
     z-index: 0;
   }
 
-:where([data-orientation='vertical']) .m_c9ade57f {
+:where(.m_dd36362e[data-orientation='vertical']) .m_c9ade57f {
     width: var(--slider-size);
     height: 100%;
   }
 
-:where([data-orientation='vertical']) .m_c9ade57f::before {
+:where(.m_dd36362e[data-orientation='vertical']) .m_c9ade57f::before {
       inset-inline: 0;
       top: calc(var(--slider-size) * -1);
       bottom: calc(var(--slider-size) * -1);
@@ -204,7 +204,7 @@ fieldset:disabled .m_38aeed47:where(:not([data-inverted])),
     background-color: var(--mantine-color-disabled-color);
   }
 
-:where([data-orientation='vertical']) .m_38aeed47 {
+:where(.m_dd36362e[data-orientation='vertical']) .m_38aeed47 {
     top: auto;
     bottom: var(--slider-bar-offset);
     inset-inline-start: 0;
@@ -221,7 +221,7 @@ fieldset:disabled .m_38aeed47:where(:not([data-inverted])),
   pointer-events: none;
 }
 
-:where([data-orientation='vertical']) .m_b7b0423a {
+:where(.m_dd36362e[data-orientation='vertical']) .m_b7b0423a {
     inset-inline-start: 0;
     top: auto;
     bottom: calc(var(--mark-offset) + var(--slider-size) / 2);
@@ -270,7 +270,7 @@ fieldset:disabled .m_38aeed47:where(:not([data-inverted])),
     color: var(--mantine-color-dark-2);
 }
 
-:where([data-orientation='vertical']) .m_68c77a5b {
+:where(.m_dd36362e[data-orientation='vertical']) .m_68c77a5b {
     transform: translate(
       calc(var(--slider-size) + var(--mantine-spacing-xs) / 2),
       calc(-50% - var(--slider-size) / 2)