@mantine/core 8.3.11 → 8.3.13

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

@@ -46,6 +46,8 @@ export interface TagsInputProps extends BoxProps, __BaseInputProps, Omit<Combobo
     acceptValueOnBlur?: boolean;
     /** Custom function to determine if a tag is duplicate. Accepts tag value and array of current values. By default, checks if the tag exists case-insensitively. */
     isDuplicate?: (value: string, currentValues: string[]) => boolean;
+    /** If set, the dropdown opens when the input receives focus @default `true` */
+    openOnFocus?: boolean;
 }
 export type TagsInputFactory = Factory<{
     props: TagsInputProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/core",
-  "version": "8.3.11",
+  "version": "8.3.13",
   "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.3.11",
+    "@mantine/hooks": "8.3.13",
     "react": "^18.x || ^19.x",
     "react-dom": "^18.x || ^19.x"
   },

package/styles/AppShell.css

@@ -7,6 +7,14 @@
     --app-shell-aside-offset: 0rem !important;
     --app-shell-footer-offset: 0rem !important;
   }
+  .m_89ab340[data-mode='static'] {
+    display: grid;
+    grid-template-columns: var(--app-shell-navbar-width, 0) 1fr var(--app-shell-aside-width, 0);
+    grid-template-rows: auto 1fr auto;
+    position: relative;
+    height: 100%;
+    overflow: auto;
+  }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);
 }
@@ -36,11 +44,21 @@
   transition-property: transform, top, height;
 }
 
+:where([data-mode='static']) .m_45252eee, :where([data-mode='static']) .m_9cdde9a {
+    position: var(--app-shell-navbar-position, fixed);
+    grid-row: var(--app-shell-navbar-grid-row, auto);
+    height: 100%;
+  }
+
 :where([data-layout='alt']) .m_45252eee, :where([data-layout='alt']) .m_9cdde9a {
     top: 0rem;
     height: 100dvh;
   }
 
+:where([data-mode='static'][data-layout='alt']) .m_45252eee, :where([data-mode='static'][data-layout='alt']) .m_9cdde9a {
+    grid-row: var(--app-shell-navbar-grid-row-alt, var(--app-shell-navbar-grid-row, auto));
+  }
+
 .m_45252eee {
   inset-inline-start: 0;
   width: var(--app-shell-navbar-width);
@@ -49,6 +67,11 @@
   z-index: var(--app-shell-navbar-z-index);
 }
 
+:where([data-mode='static']) .m_45252eee {
+    grid-column: var(--app-shell-navbar-grid-column, auto);
+    display: var(--app-shell-navbar-display, flex);
+  }
+
 :where([dir="rtl"]) .m_45252eee {
     transform: var(--app-shell-navbar-transform-rtl);
 }
@@ -64,6 +87,13 @@
   z-index: var(--app-shell-aside-z-index);
 }
 
+:where([data-mode='static']) .m_9cdde9a {
+    position: var(--app-shell-aside-position, fixed);
+    grid-column: var(--app-shell-aside-grid-column, auto);
+    grid-row: var(--app-shell-aside-grid-row, auto);
+    display: var(--app-shell-aside-display, flex);
+  }
+
 :where([dir="rtl"]) .m_9cdde9a {
     transform: var(--app-shell-aside-transform-rtl);
 }
@@ -85,6 +115,16 @@
   transition-property: padding;
 }
 
+:where([data-mode='static']) .m_8983817 {
+    padding-inline-start: var(--app-shell-padding);
+    padding-inline-end: var(--app-shell-padding);
+    padding-top: var(--app-shell-padding);
+    padding-bottom: var(--app-shell-padding);
+    min-height: auto;
+    grid-column: var(--app-shell-main-column-start, 1) / var(--app-shell-main-column-end, -1);
+    grid-row: var(--app-shell-main-grid-row, 2);
+  }
+
 .m_3b16f56b,
 .m_3840c879 {
   position: fixed;
@@ -93,11 +133,21 @@
   background-color: var(--mantine-color-body);
 }
 
+:where([data-mode='static']) .m_3b16f56b, :where([data-mode='static']) .m_3840c879 {
+    position: var(--app-shell-header-position, fixed);
+    grid-column: var(--app-shell-header-grid-column, auto);
+  }
+
 :where([data-layout='alt']) .m_3b16f56b, :where([data-layout='alt']) .m_3840c879 {
     margin-inline-start: var(--app-shell-navbar-offset, 0rem);
     margin-inline-end: var(--app-shell-aside-offset, 0rem);
   }
 
+:where([data-mode='static'][data-layout='alt']) .m_3b16f56b, :where([data-mode='static'][data-layout='alt']) .m_3840c879 {
+    margin-inline-start: 0rem;
+    margin-inline-end: 0rem;
+  }
+
 .m_3b16f56b {
   top: 0;
   height: var(--app-shell-header-height);
@@ -106,6 +156,10 @@
   z-index: var(--app-shell-header-z-index);
 }
 
+:where([data-mode='static']) .m_3b16f56b {
+    grid-row: var(--app-shell-header-grid-row, auto);
+  }
+
 .m_3b16f56b:where([data-with-border]) {
     border-bottom: 1px solid var(--app-shell-border-color);
   }
