@retray-dev/ui-kit 12.1.0 → 12.2.0

package/dist/Skeleton.js

@@ -92,6 +92,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -104,6 +105,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,
@@ -159,12 +161,13 @@ function Skeleton({
   borderRadius = 6,
   preset = "base",
   diameter = 40,
+  backgroundColor,
   style
 }) {
   const { colors, colorScheme } = useTheme();
   const shimmer = Animated.useSharedValue(0);
   const [containerWidth, setContainerWidth] = React2.useState(300);
-  const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(255,255,255,0.7)";
+  const shimmerHighlight = colorScheme === "dark" ? "rgba(255,255,255,0.08)" : "rgba(0,0,0,0.07)";
   React2.useEffect(() => {
     shimmer.value = Animated.withRepeat(
       Animated.withTiming(1, { duration: TIMINGS.shimmer.duration, easing: Animated.Easing.linear }),
@@ -183,7 +186,7 @@ function Skeleton({
     {
       style: [
         styles.base,
-        { width: resolvedWidth, height: resolvedHeight, borderRadius: resolvedRadius, backgroundColor: colors.surface },
+        { width: resolvedWidth, height: resolvedHeight, borderRadius: resolvedRadius, backgroundColor: backgroundColor ?? colors.skeleton },
         style
       ],
       onLayout: (e) => setContainerWidth(e.nativeEvent.layout.width),

package/dist/Skeleton.mjs

@@ -1,6 +1,6 @@
-export { Skeleton } from './chunk-BOVUP27T.mjs';
+export { Skeleton } from './chunk-QDAZGZUF.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Slider.js

@@ -150,6 +150,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -162,6 +163,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Slider.mjs

@@ -1,5 +1,5 @@
-export { Slider } from './chunk-4WFMPFZB.mjs';
+export { Slider } from './chunk-RJNLAH76.mjs';
 import './chunk-EJ7ZPXOH.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Spinner.js

@@ -89,6 +89,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -101,6 +102,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Spinner.mjs

@@ -1,4 +1,4 @@
-export { Spinner } from './chunk-BCWEHE34.mjs';
-import './chunk-EMUWGDWC.mjs';
+export { Spinner } from './chunk-LIS6I5UP.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Stats.d.mts

@@ -2,6 +2,7 @@ import React from 'react';
 import { ViewStyle } from 'react-native';
 
 type StatsVariant = 'elevated' | 'outlined' | 'filled';
+type StatsSize = 'default' | 'compact';
 interface StatsProps {
     value: string;
     label: string;
@@ -10,6 +11,8 @@ interface StatsProps {
     iconName?: string;
     iconColor?: string;
     variant?: StatsVariant;
+    /** `'compact'` reduces everything proportionally for tight grids. */
+    size?: StatsSize;
     onPress?: () => void;
     style?: ViewStyle;
     accessibilityLabel?: string;
@@ -19,7 +22,7 @@ interface StatsGroupProps {
     gap?: number;
     style?: ViewStyle;
 }
-declare function StatsComponent({ value, label, description, icon, iconName, iconColor, variant, onPress, style, accessibilityLabel, }: StatsProps): React.JSX.Element;
+declare function StatsComponent({ value, label, description, icon, iconName, iconColor, variant, size, onPress, style, accessibilityLabel, }: StatsProps): React.JSX.Element;
 declare function StatsGroup({ children, gap, style }: StatsGroupProps): React.JSX.Element;
 declare const Stats: React.NamedExoticComponent<StatsProps> & {
     readonly type: typeof StatsComponent;

package/dist/Stats.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { ViewStyle } from 'react-native';
 
 type StatsVariant = 'elevated' | 'outlined' | 'filled';
+type StatsSize = 'default' | 'compact';
 interface StatsProps {
     value: string;
     label: string;
@@ -10,6 +11,8 @@ interface StatsProps {
     iconName?: string;
     iconColor?: string;
     variant?: StatsVariant;
+    /** `'compact'` reduces everything proportionally for tight grids. */
+    size?: StatsSize;
     onPress?: () => void;
     style?: ViewStyle;
     accessibilityLabel?: string;
@@ -19,7 +22,7 @@ interface StatsGroupProps {
     gap?: number;
     style?: ViewStyle;
 }
-declare function StatsComponent({ value, label, description, icon, iconName, iconColor, variant, onPress, style, accessibilityLabel, }: StatsProps): React.JSX.Element;
+declare function StatsComponent({ value, label, description, icon, iconName, iconColor, variant, size, onPress, style, accessibilityLabel, }: StatsProps): React.JSX.Element;
 declare function StatsGroup({ children, gap, style }: StatsGroupProps): React.JSX.Element;
 declare const Stats: React.NamedExoticComponent<StatsProps> & {
     readonly type: typeof StatsComponent;

package/dist/Stats.js

@@ -162,6 +162,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -174,6 +175,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,
@@ -301,6 +303,7 @@ function StatsComponent({
   iconName,
   iconColor,
   variant = "elevated",
+  size = "default",
   onPress,
   style,
   accessibilityLabel
@@ -319,6 +322,27 @@ function StatsComponent({
     onPress();
   };
   const isCompact = containerWidth > 0 && containerWidth < COMPACT_THRESHOLD && !!(icon ?? iconName);
+  const sizeStyles = size === "compact" ? {
+    valueFontFamily: "Sohne-SemiBold",
+    valueFontSize: ms(16),
+    valueLineHeight: mvs(20),
+    labelFontSize: ms(11),
+    labelLineHeight: mvs(14),
+    descriptionFontSize: ms(10),
+    descriptionLineHeight: mvs(14),
+    iconSize: ms(18),
+    padding: s(12)
+  } : {
+    valueFontFamily: "Sohne-Bold",
+    valueFontSize: ms(21),
+    valueLineHeight: mvs(25),
+    labelFontSize: ms(13),
+    labelLineHeight: mvs(18),
+    descriptionFontSize: ms(12),
+    descriptionLineHeight: mvs(16),
+    iconSize: ms(20),
+    padding: s(16)
+  };
   const variantStyle = {
     elevated: {
       backgroundColor: colors.card,
@@ -343,10 +367,10 @@ function StatsComponent({
     }
   }[variant];
   const iconColorResolved = iconColor ?? colors.primary;
-  const resolvedIcon = iconName ? renderIcon(iconName, ms(22), iconColorResolved) : icon;
+  const resolvedIcon = iconName ? renderIcon(iconName, sizeStyles.iconSize, iconColorResolved) : icon;
   const iconElement = resolvedIcon ? /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.iconWrapper }, resolvedIcon) : null;
-  const valueElement = /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.value, { color: colors.foreground }], allowFontScaling: true }, value);
-  const cardContent = /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: [styles.card, variantStyle, style], onLayout: handleLayout }, isCompact ? /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, iconElement, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.compactValue }, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted }], allowFontScaling: true }, description) : null) : /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.valueRow }, iconElement, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted }], allowFontScaling: true }, description) : null));
+  const valueElement = /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.value, { color: colors.foreground, fontFamily: sizeStyles.valueFontFamily, fontSize: sizeStyles.valueFontSize, lineHeight: sizeStyles.valueLineHeight }], allowFontScaling: true }, value);
+  const cardContent = /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: [styles.card, variantStyle, { padding: sizeStyles.padding }, style], onLayout: handleLayout }, isCompact ? /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, iconElement, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.compactValue }, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle, fontSize: sizeStyles.labelFontSize, lineHeight: sizeStyles.labelLineHeight }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted, fontSize: sizeStyles.descriptionFontSize, lineHeight: sizeStyles.descriptionLineHeight }], allowFontScaling: true }, description) : null) : /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: styles.valueRow }, iconElement, valueElement), /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.label, { color: colors.foregroundSubtle, fontSize: sizeStyles.labelFontSize, lineHeight: sizeStyles.labelLineHeight }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React3__default.default.createElement(reactNative.Text, { style: [styles.description, { color: colors.foregroundMuted, fontSize: sizeStyles.descriptionFontSize, lineHeight: sizeStyles.descriptionLineHeight }], allowFontScaling: true }, description) : null));
   if (onPress) {
     return /* @__PURE__ */ React3__default.default.createElement(
       PressableCard,

package/dist/Stats.mjs

@@ -1,9 +1,9 @@
-export { Stats } from './chunk-5OLNXP3S.mjs';
+export { Stats } from './chunk-4XOB5TTD.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-QY3X2UYR.mjs';
 import './chunk-KA7LTET3.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Switch.js

@@ -151,6 +151,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -163,6 +164,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Switch.mjs

@@ -1,6 +1,6 @@
-export { Switch } from './chunk-HLMPMUK2.mjs';
+export { Switch } from './chunk-RMRS44MQ.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/TabBar.js

@@ -107,6 +107,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -119,6 +120,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/TabBar.mjs

@@ -1,6 +1,6 @@
-export { TabBar } from './chunk-D3Y2T42P.mjs';
+export { TabBar } from './chunk-NJG7DHVF.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-KA7LTET3.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Tabs.js

@@ -151,6 +151,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -163,6 +164,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Tabs.mjs

@@ -1,7 +1,7 @@
-export { Tabs, TabsContent } from './chunk-3GEYJ7I5.mjs';
+export { Tabs, TabsContent } from './chunk-IVSRW4HS.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Text.js

@@ -90,6 +90,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -102,6 +103,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Text.mjs

@@ -1,5 +1,5 @@
-export { Text } from './chunk-357YO24D.mjs';
+export { Text } from './chunk-GUTDFUNF.mjs';
 import './chunk-QY3X2UYR.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Textarea.js

@@ -103,6 +103,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -115,6 +116,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Textarea.mjs

@@ -1,6 +1,6 @@
-export { Textarea } from './chunk-JNVAIDLK.mjs';
+export { Textarea } from './chunk-2BA3JMKK.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-KA7LTET3.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Toast.js

@@ -91,6 +91,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -103,6 +104,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Toast.mjs

@@ -1,4 +1,4 @@
-export { ToastProvider, sonnerToast as toast, useToast } from './chunk-QSFV2P7O.mjs';
-import './chunk-EMUWGDWC.mjs';
+export { ToastProvider, sonnerToast as toast, useToast } from './chunk-YMYIEVZP.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/Toggle.js

@@ -164,6 +164,7 @@ function deriveColors(t, scheme) {
   const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
   const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
   const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
+  const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
   const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
   const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
   const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
@@ -176,6 +177,7 @@ function deriveColors(t, scheme) {
     foregroundMuted,
     surface,
     surfaceStrong,
+    skeleton,
     destructiveTint,
     destructiveBorder,
     successTint,

package/dist/Toggle.mjs

@@ -1,8 +1,8 @@
-export { Toggle } from './chunk-FVTVCJAH.mjs';
+export { Toggle } from './chunk-UNNRUJTM.mjs';
 import './chunk-3DKJ2GIC.mjs';
 import './chunk-EJ7ZPXOH.mjs';
 import './chunk-DVK4G2GT.mjs';
 import './chunk-KA7LTET3.mjs';
-import './chunk-EMUWGDWC.mjs';
+import './chunk-YTXRIXNZ.mjs';
 import './chunk-2CE3TQVY.mjs';
 import './chunk-Y6FXYEAI.mjs';

package/dist/{chunk-JNVAIDLK.mjs → chunk-2BA3JMKK.mjs}

@@ -1,6 +1,6 @@
 import { TIMINGS, EASINGS } from './chunk-DVK4G2GT.mjs';
 import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-EMUWGDWC.mjs';
+import { useTheme } from './chunk-YTXRIXNZ.mjs';
 import { vs, ms, s } from './chunk-2CE3TQVY.mjs';
 import React, { useState, useEffect } from 'react';
 import { Platform, StyleSheet, View, Text, TextInput } from 'react-native';

package/dist/{chunk-X26S5EVZ.mjs → chunk-2HFD4IHU.mjs}

@@ -1,4 +1,4 @@
-import { Input } from './chunk-PGERH3P7.mjs';
+import { Input } from './chunk-DF7JA72E.mjs';
 import { ms, vs } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 

package/dist/{chunk-ZHMSAYLT.mjs → chunk-2LG326TT.mjs}

@@ -1,5 +1,5 @@
 import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-EMUWGDWC.mjs';
+import { useTheme } from './chunk-YTXRIXNZ.mjs';
 import { mvs, ms, s } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';