@mantine/core 8.0.0-alpha.2 → 8.0.0

package/lib/components/Input/use-input-props.d.ts

@@ -8,18 +8,23 @@ interface BaseProps extends __BaseInputProps, BoxProps, StylesApiProps<{
     __stylesApiProps?: Record<string, any>;
     id?: string;
 }
-export declare function useInputProps<T extends BaseProps, U extends Partial<T>>(component: string, defaultProps: U, _props: T): Omit<T & { [Key in Extract<keyof T, never>]-?: {}[Key] | NonNullable<T[Key]>; }, "variant" | "style" | "size" | "label" | "required" | "className" | "id" | "description" | "error" | "__staticSelector" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "mod" | "unstyled" | "classNames" | "styles" | "vars" | "wrapperProps"> & {
+export declare function useInputProps<T extends BaseProps, U extends Partial<T>>(component: string, defaultProps: U, _props: T): Omit<T & { [Key in Extract<keyof T, never>]-?: {}[Key] | NonNullable<T[Key]>; }, "label" | "style" | "size" | "styles" | "className" | "id" | "vars" | "variant" | "unstyled" | "classNames" | "mod" | "error" | "description" | "__staticSelector" | "required" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "wrapperProps"> & {
     classNames: Partial<Record<string, string>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string>>) | undefined;
     styles: Partial<Record<string, import("../../core").CSSProperties>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../../core").CSSProperties>>) | undefined;
     unstyled: boolean | undefined;
     wrapperProps: {
-        color?: string | undefined;
         children?: import("react").ReactNode | undefined;
-        style: import("react").CSSProperties | ((theme: import("../../core").MantineTheme) => import("../../core").CSSProperties) | import("../../core").MantineStyleProp[] | undefined;
+        onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+        dir?: string | undefined;
         slot?: string | undefined;
+        style: import("react").CSSProperties | ((theme: import("../../core").MantineTheme) => import("../../core").CSSProperties) | import("../../core").MantineStyleProp[] | undefined;
         title?: string | undefined;
+        popover?: "" | "auto" | "manual" | undefined;
+        hidden?: boolean | undefined;
+        color?: string | undefined;
+        content?: string | undefined;
+        translate?: "yes" | "no" | undefined;
         key?: import("react").Key | null | undefined;
-        onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
         defaultChecked?: boolean | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined;
@@ -28,22 +33,18 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
         autoFocus?: boolean | undefined;
         className: string | undefined;
-        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+        contentEditable?: (boolean | "false" | "true") | "inherit" | "plaintext-only" | undefined;
         contextMenu?: string | undefined;
-        dir?: string | undefined;
-        draggable?: (boolean | "true" | "false") | undefined;
+        draggable?: (boolean | "false" | "true") | undefined;
         enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
-        hidden?: boolean | undefined;
         id: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
-        spellCheck?: (boolean | "true" | "false") | undefined;
+        spellCheck?: (boolean | "false" | "true") | undefined;
         tabIndex?: number | undefined;
-        translate?: "yes" | "no" | undefined;
         radioGroup?: string | undefined;
         role?: import("react").AriaRole | undefined;
         about?: string | undefined;
-        content?: string | undefined;
         datatype?: string | undefined;
         inlist?: any;
         prefix?: string | undefined;
@@ -63,18 +64,17 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         results?: number | undefined;
         security?: string | undefined;
         unselectable?: "on" | "off" | undefined;
-        popover?: "" | "auto" | "manual" | undefined;
         popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
         popoverTarget?: string | undefined;
         inert?: boolean | undefined;
         inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
         is?: string | undefined;
         "aria-activedescendant"?: string | undefined;
-        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-atomic"?: (boolean | "false" | "true") | undefined;
         "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
         "aria-braillelabel"?: string | undefined;
         "aria-brailleroledescription"?: string | undefined;
-        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-busy"?: (boolean | "false" | "true") | undefined;
         "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
         "aria-colcount"?: number | undefined;
         "aria-colindex"?: number | undefined;
@@ -85,37 +85,37 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         "aria-describedby"?: string | undefined;
         "aria-description"?: string | undefined;
         "aria-details"?: string | undefined;
-        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-disabled"?: (boolean | "false" | "true") | undefined;
         "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
         "aria-errormessage"?: string | undefined;
-        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-expanded"?: (boolean | "false" | "true") | undefined;
         "aria-flowto"?: string | undefined;
-        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-grabbed"?: (boolean | "false" | "true") | undefined;
         "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
-        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-hidden"?: (boolean | "false" | "true") | undefined;
         "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
         "aria-keyshortcuts"?: string | undefined;
         "aria-label"?: string | undefined;
         "aria-labelledby"?: string | undefined;
         "aria-level"?: number | undefined;
         "aria-live"?: "off" | "assertive" | "polite" | undefined;
-        "aria-modal"?: (boolean | "true" | "false") | undefined;
-        "aria-multiline"?: (boolean | "true" | "false") | undefined;
-        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-modal"?: (boolean | "false" | "true") | undefined;
+        "aria-multiline"?: (boolean | "false" | "true") | undefined;
+        "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
         "aria-orientation"?: "horizontal" | "vertical" | undefined;
         "aria-owns"?: string | undefined;
         "aria-placeholder"?: string | undefined;
         "aria-posinset"?: number | undefined;
         "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
-        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-readonly"?: (boolean | "false" | "true") | undefined;
         "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
-        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-required"?: (boolean | "false" | "true") | undefined;
         "aria-roledescription"?: string | undefined;
         "aria-rowcount"?: number | undefined;
         "aria-rowindex"?: number | undefined;
         "aria-rowindextext"?: string | undefined;
         "aria-rowspan"?: number | undefined;
-        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-selected"?: (boolean | "false" | "true") | undefined;
         "aria-setsize"?: number | undefined;
         "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
         "aria-valuemax"?: number | undefined;
@@ -141,6 +141,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
         onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
         onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+        onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
         onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
         onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
         onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
@@ -156,7 +157,6 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
         onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
         onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-        onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
         onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
         onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
         onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
@@ -306,7 +306,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         styles: Partial<Record<string, import("../../core").CSSProperties>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../../core").CSSProperties>>) | undefined;
         size: (string & {}) | import("../../core").MantineSize | undefined;
         inputContainer: ((children: React.ReactNode) => React.ReactNode) | undefined;
-        inputWrapperOrder: ("input" | "label" | "description" | "error")[] | undefined;
+        inputWrapperOrder: ("input" | "label" | "error" | "description")[] | undefined;
         withAsterisk: boolean | undefined;
         variant: string | undefined;
         mod: import("../../core").BoxMod | undefined;

package/lib/components/NavLink/NavLink.d.ts

@@ -1,4 +1,4 @@
-import { BoxProps, MantineColor, MantineSize, PolymorphicFactory, StylesApiProps } from '../../core';
+import { BoxProps, MantineColor, MantineSpacing, PolymorphicFactory, StylesApiProps } from '../../core';
 export type NavLinkStylesNames = 'root' | 'section' | 'body' | 'label' | 'description' | 'chevron' | 'collapse' | 'children';
 export type NavLinkVariant = 'filled' | 'light' | 'subtle';
 export type NavLinkCssVariables = {
@@ -31,7 +31,7 @@ export interface NavLinkProps extends BoxProps, StylesApiProps<NavLinkFactory> {
     /** If set, right section will not be rotated when collapse is opened, `false` by default */
     disableRightSectionRotation?: boolean;
     /** Key of `theme.spacing` or any valid CSS value to set collapsed links `padding-left`, `'lg'` by default */
-    childrenOffset?: MantineSize | (string & {}) | number;
+    childrenOffset?: MantineSpacing;
     /** If set, disabled styles will be added to the root element, `false` by default */
     disabled?: boolean;
     /** Called when the link is clicked */

package/lib/components/Pagination/Pagination.d.ts

@@ -1,4 +1,4 @@
-import { Factory, MantineSize } from '../../core';
+import { Factory, MantineSpacing } from '../../core';
 import { PaginationIcon } from './Pagination.icons';
 import { PaginationControl } from './PaginationControl/PaginationControl';
 import { PaginationDots } from './PaginationDots/PaginationDots';
@@ -25,7 +25,7 @@ export interface PaginationProps extends PaginationRootProps {
     /** Dots icon component */
     dotsIcon?: PaginationIcon;
     /** Key of `theme.spacing`, gap between controls, `8` by default */
-    gap?: MantineSize | (string & {}) | number;
+    gap?: MantineSpacing;
     /** Determines whether the pagination should be hidden when only one page is available (`total={1}`), `false` by default */
     hideWithOnePage?: boolean;
     /** Determines whether pages controls should be displayed, `true` by default */

package/lib/components/Pill/Pill.d.ts

@@ -1,4 +1,5 @@
 import { BoxProps, ElementProps, Factory, MantineRadius, MantineSize, StylesApiProps } from '../../core';
+import { CloseButtonProps } from '../CloseButton';
 import { PillGroup } from './PillGroup/PillGroup';
 export type PillStylesNames = 'root' | 'label' | 'remove';
 export type PillVariant = 'default' | 'contrast';
@@ -13,7 +14,7 @@ export interface PillProps extends BoxProps, StylesApiProps<PillFactory>, Elemen
     /** Called when the remove button is clicked */
     onRemove?: () => void;
     /** Props passed down to the remove button */
-    removeButtonProps?: React.ComponentPropsWithoutRef<'button'>;
+    removeButtonProps?: CloseButtonProps & React.ComponentPropsWithoutRef<'button'>;
     /** Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. `'xl'` by default. */
     radius?: MantineRadius;
     /** If pill is disabled it has higher contrast to be visible on the disabled input background and the remove button is hidden */

package/lib/components/PillsInput/PillsInput.d.ts

@@ -4,7 +4,6 @@ import { PillsInputField } from './PillsInputField/PillsInputField';
 export interface PillsInputProps extends BoxProps, __BaseInputProps, StylesApiProps<PillsInputFactory>, ElementProps<'div', 'size'> {
     __stylesApiProps?: Record<string, any>;
     __staticSelector?: string;
-    multiline?: boolean;
 }
 export type PillsInputFactory = Factory<{
     props: PillsInputProps;

package/lib/components/Table/TableScrollContainer.d.ts

@@ -1,11 +1,13 @@
 import { BoxProps, ElementProps, Factory, StylesApiProps } from '../../core';
 export type TableScrollContainerStylesNames = 'scrollContainer' | 'scrollContainerInner';
 export type TableScrollContainerCssVariables = {
-    scrollContainer: '--table-min-width' | '--table-overflow';
+    scrollContainer: '--table-min-width' | '--table-max-height' | '--table-overflow';
 };
 export interface TableScrollContainerProps extends BoxProps, StylesApiProps<TableScrollContainerFactory>, ElementProps<'div'> {
     /** `min-width` of the `Table` at which it should become scrollable */
     minWidth: React.CSSProperties['minWidth'];
+    /** `max-height` of the `Table` at which it should become scrollable */
+    maxHeight?: React.CSSProperties['maxHeight'];
     /** Type of the scroll container, `native` to use native scrollbars, `scrollarea` to use `ScrollArea` component, `scrollarea` by default */
     type?: 'native' | 'scrollarea';
 }

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

@@ -3,3 +3,4 @@ export { TableCaption, TableTbody, TableTd, TableTfoot, TableTr, TableTh, TableT
 export { TableScrollContainer } from './TableScrollContainer';
 export type { TableProps, TableStylesNames, TableCssVariables, TableFactory, TableData, } from './Table';
 export type { TableTbodyProps, TableTdProps, TableThProps, TableTrProps, TableCaptionProps, TableTfootProps, TableTheadProps, } from './Table.components';
+export type { TableScrollContainerProps } from './TableScrollContainer';

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

@@ -1,4 +1,4 @@
-import { BoxProps, MantineColor, MantineGradient, MantineSize, PolymorphicFactory, StylesApiProps } from '../../core';
+import { BoxProps, MantineColor, MantineFontSize, MantineGradient, MantineLineHeight, PolymorphicFactory, StylesApiProps } from '../../core';
 type TextTruncate = 'end' | 'start' | boolean;
 export type TextStylesNames = 'root';
 export type TextVariant = 'text' | 'gradient';
@@ -8,7 +8,7 @@ export type TextCssVariables = {
 export interface TextProps extends BoxProps, StylesApiProps<TextFactory> {
     __staticSelector?: string;
     /** Controls `font-size` and `line-height`, `'md'` by default */
-    size?: MantineSize | (string & {});
+    size?: MantineFontSize & MantineLineHeight;
     /** Number of lines after which Text will be truncated */
     lineClamp?: number;
     /** Side on which Text must be truncated, if `true`, text is truncated from the start */

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

@@ -1,6 +1,6 @@
-import { BoxProps, ElementProps, Factory, MantineSize, StylesApiProps } from '../../core';
+import { BoxProps, ElementProps, Factory, MantineFontSize, StylesApiProps } from '../../core';
 export type TitleOrder = 1 | 2 | 3 | 4 | 5 | 6;
-export type TitleSize = `h${TitleOrder}` | React.CSSProperties['fontSize'] | MantineSize;
+export type TitleSize = `h${TitleOrder}` | React.CSSProperties['fontSize'] | MantineFontSize;
 export type TitleStylesNames = 'root';
 export type TitleCssVariables = {
     root: '--title-fw' | '--title-lh' | '--title-fz' | '--title-line-clamp' | '--title-text-wrap';

package/lib/core/MantineProvider/theme.types.d.ts

@@ -119,18 +119,35 @@ export interface HeadingStyle {
     lineHeight: string;
 }
 export type MantineSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export type MantineBreakpointsValues = Record<MantineSize | (string & {}), string>;
-export type MantineFontSizesValues = Record<MantineSize | (string & {}), string>;
-export type MantineRadiusValues = Record<MantineSize | (string & {}), string>;
-export type MantineSpacingValues = Record<MantineSize | (string & {}), string>;
-export type MantineShadowsValues = Record<MantineSize | (string & {}), string>;
-export type MantineLineHeightValues = Record<MantineSize | (string & {}), string>;
-export type MantineBreakpoint = keyof MantineBreakpointsValues;
-export type MantineFontSize = keyof MantineFontSizesValues;
-export type MantineRadius = keyof MantineRadiusValues | (string & {}) | number;
-export type MantineSpacing = keyof MantineSpacingValues | (string & {}) | number;
-export type MantineShadow = keyof MantineShadowsValues | (string & {});
-export type MantineLineHeight = keyof MantineLineHeightValues;
+export type DefaultMantineSize = MantineSize;
+export interface MantineThemeSizesOverride {
+}
+export type MantineBreakpoint = (MantineThemeSizesOverride extends {
+    breakpoints: Record<infer CustomBreakpoints, string>;
+} ? CustomBreakpoints : MantineSize) | (string & {});
+export type MantineBreakpointsValues = Record<MantineBreakpoint, string>;
+export type MantineFontSize = (MantineThemeSizesOverride extends {
+    fontSizes: Record<infer CustomFontSizes, string>;
+} ? CustomFontSizes : MantineSize) | (string & {});
+export type MantineFontSizesValues = Record<MantineFontSize, string>;
+type _MantineRadius = (MantineThemeSizesOverride extends {
+    radius: Record<infer CustomRadius, string>;
+} ? CustomRadius : MantineSize) | (string & {});
+export type MantineRadius = _MantineRadius | number;
+export type MantineRadiusValues = Record<_MantineRadius, string>;
+type _MantineSpacing = (MantineThemeSizesOverride extends {
+    spacing: Record<infer CustomSpacing, string>;
+} ? CustomSpacing : MantineSize) | (string & {});
+export type MantineSpacing = _MantineSpacing | number;
+export type MantineSpacingValues = Record<MantineSpacing, string>;
+export type MantineShadow = (MantineThemeSizesOverride extends {
+    shadows: Record<infer CustomShadow, string>;
+} ? CustomShadow : MantineSize) | (string & {});
+export type MantineShadowsValues = Record<MantineShadow, string>;
+export type MantineLineHeight = (MantineThemeSizesOverride extends {
+    lineHeights: Record<infer CustomLineHeight, string>;
+} ? CustomLineHeight : MantineSize) | (string & {});
+export type MantineLineHeightValues = Record<MantineLineHeight, string>;
 export interface MantineThemeOther {
     [key: string]: any;
 }
@@ -164,3 +181,4 @@ export type MantineThemeColors = MantineThemeColorsOverride extends {
     colors: Record<infer CustomColors, MantineColorsTuple>;
 } ? Record<CustomColors, MantineColorsTuple> : Record<DefaultMantineColor, MantineColorsTuple>;
 export type MantineColor = keyof MantineThemeColors;
+export {};

package/lib/core/MantineProvider/use-mantine-color-scheme/use-computed-color-scheme.d.ts

@@ -1,2 +1,2 @@
 import { UseMediaQueryOptions } from '@mantine/hooks';
-export declare function useComputedColorScheme(defaultValue?: 'light' | 'dark', options?: UseMediaQueryOptions): "dark" | "light";
+export declare function useComputedColorScheme(defaultValue?: 'light' | 'dark', options?: UseMediaQueryOptions): "light" | "dark";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/core",
-  "version": "8.0.0-alpha.2",
+  "version": "8.0.0",
   "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": "8.0.0-alpha.2",
+    "@mantine/hooks": "8.0.0",
     "react": "^18.x || ^19.x",
     "react-dom": "^18.x || ^19.x"
   },
@@ -52,7 +52,7 @@
     "clsx": "^2.1.1",
     "react-number-format": "^5.4.3",
     "react-remove-scroll": "^2.6.2",
-    "react-textarea-autosize": "8.5.6",
+    "react-textarea-autosize": "8.5.9",
     "type-fest": "^4.27.0"
   },
   "devDependencies": {

package/styles/AppShell.css

@@ -4,6 +4,8 @@
   .m_89ab340[data-disabled] {
     --app-shell-header-offset: 0rem !important;
     --app-shell-navbar-offset: 0rem !important;
+    --app-shell-aside-offset: 0rem !important;
+    --app-shell-footer-offset: 0rem !important;
   }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);

package/styles/AppShell.layer.css

@@ -4,6 +4,8 @@
   .m_89ab340[data-disabled] {
     --app-shell-header-offset: 0rem !important;
     --app-shell-navbar-offset: 0rem !important;
+    --app-shell-aside-offset: 0rem !important;
+    --app-shell-footer-offset: 0rem !important;
   }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);

package/styles/ModalBase.css

@@ -38,7 +38,7 @@
     z-index: 1001;
   }
 
-.m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
+[data-offset-scrollbars] .m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
     padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale)));
   }
 

package/styles/ModalBase.layer.css

@@ -38,7 +38,7 @@
     z-index: 1001;
   }
 
-.m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
+[data-offset-scrollbars] .m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
     padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale)));
   }
 

