| ... | @@ -117,32 +117,46 @@ function ComposerSurface(props: { | ... | @@ -117,32 +117,46 @@ function ComposerSurface(props: { |
| 117 | readonly style: ViewStyle; | 117 | readonly style: ViewStyle; |
| 118 | readonly isDarkMode: boolean; | 118 | readonly isDarkMode: boolean; |
| 119 | }) { | 119 | }) { |
| | 120 | // Drop shadow lives on a wrapper: `overflow: "hidden"` on the surface itself |
| | 121 | // (needed to clip content to the pill shape) would clip the shadow on iOS. |
| | 122 | const shadowStyle: ViewStyle = { |
| | 123 | borderRadius: props.style.borderRadius, |
| | 124 | shadowColor: "#000000", |
| | 125 | shadowOpacity: props.isDarkMode ? 0.35 : 0.12, |
| | 126 | shadowRadius: 14, |
| | 127 | shadowOffset: { width: 0, height: 6 }, |
| | 128 | elevation: 10, |
| | 129 | }; |
| | 130 | |
| 120 | if (isLiquidGlassSupported) { | 131 | if (isLiquidGlassSupported) { |
| 121 | return ( | 132 | return ( |
| 122 | <LiquidGlassView | 133 | <View style={shadowStyle}> |
| 123 | effect="clear" | 134 | <LiquidGlassView |
| 124 | interactive | 135 | effect="regular" |
| 125 | tintColor={props.isDarkMode ? "rgba(44,44,46,0.5)" : "rgba(255,255,255,0.45)"} | 136 | interactive |
| 126 | colorScheme={props.isDarkMode ? "dark" : "light"} | 137 | colorScheme={props.isDarkMode ? "dark" : "light"} |
| 127 | style={props.style} | 138 | style={props.style} |
| 128 | > | 139 | > |
| 129 | {props.children} | 140 | {props.children} |
| 130 | </LiquidGlassView> | 141 | </LiquidGlassView> |
| | 142 | </View> |
| 131 | ); | 143 | ); |
| 132 | } | 144 | } |
| 133 | | 145 | |
| 134 | return ( | 146 | return ( |
| 135 | <View | 147 | <View style={shadowStyle}> |
| 136 | style={[ | 148 | <View |
| 137 | props.style, | 149 | style={[ |
| 138 | { | 150 | props.style, |
| 139 | backgroundColor: props.isDarkMode ? "rgba(44,44,46,0.96)" : "rgba(255,255,255,0.96)", | 151 | { |
| 140 | borderWidth: 1, | 152 | backgroundColor: props.isDarkMode ? "rgba(44,44,46,0.96)" : "rgba(255,255,255,0.96)", |
| 141 | borderColor: props.isDarkMode ? "rgba(255,255,255,0.08)" : "rgba(0,0,0,0.06)", | 153 | borderWidth: 1, |
| 142 | }, | 154 | borderColor: props.isDarkMode ? "rgba(255,255,255,0.08)" : "rgba(0,0,0,0.06)", |
| 143 | ]} | 155 | }, |
| 144 | > | 156 | ]} |
| 145 | {props.children} | 157 | > |
| | 158 | {props.children} |
| | 159 | </View> |
| 146 | </View> | 160 | </View> |
| 147 | ); | 161 | ); |
| 148 | } | 162 | } |
| ... | @@ -661,8 +675,8 @@ export const ThreadComposer = memo(function ThreadComposer(props: ThreadComposer | ... | @@ -661,8 +675,8 @@ export const ThreadComposer = memo(function ThreadComposer(props: ThreadComposer |
| 661 | paddingTop: isExpanded ? 8 : 6, | 675 | paddingTop: isExpanded ? 8 : 6, |
| 662 | paddingBottom: (props.bottomInset ?? 0) + (isExpanded ? 8 : 6), | 676 | paddingBottom: (props.bottomInset ?? 0) + (isExpanded ? 8 : 6), |
| 663 | experimental_backgroundImage: isDarkMode | 677 | experimental_backgroundImage: isDarkMode |
| 664 | ? "linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 40%, rgba(0,0,0,0.95) 100%)" | 678 | ? "linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 55%, rgba(0,0,0,0.9) 100%)" |
| 665 | : "linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.85) 40%, rgba(255,255,255,0.95) 100%)", | 679 | : "linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 55%, rgba(255,255,255,0.9) 100%)", |
| 666 | }} | 680 | }} |
| 667 | > | 681 | > |
| 668 | <View | 682 | <View |
Julius Marminge <julius0216@outlook.com> 2026-07-03 00:05:38-07:00
GitHub <noreply@github.com> 2026-07-03 07:05:38+00:00