diff --git a/front/packages/primitives/src/icons.tsx b/front/packages/primitives/src/icons.tsx index 5ec298bc..07ec5363 100644 --- a/front/packages/primitives/src/icons.tsx +++ b/front/packages/primitives/src/icons.tsx @@ -19,10 +19,11 @@ */ import React, { ComponentProps, ComponentType, ForwardedRef, forwardRef } from "react"; -import { Pressable, Platform, PressableProps, ViewStyle } from "react-native"; +import { Platform, PressableProps, ViewStyle } from "react-native"; import { SvgProps } from "react-native-svg"; import { YoshikiStyle } from "yoshiki/dist/type"; import { px, useYoshiki } from "yoshiki/native"; +import { PressableFeedback } from "./links"; import { ts } from "./utils"; declare module "react" { @@ -71,7 +72,7 @@ export const IconButton = forwardRef(function _IconButton. */ -import { ComponentProps, ComponentType, forwardRef, Fragment, ReactNode } from "react"; -import { - Platform, - Pressable, - TextProps, - TouchableOpacity, - TouchableNativeFeedback, - View, - ViewProps, - StyleSheet, - PressableProps, -} from "react-native"; +import { forwardRef, ReactNode } from "react"; +import { Pressable, TextProps, View, PressableProps } from "react-native"; import { LinkCore, TextLink } from "solito/link"; -import { useYoshiki } from "yoshiki/native"; +import { useTheme, useYoshiki } from "yoshiki/native"; +import { alpha } from "./themes"; export const A = ({ href, @@ -59,54 +50,20 @@ export const A = ({ ); }; -export const PressableFeedback = forwardRef< - unknown, - ViewProps & { - onFocus?: PressableProps["onFocus"]; - onBlur?: PressableProps["onBlur"]; - onPressIn?: PressableProps["onPressIn"]; - onPressOut?: PressableProps["onPressOut"]; - onPress?: PressableProps["onPress"]; - WebComponent?: ComponentType; - } ->(function _Feedback({ children, WebComponent, ...props }, ref) { - const { onBlur, onFocus, onPressIn, onPressOut, onPress, ...noPressProps } = props; - const pressProps = { onBlur, onFocus, onPressIn, onPressOut, onPress }; - const wrapperProps = Platform.select({ - android: { - style: { - borderRadius: StyleSheet.flatten(props?.style)?.borderRadius, - alignContent: "center", - justifyContent: "center", - overflow: "hidden", - }, - ref, - }, - default: {}, - }); - const Wrapper = wrapperProps.style ? View : Fragment; - const InnerPressable = Platform.select>({ - web: WebComponent ?? Pressable, - android: TouchableNativeFeedback, - ios: TouchableOpacity, - default: Pressable, - }); +export const PressableFeedback = forwardRef(function _Feedback( + { children, ...props }, + ref, +) { + const theme = useTheme(); return ( - - ({ - android: { useForeground: true, ...pressProps }, - default: { ref, ...props }, - })} - > - {Platform.select({ - android: {children}, - ios: {children}, - default: children, - })} - - + + {children} + ); }); @@ -114,7 +71,7 @@ export const Link = ({ href, children, ...props -}: { href: string } & Omit, "WebComponent">) => { +}: { href: string; children?: ReactNode } & PressableProps) => { return (