@boostdev/design-system-react-native 0.3.0 → 0.5.0

package/dist/index.cjs

@@ -64,6 +64,8 @@ __export(index_exports, {
   Radio: () => Radio,
   RadioGroup: () => RadioGroup,
   Rating: () => Rating,
+  ScaledText: () => ScaledText,
+  ScaledTextInput: () => ScaledTextInput,
   SectionHeader: () => SectionHeader,
   SegmentedControl: () => SegmentedControl,
   Select: () => Select,
@@ -85,6 +87,8 @@ __export(index_exports, {
   createReactNavigationTheme: () => createReactNavigationTheme,
   font: () => import_native.font,
   lineHeight: () => lineHeight,
+  maxFontScaleFor: () => maxFontScaleFor,
+  maxFontScaleForStyle: () => maxFontScaleForStyle,
   spacing: () => import_native.spacing,
   useReactNavigationTheme: () => useReactNavigationTheme,
   useTheme: () => useTheme,
@@ -167,10 +171,37 @@ function useReactNavigationTheme(overrides = {}) {
   });
 }
 
-// src/components/ui/Typography/Typography.tsx
+// src/native/ScaledText.tsx
+var import_react2 = require("react");
 var import_react_native2 = require("react-native");
+
+// src/native/fontScale.ts
+function maxFontScaleFor(fontSize) {
+  if (fontSize >= 60) return 1;
+  if (fontSize >= 26) return 1.3;
+  if (fontSize >= 20) return 1.5;
+  return 2;
+}
+var DEFAULT_FONT_SIZE = 14;
+
+// src/native/ScaledText.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
-var styles = import_react_native2.StyleSheet.create({
+function maxFontScaleForStyle(style, override) {
+  if (override !== void 0 && override !== null) return override;
+  const fontSize = import_react_native2.StyleSheet.flatten(style)?.fontSize;
+  return maxFontScaleFor(typeof fontSize === "number" ? fontSize : DEFAULT_FONT_SIZE);
+}
+var ScaledText = (0, import_react2.forwardRef)(function ScaledText2({ maxFontSizeMultiplier, style, ...rest }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native2.Text, { ref, style, maxFontSizeMultiplier: maxFontScaleForStyle(style, maxFontSizeMultiplier), ...rest });
+});
+var ScaledTextInput = (0, import_react2.forwardRef)(function ScaledTextInput2({ maxFontSizeMultiplier, style, ...rest }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native2.TextInput, { ref, style, maxFontSizeMultiplier: maxFontScaleForStyle(style, maxFontSizeMultiplier), ...rest });
+});
+
+// src/components/ui/Typography/Typography.tsx
+var import_react_native3 = require("react-native");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var styles = import_react_native3.StyleSheet.create({
   base: {
     fontFamily: import_native.font.family.body,
     fontWeight: import_native.font.weight.body
@@ -209,22 +240,30 @@ var accessibilityRoles = {
   body: "text",
   body_s: "text"
 };
-function Typography({ variant = "body", children, style }) {
+function Typography({
+  variant = "body",
+  children,
+  style,
+  maxFontSizeMultiplier,
+  numberOfLines
+}) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_react_native2.Text,
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    ScaledText,
     {
       accessibilityRole: accessibilityRoles[variant],
       style: [styles.base, styles[variant], { color: colors2.colorOnBg }, style],
+      maxFontSizeMultiplier,
+      numberOfLines,
       children
     }
   );
 }
 
 // src/components/ui/Badge/Badge.tsx
-var import_react_native3 = require("react-native");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var styles2 = import_react_native3.StyleSheet.create({
+var import_react_native4 = require("react-native");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var styles2 = import_react_native4.StyleSheet.create({
   badge: {
     alignSelf: "flex-start",
     flexDirection: "row",
@@ -241,7 +280,7 @@ var styles2 = import_react_native3.StyleSheet.create({
     lineHeight: import_native.font.size.bodyS
   }
 });
-function Badge({ children, variant = "primary", style }) {
+function Badge({ children, variant = "primary", style, maxFontSizeMultiplier }) {
   const { colors: colors2 } = useTheme();
   const variantColors = {
     primary: { bg: colors2.colorInteractive, text: colors2.colorOnInteractive },
@@ -251,12 +290,12 @@ function Badge({ children, variant = "primary", style }) {
     warning: { bg: colors2.colorWarning, text: colors2.colorOnWarning }
   };
   const { bg, text } = variantColors[variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native3.View, { style: [styles2.badge, { backgroundColor: bg }, style], children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native3.Text, { style: [styles2.text, { color: text }], children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native4.View, { style: [styles2.badge, { backgroundColor: bg }, style], children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ScaledText, { style: [styles2.text, { color: text }], maxFontSizeMultiplier, children }) });
 }
 
 // src/components/ui/Avatar/Avatar.tsx
-var import_react_native4 = require("react-native");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_react_native5 = require("react-native");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var sizeMap = {
   small: { container: 32, fontSize: import_native.font.size.bodyS },
   medium: { container: 48, fontSize: import_native.font.size.body },
@@ -265,7 +304,7 @@ var sizeMap = {
 function getInitials(name) {
   return name.split(" ").filter(Boolean).slice(0, 2).map((word) => word[0].toUpperCase()).join("");
 }
-var styles3 = import_react_native4.StyleSheet.create({
+var styles3 = import_react_native5.StyleSheet.create({
   container: {
     borderRadius: import_native.border.radius.full,
     overflow: "hidden",
@@ -286,19 +325,19 @@ function Avatar({ src, alt, name, size = "medium", style }) {
   const { container, fontSize } = sizeMap[size];
   const label = alt ?? name ?? "User avatar";
   if (src) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      import_react_native4.View,
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      import_react_native5.View,
       {
         style: [styles3.container, { width: container, height: container }, style],
         accessibilityLabel: label,
         accessibilityRole: "image",
-        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native4.Image, { source: { uri: src }, style: styles3.image })
+        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_native5.Image, { source: { uri: src }, style: styles3.image })
       }
     );
   }
   const initials = name ? getInitials(name) : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    import_react_native4.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_react_native5.View,
     {
       style: [
         styles3.container,
@@ -307,8 +346,8 @@ function Avatar({ src, alt, name, size = "medium", style }) {
       ],
       accessibilityLabel: label,
       accessibilityRole: "image",
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        import_react_native4.Text,
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        ScaledText,
         {
           style: [styles3.initials, { fontSize, color: colors2.colorOnBlue }],
           importantForAccessibility: "no",
@@ -321,22 +360,22 @@ function Avatar({ src, alt, name, size = "medium", style }) {
 }
 
 // src/components/ui/Separator/Separator.tsx
-var import_react_native5 = require("react-native");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var styles4 = import_react_native5.StyleSheet.create({
+var import_react_native6 = require("react-native");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var styles4 = import_react_native6.StyleSheet.create({
   horizontal: {
-    height: import_react_native5.StyleSheet.hairlineWidth,
+    height: import_react_native6.StyleSheet.hairlineWidth,
     width: "100%"
   },
   vertical: {
-    width: import_react_native5.StyleSheet.hairlineWidth,
+    width: import_react_native6.StyleSheet.hairlineWidth,
     alignSelf: "stretch"
   }
 });
 function Separator({ orientation = "horizontal", style }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    import_react_native5.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_react_native6.View,
     {
       accessibilityRole: "none",
       style: [
@@ -349,8 +388,8 @@ function Separator({ orientation = "horizontal", style }) {
 }
 
 // src/components/ui/Loading/Loading.tsx
-var import_react_native6 = require("react-native");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_react_native7 = require("react-native");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var rnSize = {
   small: "small",
   medium: "large",
@@ -358,8 +397,8 @@ var rnSize = {
 };
 function Loading({ size = "medium", accessibilityLabel = "Loading", style }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react_native6.ActivityIndicator,
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    import_react_native7.ActivityIndicator,
     {
       size: rnSize[size],
       color: colors2.colorInteractive,
@@ -371,14 +410,14 @@ function Loading({ size = "medium", accessibilityLabel = "Loading", style }) {
 }
 
 // src/components/ui/Progress/Progress.tsx
-var import_react_native7 = require("react-native");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_react_native8 = require("react-native");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var trackHeight = {
   small: 4,
   medium: 8,
   large: 12
 };
-var styles5 = import_react_native7.StyleSheet.create({
+var styles5 = import_react_native8.StyleSheet.create({
   container: {
     width: "100%"
   },
@@ -413,23 +452,23 @@ function Progress({
   const { colors: colors2 } = useTheme();
   const percentage = Math.min(100, Math.max(0, value / max * 100));
   const height = trackHeight[size];
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react_native7.View, { style: [styles5.container, style], children: [
-    showLabel && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react_native7.View, { style: styles5.labelRow, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_native7.Text, { style: [styles5.labelText, { color: colors2.colorOnBg }], children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react_native7.Text, { style: [styles5.labelText, { color: colors2.colorOnBgSubtle }], children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_native8.View, { style: [styles5.container, style], children: [
+    showLabel && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_native8.View, { style: styles5.labelRow, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ScaledText, { style: [styles5.labelText, { color: colors2.colorOnBg }], children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(ScaledText, { style: [styles5.labelText, { color: colors2.colorOnBgSubtle }], children: [
         Math.round(percentage),
         "%"
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-      import_react_native7.View,
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      import_react_native8.View,
       {
         style: [styles5.track, { height, backgroundColor: colors2.colorBgSubtle }],
         accessibilityRole: "progressbar",
         accessibilityLabel: label,
         accessibilityValue: { min: 0, max, now: value },
-        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-          import_react_native7.View,
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          import_react_native8.View,
           {
             style: [
               styles5.fill,
@@ -443,10 +482,10 @@ function Progress({
 }
 
 // src/components/ui/Skeleton/Skeleton.tsx
-var import_react2 = require("react");
-var import_react_native8 = require("react-native");
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var styles6 = import_react_native8.StyleSheet.create({
+var import_react3 = require("react");
+var import_react_native9 = require("react-native");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var styles6 = import_react_native9.StyleSheet.create({
   skeleton: {
     borderRadius: import_native.border.radius.xs,
     overflow: "hidden"
@@ -454,19 +493,19 @@ var styles6 = import_react_native8.StyleSheet.create({
 });
 function Skeleton({ style }) {
   const { colors: colors2 } = useTheme();
-  const opacity = (0, import_react2.useRef)(new import_react_native8.Animated.Value(1)).current;
-  (0, import_react2.useEffect)(() => {
-    const anim = import_react_native8.Animated.loop(
-      import_react_native8.Animated.sequence([
-        import_react_native8.Animated.timing(opacity, { toValue: 0.4, duration: 700, useNativeDriver: true }),
-        import_react_native8.Animated.timing(opacity, { toValue: 1, duration: 700, useNativeDriver: true })
+  const opacity = (0, import_react3.useRef)(new import_react_native9.Animated.Value(1)).current;
+  (0, import_react3.useEffect)(() => {
+    const anim = import_react_native9.Animated.loop(
+      import_react_native9.Animated.sequence([
+        import_react_native9.Animated.timing(opacity, { toValue: 0.4, duration: 700, useNativeDriver: true }),
+        import_react_native9.Animated.timing(opacity, { toValue: 1, duration: 700, useNativeDriver: true })
       ])
     );
     anim.start();
     return () => anim.stop();
   }, [opacity]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    import_react_native8.Animated.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    import_react_native9.Animated.View,
     {
       importantForAccessibility: "no-hide-descendants",
       style: [
@@ -479,9 +518,9 @@ function Skeleton({ style }) {
 }
 
 // src/components/ui/Alert/Alert.tsx
-var import_react_native9 = require("react-native");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var styles7 = import_react_native9.StyleSheet.create({
+var import_react_native10 = require("react-native");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var styles7 = import_react_native10.StyleSheet.create({
   alert: {
     flexDirection: "row",
     alignItems: "flex-start",
@@ -531,27 +570,27 @@ function Alert({
   };
   const { bg, text, border: borderColor } = variantColors[variant];
   const resolvedChildren = typeof children === "function" ? children({ color: text }) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-    import_react_native9.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    import_react_native10.View,
     {
       accessibilityRole: isUrgent ? "alert" : "none",
       accessibilityLiveRegion: isUrgent ? "assertive" : "polite",
       style: [styles7.alert, { backgroundColor: bg, borderStartWidth: import_native.spacing.s, borderStartColor: borderColor }, style],
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native9.View, { style: styles7.icon, children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native9.View, { style: styles7.content, children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native9.Text, { style: [styles7.title, { color: text }], children: title }),
-          typeof resolvedChildren === "string" || typeof resolvedChildren === "number" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native9.Text, { style: [styles7.body, { color: text }], children: resolvedChildren }) : resolvedChildren
+        icon && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native10.View, { style: styles7.icon, children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react_native10.View, { style: styles7.content, children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ScaledText, { style: [styles7.title, { color: text }], children: title }),
+          typeof resolvedChildren === "string" || typeof resolvedChildren === "number" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ScaledText, { style: [styles7.body, { color: text }], children: resolvedChildren }) : resolvedChildren
         ] }),
-        onDismiss && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          import_react_native9.Pressable,
+        onDismiss && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          import_react_native10.Pressable,
           {
             onPress: onDismiss,
             style: styles7.dismiss,
             accessibilityLabel: "Dismiss alert",
             accessibilityRole: "button",
             hitSlop: 8,
-            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native9.Text, { style: { color: text, fontSize: 16 }, children: "\u2715" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ScaledText, { style: { color: text, fontSize: 16 }, children: "\u2715" })
           }
         )
       ]
@@ -560,9 +599,9 @@ function Alert({
 }
 
 // src/components/ui/NotificationBanner/NotificationBanner.tsx
-var import_react_native10 = require("react-native");
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var styles8 = import_react_native10.StyleSheet.create({
+var import_react_native11 = require("react-native");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var styles8 = import_react_native11.StyleSheet.create({
   banner: {
     flexDirection: "row",
     alignItems: "center",
@@ -600,24 +639,24 @@ function NotificationBanner({
   };
   const { bg, text, border: borderColor } = variantColors[variant];
   const resolvedChildren = typeof children === "function" ? children({ color: text }) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-    import_react_native10.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    import_react_native11.View,
     {
       accessibilityRole: isUrgent ? "alert" : "none",
       accessibilityLiveRegion: isUrgent ? "assertive" : "polite",
       style: [styles8.banner, { backgroundColor: bg, borderBottomWidth: 3, borderBottomColor: borderColor }, style],
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native10.View, { style: styles8.body, children: typeof resolvedChildren === "string" || typeof resolvedChildren === "number" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native10.Text, { style: [styles8.content, { color: text }], children: resolvedChildren }) : resolvedChildren }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native11.View, { style: styles8.body, children: typeof resolvedChildren === "string" || typeof resolvedChildren === "number" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ScaledText, { style: [styles8.content, { color: text }], children: resolvedChildren }) : resolvedChildren }),
         action,
-        onDismiss && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-          import_react_native10.Pressable,
+        onDismiss && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          import_react_native11.Pressable,
           {
             onPress: onDismiss,
             style: styles8.dismiss,
             accessibilityLabel: "Dismiss notification",
             accessibilityRole: "button",
             hitSlop: 8,
-            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native10.Text, { style: { color: text, fontSize: 16 }, children: "\u2715" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ScaledText, { style: { color: text, fontSize: 16 }, children: "\u2715" })
           }
         )
       ]
@@ -626,9 +665,9 @@ function NotificationBanner({
 }
 
 // src/components/ui/Link/Link.tsx
-var import_react_native11 = require("react-native");
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var styles9 = import_react_native11.StyleSheet.create({
+var import_react_native12 = require("react-native");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var styles9 = import_react_native12.StyleSheet.create({
   text: {
     fontSize: import_native.font.size.body,
     fontFamily: import_native.font.family.body,
@@ -644,25 +683,25 @@ function Link({ href, children, accessibilityLabel, style, onPress }) {
     if (onPress) {
       onPress();
     } else if (href) {
-      import_react_native11.Linking.openURL(href);
+      import_react_native12.Linking.openURL(href);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    import_react_native11.Pressable,
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    import_react_native12.Pressable,
     {
       onPress: handlePress,
       accessibilityRole: "link",
       accessibilityLabel,
       style: ({ pressed }) => pressed && styles9.pressed,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native11.Text, { style: [styles9.text, { color: colors2.colorInteractiveOnBg }, style], children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ScaledText, { style: [styles9.text, { color: colors2.colorInteractiveOnBg }, style], children })
     }
   );
 }
 
 // src/components/ui/DescriptionList/DescriptionList.tsx
-var import_react_native12 = require("react-native");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var styles10 = import_react_native12.StyleSheet.create({
+var import_react_native13 = require("react-native");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var styles10 = import_react_native13.StyleSheet.create({
   list: {
     gap: import_native.spacing.m
   },
@@ -684,16 +723,16 @@ var styles10 = import_react_native12.StyleSheet.create({
 });
 function DescriptionList({ items, style }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native12.View, { style: [styles10.list, style], accessibilityRole: "list", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react_native12.View, { style: styles10.group, accessibilityRole: "listitem", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native12.Text, { style: [styles10.term, { color: colors2.colorOnBgSubtle }], children: item.term }),
-    typeof item.description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native12.Text, { style: [styles10.description, { color: colors2.colorOnBg }], children: item.description }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native12.View, { children: item.description })
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_native13.View, { style: [styles10.list, style], accessibilityRole: "list", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_react_native13.View, { style: styles10.group, accessibilityRole: "listitem", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ScaledText, { style: [styles10.term, { color: colors2.colorOnBgSubtle }], children: item.term }),
+    typeof item.description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ScaledText, { style: [styles10.description, { color: colors2.colorOnBg }], children: item.description }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_native13.View, { children: item.description })
   ] }, i)) });
 }
 
 // src/components/ui/Breadcrumb/Breadcrumb.tsx
-var import_react_native13 = require("react-native");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var styles11 = import_react_native13.StyleSheet.create({
+var import_react_native14 = require("react-native");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var styles11 = import_react_native14.StyleSheet.create({
   container: {
     flexDirection: "row",
     flexWrap: "wrap",
@@ -716,33 +755,33 @@ var styles11 = import_react_native13.StyleSheet.create({
 });
 function Breadcrumb({ items, style }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-    import_react_native13.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    import_react_native14.View,
     {
       style: [styles11.container, style],
       accessibilityRole: "navigation",
       accessibilityLabel: "Breadcrumb",
       children: items.map((item, index) => {
         const isLast = index === items.length - 1;
-        return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_native13.View, { style: { flexDirection: "row", alignItems: "center", minHeight: 44 }, children: isLast ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-          import_react_native13.Text,
+        return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native14.View, { style: { flexDirection: "row", alignItems: "center", minHeight: 44 }, children: isLast ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          ScaledText,
           {
             style: [styles11.itemText, { color: colors2.colorOnBg }],
             accessibilityRole: "text",
             children: item.label
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            import_react_native13.Pressable,
+        ) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            import_react_native14.Pressable,
             {
               onPress: item.onPress,
               accessibilityRole: "link",
               style: ({ pressed }) => pressed && styles11.pressed,
-              children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_native13.Text, { style: [styles11.itemText, { color: colors2.colorInteractiveOnBg }], children: item.label })
+              children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ScaledText, { style: [styles11.itemText, { color: colors2.colorInteractiveOnBg }], children: item.label })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            import_react_native13.Text,
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            ScaledText,
             {
               style: [styles11.separator, { color: colors2.colorOnBgSubtle }],
               importantForAccessibility: "no",
@@ -757,8 +796,8 @@ function Breadcrumb({ items, style }) {
 }
 
 // src/components/ui/ProgressCircle/ProgressCircle.tsx
-var import_react_native14 = require("react-native");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_react_native15 = require("react-native");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var SIZE_PX = {
   small: 40,
   medium: 64,
@@ -774,7 +813,7 @@ var FONT_SIZE = {
   medium: import_native.font.size.bodyS,
   large: import_native.font.size.body
 };
-var styles12 = import_react_native14.StyleSheet.create({
+var styles12 = import_react_native15.StyleSheet.create({
   wrapper: {
     alignItems: "center",
     justifyContent: "center"
@@ -791,16 +830,16 @@ function HalfCircle({
   color,
   rotation
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-    import_react_native14.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    import_react_native15.View,
     {
       style: {
         width: size / 2,
         height: size,
         overflow: "hidden"
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-        import_react_native14.View,
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        import_react_native15.View,
         {
           style: {
             width: size,
@@ -830,8 +869,8 @@ function ProgressCircle({
   const fillColor = colors2.colorInteractive;
   const trackColor = colors2.colorBgSubtle;
   const degrees = percentage / 100 * 360;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-    import_react_native14.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    import_react_native15.View,
     {
       style: [
         styles12.wrapper,
@@ -842,8 +881,8 @@ function ProgressCircle({
       accessibilityLabel: label,
       accessibilityValue: { min: 0, max, now: value },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          import_react_native14.View,
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          import_react_native15.View,
           {
             style: {
               position: "absolute",
@@ -855,8 +894,8 @@ function ProgressCircle({
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          import_react_native14.View,
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          import_react_native15.View,
           {
             style: {
               position: "absolute",
@@ -865,7 +904,7 @@ function ProgressCircle({
               start: px / 2,
               overflow: "hidden"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               HalfCircle,
               {
                 size: px,
@@ -876,8 +915,8 @@ function ProgressCircle({
             )
           }
         ),
-        degrees > 180 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          import_react_native14.View,
+        degrees > 180 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          import_react_native15.View,
           {
             style: {
               position: "absolute",
@@ -886,14 +925,14 @@ function ProgressCircle({
               start: 0,
               overflow: "hidden"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_react_native14.View,
+            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+              import_react_native15.View,
               {
                 style: {
                   position: "absolute",
                   end: 0
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   HalfCircle,
                   {
                     size: px,
@@ -906,8 +945,8 @@ function ProgressCircle({
             )
           }
         ),
-        showValue && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-          import_react_native14.Text,
+        showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+          ScaledText,
           {
             style: [styles12.valueText, { fontSize: FONT_SIZE[size], color: colors2.colorOnBg }],
             importantForAccessibility: "no",
@@ -924,10 +963,10 @@ function ProgressCircle({
 }
 
 // src/components/ui/Tooltip/Tooltip.tsx
-var import_react3 = require("react");
-var import_react_native15 = require("react-native");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var styles13 = import_react_native15.StyleSheet.create({
+var import_react4 = require("react");
+var import_react_native16 = require("react-native");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var styles13 = import_react_native16.StyleSheet.create({
   wrapper: {
     position: "relative"
   },
@@ -949,10 +988,10 @@ var styles13 = import_react_native15.StyleSheet.create({
 });
 function Tooltip({ content, children, style }) {
   const { colors: colors2 } = useTheme();
-  const [visible, setVisible] = (0, import_react3.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_native15.View, { style: [styles13.wrapper, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-      import_react_native15.Pressable,
+  const [visible, setVisible] = (0, import_react4.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react_native16.View, { style: [styles13.wrapper, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      import_react_native16.Pressable,
       {
         onLongPress: () => setVisible(true),
         onPressOut: () => setVisible(false),
@@ -960,21 +999,21 @@ function Tooltip({ content, children, style }) {
         children
       }
     ),
-    visible && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-      import_react_native15.View,
+    visible && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      import_react_native16.View,
       {
         style: [styles13.tooltip, { backgroundColor: colors2.colorOnBg }],
         accessibilityRole: "text",
         accessibilityLabel: content,
-        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native15.Text, { style: [styles13.text, { color: colors2.colorBg }], children: content })
+        children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ScaledText, { style: [styles13.text, { color: colors2.colorBg }], children: content })
       }
     )
   ] });
 }
 
 // src/components/ui/Pagination/Pagination.tsx
-var import_react_native16 = require("react-native");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_react_native17 = require("react-native");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function getPageRange(current, total) {
   const delta = 1;
   const range = [];
@@ -987,7 +1026,7 @@ function getPageRange(current, total) {
   }
   return range;
 }
-var styles14 = import_react_native16.StyleSheet.create({
+var styles14 = import_react_native17.StyleSheet.create({
   container: {
     flexDirection: "row",
     alignItems: "center",
@@ -1038,15 +1077,15 @@ function Pagination({
 }) {
   const { colors: colors2 } = useTheme();
   const pages = getPageRange(currentPage, totalPages);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
-    import_react_native16.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+    import_react_native17.View,
     {
       style: [styles14.container, style],
       accessibilityRole: "navigation",
       accessibilityLabel: "Pagination",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-          import_react_native16.Pressable,
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          import_react_native17.Pressable,
           {
             onPress: () => onPageChange(currentPage - 1),
             disabled: currentPage <= 1,
@@ -1058,12 +1097,12 @@ function Pagination({
               currentPage <= 1 && styles14.disabled,
               pressed && !currentPage && styles14.pressed
             ],
-            children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native16.Text, { style: [styles14.navText, { color: colors2.colorOnBg }], children: "\u2039" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ScaledText, { style: [styles14.navText, { color: colors2.colorOnBg }], children: "\u2039" })
           }
         ),
         pages.map(
-          (page, index) => page === "..." ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-            import_react_native16.Text,
+          (page, index) => page === "..." ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+            ScaledText,
             {
               style: [styles14.ellipsis, { color: colors2.colorOnBgSubtle }],
               importantForAccessibility: "no",
@@ -1071,8 +1110,8 @@ function Pagination({
               children: "..."
             },
             `ellipsis-${index}`
-          ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-            import_react_native16.Pressable,
+          ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+            import_react_native17.Pressable,
             {
               onPress: () => onPageChange(page),
               accessibilityRole: "button",
@@ -1083,8 +1122,8 @@ function Pagination({
                 currentPage === page && { backgroundColor: colors2.colorInteractive },
                 pressed && styles14.pressed
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-                import_react_native16.Text,
+              children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                ScaledText,
                 {
                   style: [
                     styles14.buttonText,
@@ -1100,8 +1139,8 @@ function Pagination({
             page
           )
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-          import_react_native16.Pressable,
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          import_react_native17.Pressable,
           {
             onPress: () => onPageChange(currentPage + 1),
             disabled: currentPage >= totalPages,
@@ -1113,7 +1152,7 @@ function Pagination({
               currentPage >= totalPages && styles14.disabled,
               pressed && styles14.pressed
             ],
-            children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native16.Text, { style: [styles14.navText, { color: colors2.colorOnBg }], children: "\u203A" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ScaledText, { style: [styles14.navText, { color: colors2.colorOnBg }], children: "\u203A" })
           }
         )
       ]
@@ -1122,13 +1161,13 @@ function Pagination({
 }
 
 // src/components/ui/Collapsible/Collapsible.tsx
-var import_react4 = require("react");
-var import_react_native17 = require("react-native");
-var import_jsx_runtime17 = require("react/jsx-runtime");
-if (import_react_native17.Platform.OS === "android" && import_react_native17.UIManager.setLayoutAnimationEnabledExperimental) {
-  import_react_native17.UIManager.setLayoutAnimationEnabledExperimental(true);
+var import_react5 = require("react");
+var import_react_native18 = require("react-native");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+if (import_react_native18.Platform.OS === "android" && import_react_native18.UIManager.setLayoutAnimationEnabledExperimental) {
+  import_react_native18.UIManager.setLayoutAnimationEnabledExperimental(true);
 }
-var styles15 = import_react_native17.StyleSheet.create({
+var styles15 = import_react_native18.StyleSheet.create({
   container: {
     borderRadius: import_native.border.radius.m,
     overflow: "hidden"
@@ -1176,14 +1215,14 @@ function Collapsible({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [internalOpen, setInternalOpen] = (0, import_react4.useState)(defaultOpen);
+  const [internalOpen, setInternalOpen] = (0, import_react5.useState)(defaultOpen);
   const isControlled = controlledOpen !== void 0;
   const isOpen = isControlled ? controlledOpen : internalOpen;
-  const rotation = (0, import_react4.useRef)(new import_react_native17.Animated.Value(isOpen ? 1 : 0)).current;
-  const toggle = (0, import_react4.useCallback)(() => {
+  const rotation = (0, import_react5.useRef)(new import_react_native18.Animated.Value(isOpen ? 1 : 0)).current;
+  const toggle = (0, import_react5.useCallback)(() => {
     const next = !isOpen;
-    import_react_native17.LayoutAnimation.configureNext(import_react_native17.LayoutAnimation.Presets.easeInEaseOut);
-    import_react_native17.Animated.timing(rotation, {
+    import_react_native18.LayoutAnimation.configureNext(import_react_native18.LayoutAnimation.Presets.easeInEaseOut);
+    import_react_native18.Animated.timing(rotation, {
       toValue: next ? 1 : 0,
       duration: 200,
       useNativeDriver: true
@@ -1197,14 +1236,14 @@ function Collapsible({
     inputRange: [0, 1],
     outputRange: ["-45deg", "45deg"]
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-    import_react_native17.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    import_react_native18.View,
     {
       style: [styles15.container, { borderBottomWidth: 1, borderBottomColor: colors2.colorBgSubtle }, style],
       accessibilityRole: "summary",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-          import_react_native17.Pressable,
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+          import_react_native18.Pressable,
           {
             onPress: toggle,
             accessibilityRole: "button",
@@ -1212,9 +1251,9 @@ function Collapsible({
             accessibilityState: { expanded: isOpen },
             style: ({ pressed }) => [styles15.header, pressed && styles15.pressed],
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native17.Text, { style: [styles15.summaryText, { color: colors2.colorOnBg }], children: summary }),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                import_react_native17.Animated.View,
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ScaledText, { style: [styles15.summaryText, { color: colors2.colorOnBg }], children: summary }),
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                import_react_native18.Animated.View,
                 {
                   testID: "bds-collapsible-chevron",
                   style: [styles15.chevron, { borderColor: colors2.colorOnBgSubtle, transform: [{ rotate }] }],
@@ -1225,20 +1264,20 @@ function Collapsible({
             ]
           }
         ),
-        isOpen && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native17.View, { style: styles15.content, children })
+        isOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native18.View, { style: styles15.content, children })
       ]
     }
   );
 }
 
 // src/components/ui/Accordion/Accordion.tsx
-var import_react5 = require("react");
-var import_react_native18 = require("react-native");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-if (import_react_native18.Platform.OS === "android" && import_react_native18.UIManager.setLayoutAnimationEnabledExperimental) {
-  import_react_native18.UIManager.setLayoutAnimationEnabledExperimental(true);
+var import_react6 = require("react");
+var import_react_native19 = require("react-native");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+if (import_react_native19.Platform.OS === "android" && import_react_native19.UIManager.setLayoutAnimationEnabledExperimental) {
+  import_react_native19.UIManager.setLayoutAnimationEnabledExperimental(true);
 }
-var styles16 = import_react_native18.StyleSheet.create({
+var styles16 = import_react_native19.StyleSheet.create({
   container: {
     overflow: "hidden",
     borderRadius: import_native.border.radius.s
@@ -1283,20 +1322,20 @@ function Accordion({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [openIds, setOpenIds] = (0, import_react5.useState)(defaultOpen);
+  const [openIds, setOpenIds] = (0, import_react6.useState)(defaultOpen);
   const toggle = (id) => {
-    import_react_native18.LayoutAnimation.configureNext(import_react_native18.LayoutAnimation.Presets.easeInEaseOut);
+    import_react_native19.LayoutAnimation.configureNext(import_react_native19.LayoutAnimation.Presets.easeInEaseOut);
     setOpenIds((prev) => {
       const isOpen = prev.includes(id);
       if (isOpen) return prev.filter((i) => i !== id);
       return allowMultiple ? [...prev, id] : [id];
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native18.View, { style: [styles16.container, style], children: items.map((item, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_native19.View, { style: [styles16.container, style], children: items.map((item, index) => {
     const isOpen = openIds.includes(item.id);
     const isLast = index === items.length - 1;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-      import_react_native18.View,
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+      import_react_native19.View,
       {
         style: [
           styles16.item,
@@ -1304,8 +1343,8 @@ function Accordion({
           isLast && { borderBottomWidth: 0 }
         ],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-            import_react_native18.Pressable,
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+            import_react_native19.Pressable,
             {
               onPress: () => toggle(item.id),
               disabled: item.disabled,
@@ -1317,9 +1356,9 @@ function Accordion({
                 pressed && !item.disabled && styles16.pressed
               ],
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native18.Text, { style: [styles16.titleText, { color: colors2.colorOnBg }], children: typeof item.title === "string" ? item.title : item.title }),
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-                  import_react_native18.Text,
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ScaledText, { style: [styles16.titleText, { color: colors2.colorOnBg }], children: typeof item.title === "string" ? item.title : item.title }),
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                  ScaledText,
                   {
                     style: [styles16.chevron, { color: colors2.colorOnBgSubtle }],
                     importantForAccessibility: "no",
@@ -1330,7 +1369,7 @@ function Accordion({
               ]
             }
           ),
-          isOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native18.View, { style: styles16.panel, accessibilityRole: "summary", children: item.content })
+          isOpen && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_native19.View, { style: styles16.panel, accessibilityRole: "summary", children: item.content })
         ]
       },
       item.id
@@ -1339,10 +1378,10 @@ function Accordion({
 }
 
 // src/components/ui/Tabs/Tabs.tsx
-var import_react6 = require("react");
-var import_react_native19 = require("react-native");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var styles17 = import_react_native19.StyleSheet.create({
+var import_react7 = require("react");
+var import_react_native20 = require("react-native");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var styles17 = import_react_native20.StyleSheet.create({
   container: {
     overflow: "hidden"
   },
@@ -1380,10 +1419,10 @@ function Tabs({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [activeTab, setActiveTab] = (0, import_react6.useState)(defaultTab ?? tabs[0]?.id);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react_native19.View, { style: [styles17.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-      import_react_native19.ScrollView,
+  const [activeTab, setActiveTab] = (0, import_react7.useState)(defaultTab ?? tabs[0]?.id);
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react_native20.View, { style: [styles17.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      import_react_native20.ScrollView,
       {
         horizontal: true,
         showsHorizontalScrollIndicator: false,
@@ -1391,8 +1430,8 @@ function Tabs({
         accessibilityRole: "tabbar",
         children: tabs.map((tab) => {
           const isActive = activeTab === tab.id;
-          return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-            import_react_native19.Pressable,
+          return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+            import_react_native20.Pressable,
             {
               onPress: () => setActiveTab(tab.id),
               disabled: tab.disabled,
@@ -1410,8 +1449,8 @@ function Tabs({
                 tab.disabled && styles17.disabled,
                 pressed && !tab.disabled && styles17.pressed
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                import_react_native19.Text,
+              children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                ScaledText,
                 {
                   style: [
                     styles17.tabLabel,
@@ -1432,15 +1471,15 @@ function Tabs({
     tabs.map((tab) => {
       const isActive = activeTab === tab.id;
       if (!isActive) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_native19.View, { style: styles17.panel, accessibilityRole: "tabpanel", children: tab.content }, tab.id);
+      return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.View, { style: styles17.panel, accessibilityRole: "tabpanel", children: tab.content }, tab.id);
     })
   ] });
 }
 
 // src/components/ui/Table/Table.tsx
-var import_react_native20 = require("react-native");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var styles18 = import_react_native20.StyleSheet.create({
+var import_react_native21 = require("react-native");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var styles18 = import_react_native21.StyleSheet.create({
   wrapper: {
     borderRadius: import_native.border.radius.s,
     overflow: "hidden"
@@ -1516,26 +1555,26 @@ function Table({
     if (sortKey !== col.key) return base;
     return `${base}, currently ${sortDirection === "asc" ? "ascending" : "descending"}`;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    import_react_native20.ScrollView,
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    import_react_native21.ScrollView,
     {
       horizontal: true,
       showsHorizontalScrollIndicator: true,
       style: [styles18.wrapper, { backgroundColor: colors2.colorBg }, style],
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react_native20.View, { children: [
-        caption && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.Text, { style: [styles18.caption, { color: colors2.colorOnBgSubtle }], children: caption }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.View, { style: [styles18.headerRow, { backgroundColor: colors2.colorBgSubtle }], children: columns.map(
-          (col) => col.sortable ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
-            import_react_native20.Pressable,
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react_native21.View, { children: [
+        caption && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScaledText, { style: [styles18.caption, { color: colors2.colorOnBgSubtle }], children: caption }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: [styles18.headerRow, { backgroundColor: colors2.colorBgSubtle }], children: columns.map(
+          (col) => col.sortable ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+            import_react_native21.Pressable,
             {
               onPress: () => handleSort(col.key),
               accessibilityRole: "button",
               accessibilityLabel: getSortLabel(col),
               style: ({ pressed }) => [styles18.headerCell, pressed && styles18.pressed],
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.Text, { style: [styles18.headerText, { color: colors2.colorOnBg }], children: col.header }),
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-                  import_react_native20.Text,
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScaledText, { style: [styles18.headerText, { color: colors2.colorOnBg }], children: col.header }),
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  ScaledText,
                   {
                     style: [
                       styles18.sortIndicator,
@@ -1551,10 +1590,10 @@ function Table({
               ]
             },
             col.key
-          ) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.View, { style: styles18.headerCell, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.Text, { style: [styles18.headerText, { color: colors2.colorOnBg }], children: col.header }) }, col.key)
+          ) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles18.headerCell, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScaledText, { style: [styles18.headerText, { color: colors2.colorOnBg }], children: col.header }) }, col.key)
         ) }),
-        rows.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-          import_react_native20.View,
+        rows.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+          import_react_native21.View,
           {
             style: [
               styles18.row,
@@ -1562,7 +1601,7 @@ function Table({
               rowIndex % 2 === 1 && { backgroundColor: colors2.colorBgSubtle }
             ],
             accessibilityRole: "none",
-            children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.View, { style: styles18.cell, children: col.render ? typeof col.render(row) === "string" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.Text, { style: [styles18.cellText, { color: colors2.colorOnBg }], children: col.render(row) }) : col.render(row) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native20.Text, { style: [styles18.cellText, { color: colors2.colorOnBg }], children: String(row[col.key] ?? "") }) }, col.key))
+            children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles18.cell, children: col.render ? typeof col.render(row) === "string" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScaledText, { style: [styles18.cellText, { color: colors2.colorOnBg }], children: col.render(row) }) : col.render(row) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScaledText, { style: [styles18.cellText, { color: colors2.colorOnBg }], children: String(row[col.key] ?? "") }) }, col.key))
           },
           rowIndex
         ))
@@ -1572,9 +1611,9 @@ function Table({
 }
 
 // src/components/ui/Calendar/Calendar.tsx
-var import_react7 = require("react");
-var import_react_native21 = require("react-native");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_react8 = require("react");
+var import_react_native22 = require("react-native");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var DAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
 var DAY_LABELS = {
   Su: "Sunday",
@@ -1617,7 +1656,7 @@ function getFirstDayOfMonth(year, month) {
   return new Date(year, month, 1).getDay();
 }
 var DAY_SIZE = 44;
-var styles19 = import_react_native21.StyleSheet.create({
+var styles19 = import_react_native22.StyleSheet.create({
   container: {
     alignSelf: "flex-start"
   },
@@ -1699,12 +1738,12 @@ function Calendar({
   const { colors: colors2 } = useTheme();
   const today = /* @__PURE__ */ new Date();
   const controlled = value !== void 0;
-  const [internal, setInternal] = (0, import_react7.useState)(defaultValue);
+  const [internal, setInternal] = (0, import_react8.useState)(defaultValue);
   const selected = controlled ? value : internal;
-  const [viewYear, setViewYear] = (0, import_react7.useState)(
+  const [viewYear, setViewYear] = (0, import_react8.useState)(
     selected?.getFullYear() ?? today.getFullYear()
   );
-  const [viewMonth, setViewMonth] = (0, import_react7.useState)(
+  const [viewMonth, setViewMonth] = (0, import_react8.useState)(
     selected?.getMonth() ?? today.getMonth()
   );
   const daysInMonth = getDaysInMonth(viewYear, viewMonth);
@@ -1729,26 +1768,26 @@ function Calendar({
     { length: cells.length / 7 },
     (_, i) => cells.slice(i * 7, i * 7 + 7)
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
-    import_react_native21.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    import_react_native22.View,
     {
       style: [styles19.container, style],
       accessibilityRole: "none",
       accessibilityLabel: `${MONTHS[viewMonth]} ${viewYear} calendar`,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react_native21.View, { style: styles19.header, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-            import_react_native21.Pressable,
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react_native22.View, { style: styles19.header, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            import_react_native22.Pressable,
             {
               onPress: () => navigate(-1),
               accessibilityRole: "button",
               accessibilityLabel: "Previous month",
               style: ({ pressed }) => [styles19.navButton, pressed && styles19.pressed],
-              children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.Text, { style: [styles19.navText, { color: colors2.colorOnBg }], children: "\u2039" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ScaledText, { style: [styles19.navText, { color: colors2.colorOnBg }], children: "\u2039" })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
-            import_react_native21.Text,
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+            ScaledText,
             {
               style: [styles19.monthYear, { color: colors2.colorOnBg }],
               accessibilityRole: "text",
@@ -1760,35 +1799,35 @@ function Calendar({
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-            import_react_native21.Pressable,
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            import_react_native22.Pressable,
             {
               onPress: () => navigate(1),
               accessibilityRole: "button",
               accessibilityLabel: "Next month",
               style: ({ pressed }) => [styles19.navButton, pressed && styles19.pressed],
-              children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.Text, { style: [styles19.navText, { color: colors2.colorOnBg }], children: "\u203A" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ScaledText, { style: [styles19.navText, { color: colors2.colorOnBg }], children: "\u203A" })
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles19.weekRow, children: DAYS.map((d) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles19.weekday, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-          import_react_native21.Text,
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles19.weekRow, children: DAYS.map((d) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles19.weekday, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          ScaledText,
           {
             style: [styles19.weekdayText, { color: colors2.colorOnBgSubtle }],
             accessibilityLabel: DAY_LABELS[d],
             children: d
           }
         ) }, d)) }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles19.grid, children: rows.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles19.dayRow, children: row.map((cell, colIndex) => {
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles19.grid, children: rows.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles19.dayRow, children: row.map((cell, colIndex) => {
           if (!cell) {
-            return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_native21.View, { style: styles19.dayCell }, colIndex);
+            return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles19.dayCell }, colIndex);
           }
           const date = new Date(viewYear, viewMonth, cell.day);
           const isSelected = selected ? isSameDay(date, selected) : false;
           const isToday = isSameDay(date, today);
           const disabled = isOutOfRange(date, min, max);
-          return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-            import_react_native21.Pressable,
+          return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            import_react_native22.Pressable,
             {
               onPress: () => selectDay(cell.day),
               disabled,
@@ -1814,8 +1853,8 @@ function Calendar({
                 disabled && styles19.disabled,
                 pressed && !disabled && styles19.pressed
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-                import_react_native21.Text,
+              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                ScaledText,
                 {
                   style: [
                     styles19.dayText,
@@ -1837,12 +1876,12 @@ function Calendar({
 }
 
 // src/components/ui/Carousel/Carousel.tsx
-var import_react8 = require("react");
-var import_react_native22 = require("react-native");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_react9 = require("react");
+var import_react_native23 = require("react-native");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var DOT_SIZE = 8;
 var DOT_HIT_SIZE = 44;
-var styles20 = import_react_native22.StyleSheet.create({
+var styles20 = import_react_native23.StyleSheet.create({
   container: {
     width: "100%"
   },
@@ -1897,10 +1936,10 @@ function Carousel({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const scrollRef = (0, import_react8.useRef)(null);
-  const [activeIndex, setActiveIndex] = (0, import_react8.useState)(0);
-  const [slideWidth, setSlideWidth] = (0, import_react8.useState)(import_react_native22.Dimensions.get("window").width);
-  const handleScroll = (0, import_react8.useCallback)(
+  const scrollRef = (0, import_react9.useRef)(null);
+  const [activeIndex, setActiveIndex] = (0, import_react9.useState)(0);
+  const [slideWidth, setSlideWidth] = (0, import_react9.useState)(import_react_native23.Dimensions.get("window").width);
+  const handleScroll = (0, import_react9.useCallback)(
     (e) => {
       const offset = e.nativeEvent.contentOffset.x;
       const width = e.nativeEvent.layoutMeasurement.width;
@@ -1915,15 +1954,15 @@ function Carousel({
     const clamped = Math.max(0, Math.min(index, items.length - 1));
     scrollRef.current?.scrollTo({ x: clamped * slideWidth, animated: true });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
-    import_react_native22.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    import_react_native23.View,
     {
       style: [styles20.container, style],
       accessibilityRole: "none",
       accessibilityLabel: label,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-          import_react_native22.ScrollView,
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_react_native23.ScrollView,
           {
             ref: scrollRef,
             horizontal: true,
@@ -1933,12 +1972,12 @@ function Carousel({
             scrollEventThrottle: 16,
             onLayout: (e) => setSlideWidth(e.nativeEvent.layout.width),
             style: styles20.scrollView,
-            children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: [styles20.slide, { width: slideWidth }], children: item }, index))
+            children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { style: [styles20.slide, { width: slideWidth }], children: item }, index))
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react_native22.View, { style: styles20.nav, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            import_react_native22.Pressable,
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react_native23.View, { style: styles20.nav, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            import_react_native23.Pressable,
             {
               onPress: () => scrollTo(activeIndex - 1),
               disabled: activeIndex <= 0,
@@ -1950,19 +1989,19 @@ function Carousel({
                 activeIndex <= 0 && { opacity: 0.4 },
                 pressed && styles20.pressed
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.Text, { style: [styles20.navText, { color: colors2.colorOnBg }], children: "\u2039" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScaledText, { style: [styles20.navText, { color: colors2.colorOnBg }], children: "\u2039" })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.View, { style: styles20.dots, children: items.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            import_react_native22.Pressable,
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { style: styles20.dots, children: items.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            import_react_native23.Pressable,
             {
               onPress: () => scrollTo(index),
               accessibilityRole: "button",
               accessibilityLabel: `Go to slide ${index + 1}`,
               accessibilityState: { selected: activeIndex === index },
               style: styles20.dotWrapper,
-              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                import_react_native22.View,
+              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                import_react_native23.View,
                 {
                   style: [
                     styles20.dot,
@@ -1975,8 +2014,8 @@ function Carousel({
             },
             index
           )) }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            import_react_native22.Pressable,
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            import_react_native23.Pressable,
             {
               onPress: () => scrollTo(activeIndex + 1),
               disabled: activeIndex >= items.length - 1,
@@ -1988,7 +2027,7 @@ function Carousel({
                 activeIndex >= items.length - 1 && { opacity: 0.4 },
                 pressed && styles20.pressed
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_native22.Text, { style: [styles20.navText, { color: colors2.colorOnBg }], children: "\u203A" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScaledText, { style: [styles20.navText, { color: colors2.colorOnBg }], children: "\u203A" })
             }
           )
         ] })
@@ -1998,8 +2037,8 @@ function Carousel({
 }
 
 // src/components/layout/Card/Card.tsx
-var import_react_native23 = require("react-native");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_react_native24 = require("react-native");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var paddingMap = {
   none: 0,
   small: import_native.spacing.s,
@@ -2011,7 +2050,7 @@ var alignMap = {
   center: "center",
   end: "flex-end"
 };
-var styles21 = import_react_native23.StyleSheet.create({
+var styles21 = import_react_native24.StyleSheet.create({
   card: {
     borderRadius: import_native.border.radius.m,
     overflow: "hidden"
@@ -2046,8 +2085,8 @@ function Card({
     alignItems: alignMap[textAlign]
   };
   if (onPress) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      import_react_native23.Pressable,
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      import_react_native24.Pressable,
       {
         onPress,
         accessibilityRole: "button",
@@ -2057,18 +2096,18 @@ function Card({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_native23.View, { style: [styles21.card, variantStyle, inner, style], children });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.View, { style: [styles21.card, variantStyle, inner, style], children });
 }
 
 // src/components/layout/SectionHeader/SectionHeader.tsx
-var import_react_native24 = require("react-native");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_react_native25 = require("react-native");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var alignMap2 = {
   start: "flex-start",
   center: "center",
   end: "flex-end"
 };
-var titleStyles = import_react_native24.StyleSheet.create({
+var titleStyles = import_react_native25.StyleSheet.create({
   small: {
     fontSize: import_native.font.size.heading3,
     fontFamily: import_native.font.family.heading,
@@ -2088,7 +2127,7 @@ var titleStyles = import_react_native24.StyleSheet.create({
     lineHeight: lineHeight.heading1
   }
 });
-var styles22 = import_react_native24.StyleSheet.create({
+var styles22 = import_react_native25.StyleSheet.create({
   container: {
     gap: import_native.spacing.xxs
   },
@@ -2107,25 +2146,25 @@ function SectionHeader({
 }) {
   const { colors: colors2 } = useTheme();
   const align = alignMap2[alignment];
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_native24.View, { style: [styles22.container, { alignItems: align }, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-      import_react_native24.Text,
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react_native25.View, { style: [styles22.container, { alignItems: align }, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      ScaledText,
       {
         accessibilityRole: "header",
         style: [titleStyles[size], { color: colors2.colorOnBg }],
         children: title
       }
     ),
-    subtitle && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_native24.Text, { style: [styles22.subtitle, { color: colors2.colorOnBgSubtle }], children: subtitle })
+    subtitle && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ScaledText, { style: [styles22.subtitle, { color: colors2.colorOnBgSubtle }], children: subtitle })
   ] });
 }
 
 // src/components/layout/IconWrapper/IconWrapper.tsx
-var import_react_native25 = require("react-native");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_react_native26 = require("react-native");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function IconWrapper({ children, style, accessibilityElementsHidden }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-    import_react_native25.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    import_react_native26.View,
     {
       style: [{ alignItems: "center", justifyContent: "center" }, style],
       importantForAccessibility: accessibilityElementsHidden ? "no-hide-descendants" : "auto",
@@ -2136,9 +2175,9 @@ function IconWrapper({ children, style, accessibilityElementsHidden }) {
 }
 
 // src/components/layout/ButtonGroup/ButtonGroup.tsx
-var import_react_native26 = require("react-native");
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var styles23 = import_react_native26.StyleSheet.create({
+var import_react_native27 = require("react-native");
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var styles23 = import_react_native27.StyleSheet.create({
   group: {
     flexDirection: "row",
     flexWrap: "wrap",
@@ -2151,8 +2190,8 @@ var styles23 = import_react_native26.StyleSheet.create({
 });
 function ButtonContainer({ children, variant, accessibilityLabel, style }) {
   const isColumn = variant === "card" || variant === "modal";
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-    import_react_native26.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_react_native27.View,
     {
       accessibilityLabel,
       style: [isColumn ? styles23.column : styles23.group, style],
@@ -2163,14 +2202,14 @@ function ButtonContainer({ children, variant, accessibilityLabel, style }) {
 var ButtonGroup = ButtonContainer;
 
 // src/components/interaction/Button/Button.tsx
-var import_react_native27 = require("react-native");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_react_native28 = require("react-native");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var sizeTokens = {
   small: { height: 36, px: import_native.spacing.m, fontSize: import_native.font.size.bodyS, radius: import_native.border.radius.full },
   medium: { height: 48, px: import_native.spacing.m, fontSize: import_native.font.size.body, radius: import_native.border.radius.full },
   large: { height: 56, px: import_native.spacing.xxl, fontSize: import_native.font.size.heading3, radius: import_native.border.radius.full }
 };
-var styles24 = import_react_native27.StyleSheet.create({
+var styles24 = import_react_native28.StyleSheet.create({
   pressable: {
     flexDirection: "row",
     alignItems: "center",
@@ -2181,7 +2220,9 @@ var styles24 = import_react_native27.StyleSheet.create({
   label: {
     fontFamily: import_native.font.family.body,
     fontWeight: import_native.font.weight.semibold,
-    includeFontPadding: false
+    includeFontPadding: false,
+    flexShrink: 1,
+    textAlign: "center"
   }
 });
 function Button({
@@ -2203,12 +2244,15 @@ function Button({
   const outlineTextColor = colors2.colorInteractiveOnBg;
   const isOutline = variant === "outline" || variant === "ghost";
   const containerStyle = {
-    height,
+    minHeight: height,
     paddingHorizontal: isIconOnly ? import_native.spacing.xs : px,
     borderRadius: radius,
     opacity: disabled ? 0.4 : 1,
     // Icon-only: square with equal xs padding on both axes.
     ...isIconOnly && { aspectRatio: 1, paddingVertical: import_native.spacing.xs },
+    // Icon-only keeps a fixed height (stays square); a text button gets vertical padding
+    // instead, so a wrapped label grows the button from minHeight rather than clipping.
+    ...isIconOnly ? { height } : { paddingVertical: import_native.spacing.xxs },
     ...variant === "default" && { backgroundColor: primaryColor },
     ...isOutline && {
       backgroundColor: "transparent",
@@ -2217,8 +2261,8 @@ function Button({
     }
   };
   const textColor = variant === "default" ? onPrimaryColor : outlineTextColor;
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
-    import_react_native27.Pressable,
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+    import_react_native28.Pressable,
     {
       onPress,
       disabled,
@@ -2227,19 +2271,19 @@ function Button({
       accessibilityState: { disabled },
       style: ({ pressed }) => [styles24.pressable, containerStyle, pressed && { opacity: 0.75 }, style],
       children: [
-        iconStart && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.View, { importantForAccessibility: "no-hide-descendants", accessibilityElementsHidden: true, children: iconStart }),
-        children && (isIconOnly ? children : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.Text, { style: [styles24.label, { fontSize, color: textColor }], children })),
-        iconEnd && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_native27.View, { importantForAccessibility: "no-hide-descendants", children: iconEnd })
+        iconStart && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.View, { importantForAccessibility: "no-hide-descendants", accessibilityElementsHidden: true, children: iconStart }),
+        children && (isIconOnly ? children : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ScaledText, { style: [styles24.label, { fontSize, color: textColor }], children })),
+        iconEnd && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_native28.View, { importantForAccessibility: "no-hide-descendants", children: iconEnd })
       ]
     }
   );
 }
 
 // src/components/interaction/Rating/Rating.tsx
-var import_react_native28 = require("react-native");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_react_native29 = require("react-native");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var STAR_SIZE = 24;
-var styles25 = import_react_native28.StyleSheet.create({
+var styles25 = import_react_native29.StyleSheet.create({
   container: {
     flexDirection: "row",
     alignItems: "center"
@@ -2252,14 +2296,14 @@ var styles25 = import_react_native28.StyleSheet.create({
 function Rating({ value, max = 5, style, accessibilityLabel }) {
   const { colors: colors2 } = useTheme();
   const label = accessibilityLabel ?? `${value} out of ${max} stars`;
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-    import_react_native28.View,
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    import_react_native29.View,
     {
       style: [styles25.container, style],
       accessibilityRole: "image",
       accessibilityLabel: label,
-      children: Array.from({ length: max }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-        import_react_native28.Text,
+      children: Array.from({ length: max }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        ScaledText,
         {
           style: [
             styles25.star,
@@ -2279,12 +2323,11 @@ function Rating({ value, max = 5, style, accessibilityLabel }) {
 var import_react_native31 = require("react-native");
 
 // src/components/interaction/form/atoms/Label.tsx
-var import_react_native29 = require("react-native");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 function Label({ label, style }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-    import_react_native29.Text,
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    ScaledText,
     {
       style: [
         {
@@ -2303,7 +2346,7 @@ function Label({ label, style }) {
 
 // src/components/interaction/form/atoms/Message.tsx
 var import_react_native30 = require("react-native");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var styles26 = import_react_native30.StyleSheet.create({
   base: {
     fontFamily: import_native.font.family.body,
@@ -2315,8 +2358,8 @@ function Message({ message, type, style }) {
   const { colors: colors2 } = useTheme();
   if (!message) return null;
   const color = type === "error" ? colors2.colorError : colors2.colorOnBgSubtle;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-    import_react_native30.Text,
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    ScaledText,
     {
       accessibilityRole: type === "error" ? "alert" : "none",
       accessibilityLiveRegion: type === "error" ? "assertive" : "polite",
@@ -2327,7 +2370,7 @@ function Message({ message, type, style }) {
 }
 
 // src/components/interaction/form/Switch/Switch.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var styles27 = import_react_native31.StyleSheet.create({
   container: {
     gap: import_native.spacing.xxs
@@ -2348,9 +2391,9 @@ function Switch({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react_native31.View, { style: [styles27.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react_native31.View, { style: styles27.row, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react_native31.View, { style: [styles27.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react_native31.View, { style: styles27.row, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         import_react_native31.Switch,
         {
           value,
@@ -2363,16 +2406,16 @@ function Switch({
           trackColor: { false: colors2.colorBgSubtle, true: colors2.colorBlueSubtle }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Label, { label })
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Label, { label })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/Checkbox/Checkbox.tsx
 var import_react_native32 = require("react-native");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var BOX = 22;
 var styles28 = import_react_native32.StyleSheet.create({
   container: {
@@ -2411,8 +2454,8 @@ function Checkbox({
   const { colors: colors2 } = useTheme();
   const borderColor = error ? colors2.colorError : checked ? colors2.colorInteractive : colors2.colorOnBg;
   const bgColor = checked ? colors2.colorInteractive : "transparent";
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react_native32.View, { style: [styles28.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native32.View, { style: [styles28.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
       import_react_native32.Pressable,
       {
         onPress: () => !disabled && onChange?.(!checked),
@@ -2422,19 +2465,19 @@ function Checkbox({
         disabled,
         style: ({ pressed }) => [styles28.row, pressed && { opacity: 0.7 }, disabled && { opacity: 0.4 }],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_native32.View, { style: [styles28.box, { borderColor, backgroundColor: bgColor }], children: checked && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Label, { label: "\u2713", style: [styles28.checkmark, { color: colors2.colorOnInteractive }] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Label, { label })
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_native32.View, { style: [styles28.box, { borderColor, backgroundColor: bgColor }], children: checked && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Label, { label: "\u2713", style: [styles28.checkmark, { color: colors2.colorOnInteractive }] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Label, { label })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
 var import_react_native33 = require("react-native");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var styles29 = import_react_native33.StyleSheet.create({
   container: {
     gap: import_native.spacing.xs
@@ -2462,20 +2505,20 @@ function CheckboxGroup({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
     import_react_native33.View,
     {
       style: [styles29.container, disabled && { opacity: 0.4 }, style],
       accessibilityRole: "none",
       accessibilityLabel: legend,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native33.Text, { style: [styles29.legend, { color: colors2.colorOnBg }], children: [
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(ScaledText, { style: [styles29.legend, { color: colors2.colorOnBg }], children: [
           legend,
-          required && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_native33.Text, { style: [styles29.required, { color: colors2.colorOnBgSubtle }], children: " *" })
+          required && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ScaledText, { style: [styles29.required, { color: colors2.colorOnBgSubtle }], children: " *" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_native33.View, { style: styles29.items, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Message, { type: "error", message: error }),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Message, { type: "hint", message: hint })
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_native33.View, { style: styles29.items, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Message, { type: "error", message: error }),
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Message, { type: "hint", message: hint })
       ]
     }
   );
@@ -2483,7 +2526,7 @@ function CheckboxGroup({
 
 // src/components/interaction/form/Radio/Radio.tsx
 var import_react_native34 = require("react-native");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var DOT = 22;
 var INNER = 10;
 var styles30 = import_react_native34.StyleSheet.create({
@@ -2522,8 +2565,8 @@ function Radio({
 }) {
   const { colors: colors2 } = useTheme();
   const borderColor = error ? colors2.colorError : checked ? colors2.colorInteractive : colors2.colorOnBg;
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_react_native34.View, { style: [styles30.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react_native34.View, { style: [styles30.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
       import_react_native34.Pressable,
       {
         onPress: () => !disabled && onChange?.(),
@@ -2533,19 +2576,19 @@ function Radio({
         disabled,
         style: ({ pressed }) => [styles30.row, pressed && { opacity: 0.7 }, disabled && { opacity: 0.4 }],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_native34.View, { style: [styles30.outer, { borderColor }], children: checked && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_native34.View, { style: [styles30.inner, { backgroundColor: colors2.colorInteractive }] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Label, { label })
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_native34.View, { style: [styles30.outer, { borderColor }], children: checked && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_native34.View, { style: [styles30.inner, { backgroundColor: colors2.colorInteractive }] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Label, { label })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/RadioGroup/RadioGroup.tsx
 var import_react_native35 = require("react-native");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var styles31 = import_react_native35.StyleSheet.create({
   container: {
     gap: import_native.spacing.xs
@@ -2573,20 +2616,20 @@ function RadioGroup({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     import_react_native35.View,
     {
       style: [styles31.container, disabled && { opacity: 0.4 }, style],
       accessibilityRole: "radiogroup",
       accessibilityLabel: legend,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react_native35.Text, { style: [styles31.legend, { color: colors2.colorOnBg }], children: [
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(ScaledText, { style: [styles31.legend, { color: colors2.colorOnBg }], children: [
           legend,
-          required && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_native35.Text, { style: [styles31.required, { color: colors2.colorOnBgSubtle }], children: " *" })
+          required && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ScaledText, { style: [styles31.required, { color: colors2.colorOnBgSubtle }], children: " *" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_native35.View, { style: styles31.items, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Message, { type: "error", message: error }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Message, { type: "hint", message: hint })
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native35.View, { style: styles31.items, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Message, { type: "error", message: error }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Message, { type: "hint", message: hint })
       ]
     }
   );
@@ -2594,7 +2637,7 @@ function RadioGroup({
 
 // src/components/interaction/form/FileInput/FileInput.tsx
 var import_react_native36 = require("react-native");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var styles32 = import_react_native36.StyleSheet.create({
   container: {
     gap: import_native.spacing.xxs
@@ -2650,14 +2693,14 @@ function FileInput({
 }) {
   const { colors: colors2 } = useTheme();
   const borderColor = error ? colors2.colorError : colors2.colorBgSubtle;
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react_native36.View, { style: [styles32.container, style], testID: name, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react_native36.View, { style: [styles32.container, style], testID: name, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
       Label,
       {
         label: required ? `${label} *` : label
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
       import_react_native36.Pressable,
       {
         onPress: () => !disabled && onSelect?.(),
@@ -2675,27 +2718,27 @@ function FileInput({
           disabled && { opacity: 0.4 }
         ],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native36.Text, { style: [styles32.icon, { color: colors2.colorInteractive }], children: "\u2191" }),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native36.Text, { style: [styles32.prompt, { color: colors2.colorOnBgSubtle }], children: fileNames.length > 0 ? "Selected files:" : "Tap to select file" }),
-          fileNames.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native36.View, { style: styles32.fileList, children: fileNames.map((fileName) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native36.Text, { style: [styles32.fileName, { color: colors2.colorOnBg }], children: fileName }, fileName)) }),
-          accept && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react_native36.Text, { style: [styles32.acceptHint, { color: colors2.colorOnBgSubtle }], children: accept })
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ScaledText, { style: [styles32.icon, { color: colors2.colorInteractive }], children: "\u2191" }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ScaledText, { style: [styles32.prompt, { color: colors2.colorOnBgSubtle }], children: fileNames.length > 0 ? "Selected files:" : "Tap to select file" }),
+          fileNames.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react_native36.View, { style: styles32.fileList, children: fileNames.map((fileName) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ScaledText, { style: [styles32.fileName, { color: colors2.colorOnBg }], children: fileName }, fileName)) }),
+          accept && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ScaledText, { style: [styles32.acceptHint, { color: colors2.colorOnBgSubtle }], children: accept })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/Combobox/Combobox.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 var import_react_native37 = require("react-native");
 
 // src/components/interaction/form/atoms/inputHelpers.ts
 var OPTICAL_TEXT_SHIFT = -1.5;
 
 // src/components/interaction/form/Combobox/Combobox.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var INPUT_HEIGHT = 44;
 var MAX_DROPDOWN_HEIGHT = 200;
 var styles33 = import_react_native37.StyleSheet.create({
@@ -2766,13 +2809,13 @@ function Combobox({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const selectedOption = (0, import_react9.useMemo)(
+  const selectedOption = (0, import_react10.useMemo)(
     () => options.find((o) => o.value === value),
     [options, value]
   );
-  const [inputValue, setInputValue] = (0, import_react9.useState)(selectedOption?.label ?? "");
-  const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
-  const filtered = (0, import_react9.useMemo)(
+  const [inputValue, setInputValue] = (0, import_react10.useState)(selectedOption?.label ?? "");
+  const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
+  const filtered = (0, import_react10.useMemo)(
     () => options.filter(
       (o) => o.label.toLowerCase().includes(inputValue.toLowerCase())
     ),
@@ -2794,9 +2837,9 @@ function Combobox({
     setTimeout(() => setIsOpen(false), 150);
   };
   const borderColor = error ? colors2.colorError : colors2.colorOnBg;
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react_native37.View, { style: [styles33.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Label, { label }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_react_native37.View, { style: [styles33.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Label, { label }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
       import_react_native37.View,
       {
         style: [
@@ -2808,8 +2851,8 @@ function Combobox({
           disabled && { opacity: 0.4 }
         ],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-            import_react_native37.TextInput,
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+            ScaledTextInput,
             {
               value: inputValue,
               onChangeText: handleChangeText,
@@ -2827,7 +2870,7 @@ function Combobox({
               ]
             }
           ),
-          isOpen && filtered.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+          isOpen && filtered.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
             import_react_native37.ScrollView,
             {
               style: [
@@ -2842,7 +2885,7 @@ function Combobox({
               children: filtered.map((option) => {
                 const isSelected = option.value === value;
                 const isDisabled = option.disabled;
-                return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
                   import_react_native37.Pressable,
                   {
                     onPress: () => !isDisabled && selectOption(option),
@@ -2856,8 +2899,8 @@ function Combobox({
                       pressed && !isDisabled && { backgroundColor: colors2.colorBgSubtle },
                       isDisabled && { opacity: 0.4 }
                     ],
-                    children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-                      import_react_native37.Text,
+                    children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+                      ScaledText,
                       {
                         style: [
                           styles33.optionText,
@@ -2878,20 +2921,21 @@ function Combobox({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_react_native38 = require("react-native");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var TRACK_PADDING = import_native.spacing.xxxs;
 var sizeTokens2 = {
   small: { minHeight: 32, fontSize: import_native.font.size.bodyS, px: import_native.spacing.s, py: import_native.spacing.xxs },
   medium: { minHeight: 44, fontSize: import_native.font.size.body, px: import_native.spacing.m, py: import_native.spacing.xs },
-  large: { minHeight: 48, fontSize: import_native.font.size.body, px: import_native.spacing.m, py: import_native.spacing.s }
+  large: { minHeight: 48, fontSize: import_native.font.size.body, px: import_native.spacing.m, py: import_native.spacing.s },
+  xlarge: { minHeight: 56, fontSize: import_native.font.size.body, px: import_native.spacing.m, py: import_native.spacing.s }
 };
 var thumbShadow = {
   shadowColor: "#000",
@@ -2932,10 +2976,10 @@ function SegmentedControl({
 }) {
   const { colors: colors2 } = useTheme();
   const { minHeight, fontSize, px, py } = sizeTokens2[size];
-  const items = import_react10.Children.toArray(children);
+  const items = import_react11.Children.toArray(children);
   const trackBg = colors2.colorBgSubtle;
   const thumbBg = variant === "outline" ? colors2.colorBg : colors2.colorInteractive;
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     import_react_native38.View,
     {
       style: [styles34.track, { backgroundColor: trackBg }, style],
@@ -2951,7 +2995,7 @@ function SegmentedControl({
           paddingVertical: py,
           ...isActive ? { backgroundColor: thumbBg, ...thumbShadow } : { backgroundColor: "transparent" }
         };
-        return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           import_react_native38.Pressable,
           {
             onPress: () => !disabled && onValueChange?.(index),
@@ -2965,7 +3009,16 @@ function SegmentedControl({
               pressed && !disabled && { opacity: 0.7 },
               disabled && { opacity: 0.4 }
             ],
-            children: label !== null ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_react_native38.Text, { style: [styles34.label, { fontSize, color: labelColor }], children: label }) : child
+            children: label !== null ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+              ScaledText,
+              {
+                style: [styles34.label, { fontSize, color: labelColor }],
+                numberOfLines: 1,
+                adjustsFontSizeToFit: true,
+                minimumFontScale: 0.5,
+                children: label
+              }
+            ) : child
           },
           index
         );
@@ -2975,9 +3028,9 @@ function SegmentedControl({
 }
 
 // src/components/interaction/form/FormInput/FormInput.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_react_native39 = require("react-native");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var INPUT_HEIGHT2 = 44;
 var keyboardTypeMap = {
   text: "default",
@@ -2993,11 +3046,11 @@ var styles35 = import_react_native39.StyleSheet.create({
     gap: import_native.spacing.xxs
   },
   /**
-   * The wrapper draws the pill border and provides the fixed 44pt touch-target height.
+   * The wrapper draws the pill border and provides at least 44pt touch-target height.
    * justifyContent: 'center' vertically centers the inner TextInput on both iOS and Android.
    */
   inputWrapper: {
-    height: INPUT_HEIGHT2,
+    minHeight: INPUT_HEIGHT2,
     justifyContent: "center",
     borderWidth: 1,
     borderRadius: import_native.border.radius.full
@@ -3034,11 +3087,11 @@ function FormInput({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [focused, setFocused] = (0, import_react11.useState)(false);
+  const [focused, setFocused] = (0, import_react12.useState)(false);
   const borderColor = error ? colors2.colorError : focused ? colors2.colorInteractive : colors2.colorOnBg;
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_react_native39.View, { style: [styles35.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Label, { label }),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_react_native39.View, { style: [styles35.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Label, { label }),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
       import_react_native39.View,
       {
         style: [
@@ -3049,8 +3102,8 @@ function FormInput({
           },
           disabled && { opacity: 0.4 }
         ],
-        children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-          import_react_native39.TextInput,
+        children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+          ScaledTextInput,
           {
             accessibilityLabel: typeof label === "string" ? label : name,
             accessibilityState: { disabled },
@@ -3081,15 +3134,15 @@ function FormInput({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/Textarea/Textarea.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 var import_react_native40 = require("react-native");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var styles36 = import_react_native40.StyleSheet.create({
   container: {
     gap: import_native.spacing.xxs
@@ -3122,12 +3175,12 @@ function Textarea({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [focused, setFocused] = (0, import_react12.useState)(false);
+  const [focused, setFocused] = (0, import_react13.useState)(false);
   const borderColor = error ? colors2.colorError : focused ? colors2.colorInteractive : colors2.colorOnBg;
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_react_native40.View, { style: [styles36.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Label, { label }),
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
-      import_react_native40.TextInput,
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react_native40.View, { style: [styles36.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Label, { label }),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+      ScaledTextInput,
       {
         accessibilityLabel: typeof label === "string" ? label : name,
         accessibilityState: { disabled },
@@ -3159,15 +3212,15 @@ function Textarea({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/Select/Select.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_react_native41 = require("react-native");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var styles37 = import_react_native41.StyleSheet.create({
   container: {
     gap: import_native.spacing.xxs
@@ -3247,7 +3300,7 @@ function Select({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [open, setOpen] = (0, import_react13.useState)(false);
+  const [open, setOpen] = (0, import_react14.useState)(false);
   const selectedOption = options.find((o) => o.value === value);
   const displayText = selectedOption?.label ?? placeholder;
   const isPlaceholder = !selectedOption;
@@ -3256,9 +3309,9 @@ function Select({
     onChange?.(optionValue);
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react_native41.View, { style: [styles37.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Label, { label }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react_native41.View, { style: [styles37.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Label, { label }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
       import_react_native41.Pressable,
       {
         accessibilityRole: "button",
@@ -3276,8 +3329,8 @@ function Select({
           disabled && { opacity: 0.4 }
         ],
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-            import_react_native41.Text,
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            ScaledText,
             {
               style: [
                 styles37.triggerText,
@@ -3288,52 +3341,52 @@ function Select({
               children: displayText
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_native41.Text, { style: [styles37.chevron, { color: colors2.colorOnBgSubtle }], "aria-hidden": true, children: "\u25BE" })
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ScaledText, { style: [styles37.chevron, { color: colors2.colorOnBgSubtle }], "aria-hidden": true, children: "\u25BE" })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
       import_react_native41.Modal,
       {
         visible: open,
         transparent: true,
         animationType: "slide",
         onRequestClose: () => setOpen(false),
-        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           import_react_native41.Pressable,
           {
             style: styles37.overlay,
             onPress: () => setOpen(false),
             accessibilityRole: "button",
             accessibilityLabel: "Close options",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
               import_react_native41.Pressable,
               {
                 style: [styles37.sheet, { backgroundColor: colors2.colorBg }],
                 onPress: () => {
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react_native41.SafeAreaView, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react_native41.View, { style: styles37.sheetHeader, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_native41.Text, { style: [styles37.sheetTitle, { color: colors2.colorOnBg }], children: typeof label === "string" ? label : "Select" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react_native41.SafeAreaView, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react_native41.View, { style: styles37.sheetHeader, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ScaledText, { style: [styles37.sheetTitle, { color: colors2.colorOnBg }], children: typeof label === "string" ? label : "Select" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                       import_react_native41.Pressable,
                       {
                         accessibilityRole: "button",
                         accessibilityLabel: "Close",
                         onPress: () => setOpen(false),
                         hitSlop: 8,
-                        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_native41.Text, { style: [styles37.closeText, { color: colors2.colorInteractive }], children: "Done" })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ScaledText, { style: [styles37.closeText, { color: colors2.colorInteractive }], children: "Done" })
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                     import_react_native41.FlatList,
                     {
                       data: options,
                       keyExtractor: (item) => item.value,
                       renderItem: ({ item }) => {
                         const isSelected = item.value === value;
-                        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+                        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                           import_react_native41.Pressable,
                           {
                             accessibilityRole: "button",
@@ -3350,8 +3403,8 @@ function Select({
                               pressed && { opacity: 0.7 },
                               item.disabled && { opacity: 0.4 }
                             ],
-                            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-                              import_react_native41.Text,
+                            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                              ScaledText,
                               {
                                 style: [
                                   styles37.optionText,
@@ -3375,15 +3428,15 @@ function Select({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/form/Slider/Slider.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_react_native42 = require("react-native");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var TRACK_HEIGHT = 6;
 var THUMB_SIZE = 24;
 var styles38 = import_react_native42.StyleSheet.create({
@@ -3449,8 +3502,8 @@ function Slider({
 }) {
   const { colors: colors2 } = useTheme();
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = (0, import_react14.useState)(defaultValue ?? min);
-  const [trackWidth, setTrackWidth] = (0, import_react14.useState)(0);
+  const [internalValue, setInternalValue] = (0, import_react15.useState)(defaultValue ?? min);
+  const [trackWidth, setTrackWidth] = (0, import_react15.useState)(0);
   const currentValue = isControlled ? value : internalValue;
   const fillPct = max > min ? (currentValue - min) / (max - min) * 100 : 0;
   const updateValue = (v) => {
@@ -3480,7 +3533,7 @@ function Slider({
       updateValue(valueFromTouch(e.nativeEvent.pageX, pageX));
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
     import_react_native42.View,
     {
       style: [styles38.container, style],
@@ -3489,11 +3542,11 @@ function Slider({
       accessibilityValue: { min, max, now: currentValue, text: String(currentValue) },
       accessibilityState: { disabled },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react_native42.View, { style: styles38.labelRow, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Label, { label }),
-          showValue && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_native42.Text, { style: [styles38.valueText, { color: colors2.colorOnBg }], children: currentValue })
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_react_native42.View, { style: styles38.labelRow, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Label, { label }),
+          showValue && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ScaledText, { style: [styles38.valueText, { color: colors2.colorOnBg }], children: currentValue })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
           import_react_native42.View,
           {
             style: [styles38.trackContainer, disabled && { opacity: 0.4 }],
@@ -3503,7 +3556,7 @@ function Slider({
             onResponderGrant: handleResponderGrant,
             onResponderMove: handleResponderMove,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_native42.View, { style: [styles38.track, { backgroundColor: colors2.colorBgSubtle }], children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react_native42.View, { style: [styles38.track, { backgroundColor: colors2.colorBgSubtle }], children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 import_react_native42.View,
                 {
                   style: [
@@ -3515,7 +3568,7 @@ function Slider({
                   ]
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 import_react_native42.View,
                 {
                   style: [
@@ -3532,17 +3585,17 @@ function Slider({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { type: "error", message: error }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { type: "hint", message: hint })
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Message, { type: "error", message: error }),
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Message, { type: "hint", message: hint })
       ]
     }
   );
 }
 
 // src/components/interaction/form/NumberInput/NumberInput.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var import_react_native43 = require("react-native");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var STEPPER_SIZE = 44;
 var styles39 = import_react_native43.StyleSheet.create({
   container: {
@@ -3619,7 +3672,7 @@ function NumberInput({
 }) {
   const { colors: colors2 } = useTheme();
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = (0, import_react15.useState)(defaultValue ?? 0);
+  const [internalValue, setInternalValue] = (0, import_react16.useState)(defaultValue ?? 0);
   const currentValue = isControlled ? value : internalValue;
   const clamp = (v) => {
     const withMin = min !== void 0 ? Math.max(min, v) : v;
@@ -3633,10 +3686,10 @@ function NumberInput({
   const canDecrease = min === void 0 || currentValue > min;
   const canIncrease = max === void 0 || currentValue < max;
   const borderColor = error ? colors2.colorError : colors2.colorOnBg;
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_react_native43.View, { style: [styles39.container, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Label, { label }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_react_native43.View, { style: [styles39.inputRow, disabled && { opacity: 0.4 }], children: [
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_react_native43.View, { style: [styles39.container, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Label, { label }),
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_react_native43.View, { style: [styles39.inputRow, disabled && { opacity: 0.4 }], children: [
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
         import_react_native43.Pressable,
         {
           accessibilityRole: "button",
@@ -3654,8 +3707,8 @@ function NumberInput({
             pressed && { opacity: 0.7 },
             (disabled || !canDecrease) && { opacity: 0.4 }
           ],
-          children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
-            import_react_native43.Text,
+          children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+            ScaledText,
             {
               style: [styles39.stepperText, { color: colors2.colorOnBg }],
               "aria-hidden": true,
@@ -3664,7 +3717,7 @@ function NumberInput({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
         import_react_native43.View,
         {
           style: [
@@ -3674,8 +3727,8 @@ function NumberInput({
               backgroundColor: colors2.colorBg
             }
           ],
-          children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
-            import_react_native43.TextInput,
+          children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+            ScaledTextInput,
             {
               accessibilityLabel: label,
               accessibilityState: { disabled },
@@ -3701,7 +3754,7 @@ function NumberInput({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
         import_react_native43.Pressable,
         {
           accessibilityRole: "button",
@@ -3719,8 +3772,8 @@ function NumberInput({
             pressed && { opacity: 0.7 },
             (disabled || !canIncrease) && { opacity: 0.4 }
           ],
-          children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
-            import_react_native43.Text,
+          children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+            ScaledText,
             {
               style: [styles39.stepperText, { color: colors2.colorOnBg }],
               "aria-hidden": true,
@@ -3730,14 +3783,14 @@ function NumberInput({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Message, { type: "error", message: error }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Message, { type: "hint", message: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Message, { type: "error", message: error }),
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Message, { type: "hint", message: hint })
   ] });
 }
 
 // src/components/interaction/Dialog/Dialog.tsx
 var import_react_native44 = require("react-native");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var styles40 = import_react_native44.StyleSheet.create({
   overlay: {
     flex: 1,
@@ -3794,15 +3847,15 @@ function Dialog({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     import_react_native44.Modal,
     {
       visible: isOpen,
       transparent: true,
       animationType: "fade",
       onRequestClose: onClose,
-      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_react_native44.View, { style: styles40.overlay, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_react_native44.View, { style: styles40.overlay, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
           import_react_native44.Pressable,
           {
             testID: "bds-dialog-backdrop",
@@ -3812,14 +3865,14 @@ function Dialog({
             importantForAccessibility: "no"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
           import_react_native44.View,
           {
             style: [styles40.panel, { backgroundColor: colors2.colorGreySubtle }, style],
             accessibilityViewIsModal: true,
             onAccessibilityEscape: onClose,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
                 import_react_native44.Pressable,
                 {
                   style: styles40.closeButton,
@@ -3827,8 +3880,8 @@ function Dialog({
                   accessibilityRole: "button",
                   accessibilityLabel: "Close dialog",
                   hitSlop: 8,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-                    import_react_native44.Text,
+                  children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+                    ScaledText,
                     {
                       style: [styles40.closeText, { color: colors2.colorOnBgSubtle }],
                       "aria-hidden": true,
@@ -3837,7 +3890,7 @@ function Dialog({
                   )
                 }
               ),
-              !!title && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react_native44.View, { style: styles40.header, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react_native44.Text, { style: [styles40.title, { color: colors2.colorOnGreySubtle }], children: title }) }),
+              !!title && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_native44.View, { style: styles40.header, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ScaledText, { style: [styles40.title, { color: colors2.colorOnGreySubtle }], children: title }) }),
               children
             ]
           }
@@ -3848,9 +3901,9 @@ function Dialog({
 }
 
 // src/components/interaction/SideSheet/SideSheet.tsx
-var import_react16 = require("react");
+var import_react17 = require("react");
 var import_react_native45 = require("react-native");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var styles41 = import_react_native45.StyleSheet.create({
   overlay: {
     flex: 1,
@@ -3909,9 +3962,9 @@ function SideSheet({
 }) {
   const { colors: colors2 } = useTheme();
   const screenHeight = import_react_native45.Dimensions.get("window").height;
-  const slideAnim = (0, import_react16.useRef)(new import_react_native45.Animated.Value(screenHeight)).current;
-  const backdropAnim = (0, import_react16.useRef)(new import_react_native45.Animated.Value(0)).current;
-  (0, import_react16.useEffect)(() => {
+  const slideAnim = (0, import_react17.useRef)(new import_react_native45.Animated.Value(screenHeight)).current;
+  const backdropAnim = (0, import_react17.useRef)(new import_react_native45.Animated.Value(0)).current;
+  (0, import_react17.useEffect)(() => {
     if (isOpen) {
       import_react_native45.Animated.parallel([
         import_react_native45.Animated.timing(slideAnim, {
@@ -3940,22 +3993,22 @@ function SideSheet({
       ]).start();
     }
   }, [isOpen, slideAnim, backdropAnim, screenHeight]);
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
     import_react_native45.Modal,
     {
       visible: isOpen,
       transparent: true,
       animationType: "none",
       onRequestClose: onClose,
-      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_react_native45.View, { style: styles41.overlay, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_react_native45.View, { style: styles41.overlay, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
           import_react_native45.Animated.View,
           {
             style: [
               import_react_native45.StyleSheet.absoluteFill,
               { backgroundColor: "rgba(0, 0, 0, 0.5)", opacity: backdropAnim }
             ],
-            children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
               import_react_native45.Pressable,
               {
                 style: import_react_native45.StyleSheet.absoluteFill,
@@ -3967,7 +4020,7 @@ function SideSheet({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
           import_react_native45.Animated.View,
           {
             style: [
@@ -3981,13 +4034,13 @@ function SideSheet({
             accessibilityViewIsModal: true,
             onAccessibilityEscape: onClose,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
                 import_react_native45.View,
                 {
                   style: [styles41.header, { borderBottomColor: colors2.colorBgSubtle }],
                   children: [
-                    !!title && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_native45.Text, { style: [styles41.title, { color: colors2.colorOnBg }], children: title }),
-                    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+                    !!title && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ScaledText, { style: [styles41.title, { color: colors2.colorOnBg }], children: title }),
+                    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
                       import_react_native45.Pressable,
                       {
                         style: styles41.closeButton,
@@ -3995,8 +4048,8 @@ function SideSheet({
                         accessibilityRole: "button",
                         accessibilityLabel: "Close side sheet",
                         hitSlop: 8,
-                        children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
-                          import_react_native45.Text,
+                        children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                          ScaledText,
                           {
                             style: [styles41.closeText, { color: colors2.colorOnBgSubtle }],
                             "aria-hidden": true,
@@ -4008,7 +4061,7 @@ function SideSheet({
                   ]
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_native45.View, { style: styles41.body, testID: "bds-sidesheet-body", children })
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_native45.View, { style: styles41.body, testID: "bds-sidesheet-body", children })
             ]
           }
         )
@@ -4018,10 +4071,10 @@ function SideSheet({
 }
 
 // src/components/interaction/Toast/Toast.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_react_native46 = require("react-native");
-var import_jsx_runtime46 = require("react/jsx-runtime");
-var ToastContext = (0, import_react17.createContext)(void 0);
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var ToastContext = (0, import_react18.createContext)(void 0);
 var styles42 = import_react_native46.StyleSheet.create({
   container: {
     position: "absolute",
@@ -4067,9 +4120,9 @@ function ToastItem({
   onRemove
 }) {
   const { colors: colors2 } = useTheme();
-  const slideAnim = (0, import_react17.useRef)(new import_react_native46.Animated.Value(-100)).current;
-  const opacityAnim = (0, import_react17.useRef)(new import_react_native46.Animated.Value(0)).current;
-  const variantColors = (0, import_react17.useMemo)(
+  const slideAnim = (0, import_react18.useRef)(new import_react_native46.Animated.Value(-100)).current;
+  const opacityAnim = (0, import_react18.useRef)(new import_react_native46.Animated.Value(0)).current;
+  const variantColors = (0, import_react18.useMemo)(
     () => ({
       success: { bg: colors2.colorSuccess, text: colors2.colorOnSuccess },
       error: { bg: colors2.colorError, text: colors2.colorOnError },
@@ -4077,7 +4130,7 @@ function ToastItem({
     }),
     [colors2]
   );
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     import_react_native46.Animated.parallel([
       import_react_native46.Animated.timing(slideAnim, {
         toValue: 0,
@@ -4091,12 +4144,12 @@ function ToastItem({
       })
     ]).start();
   }, [slideAnim, opacityAnim]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const timer = setTimeout(onRemove, 5e3);
     return () => clearTimeout(timer);
   }, [onRemove]);
   const { bg, text } = variantColors[toast.variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
     import_react_native46.Animated.View,
     {
       style: [
@@ -4110,8 +4163,8 @@ function ToastItem({
       accessibilityRole: "alert",
       accessibilityLiveRegion: "polite",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_native46.Text, { style: [styles42.message, { color: text }], children: toast.message }),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ScaledText, { style: [styles42.message, { color: text }], children: toast.message }),
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
           import_react_native46.Pressable,
           {
             style: styles42.closeButton,
@@ -4119,7 +4172,7 @@ function ToastItem({
             accessibilityRole: "button",
             accessibilityLabel: "Dismiss",
             hitSlop: 8,
-            children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_native46.Text, { style: [styles42.closeText, { color: text }], "aria-hidden": true, children: "\u2715" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ScaledText, { style: [styles42.closeText, { color: text }], "aria-hidden": true, children: "\u2715" })
           }
         )
       ]
@@ -4130,24 +4183,24 @@ function ToastProvider({
   children,
   style
 }) {
-  const [toasts, setToasts] = (0, import_react17.useState)([]);
-  const showToast = (0, import_react17.useCallback)((message, variant) => {
+  const [toasts, setToasts] = (0, import_react18.useState)([]);
+  const showToast = (0, import_react18.useCallback)((message, variant) => {
     const id = Math.random().toString(36).substring(2, 9);
     setToasts((prev) => [...prev, { id, message, variant }]);
   }, []);
-  const removeToast = (0, import_react17.useCallback)((id) => {
+  const removeToast = (0, import_react18.useCallback)((id) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
   }, []);
-  const value = (0, import_react17.useMemo)(() => ({ showToast }), [showToast]);
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ToastContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_react_native46.View, { style: [{ flex: 1 }, style], children: [
+  const value = (0, import_react18.useMemo)(() => ({ showToast }), [showToast]);
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ToastContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_native46.View, { style: [{ flex: 1 }, style], children: [
     children,
-    toasts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    toasts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       import_react_native46.View,
       {
         style: styles42.container,
         accessibilityRole: "summary",
         accessibilityLabel: "Notifications",
-        children: toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+        children: toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
           ToastItem,
           {
             toast,
@@ -4160,7 +4213,7 @@ function ToastProvider({
   ] }) });
 }
 function useToast() {
-  const context = (0, import_react17.useContext)(ToastContext);
+  const context = (0, import_react18.useContext)(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }
@@ -4168,9 +4221,9 @@ function useToast() {
 }
 
 // src/components/interaction/DropdownMenu/DropdownMenu.tsx
-var import_react18 = __toESM(require("react"), 1);
+var import_react19 = __toESM(require("react"), 1);
 var import_react_native47 = require("react-native");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var styles43 = import_react_native47.StyleSheet.create({
   overlay: {
     flex: 1,
@@ -4228,11 +4281,11 @@ function DropdownMenu({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [open, setOpen] = (0, import_react18.useState)(false);
+  const [open, setOpen] = (0, import_react19.useState)(false);
   const screenHeight = import_react_native47.Dimensions.get("window").height;
-  const slideAnim = (0, import_react18.useRef)(new import_react_native47.Animated.Value(screenHeight)).current;
-  const backdropAnim = (0, import_react18.useRef)(new import_react_native47.Animated.Value(0)).current;
-  (0, import_react18.useEffect)(() => {
+  const slideAnim = (0, import_react19.useRef)(new import_react_native47.Animated.Value(screenHeight)).current;
+  const backdropAnim = (0, import_react19.useRef)(new import_react_native47.Animated.Value(0)).current;
+  (0, import_react19.useEffect)(() => {
     if (open) {
       import_react_native47.Animated.parallel([
         import_react_native47.Animated.timing(slideAnim, {
@@ -4265,28 +4318,28 @@ function DropdownMenu({
     item.onPress?.();
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_native47.View, { style, children: [
-    import_react18.default.cloneElement(trigger, {
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_react_native47.View, { style, children: [
+    import_react19.default.cloneElement(trigger, {
       onPress: () => setOpen(true),
       accessibilityRole: "button",
       accessibilityLabel: title
     }),
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       import_react_native47.Modal,
       {
         visible: open,
         transparent: true,
         animationType: "none",
         onRequestClose: () => setOpen(false),
-        children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_native47.View, { style: styles43.overlay, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_react_native47.View, { style: styles43.overlay, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
             import_react_native47.Animated.View,
             {
               style: [
                 import_react_native47.StyleSheet.absoluteFill,
                 { backgroundColor: "rgba(0, 0, 0, 0.5)", opacity: backdropAnim }
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                 import_react_native47.Pressable,
                 {
                   style: import_react_native47.StyleSheet.absoluteFill,
@@ -4298,7 +4351,7 @@ function DropdownMenu({
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
             import_react_native47.Animated.View,
             {
               style: [
@@ -4310,8 +4363,8 @@ function DropdownMenu({
               ],
               accessibilityViewIsModal: true,
               onAccessibilityEscape: () => setOpen(false),
-              children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_native47.SafeAreaView, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_react_native47.SafeAreaView, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
                   import_react_native47.View,
                   {
                     style: [
@@ -4319,16 +4372,16 @@ function DropdownMenu({
                       { borderBottomColor: colors2.colorBgSubtle }
                     ],
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_native47.Text, { style: [styles43.sheetTitle, { color: colors2.colorOnBg }], children: title }),
-                      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ScaledText, { style: [styles43.sheetTitle, { color: colors2.colorOnBg }], children: title }),
+                      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                         import_react_native47.Pressable,
                         {
                           accessibilityRole: "button",
                           accessibilityLabel: "Close",
                           onPress: () => setOpen(false),
                           hitSlop: 8,
-                          children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-                            import_react_native47.Text,
+                          children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+                            ScaledText,
                             {
                               style: [
                                 styles43.closeText,
@@ -4342,13 +4395,13 @@ function DropdownMenu({
                     ]
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                   import_react_native47.FlatList,
                   {
                     data: items,
                     keyExtractor: (item) => item.id,
-                    renderItem: ({ item }) => /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
-                      item.separator && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                    renderItem: ({ item }) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
+                      item.separator && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                         import_react_native47.View,
                         {
                           style: [
@@ -4358,7 +4411,7 @@ function DropdownMenu({
                           accessibilityRole: "none"
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+                      /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
                         import_react_native47.Pressable,
                         {
                           accessibilityRole: "menuitem",
@@ -4372,7 +4425,7 @@ function DropdownMenu({
                             item.disabled && { opacity: 0.4 }
                           ],
                           children: [
-                            !!item.icon && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                            !!item.icon && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                               import_react_native47.View,
                               {
                                 importantForAccessibility: "no-hide-descendants",
@@ -4380,8 +4433,8 @@ function DropdownMenu({
                                 children: item.icon
                               }
                             ),
-                            /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-                              import_react_native47.Text,
+                            /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+                              ScaledText,
                               {
                                 style: [
                                   styles43.itemText,
@@ -4406,9 +4459,9 @@ function DropdownMenu({
 }
 
 // src/components/interaction/Popover/Popover.tsx
-var import_react19 = __toESM(require("react"), 1);
+var import_react20 = __toESM(require("react"), 1);
 var import_react_native48 = require("react-native");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var styles44 = import_react_native48.StyleSheet.create({
   wrapper: {
     alignSelf: "flex-start"
@@ -4439,23 +4492,23 @@ function Popover({
   style
 }) {
   const { colors: colors2 } = useTheme();
-  const [isOpen, setIsOpen] = (0, import_react19.useState)(false);
+  const [isOpen, setIsOpen] = (0, import_react20.useState)(false);
   const close = () => setIsOpen(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_react_native48.View, { style: [styles44.wrapper, style], children: [
-    import_react19.default.cloneElement(children, {
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_react_native48.View, { style: [styles44.wrapper, style], children: [
+    import_react20.default.cloneElement(children, {
       onPress: () => setIsOpen(true),
       accessibilityRole: "button",
       accessibilityLabel: accessibilityLabel ?? "Open popover"
     }),
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       import_react_native48.Modal,
       {
         visible: isOpen,
         transparent: true,
         animationType: "fade",
         onRequestClose: close,
-        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_react_native48.View, { style: styles44.overlay, onAccessibilityEscape: close, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_react_native48.View, { style: styles44.overlay, onAccessibilityEscape: close, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
             import_react_native48.Pressable,
             {
               testID: "bds-popover-backdrop",
@@ -4466,7 +4519,7 @@ function Popover({
               accessibilityLabel: "Close popover"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
             import_react_native48.View,
             {
               style: [styles44.panel, { backgroundColor: colors2.colorBg }],