package/styles/Notification.css

@@ -35,10 +35,6 @@
     background-color: var(--mantine-color-dark-6);
 }
 
-  .m_a513464:where([data-with-icon]) {
-    padding-inline-start: var(--mantine-spacing-xs);
-  }
-
   .m_a513464:where([data-with-icon])::before {
       display: none;
     }

package/styles/Notification.layer.css

@@ -35,10 +35,6 @@
     background-color: var(--mantine-color-dark-6);
 }
 
-  .m_a513464:where([data-with-icon]) {
-    padding-inline-start: var(--mantine-spacing-xs);
-  }
-
   .m_a513464:where([data-with-icon])::before {
       display: none;
     }

package/styles/Paper.css

@@ -11,10 +11,14 @@
   background-color: var(--mantine-color-body);
 }
 
-  :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+  [data-mantine-color-scheme='light'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-gray-3);
 }
 
-  :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+  [data-mantine-color-scheme='dark'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-dark-4);
 }
+
+  .m_1b7284a3:where([data-with-border]) {
+    border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
+  }

package/styles/Paper.layer.css

@@ -11,11 +11,15 @@
   background-color: var(--mantine-color-body);
 }
 
-  :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+  [data-mantine-color-scheme='light'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-gray-3);
 }
 
-  :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+  [data-mantine-color-scheme='dark'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-dark-4);
 }
