fix: deprecate containerStyle prop

gmsgowtham · Aug 20, 2023 · 23b9652 · 23b9652
1 parent 26624a7
commit 23b9652
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 4 deletions.
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -71,6 +71,9 @@ export default function App() {
 					textStyle={styles.text}
 					hljsStyle={hljsStyle}
 					language="typescript"
+					scrollViewProps={{
+						contentContainerStyle: styles.codeContainer,
+					}}
 				>
 					{CODE_STR}
 				</CodeHighlighter>
@@ -82,7 +85,6 @@ export default function App() {
 const styles = StyleSheet.create({
 	codeContainer: {
 		paddingHorizontal: 16,
-		minWidth: "100%",
 	},
 	text: {
 		fontSize: 16,

diff --git a/package.json b/package.json
@@ -41,6 +41,7 @@
     "react-native",
     "ios",
     "android",
+    "web",
     "code-hightlighter",
     "syntax-highlighter"
   ],

diff --git a/src/lib/CodeHighlighter.tsx b/src/lib/CodeHighlighter.tsx
@@ -21,17 +21,20 @@ import {
 
 export interface CodeHighlighterProps extends SyntaxHighlighterProps {
 	hljsStyle: ReactStyle;
-	containerStyle?: StyleProp<ViewStyle>;
 	textStyle?: StyleProp<TextStyle>;
 	scrollViewProps?: ScrollViewProps;
+	/**
+	 * @deprecated, Use scrollViewProps.contentContainerStyle instead
+	 */
+	containerStyle?: StyleProp<ViewStyle>;
 }
 
 export const CodeHighlighter: FunctionComponent<CodeHighlighterProps> = ({
 	children,
-	containerStyle,
 	textStyle,
 	hljsStyle,
 	scrollViewProps,
+	containerStyle,
 	...rest
 }) => {
 	const stylesheet: HighlighterStyleSheet = useMemo(
@@ -75,7 +78,11 @@ export const CodeHighlighter: FunctionComponent<CodeHighlighterProps> = ({
 			<ScrollView
 				{...scrollViewProps}
 				horizontal
-				contentContainerStyle={[stylesheet.hljs, containerStyle]}
+				contentContainerStyle={[
+					stylesheet.hljs,
+					scrollViewProps?.contentContainerStyle,
+					containerStyle,
+				]}
 			>
 				<View>{renderNode(rows)}</View>
 			</ScrollView>