diff --git a/docz/docs/03-demos/17-mobile/01-reactnative.md b/docz/docs/03-demos/17-mobile/01-reactnative.md index 580e638..10a9ef0 100644 --- a/docz/docs/03-demos/17-mobile/01-reactnative.md +++ b/docz/docs/03-demos/17-mobile/01-reactnative.md @@ -244,7 +244,7 @@ This demo was tested in the following environments: :::caution -First install React Native bt following the CLI Guide![^1]. Make sure you can run a basic test app on your +First install React Native by following the CLI Guide![^1]. Make sure you can run a basic test app on your phone/simulator before continuing! ::: @@ -319,7 +319,7 @@ scheme is fundamentally different from `react-native`.[^6] cd SheetJSRNFetch curl -LO https://docs.sheetjs.com/logo.png npm i -S https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz -npm i -S react-native-table-component@1.2.2 @types/react-native-table-component`} +npm i -S https://git.sheetjs.com/asadbek064/react-native-tabeller/raw/branch/main/react-native-tabeller-0.1.0.tgz`} 3) Download [`App.tsx`](pathname:///reactnative/App.tsx) and replace: diff --git a/docz/static/reactnative/App.tsx b/docz/static/reactnative/App.tsx index 3bc2090..fcb7c13 100644 --- a/docz/static/reactnative/App.tsx +++ b/docz/static/reactnative/App.tsx @@ -1,16 +1,10 @@ /* sheetjs (C) SheetJS -- https://sheetjs.com */ import React, { useState, useCallback } from 'react'; -import { StyleSheet, Text, Button, Alert, Image, ScrollView, LogBox } from 'react-native'; -import { Table, Row, Rows, TableWrapper } from 'react-native-table-component'; +import { StyleSheet, Text, Button, Alert, Image, ScrollView } from 'react-native'; +import { Table, Row, Rows, TableWrapper } from 'react-native-tabeller'; import { read, utils, WorkSheet } from 'xlsx'; -// suppress react-native-table-component type - no longer maintained -// TODO: rewrite this demo; works for now -LogBox.ignoreLogs([ - 'Invalid prop `textStyle` of type `array` supplied to `Cell`', -]); - const make_width = (ws: WorkSheet): number[] => { const aoa = utils.sheet_to_json(ws, {header:1}), res: number[] = []; aoa.forEach((r) => { r.forEach((c, C) => { res[C] = Math.max(res[C]||60, String(c).length * 10); }); }); @@ -66,7 +60,7 @@ function App(): JSX.Element { } const styles = StyleSheet.create({ - container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF' }, + container: { backgroundColor: '#F5FCFF' }, welcome: { fontSize: 20, textAlign: 'center', margin: 10 }, bolded: { textAlign: 'center', color: '#333333', marginBottom: 5, fontWeight: "bold" }, thead: { height: 40, backgroundColor: '#f1f8ff' },