+
+  .m_1b7284a3:where([data-with-border]) {
+    border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
+  }
 }

package/styles/Table.css

@@ -102,9 +102,18 @@
 
 .m_b242d975:where([data-sticky]) {
     position: sticky;
-    background-color: var(--mantine-color-body);
   }
 
+.m_b242d975:where([data-sticky]) :where(.m_4e7aa4f3) {
+      position: sticky;
+      top: var(--table-sticky-header-offset, 0);
+      background-color: var(--mantine-color-body);
+    }
+
+:where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
+  top: initial;
+}
+
 .m_9e5a3ac7 {
   color: var(--mantine-color-dimmed);
 }
@@ -123,4 +132,5 @@
 
 .m_62259741 {
   min-width: var(--table-min-width);
+  max-height: var(--table-max-height);
 }

package/styles/Table.layer.css

@@ -102,9 +102,18 @@
 
 .m_b242d975:where([data-sticky]) {
     position: sticky;
-    background-color: var(--mantine-color-body);
   }
 
+.m_b242d975:where([data-sticky]) :where(.m_4e7aa4f3) {
+      position: sticky;
+      top: var(--table-sticky-header-offset, 0);
+      background-color: var(--mantine-color-body);
+    }
+
+:where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
+  top: initial;
+}
+
 .m_9e5a3ac7 {
   color: var(--mantine-color-dimmed);
 }
