@mantine/core 9.6.3 → 9.7.0

package/styles/Toolbar.css

@@ -0,0 +1,220 @@
+.m_a2d26014 {
+  --toolbar-toggle-size-xs: 22px;
+  --toolbar-toggle-size-sm: 26px;
+  --toolbar-toggle-size-md: 30px;
+  --toolbar-toggle-size-lg: 36px;
+  --toolbar-toggle-size-xl: 42px;
+
+  --toolbar-padding-xs: 4px;
+  --toolbar-padding-sm: 5px;
+  --toolbar-padding-md: 6px;
+  --toolbar-padding-lg: 8px;
+  --toolbar-padding-xl: 12px;
+
+  --toolbar-gap-xs: calc(var(--mantine-spacing-xs) / 2);
+  --toolbar-gap-sm: var(--mantine-spacing-xs);
+  --toolbar-gap-md: var(--mantine-spacing-sm);
+  --toolbar-gap-lg: var(--mantine-spacing-sm);
+  --toolbar-gap-xl: var(--mantine-spacing-md);
+
+  --toolbar-toggle-size: var(--toolbar-toggle-size-md);
+  --toolbar-padding: var(--toolbar-padding-md);
+  --toolbar-gap: var(--toolbar-gap-md);
+  --_tr: var(--toolbar-radius, var(--mantine-radius-default));
+  --toolbar-toggle-radius: max(calc(var(--_tr) - var(--toolbar-padding)), min(var(--_tr), 2px));
+
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--toolbar-gap);
+  background-color: var(--mantine-color-body);
+  border-radius: var(--toolbar-radius, var(--mantine-radius-default));
+  padding: var(--toolbar-padding);
+}
+
+  .m_a2d26014:where([data-with-border]) {
+    border: 1px solid;
+  }
+
+  :where([data-mantine-color-scheme='light']) .m_a2d26014:where([data-with-border]) {
+      border-color: var(--mantine-color-gray-4);
+}
+
+  :where([data-mantine-color-scheme='dark']) .m_a2d26014:where([data-with-border]) {
+      border-color: var(--mantine-color-dark-4);
+}
+
+  .m_a2d26014:where([data-orientation='vertical']) {
+    flex-direction: column;
+    align-items: stretch;
+    width: fit-content;
+  }
+
+.m_b6dffd8d {
+  display: flex;
+  background-color: var(--mantine-color-body);
+}
+
+.m_b6dffd8d :where([data-toolbar-toggle]):focus-visible {
+      position: relative;
+      z-index: 1;
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):first-child {
+      border-end-end-radius: 0;
+      border-start-end-radius: 0;
+      border-inline-end-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):last-child {
+      border-end-start-radius: 0;
+      border-start-start-radius: 0;
+      border-inline-start-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):not(:first-child):not(:last-child) {
+      border-radius: 0;
+      border-inline-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d:where([data-orientation='vertical']) {
+    flex-direction: column;
+  }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):first-child {
+        border-end-start-radius: 0;
+        border-end-end-radius: 0;
+        border-start-end-radius: var(--toolbar-toggle-radius);
+        border-inline-end-width: 1px;
+        border-bottom-width: calc(1px / 2);
+      }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):last-child {
+        border-start-start-radius: 0;
+        border-start-end-radius: 0;
+        border-end-start-radius: var(--toolbar-toggle-radius);
+        border-inline-start-width: 1px;
+        border-top-width: calc(1px / 2);
+      }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):not(:first-child):not(:last-child) {
+        border-radius: 0;
+        border-inline-width: 1px;
+        border-bottom-width: calc(1px / 2);
+        border-top-width: calc(1px / 2);
+      }
+
+.m_3b209606 {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: var(--toolbar-toggle-radius);
+  cursor: pointer;
+  appearance: none;
+  text-decoration: none;
+  line-height: 1;
+  user-select: none;
+  font-size: var(--mantine-font-size-xs);
+  width: var(--toolbar-toggle-size);
+  min-width: var(--toolbar-toggle-size);
+  height: var(--toolbar-toggle-size);
+  padding: calc(var(--toolbar-toggle-size) / 5);
+  border: 1px solid;
+  font-weight: var(--mantine-font-weight-medium);
+}
+
+.m_3b209606:where([data-auto-width]) {
+    width: auto;
+    padding: 0 calc(var(--toolbar-toggle-size) / 4);
+  }
+
+:where([data-mantine-color-scheme='light']) .m_3b209606 {
+    background-color: var(--mantine-color-white);
+    border-color: var(--mantine-color-gray-4);
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_3b209606 {
+    background-color: var(--mantine-color-dark-6);
+    border-color: var(--mantine-color-dark-4);
+    color: var(--mantine-color-dark-1);
+}
+
+@media (hover: hover) {
+      :where([data-mantine-color-scheme='light']) .m_3b209606:hover:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-gray-0);
+  }
+
+      :where([data-mantine-color-scheme='dark']) .m_3b209606:hover:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-dark-5);
+  }
+}
+
+@media (hover: none) {
+      :where([data-mantine-color-scheme='light']) .m_3b209606:active:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-gray-0);
+  }
+
+      :where([data-mantine-color-scheme='dark']) .m_3b209606:active:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-dark-5);
+  }
+}
+
+.m_3b209606:where([data-active]) {
+    background-color: var(--toolbar-toggle-active-bg, var(--mantine-primary-color-light));
+    color: var(--toolbar-toggle-active-color, var(--mantine-primary-color-light-color));
+    border-color: transparent;
+  }
+
+@media (hover: hover) {
+      .m_3b209606:where([data-active]):hover:where(:not([data-disabled])) {
+        background-color: var(
+          --toolbar-toggle-active-hover,
+          var(--mantine-primary-color-light-hover)
+        );
+      }
+}
+
+@media (hover: none) {
+      .m_3b209606:where([data-active]):active:where(:not([data-disabled])) {
+        background-color: var(
+          --toolbar-toggle-active-hover,
+          var(--mantine-primary-color-light-hover)
+        );
+      }
+}
+
+.m_3b209606:where([data-disabled]) {
+    cursor: not-allowed;
+    color: var(--mantine-color-disabled-color);
+    background-color: var(--mantine-color-disabled);
+    border-color: transparent;
+  }
+
+:where([data-mantine-color-scheme='light']) .m_3b209606:where([data-disabled][data-active]) {
+      background-color: var(--mantine-color-gray-4);
+      color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_3b209606:where([data-disabled][data-active]) {
+      background-color: var(--mantine-color-dark-4);
+      color: var(--mantine-color-dark-2);
+}
+
+:where([data-mantine-color-scheme='light']) .m_d1258ea7 {
+    background-color: var(--mantine-color-gray-4);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_d1258ea7 {
+    background-color: var(--mantine-color-dark-4);
+}
+
+.m_d1258ea7:where([data-orientation='horizontal']) {
+    width: 1px;
+    align-self: stretch;
+  }
+
+.m_d1258ea7:where([data-orientation='vertical']) {
+    height: 1px;
+    align-self: stretch;
+  }

package/styles/Toolbar.layer.css

@@ -0,0 +1,221 @@
+@layer mantine {.m_a2d26014 {
+  --toolbar-toggle-size-xs: 22px;
+  --toolbar-toggle-size-sm: 26px;
+  --toolbar-toggle-size-md: 30px;
+  --toolbar-toggle-size-lg: 36px;
+  --toolbar-toggle-size-xl: 42px;
+
+  --toolbar-padding-xs: 4px;
+  --toolbar-padding-sm: 5px;
+  --toolbar-padding-md: 6px;
+  --toolbar-padding-lg: 8px;
+  --toolbar-padding-xl: 12px;
+
+  --toolbar-gap-xs: calc(var(--mantine-spacing-xs) / 2);
+  --toolbar-gap-sm: var(--mantine-spacing-xs);
+  --toolbar-gap-md: var(--mantine-spacing-sm);
+  --toolbar-gap-lg: var(--mantine-spacing-sm);
+  --toolbar-gap-xl: var(--mantine-spacing-md);
+
+  --toolbar-toggle-size: var(--toolbar-toggle-size-md);
+  --toolbar-padding: var(--toolbar-padding-md);
+  --toolbar-gap: var(--toolbar-gap-md);
+  --_tr: var(--toolbar-radius, var(--mantine-radius-default));
+  --toolbar-toggle-radius: max(calc(var(--_tr) - var(--toolbar-padding)), min(var(--_tr), 2px));
+
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--toolbar-gap);
+  background-color: var(--mantine-color-body);
+  border-radius: var(--toolbar-radius, var(--mantine-radius-default));
+  padding: var(--toolbar-padding);
+}
+
+  .m_a2d26014:where([data-with-border]) {
+    border: 1px solid;
+  }
+
+  :where([data-mantine-color-scheme='light']) .m_a2d26014:where([data-with-border]) {
+      border-color: var(--mantine-color-gray-4);
+}
+
+  :where([data-mantine-color-scheme='dark']) .m_a2d26014:where([data-with-border]) {
+      border-color: var(--mantine-color-dark-4);
+}
+
+  .m_a2d26014:where([data-orientation='vertical']) {
+    flex-direction: column;
+    align-items: stretch;
+    width: fit-content;
+  }
+
+.m_b6dffd8d {
+  display: flex;
+  background-color: var(--mantine-color-body);
+}
+
+.m_b6dffd8d :where([data-toolbar-toggle]):focus-visible {
+      position: relative;
+      z-index: 1;
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):first-child {
+      border-end-end-radius: 0;
+      border-start-end-radius: 0;
+      border-inline-end-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):last-child {
+      border-end-start-radius: 0;
+      border-start-start-radius: 0;
+      border-inline-start-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d :where([data-toolbar-toggle]):not(:only-child):not(:first-child):not(:last-child) {
+      border-radius: 0;
+      border-inline-width: calc(1px / 2);
+    }
+
+.m_b6dffd8d:where([data-orientation='vertical']) {
+    flex-direction: column;
+  }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):first-child {
+        border-end-start-radius: 0;
+        border-end-end-radius: 0;
+        border-start-end-radius: var(--toolbar-toggle-radius);
+        border-inline-end-width: 1px;
+        border-bottom-width: calc(1px / 2);
+      }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):last-child {
+        border-start-start-radius: 0;
+        border-start-end-radius: 0;
+        border-end-start-radius: var(--toolbar-toggle-radius);
+        border-inline-start-width: 1px;
+        border-top-width: calc(1px / 2);
+      }
+
+.m_b6dffd8d:where([data-orientation='vertical']) :where([data-toolbar-toggle]):not(:only-child):not(:first-child):not(:last-child) {
+        border-radius: 0;
+        border-inline-width: 1px;
+        border-bottom-width: calc(1px / 2);
+        border-top-width: calc(1px / 2);
+      }
+
+.m_3b209606 {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: var(--toolbar-toggle-radius);
+  cursor: pointer;
+  appearance: none;
+  text-decoration: none;
+  line-height: 1;
+  user-select: none;
+  font-size: var(--mantine-font-size-xs);
+  width: var(--toolbar-toggle-size);
+  min-width: var(--toolbar-toggle-size);
+  height: var(--toolbar-toggle-size);
+  padding: calc(var(--toolbar-toggle-size) / 5);
+  border: 1px solid;
+  font-weight: var(--mantine-font-weight-medium);
+}
+
+.m_3b209606:where([data-auto-width]) {
+    width: auto;
+    padding: 0 calc(var(--toolbar-toggle-size) / 4);
+  }
+
+:where([data-mantine-color-scheme='light']) .m_3b209606 {
+    background-color: var(--mantine-color-white);
+    border-color: var(--mantine-color-gray-4);
+    color: var(--mantine-color-gray-7);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_3b209606 {
+    background-color: var(--mantine-color-dark-6);
+    border-color: var(--mantine-color-dark-4);
+    color: var(--mantine-color-dark-1);
+}
+
+@media (hover: hover) {
+      :where([data-mantine-color-scheme='light']) .m_3b209606:hover:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-gray-0);
+  }
+
+      :where([data-mantine-color-scheme='dark']) .m_3b209606:hover:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-dark-5);
+  }
+}
+
+@media (hover: none) {
+      :where([data-mantine-color-scheme='light']) .m_3b209606:active:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-gray-0);
+  }
+
+      :where([data-mantine-color-scheme='dark']) .m_3b209606:active:where(:not([data-disabled], [data-active])) {
+        background-color: var(--mantine-color-dark-5);
+  }
+}
+
+.m_3b209606:where([data-active]) {
+    background-color: var(--toolbar-toggle-active-bg, var(--mantine-primary-color-light));
+    color: var(--toolbar-toggle-active-color, var(--mantine-primary-color-light-color));
+    border-color: transparent;
+  }
+
+@media (hover: hover) {
+      .m_3b209606:where([data-active]):hover:where(:not([data-disabled])) {
+        background-color: var(
+          --toolbar-toggle-active-hover,
+          var(--mantine-primary-color-light-hover)
+        );
+      }
+}
+
+@media (hover: none) {
+      .m_3b209606:where([data-active]):active:where(:not([data-disabled])) {
+        background-color: var(
+          --toolbar-toggle-active-hover,
+          var(--mantine-primary-color-light-hover)
+        );
+      }
+}
+
+.m_3b209606:where([data-disabled]) {
+    cursor: not-allowed;
+    color: var(--mantine-color-disabled-color);
+    background-color: var(--mantine-color-disabled);
+    border-color: transparent;
+  }
+
+:where([data-mantine-color-scheme='light']) .m_3b209606:where([data-disabled][data-active]) {
+      background-color: var(--mantine-color-gray-4);
+      color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_3b209606:where([data-disabled][data-active]) {
+      background-color: var(--mantine-color-dark-4);
+      color: var(--mantine-color-dark-2);
+}
+
+:where([data-mantine-color-scheme='light']) .m_d1258ea7 {
+    background-color: var(--mantine-color-gray-4);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_d1258ea7 {
+    background-color: var(--mantine-color-dark-4);
+}
+
+.m_d1258ea7:where([data-orientation='horizontal']) {
+    width: 1px;
+    align-self: stretch;
+  }
+
+.m_d1258ea7:where([data-orientation='vertical']) {
+    height: 1px;
+    align-self: stretch;
+  }
+}

package/styles/Tour.css

@@ -0,0 +1,127 @@
+.m_23880f17 {
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+  z-index: var(--tour-z-index);
+}
+
+.m_43070dfb {
+  position: fixed;
+  inset: 0;
+  pointer-events: auto;
+}
+
+.m_43070dfb:where([data-with-overlay-interaction]) {
+    pointer-events: none;
+  }
+
+.m_401e99ae {
+  position: absolute;
+  pointer-events: auto;
+  padding: var(--mantine-spacing-md);
+  border-radius: var(--tour-tooltip-radius, var(--mantine-radius-default));
+  box-shadow: var(--tour-tooltip-shadow, var(--mantine-shadow-md));
+  z-index: 1;
+  box-sizing: border-box;
+}
+
+:where([data-mantine-color-scheme='light']) .m_401e99ae {
+    background-color: var(--mantine-color-white);
+    border: 1px solid var(--mantine-color-gray-3);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_401e99ae {
+    background-color: var(--mantine-color-dark-7);
+    border: 1px solid var(--mantine-color-dark-4);
+}
+
+.m_401e99ae:where([data-centered]) {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    translate: -50% -50%;
+    max-width: calc(100% - 16px);
+  }
+
+.m_4d935ac3 {
+  margin: 0;
+  font-weight: 600;
+  font-size: var(--mantine-font-size-md);
+  line-height: 1.4;
+  margin-bottom: var(--mantine-spacing-xs);
+}
+
+.m_2380c7d7 {
+  font-size: var(--mantine-font-size-sm);
+  line-height: 1.55;
+}
+
+.m_f5605c89 {
+  margin-top: var(--mantine-spacing-md);
+}
+
+.m_324c9375 {
+  position: absolute;
+  top: var(--mantine-spacing-xs);
+  right: var(--mantine-spacing-xs);
+}
+
+/* stylelint-disable-next-line selector-type-no-unknown */
+
+:where([dir='rtl']) .m_324c9375 {
+    right: auto;
+    left: var(--mantine-spacing-xs);
+  }
+
+.m_66c6e5bb {
+  font-size: var(--mantine-font-size-sm);
+}
+
+:where([data-mantine-color-scheme='light']) .m_66c6e5bb {
+    color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_66c6e5bb {
+    color: var(--mantine-color-dark-2);
+}
+
+.m_45dfa139 {
+  position: absolute;
+  pointer-events: auto;
+  width: var(--tour-beacon-size, 12px);
+  height: var(--tour-beacon-size, 12px);
+  border-radius: 50%;
+  background-color: var(
+    --tour-beacon-color,
+    var(--tour-color, var(--mantine-primary-color-filled))
+  );
+  border: 0;
+  padding: 0;
+  cursor: pointer;
+  z-index: 1;
+}
+
+.m_af9f65e0 {
+  position: absolute;
+  inset: calc(var(--tour-beacon-size, 12px) * -0.35);
+  border-radius: 50%;
+  background-color: var(
+    --tour-beacon-color,
+    var(--tour-color, var(--mantine-primary-color-filled))
+  );
+  opacity: 0.3;
+  animation: m_b83bf210 1.5s ease-in-out infinite;
+}
+
+@keyframes m_b83bf210 {
+  0%,
+  100% {
+    transform: scale(0.8);
+    opacity: 0.3;
+  }
+
+  50% {
+    transform: scale(1);
+    opacity: 0;
+  }
+}

package/styles/Tour.layer.css

@@ -0,0 +1,128 @@
+@layer mantine {.m_23880f17 {
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+  z-index: var(--tour-z-index);
+}
+
+.m_43070dfb {
+  position: fixed;
+  inset: 0;
+  pointer-events: auto;
+}
+
+.m_43070dfb:where([data-with-overlay-interaction]) {
+    pointer-events: none;
+  }
+
+.m_401e99ae {
+  position: absolute;
+  pointer-events: auto;
+  padding: var(--mantine-spacing-md);
+  border-radius: var(--tour-tooltip-radius, var(--mantine-radius-default));
+  box-shadow: var(--tour-tooltip-shadow, var(--mantine-shadow-md));
+  z-index: 1;
+  box-sizing: border-box;
+}
+
+:where([data-mantine-color-scheme='light']) .m_401e99ae {
+    background-color: var(--mantine-color-white);
+    border: 1px solid var(--mantine-color-gray-3);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_401e99ae {
+    background-color: var(--mantine-color-dark-7);
+    border: 1px solid var(--mantine-color-dark-4);
+}
+
+.m_401e99ae:where([data-centered]) {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    translate: -50% -50%;
+    max-width: calc(100% - 16px);
+  }
+
+.m_4d935ac3 {
+  margin: 0;
+  font-weight: 600;
+  font-size: var(--mantine-font-size-md);
+  line-height: 1.4;
+  margin-bottom: var(--mantine-spacing-xs);
+}
+
+.m_2380c7d7 {
+  font-size: var(--mantine-font-size-sm);
+  line-height: 1.55;
+}
+
+.m_f5605c89 {
+  margin-top: var(--mantine-spacing-md);
+}
+
+.m_324c9375 {
+  position: absolute;
+  top: var(--mantine-spacing-xs);
+  right: var(--mantine-spacing-xs);
+}
+
+/* stylelint-disable-next-line selector-type-no-unknown */
+
+:where([dir='rtl']) .m_324c9375 {
+    right: auto;
+    left: var(--mantine-spacing-xs);
+  }
+
+.m_66c6e5bb {
+  font-size: var(--mantine-font-size-sm);
+}
+
+:where([data-mantine-color-scheme='light']) .m_66c6e5bb {
+    color: var(--mantine-color-gray-6);
+}
+
+:where([data-mantine-color-scheme='dark']) .m_66c6e5bb {
+    color: var(--mantine-color-dark-2);
+}
+
+.m_45dfa139 {
+  position: absolute;
+  pointer-events: auto;
+  width: var(--tour-beacon-size, 12px);
+  height: var(--tour-beacon-size, 12px);
+  border-radius: 50%;
+  background-color: var(
+    --tour-beacon-color,
+    var(--tour-color, var(--mantine-primary-color-filled))
+  );
+  border: 0;
+  padding: 0;
+  cursor: pointer;
+  z-index: 1;
+}
+
+.m_af9f65e0 {
+  position: absolute;
+  inset: calc(var(--tour-beacon-size, 12px) * -0.35);
+  border-radius: 50%;
+  background-color: var(
+    --tour-beacon-color,
+    var(--tour-color, var(--mantine-primary-color-filled))
+  );
+  opacity: 0.3;
+  animation: m_b83bf210 1.5s ease-in-out infinite;
+}
+
+@keyframes m_b83bf210 {
+  0%,
+  100% {
+    transform: scale(0.8);
+    opacity: 0.3;
+  }
+
+  50% {
+    transform: scale(1);
+    opacity: 0;
+  }
+}
+}