@@ -118,6 +172,12 @@
   z-index: var(--app-shell-footer-z-index);
 }
 
+:where([data-mode='static']) .m_3840c879 {
+    position: var(--app-shell-footer-position, fixed);
+    grid-column: var(--app-shell-footer-grid-column, auto);
+    grid-row: var(--app-shell-footer-grid-row, auto);
+  }
+
 .m_3840c879:where([data-with-border]) {
     border-top: 1px solid var(--app-shell-border-color);
   }

package/styles/AppShell.layer.css

@@ -7,6 +7,14 @@
     --app-shell-aside-offset: 0rem !important;
     --app-shell-footer-offset: 0rem !important;
   }
+  .m_89ab340[data-mode='static'] {
+    display: grid;
+    grid-template-columns: var(--app-shell-navbar-width, 0) 1fr var(--app-shell-aside-width, 0);
+    grid-template-rows: auto 1fr auto;
+    position: relative;
+    height: 100%;
+    overflow: auto;
+  }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);
 }
@@ -36,11 +44,21 @@
   transition-property: transform, top, height;
 }
 
+:where([data-mode='static']) .m_45252eee, :where([data-mode='static']) .m_9cdde9a {
+    position: var(--app-shell-navbar-position, fixed);
+    grid-row: var(--app-shell-navbar-grid-row, auto);
+    height: 100%;
+  }
+
 :where([data-layout='alt']) .m_45252eee, :where([data-layout='alt']) .m_9cdde9a {
     top: 0rem;
     height: 100dvh;
   }
 
+:where([data-mode='static'][data-layout='alt']) .m_45252eee, :where([data-mode='static'][data-layout='alt']) .m_9cdde9a {
+    grid-row: var(--app-shell-navbar-grid-row-alt, var(--app-shell-navbar-grid-row, auto));
+  }
+
 .m_45252eee {
   inset-inline-start: 0;
   width: var(--app-shell-navbar-width);
@@ -49,6 +67,11 @@
   z-index: var(--app-shell-navbar-z-index);
 }
 
+:where([data-mode='static']) .m_45252eee {
+    grid-column: var(--app-shell-navbar-grid-column, auto);
+    display: var(--app-shell-navbar-display, flex);
+  }
+
 :where([dir="rtl"]) .m_45252eee {
     transform: var(--app-shell-navbar-transform-rtl);
 }
@@ -64,6 +87,13 @@
   z-index: var(--app-shell-aside-z-index);
 }
 
+:where([data-mode='static']) .m_9cdde9a {
+    position: var(--app-shell-aside-position, fixed);
+    grid-column: var(--app-shell-aside-grid-column, auto);
+    grid-row: var(--app-shell-aside-grid-row, auto);
+    display: var(--app-shell-aside-display, flex);
+  }
+
 :where([dir="rtl"]) .m_9cdde9a {
     transform: var(--app-shell-aside-transform-rtl);
 }
@@ -85,6 +115,16 @@
   transition-property: padding;
 }
 
+:where([data-mode='static']) .m_8983817 {
+    padding-inline-start: var(--app-shell-padding);
+    padding-inline-end: var(--app-shell-padding);
+    padding-top: var(--app-shell-padding);
+    padding-bottom: var(--app-shell-padding);
+    min-height: auto;
+    grid-column: var(--app-shell-main-column-start, 1) / var(--app-shell-main-column-end, -1);
+    grid-row: var(--app-shell-main-grid-row, 2);
+  }
+
 .m_3b16f56b,
 .m_3840c879 {
   position: fixed;
@@ -93,11 +133,21 @@
   background-color: var(--mantine-color-body);
 }
 
+:where([data-mode='static']) .m_3b16f56b, :where([data-mode='static']) .m_3840c879 {
+    position: var(--app-shell-header-position, fixed);
+    grid-column: var(--app-shell-header-grid-column, auto);
+  }
+
 :where([data-layout='alt']) .m_3b16f56b, :where([data-layout='alt']) .m_3840c879 {
     margin-inline-start: var(--app-shell-navbar-offset, 0rem);
     margin-inline-end: var(--app-shell-aside-offset, 0rem);
   }
 
+:where([data-mode='static'][data-layout='alt']) .m_3b16f56b, :where([data-mode='static'][data-layout='alt']) .m_3840c879 {
+    margin-inline-start: 0rem;
+    margin-inline-end: 0rem;
+  }
+
 .m_3b16f56b {
   top: 0;
   height: var(--app-shell-header-height);
@@ -106,6 +156,10 @@
   z-index: var(--app-shell-header-z-index);
 }
 
+:where([data-mode='static']) .m_3b16f56b {
+    grid-row: var(--app-shell-header-grid-row, auto);
+  }
+
 .m_3b16f56b:where([data-with-border]) {
     border-bottom: 1px solid var(--app-shell-border-color);
   }
@@ -118,6 +172,12 @@
   z-index: var(--app-shell-footer-z-index);
 }
 
+:where([data-mode='static']) .m_3840c879 {
+    position: var(--app-shell-footer-position, fixed);
+    grid-column: var(--app-shell-footer-grid-column, auto);
+    grid-row: var(--app-shell-footer-grid-row, auto);
+  }
+
 .m_3840c879:where([data-with-border]) {
     border-top: 1px solid var(--app-shell-border-color);
   }