@@ -123,5 +132,6 @@
 
 .m_62259741 {
   min-width: var(--table-min-width);
+  max-height: var(--table-max-height);
 }
 }

package/styles/TypographyStylesProvider.css

@@ -7,6 +7,7 @@
   .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
     margin-bottom: var(--mantine-spacing-xs);
     text-wrap: var(--mantine-heading-text-wrap);
+    font-family: var(--mantine-font-family-headings);
   }
   .m_d6493fad :where(h1) {
     margin-top: calc(1.5 * var(--mantine-spacing-xl));

package/styles/TypographyStylesProvider.layer.css

@@ -7,6 +7,7 @@
   .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
     margin-bottom: var(--mantine-spacing-xs);
     text-wrap: var(--mantine-heading-text-wrap);
+    font-family: var(--mantine-font-family-headings);
   }
   .m_d6493fad :where(h1) {
     margin-top: calc(1.5 * var(--mantine-spacing-xl));

package/styles.css

@@ -817,14 +817,18 @@ fieldset:disabled .mantine-active:active {
   background-color: var(--mantine-color-body);
 }
 
-  :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+  [data-mantine-color-scheme='light'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-gray-3);
 }
 
-  :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+  [data-mantine-color-scheme='dark'] .m_1b7284a3 {
+    --paper-border-color: var(--mantine-color-dark-4);
 }
 
