tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

docs(react-native): escape JSX double-braces for Scriban 

Scriban treats `{{ ... }}` inside markdown as a template expression and
chokes on the comma inside JSX style props (e.g.
`contentContainerStyle={{ flexGrow: 1, paddingBottom: 96 }}`).

Wraps every literal JSX `{{ ... }}` occurrence with the
`{%{{{ ... }}}%}` escape used elsewhere in the docs, covering the 13 sites
spread across the DataList, AbpSelect, BookStoreNavigator,
BottomTabNavigator and CreateUpdateBookForm code blocks. Pure docs change,
no semantic effect on the rendered tutorial.

Reported by the markdown linter:
  index.md:161:43: error: [ScribanParseError] Invalid token found `,`.
pull/25444/head
Fahri Gedik 1 week ago
parent
f5471a1876
commit
cb9c758465
1 changed files with 13 additions and 13 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 26
      docs/en/tutorials/mobile/react-native/index.md

26
docs/en/tutorials/mobile/react-native/index.md
View File

@ -158,7 +158,7 @@ function DataList<T extends { id: string }>({
data={items} data={items}
keyExtractor={(item, index) => item?.id?.toString() ?? index.toString()} keyExtractor={(item, index) => item?.id?.toString() ?? index.toString()}
renderItem={render} renderItem={render}
contentContainerStyle={{ flexGrow: 1, paddingBottom: 96 }} contentContainerStyle={%{{{ flexGrow: 1, paddingBottom: 96 }}}%}
refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} tintColor={accentColor} />} refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} tintColor={accentColor} />}
onEndReached={onEndReached} onEndReached={onEndReached}
onEndReachedThreshold={0.4} onEndReachedThreshold={0.4}
@ -255,7 +255,7 @@ function AbpSelect({
<FlatList <FlatList
data={data} data={data}
keyExtractor={item => String(item.id)} keyExtractor={item => String(item.id)}
style={{ maxHeight: 360 }} style={%{{{ maxHeight: 360 }}}%}
ItemSeparatorComponent={() => ( ItemSeparatorComponent={() => (
<View className="h-px bg-border dark:bg-border-dark mx-4" /> <View className="h-px bg-border dark:bg-border-dark mx-4" />
)} )}
@ -376,7 +376,7 @@ export default function BookStoreStackNavigator() {
headerShadowVisible: false, headerShadowVisible: false,
headerRight: () => ( headerRight: () => (
<Pressable onPress={() => navigation.goBack()} hitSlop={8}> <Pressable onPress={() => navigation.goBack()} hitSlop={8}>
<Text style={{ color: accentColor, fontWeight: '600' }}>{t('AbpUi::Cancel')}</Text> <Text style={%{{{ color: accentColor, fontWeight: '600' }}}%}>{t('AbpUi::Cancel')}</Text>
</Pressable> </Pressable>
), ),
})} })}
@ -391,7 +391,7 @@ export default function BookStoreStackNavigator() {
headerShadowVisible: false, headerShadowVisible: false,
headerRight: () => ( headerRight: () => (
<Pressable onPress={() => navigation.goBack()} hitSlop={8}> <Pressable onPress={() => navigation.goBack()} hitSlop={8}>
<Text style={{ color: accentColor, fontWeight: '600' }}>{t('AbpUi::Cancel')}</Text> <Text style={%{{{ color: accentColor, fontWeight: '600' }}}%}>{t('AbpUi::Cancel')}</Text>
</Pressable> </Pressable>
), ),
})} })}
@ -436,7 +436,7 @@ export default function BottomTabNavigator() {
<Tab.Navigator <Tab.Navigator
id="BottomTab" id="BottomTab"
initialRouteName="HomeTab" initialRouteName="HomeTab"
screenOptions={{ /* ... existing screen options ... */ }}> screenOptions={%{{{ /* ... existing screen options ... */ }}}%}>
<Tab.Screen name="HomeTab" component={HomeStackNavigator} options={/* ... */} /> <Tab.Screen name="HomeTab" component={HomeStackNavigator} options={/* ... */} />
{showBookStore ? ( {showBookStore ? (
@ -857,7 +857,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
<KeyboardAvoidingView <KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : undefined} behavior={Platform.OS === 'ios' ? 'padding' : undefined}
className="flex-1 bg-background dark:bg-background-dark"> className="flex-1 bg-background dark:bg-background-dark">
<ScrollView keyboardShouldPersistTaps="handled" contentContainerStyle={{ padding: 16, paddingBottom: 32 }}> <ScrollView keyboardShouldPersistTaps="handled" contentContainerStyle={%{{{ padding: 16, paddingBottom: 32 }}}%}>
<View className="bg-card dark:bg-card-dark rounded-2xl border border-card-border dark:border-card-border-dark shadow-sm p-4"> <View className="bg-card dark:bg-card-dark rounded-2xl border border-card-border dark:border-card-border-dark shadow-sm p-4">
{/* Name */} {/* Name */}
<View className="mb-3"> <View className="mb-3">
@ -869,7 +869,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
onBlur={form.handleBlur('name')} onBlur={form.handleBlur('name')}
error={showError('name')} error={showError('name')}
autoCapitalize="sentences" autoCapitalize="sentences"
style={{ backgroundColor: primaryContainer }} style={%{{{ backgroundColor: primaryContainer }}}%}
/> />
{renderError('name')} {renderError('name')}
</View> </View>
@ -885,7 +885,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
editable={false} editable={false}
error={showError('authorId')} error={showError('authorId')}
right={<TextInput.Icon icon="menu-down" />} right={<TextInput.Icon icon="menu-down" />}
style={{ backgroundColor: primaryContainer }} style={%{{{ backgroundColor: primaryContainer }}}%}
/> />
</View> </View>
</Pressable> </Pressable>
@ -903,7 +903,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
editable={false} editable={false}
error={showError('type')} error={showError('type')}
right={<TextInput.Icon icon="menu-down" />} right={<TextInput.Icon icon="menu-down" />}
style={{ backgroundColor: primaryContainer }} style={%{{{ backgroundColor: primaryContainer }}}%}
/> />
</View> </View>
</Pressable> </Pressable>
@ -925,7 +925,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
editable={false} editable={false}
error={showError('publishDate')} error={showError('publishDate')}
right={<TextInput.Icon icon="calendar" />} right={<TextInput.Icon icon="calendar" />}
style={{ backgroundColor: primaryContainer }} style={%{{{ backgroundColor: primaryContainer }}}%}
/> />
</View> </View>
</Pressable> </Pressable>
@ -942,7 +942,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
onBlur={form.handleBlur('price')} onBlur={form.handleBlur('price')}
error={showError('price')} error={showError('price')}
keyboardType="decimal-pad" keyboardType="decimal-pad"
style={{ backgroundColor: primaryContainer }} style={%{{{ backgroundColor: primaryContainer }}}%}
/> />
{renderError('price')} {renderError('price')}
</View> </View>
@ -994,7 +994,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
{t('BookStore::PublishDate')} {t('BookStore::PublishDate')}
</Text> </Text>
</View> </View>
<View style={{ backgroundColor: headerBg }}> <View style={%{{{ backgroundColor: headerBg }}}%}>
<DateTimePicker <DateTimePicker
value={tempDate} value={tempDate}
mode="date" mode="date"
@ -1015,7 +1015,7 @@ function CreateUpdateBookForm({ submit, book, authors }: CreateUpdateBookFormPro
{Platform.OS === 'ios' ? ( {Platform.OS === 'ios' ? (
<View className="flex-row justify-end px-4 py-3 border-t border-card-border dark:border-card-border-dark gap-x-2"> <View className="flex-row justify-end px-4 py-3 border-t border-card-border dark:border-card-border-dark gap-x-2">
<Pressable onPress={() => setDateModalVisible(false)} className="px-4 py-2 rounded-md"> <Pressable onPress={() => setDateModalVisible(false)} className="px-4 py-2 rounded-md">
<Text style={{ color: accentColor, fontWeight: '600' }}>{t('AbpUi::Cancel')}</Text> <Text style={%{{{ color: accentColor, fontWeight: '600' }}}%}>{t('AbpUi::Cancel')}</Text>
</Pressable> </Pressable>
<Pressable <Pressable
onPress={() => { onPress={() => {

Write Preview
Loading…
Cancel
Save