Function DrawerRow

src/showcase/ShowcaseMenu.tsx:522–588

({
  appTheme,
  description,
  iconName,
  isSelected = false,
  label,
  onPress,
}: {
  appTheme: ShowcaseMenuTheme;
  description?: string;
  iconName: IoniconName;
  isSelected?: boolean;
  label: string;
  onPress: () => void;
})

);

const DrawerRow = ({
  appTheme,
  description,
  iconName,
  isSelected = false,
  label,
  onPress,
}: {
  appTheme: ShowcaseMenuTheme;
  description?: string;
  iconName: IoniconName;
  isSelected?: boolean;
  label: string;
  onPress: () => void;
}) => {
  const accentColor = appTheme.series[0] ?? appTheme.text;

  return (
    <Pressable
      accessibilityRole="button"
      accessibilityState={{ selected: isSelected }}
      onPress={onPress}
      style={({ pressed }) => [
        styles.row,
        {
          backgroundColor: isSelected ? appTheme.background : "transparent",
        },
        pressed && styles.pressed,
      ]}
    >
      <View
        style={[
          styles.rowIcon,
          {
            backgroundColor: isSelected ? accentColor : appTheme.background,
            borderColor: appTheme.axis,
          },
        ]}
      >
        <Ionicons
          name={iconName}
          size={15}
          color={isSelected ? appTheme.background : appTheme.text}
        />
      </View>
      <View style={styles.rowTextBlock}>
        <Text
          numberOfLines={1}
          style={[styles.rowLabel, { color: appTheme.text }]}
        >
          {label}
        </Text>
        {description ? (
          <Text
            numberOfLines={1}
            style={[styles.rowDescription, { color: appTheme.mutedText }]}
          >
            {description}