+  .m_1b7284a3:where([data-with-border]) {
+    border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
+  }
+
 .m_9814e45f {
   inset: 0;
   position: absolute;
@@ -1307,7 +1311,7 @@ fieldset:disabled .mantine-active:active {
     z-index: 1001;
   }
 
-.m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
+[data-offset-scrollbars] .m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c {
     padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale)));
   }
 
@@ -2149,6 +2153,8 @@ fieldset:disabled .mantine-active:active {
   .m_89ab340[data-disabled] {
     --app-shell-header-offset: 0rem !important;
     --app-shell-navbar-offset: 0rem !important;
+    --app-shell-aside-offset: 0rem !important;
+    --app-shell-footer-offset: 0rem !important;
   }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);
@@ -4828,10 +4834,6 @@ fieldset:disabled .m_d3ea56bb,
     background-color: var(--mantine-color-dark-6);
 }
 
-  .m_a513464:where([data-with-icon]) {
-    padding-inline-start: var(--mantine-spacing-xs);
-  }
-
   .m_a513464:where([data-with-icon])::before {
       display: none;
     }
@@ -6797,9 +6799,18 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
 
 .m_b242d975:where([data-sticky]) {
     position: sticky;
-    background-color: var(--mantine-color-body);
   }
 
+.m_b242d975:where([data-sticky]) :where(.m_4e7aa4f3) {
+      position: sticky;
+      top: var(--table-sticky-header-offset, 0);
+      background-color: var(--mantine-color-body);
+    }
+
+:where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
+  top: initial;
+}
+
 .m_9e5a3ac7 {
   color: var(--mantine-color-dimmed);
 }
@@ -6818,6 +6829,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
 
 .m_62259741 {
   min-width: var(--table-min-width);
+  max-height: var(--table-max-height);
 }
 
 .m_bcaa9990 {
@@ -7485,6 +7497,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
   .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
     margin-bottom: var(--mantine-spacing-xs);
     text-wrap: var(--mantine-heading-text-wrap);
+    font-family: var(--mantine-font-family-headings);
   }
   .m_d6493fad :where(h1) {
     margin-top: calc(1.5 * var(--mantine-spacing-xl));