diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml
index 5b20b75..13373b3 100644
--- a/.github/ISSUE_TEMPLATE/config.yml
+++ b/.github/ISSUE_TEMPLATE/config.yml
@@ -1,8 +1,8 @@
blank_issues_enabled: false
contact_links:
- name: Feature Request 💡
- url: https://github.com/ahmdshrif/react-native-datagrid/discussions/new?category=ideas
+ url: https://github.com/ahmdshrif/react-native-grid-table/discussions/new?category=ideas
about: If you have a feature request, please create a new discussion on GitHub.
- name: Discussions on GitHub 💬
- url: https://github.com/ahmdshrif/react-native-datagrid/discussions
+ url: https://github.com/ahmdshrif/react-native-grid-table/discussions
about: If this library works as promised but you need help, please ask questions there.
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5fb946b..153f452 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -21,5 +21,5 @@ First public beta. The API may still change before 0.1.0.
- Every mounted row renders every column. Rendering only visible columns is planned for wide tables.
- Sorting, filtering and key generation process the whole dataset in JS.
- No column resizing or inline editing yet.
-- No native horizontal scrollbar or overscroll bounce: sideways scrolling is driven by a pan gesture so the header and pinned columns stay in sync ([#3](https://github.com/ahmdshrif/react-native-datagrid/issues/3)).
+- No native horizontal scrollbar or overscroll bounce: sideways scrolling is driven by a pan gesture so the header and pinned columns stay in sync ([#3](https://github.com/ahmdshrif/react-native-grid-table/issues/3)).
- Performance has been measured on the iOS simulator and an Android emulator only. Physical low-end Android devices are not measured yet.
diff --git a/README.md b/README.md
index bdd71d8..028e43f 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-
react-native-datagrid
+react-native-grid-table
A data grid for React Native with pinned columns that actually stay pinned.
@@ -13,21 +13,21 @@
-
-
-
-
+
+
+
+
-> **Beta.** The API may still change before `0.1.0`. What lands next is decided by feedback from real apps — [open an issue](https://github.com/ahmdshrif/react-native-datagrid/issues).
+> **Beta.** The API may still change before `0.1.0`. What lands next is decided by feedback from real apps — [open an issue](https://github.com/ahmdshrif/react-native-grid-table/issues).
## Why this grid
-**âš¡ Pinned columns that don't drift.** Sideways scrolling is driven by one Reanimated value, so rows, header and pinned columns move in the same frame. Feeding a `ScrollView`'s offset into a transform is a frame late on Android, and pinned columns visibly flicker ([#3](https://github.com/ahmdshrif/react-native-datagrid/issues/3)).
+**âš¡ Pinned columns that don't drift.** Sideways scrolling is driven by one Reanimated value, so rows, header and pinned columns move in the same frame. Feeding a `ScrollView`'s offset into a transform is a frame late on Android, and pinned columns visibly flicker ([#3](https://github.com/ahmdshrif/react-native-grid-table/issues/3)).
**🚀 Built on FlashList.** Only the rows on screen are mounted, so 10,000 rows scroll like 30.
@@ -38,14 +38,14 @@
## Quick start
```sh
-npx expo install react-native-datagrid@beta @shopify/flash-list react-native-reanimated react-native-worklets react-native-gesture-handler
+npx expo install react-native-grid-table@beta @shopify/flash-list react-native-reanimated react-native-worklets react-native-gesture-handler
```
Without Expo
```sh
-npm install react-native-datagrid@beta @shopify/flash-list react-native-reanimated react-native-worklets react-native-gesture-handler
+npm install react-native-grid-table@beta @shopify/flash-list react-native-reanimated react-native-worklets react-native-gesture-handler
```
Follow the [Reanimated setup guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started) to add the worklets Babel plugin. On Expo, install the peers with `expo install` so they match your SDK; installing this library first can pull a Reanimated version that needs a newer React Native than your SDK ships.
@@ -65,8 +65,8 @@ export default function App() {
Then render a grid. It fills its parent, so give the parent a height.
```tsx
-import { DataGrid } from 'react-native-datagrid';
-import type { DataGridColumn } from 'react-native-datagrid';
+import { DataGrid } from 'react-native-grid-table';
+import type { DataGridColumn } from 'react-native-grid-table';
type Order = { id: string; customer: string; status: string; amount: number };
@@ -171,7 +171,7 @@ Checked on the iOS 26 simulator and an Android API 35 emulator in Release builds
## How it compares
-| | react-native-datagrid | Plain `FlatList` | [TanStack Table](https://tanstack.com/table) |
+| | react-native-grid-table | Plain `FlatList` | [TanStack Table](https://tanstack.com/table) |
| --- | --- | --- | --- |
| Pinned columns + sticky header | Built in | You build it | You build it |
| Row virtualization | FlashList | FlatList | Bring your own list |
diff --git a/RELEASING.md b/RELEASING.md
index 4cbd646..85dfc4b 100644
--- a/RELEASING.md
+++ b/RELEASING.md
@@ -9,7 +9,7 @@
5. `npm publish` — `publishConfig.tag` is `beta`, so it will **not** become `latest`.
6. `git tag v0.1.0-beta.0 && git push --tags`.
-Install instructions for testers: `npm install react-native-datagrid@beta`.
+Install instructions for testers: `npm install react-native-grid-table@beta`.
## Stable
diff --git a/docs/theming.md b/docs/theming.md
index fec8f7d..b4537b5 100644
--- a/docs/theming.md
+++ b/docs/theming.md
@@ -34,7 +34,7 @@ The grid ships light and dark themes and follows the device by default. Override
`lightTheme` and `darkTheme` are exported, so you can extend one instead of listing every token:
```tsx
-import { darkTheme } from 'react-native-datagrid';
+import { darkTheme } from 'react-native-grid-table';
const brandDark = { ...darkTheme, accent: '#FFB300', onAccent: '#1A1A1A' };
diff --git a/example/app.json b/example/app.json
index 0f9ce14..e499cec 100644
--- a/example/app.json
+++ b/example/app.json
@@ -1,14 +1,14 @@
{
"expo": {
- "name": "Datagrid Example",
- "slug": "react-native-datagrid-example",
+ "name": "Grid Table Example",
+ "slug": "react-native-grid-table-example",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "automatic",
"ios": {
"supportsTablet": true,
- "bundleIdentifier": "dev.rndatagrid.example"
+ "bundleIdentifier": "dev.rngridtable.example"
},
"android": {
"adaptiveIcon": {
@@ -17,7 +17,7 @@
"backgroundImage": "./assets/android-icon-background.png",
"monochromeImage": "./assets/android-icon-monochrome.png"
},
- "package": "dev.rndatagrid.example"
+ "package": "dev.rngridtable.example"
},
"web": {
"favicon": "./assets/favicon.png"
diff --git a/example/metro.config.js b/example/metro.config.js
index 027026e..50e62b4 100644
--- a/example/metro.config.js
+++ b/example/metro.config.js
@@ -13,7 +13,7 @@ const root = path.resolve(__dirname, '..');
const config = withMetroConfig(getDefaultConfig(__dirname), {
root,
dirname: __dirname,
- conditions: ['react-native-datagrid-source'],
+ conditions: ['react-native-grid-table-source'],
});
module.exports = config;
diff --git a/example/package.json b/example/package.json
index 3932155..28b7bc1 100644
--- a/example/package.json
+++ b/example/package.json
@@ -1,5 +1,5 @@
{
- "name": "react-native-datagrid-example",
+ "name": "react-native-grid-table-example",
"version": "1.0.0",
"main": "index.js",
"dependencies": {
@@ -21,7 +21,7 @@
"android": "expo run:android",
"ios": "expo run:ios",
"web": "expo start --web",
- "build:ios": "xcodebuild ONLY_ACTIVE_ARCH=YES -workspace ios/DatagridExample.xcworkspace -UseNewBuildSystem=YES -scheme DatagridExample -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build -quiet",
+ "build:ios": "xcodebuild ONLY_ACTIVE_ARCH=YES -workspace ios/GridTableExample.xcworkspace -UseNewBuildSystem=YES -scheme GridTableExample -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build -quiet",
"build:android": "cd android && ./gradlew assembleDebug -DtestBuildType=debug -Dorg.gradle.jvmargs=-Xmx4g",
"build:web": "expo export --platform web"
},
diff --git a/example/src/App.tsx b/example/src/App.tsx
index b78ac82..2f469ad 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -3,8 +3,8 @@ import { StyleSheet, Text, View, useColorScheme } from 'react-native';
import { StatusBar } from 'expo-status-bar';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
-import { darkTheme, lightTheme } from 'react-native-datagrid';
-import type { DataGridTheme } from 'react-native-datagrid';
+import { darkTheme, lightTheme } from 'react-native-grid-table';
+import type { DataGridTheme } from 'react-native-grid-table';
import { Segmented } from './controls';
import { LocalDemo } from './LocalDemo';
import { PerfMonitor } from './PerfMonitor';
diff --git a/example/src/LocalDemo.tsx b/example/src/LocalDemo.tsx
index bcfdc32..451fb06 100644
--- a/example/src/LocalDemo.tsx
+++ b/example/src/LocalDemo.tsx
@@ -1,7 +1,7 @@
import { useMemo, useState } from 'react';
import { Text, View } from 'react-native';
-import { DataGrid } from 'react-native-datagrid';
-import type { ColumnFilters, DataGridTheme } from 'react-native-datagrid';
+import { DataGrid } from 'react-native-grid-table';
+import type { ColumnFilters, DataGridTheme } from 'react-native-grid-table';
import { makeColumns } from './columns';
import {
Chip,
diff --git a/example/src/ServerDemo.tsx b/example/src/ServerDemo.tsx
index a10abd6..5ec3350 100644
--- a/example/src/ServerDemo.tsx
+++ b/example/src/ServerDemo.tsx
@@ -1,7 +1,7 @@
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { Text, View } from 'react-native';
-import { DataGrid } from 'react-native-datagrid';
-import type { DataGridTheme, SortState } from 'react-native-datagrid';
+import { DataGrid } from 'react-native-grid-table';
+import type { DataGridTheme, SortState } from 'react-native-grid-table';
import { makeColumns } from './columns';
import { Chip, LinkButton, SearchBox, controlStyles } from './controls';
import { STATUSES } from './data';
diff --git a/example/src/columns.tsx b/example/src/columns.tsx
index a7b814c..9b048ee 100644
--- a/example/src/columns.tsx
+++ b/example/src/columns.tsx
@@ -1,5 +1,5 @@
import { StyleSheet, Text, View } from 'react-native';
-import type { DataGridColumn } from 'react-native-datagrid';
+import type { DataGridColumn } from 'react-native-grid-table';
import type { WorkOrder, WorkOrderStatus } from './data';
const money = new Intl.NumberFormat('en-US', {
diff --git a/example/src/controls.tsx b/example/src/controls.tsx
index fdaa1b5..3f42d31 100644
--- a/example/src/controls.tsx
+++ b/example/src/controls.tsx
@@ -1,5 +1,5 @@
import { Pressable, StyleSheet, Text, TextInput, View } from 'react-native';
-import type { DataGridTheme } from 'react-native-datagrid';
+import type { DataGridTheme } from 'react-native-grid-table';
type ChipProps = {
theme: DataGridTheme;
diff --git a/example/src/fakeServer.ts b/example/src/fakeServer.ts
index d7700c5..d74c436 100644
--- a/example/src/fakeServer.ts
+++ b/example/src/fakeServer.ts
@@ -1,5 +1,9 @@
-import { buildSearchIndex, filterRows, sortRows } from 'react-native-datagrid';
-import type { SortState } from 'react-native-datagrid';
+import {
+ buildSearchIndex,
+ filterRows,
+ sortRows,
+} from 'react-native-grid-table';
+import type { SortState } from 'react-native-grid-table';
import { makeColumns } from './columns';
import { makeWorkOrders } from './data';
import type { WorkOrder, WorkOrderStatus } from './data';
diff --git a/package.json b/package.json
index f8a26bd..1755feb 100644
--- a/package.json
+++ b/package.json
@@ -1,12 +1,12 @@
{
- "name": "react-native-datagrid",
+ "name": "react-native-grid-table",
"version": "0.1.0-beta.0",
"description": "Fast data grid for React Native: pinned columns, sticky header, virtualized rows, sorting and selection",
"main": "./lib/module/index.js",
"types": "./lib/typescript/src/index.d.ts",
"exports": {
".": {
- "react-native-datagrid-source": "./src/index.tsx",
+ "react-native-grid-table-source": "./src/index.tsx",
"types": "./lib/typescript/src/index.d.ts",
"default": "./lib/module/index.js"
},
@@ -32,7 +32,7 @@
"!**/.*"
],
"scripts": {
- "example": "yarn workspace react-native-datagrid-example",
+ "example": "yarn workspace react-native-grid-table-example",
"clean": "del-cli lib",
"prepare": "bob build",
"typecheck": "tsc",
@@ -56,14 +56,14 @@
],
"repository": {
"type": "git",
- "url": "git+https://github.com/ahmdshrif/react-native-datagrid.git"
+ "url": "git+https://github.com/ahmdshrif/react-native-grid-table.git"
},
"author": "ahmdshrif (https://github.com/ahmdshrif)",
"license": "MIT",
"bugs": {
- "url": "https://github.com/ahmdshrif/react-native-datagrid/issues"
+ "url": "https://github.com/ahmdshrif/react-native-grid-table/issues"
},
- "homepage": "https://github.com/ahmdshrif/react-native-datagrid#readme",
+ "homepage": "https://github.com/ahmdshrif/react-native-grid-table#readme",
"publishConfig": {
"registry": "https://registry.npmjs.org/",
"tag": "beta",
@@ -142,7 +142,7 @@
"customExportConditions": [
"require",
"react-native",
- "react-native-datagrid-source"
+ "react-native-grid-table-source"
]
},
"modulePathIgnorePatterns": [
diff --git a/tsconfig.json b/tsconfig.json
index 953a226..f0cf477 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -2,14 +2,14 @@
"compilerOptions": {
"rootDir": ".",
"paths": {
- "react-native-datagrid": [
+ "react-native-grid-table": [
"./src/index"
]
},
"allowUnreachableCode": false,
"allowUnusedLabels": false,
"customConditions": [
- "react-native-datagrid-source",
+ "react-native-grid-table-source",
"react-native-strict-api"
],
"esModuleInterop": true,
diff --git a/yarn.lock b/yarn.lock
index 347c7e8..584969d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10323,9 +10323,23 @@ __metadata:
languageName: node
linkType: hard
-"react-native-datagrid-example@workspace:example":
+"react-native-gesture-handler@npm:~2.30.0":
+ version: 2.30.1
+ resolution: "react-native-gesture-handler@npm:2.30.1"
+ dependencies:
+ "@egjs/hammerjs": "npm:^2.0.17"
+ hoist-non-react-statics: "npm:^3.3.0"
+ invariant: "npm:^2.2.4"
+ peerDependencies:
+ react: "*"
+ react-native: "*"
+ checksum: 10c0/6fdace725cfc08a8f2ab4b307d8d7f11438ebe38038443f7057bb1fd10554fcec8ce2816e8da131ae9b850c9be5e3bbef752b90240f5c91595ab20fd03ad6876
+ languageName: node
+ linkType: hard
+
+"react-native-grid-table-example@workspace:example":
version: 0.0.0-use.local
- resolution: "react-native-datagrid-example@workspace:example"
+ resolution: "react-native-grid-table-example@workspace:example"
dependencies:
"@expo/metro-runtime": "npm:~55.0.0"
"@shopify/flash-list": "npm:2.0.2"
@@ -10344,9 +10358,9 @@ __metadata:
languageName: unknown
linkType: soft
-"react-native-datagrid@workspace:.":
+"react-native-grid-table@workspace:.":
version: 0.0.0-use.local
- resolution: "react-native-datagrid@workspace:."
+ resolution: "react-native-grid-table@workspace:."
dependencies:
"@commitlint/config-conventional": "npm:^21.2.0"
"@eslint/compat": "npm:^2.1.0"
@@ -10386,20 +10400,6 @@ __metadata:
languageName: unknown
linkType: soft
-"react-native-gesture-handler@npm:~2.30.0":
- version: 2.30.1
- resolution: "react-native-gesture-handler@npm:2.30.1"
- dependencies:
- "@egjs/hammerjs": "npm:^2.0.17"
- hoist-non-react-statics: "npm:^3.3.0"
- invariant: "npm:^2.2.4"
- peerDependencies:
- react: "*"
- react-native: "*"
- checksum: 10c0/6fdace725cfc08a8f2ab4b307d8d7f11438ebe38038443f7057bb1fd10554fcec8ce2816e8da131ae9b850c9be5e3bbef752b90240f5c91595ab20fd03ad6876
- languageName: node
- linkType: hard
-
"react-native-is-edge-to-edge@npm:1.2.1":
version: 1.2.1
resolution: "react-native-is-edge-to-edge@npm:1.2.1"