@elevasis/ui 2.24.0 → 2.25.1

package/dist/test-utils/index.js

@@ -7,7 +7,7 @@ import { ApiClientProvider } from '../chunk-T6INEVX6.js';
 import '../chunk-SGXXJE52.js';
 import '../chunk-KRWALB24.js';
 import '../chunk-DD3CCMCZ.js';
-import { ElevasisServiceProvider } from '../chunk-IRW7JMQ4.js';
+import { ElevasisServiceProvider } from '../chunk-5WWZXCS5.js';
 import { __export, __reExport } from '../chunk-I2KLQ2HA.js';
 import { MantineProvider } from '@mantine/core';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

package/dist/typeform/index.js

@@ -780,17 +780,41 @@ function TypeformPageWrapper({
 function useCardStyle() {
   const { config, styles } = useTypeformContext();
   const theme = config.theme;
-  const getCardStyle = (isSelected, isHovered) => ({
-    display: "block",
-    width: "100%",
-    padding: "var(--mantine-spacing-sm) var(--mantine-spacing-md)",
-    borderRadius: "var(--mantine-radius-md)",
-    border: isSelected ? "var(--active-border)" : "1px solid var(--color-border)",
-    transition: "background-color 200ms ease, border-color 200ms ease",
-    ...styles?.card,
-    // Selection styling - must come after styles?.card to take precedence
-    backgroundColor: isSelected ? "var(--active-background)" : isHovered ? "var(--color-surface)" : "transparent"
-  });
+  const getCardStyle = (isSelected, isHovered) => {
+    const base = {
+      display: "block",
+      width: "100%",
+      padding: "var(--mantine-spacing-sm) var(--mantine-spacing-md)",
+      borderRadius: "var(--mantine-radius-md)",
+      border: "1px solid var(--color-border)",
+      backgroundColor: "transparent",
+      ...styles?.card,
+      // Force-disable any preset transition (instant state changes)
+      transition: "none"
+    };
+    const fallbackSelected = {
+      border: "var(--active-border)",
+      backgroundColor: "var(--active-background)"
+    };
+    const fallbackHovered = {
+      backgroundColor: "var(--color-surface)"
+    };
+    if (isSelected) {
+      return {
+        ...base,
+        ...fallbackSelected,
+        ...styles?.cardSelected
+      };
+    }
+    if (isHovered) {
+      return {
+        ...base,
+        ...fallbackHovered,
+        ...styles?.cardHovered
+      };
+    }
+    return base;
+  };
   const getKeyStyle = (isSelected, isHovered) => ({
     minWidth: 24,
     height: 24,
@@ -799,10 +823,12 @@ function useCardStyle() {
     justifyContent: "center",
     fontSize: "var(--mantine-font-size-xs)",
     backgroundColor: isSelected || isHovered ? "var(--color-primary)" : "var(--mantine-color-dark-5)",
+    color: isSelected || isHovered ? "#ffffff" : void 0,
     border: "none",
-    transition: "background-color 200ms ease",
     flexShrink: 0,
-    ...styles?.cardKey
+    ...styles?.cardKey,
+    transition: "none",
+    ...isSelected || isHovered ? { backgroundColor: "var(--color-primary)", color: "#ffffff" } : null
   });
   return { getCardStyle, getKeyStyle, theme, styles };
 }
@@ -1643,6 +1669,10 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [handleKeyDown]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    window.scrollTo({ top: 0, left: 0, behavior: "auto" });
+  }, [currentPageIndex]);
   if (isComplete) {
     return /* @__PURE__ */ jsx(Box, { className, style: styles?.container, children: /* @__PURE__ */ jsx(
       Center,
@@ -1809,17 +1839,16 @@ var brochureStyles = {
     boxShadow: "0 8px 32px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03)",
     transition: "all 300ms cubic-bezier(0.4, 0, 0.2, 1)"
   },
-  // Selected card - blue glow effect
+  // Selected card - solid blue fill, no glow
   cardSelected: {
-    backgroundColor: "rgba(0, 153, 255, 0.08)",
-    border: "1px solid rgba(0, 153, 255, 0.3)",
-    boxShadow: "0 8px 32px rgba(0, 0, 0, 0.3), 0 0 60px -15px rgba(0, 153, 255, 0.25), inset 0 1px 0 rgba(0, 153, 255, 0.1)"
+    backgroundColor: "rgba(0, 153, 255, 0.32)",
+    border: "1px solid rgba(0, 153, 255, 0.85)",
+    boxShadow: "none"
   },
-  // Hovered card - subtle lift
+  // Hovered card - instant subtle highlight (no transform/lift)
   cardHovered: {
     backgroundColor: "rgba(24, 24, 27, 0.6)",
-    border: "1px solid rgba(255, 255, 255, 0.12)",
-    transform: "translateY(-2px)"
+    border: "1px solid rgba(255, 255, 255, 0.12)"
   },
   // Card label text - more readable
   cardLabel: {