@rebasepro/core 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +178 -110
  3. package/dist/components/LoginView/LoginView.d.ts +1 -6
  4. package/dist/contexts/SnackbarProvider.d.ts +1 -1
  5. package/dist/hooks/data/save.d.ts +2 -2
  6. package/dist/hooks/data/useEntityFetch.d.ts +5 -0
  7. package/dist/hooks/useResolvedComponent.d.ts +1 -1
  8. package/dist/index.es.js +386 -309
  9. package/dist/index.es.js.map +1 -1
  10. package/dist/index.umd.js +436 -358
  11. package/dist/index.umd.js.map +1 -1
  12. package/package.json +22 -23
  13. package/src/components/AIIcon.tsx +1 -1
  14. package/src/components/Debug/UIReferenceView.tsx +52 -3
  15. package/src/components/Debug/UIStyleGuide.tsx +1 -2
  16. package/src/components/ErrorView.tsx +1 -2
  17. package/src/components/LanguageToggle.tsx +1 -9
  18. package/src/components/LoginView/LoginView.tsx +21 -12
  19. package/src/components/UserDisplay.tsx +1 -2
  20. package/src/components/UserSelectPopover.tsx +13 -2
  21. package/src/components/UserSettingsView.tsx +12 -3
  22. package/src/components/common/useDataTableController.tsx +2 -2
  23. package/src/contexts/SnackbarProvider.tsx +2 -1
  24. package/src/core/PluginLifecycleManager.tsx +0 -1
  25. package/src/core/Rebase.tsx +1 -1
  26. package/src/hooks/data/save.ts +4 -4
  27. package/src/hooks/data/useCollectionFetch.tsx +4 -4
  28. package/src/hooks/data/useEntityFetch.tsx +13 -3
  29. package/src/hooks/data/useRelationSelector.tsx +2 -2
  30. package/src/hooks/useResolvedComponent.tsx +7 -6
  31. package/src/hooks/useStudioBridge.tsx +0 -1
  32. package/src/locales/en.ts +8 -0
  33. package/src/util/icons.tsx +16 -8
  34. package/src/util/previews.ts +1 -1
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2021 Rebase
3
+ Copyright (c) 2026 Rebase
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
package/README.md CHANGED
@@ -1,7 +1,3 @@
1
- <p align="center">
2
- <img src="https://rebase.pro/img/dark_mode.webp" alt="Intro video" style="max-width: 100%;"/>
3
- </p>
4
-
5
1
  <p align="center">
6
2
  <a href="https://rebase.pro">
7
3
  <img src="https://rebase.pro/img/logo_small.png" width="240px" alt="Rebase logo" />
@@ -9,166 +5,238 @@
9
5
  </p>
10
6
 
11
7
  <h1 align="center">Rebase</h1>
12
- <h3 align="center">Awesome Firebase/MongoDB-based headless CMS</h3>
13
- <p align="center"><a href="https://demo.rebase.pro">Live demo</a></p>
8
+ <h3 align="center">The Open-Source Headless CMS & Admin Panel for Postgres</h3>
9
+ <p align="center">
10
+ <strong>Ship production-ready backends and radically extensible back-office apps in minutes.</strong><br/>
11
+ Own your data, own your code. The absolute easiest way to build on PostgreSQL.
12
+ </p>
13
+
14
+ <p align="center">
15
+ <a href="https://demo.rebase.pro">Live Demo</a> •
16
+ <a href="https://rebase.pro/docs">Documentation</a> •
17
+ <a href="https://rebase.pro/features">Features</a> •
18
+ <a href="https://github.com/rebasepro/rebase">GitHub</a> •
19
+ <a href="https://discord.gg/fxy7xsQm3m">Discord</a>
20
+ </p>
14
21
 
15
- <br />
22
+ <p align="center">
23
+ <a href="https://www.npmjs.com/package/@rebasepro/core"><img src="https://img.shields.io/npm/v/@rebasepro/core.svg?style=flat-square&color=orange" alt="NPM Version" /></a>
24
+ <a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/license-MIT-purple.svg?style=flat-square" alt="License: MIT" /></a>
25
+ <a href="https://www.npmjs.com/package/@rebasepro/core"><img src="https://img.shields.io/npm/dw/@rebasepro/core?style=flat-square&color=blue" alt="NPM Downloads" /></a>
26
+ <a href="https://discord.gg/fxy7xsQm3m"><img src="https://img.shields.io/discord/1013768502458470442?style=flat-square&logo=discord&logoColor=white&label=Discord" alt="Discord" /></a>
27
+ </p>
28
+
29
+ <br/>
30
+
31
+ <p align="center">
32
+ <img src="https://rebase.pro/img/demo_products.png" width="800px" alt="Rebase Dashboard" />
33
+ </p>
16
34
 
35
+ ---
17
36
 
18
- [![NPM](https://img.shields.io/npm/v/rebase.svg)](https://www.npmjs.com/package/rebase) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
37
+ ## What is Rebase?
19
38
 
20
- Designed by developers for developers, Rebase is a headless CMS and admin panel
21
- that seamlessly integrates with **Firebase and Firestore** by default, but is
22
- also
23
- compatible with any backend.
39
+ Rebase is a **developer-first**, open-source headless CMS and admin panel framework built with **React** and **TypeScript**. It gives you a complete backend-as-a-service layer on top of PostgreSQL — including authentication, S3-compatible storage, a full admin UI, and auto-generated APIs — while letting you extend every layer with custom React components, serverless functions, and scripts.
24
40
 
25
- Effortlessly generate **CRUD views** based on your configuration. Rebase is
26
- simple
27
- to set up for standard cases and easy to extend and customize for more specific
28
- needs.
41
+ ### Key Highlights
29
42
 
30
- Built to produce collection and form views that naturally align with the
31
- collection/document model, Rebase covers a wide range of basic and advanced use
32
- cases. With extensibility in mind, it's easy to create your own views or modify
33
- existing ones.
43
+ - 🔓 **No Vendor Lock-in** Self-host anywhere. Full control over your infrastructure, code, and database.
44
+ - **Instant Setup** `npx @rebasepro/cli init` scaffolds a production-ready project in seconds.
45
+ - 🗄️ **PostgreSQL First** First-class Postgres support with Drizzle ORM, schema introspection, and automatic migrations.
46
+ - 🧩 **Radical Extensibility** — Not constrained to pre-built widgets. If you can build it in React, you can build it in Rebase.
47
+ - 🎨 **Premium UI** — Fast, accessible design system built on Tailwind CSS v4 and Radix UI.
48
+ - 🤖 **AI-Ready** — MCP server for AI-assisted database management, plus data enhancement and insights plugins.
34
49
 
35
- Rebase does **not impose any data structure** restrictions, ensuring a smooth,
36
- out-of-the-box experience for any project.
50
+ ---
37
51
 
38
- ### Core technologies
52
+ ## Quick Start
39
53
 
40
- Rebase is based on this great technologies:
54
+ Scaffold a complete, self-hosted Rebase application connected to your database:
41
55
 
42
- - Typescript
43
- - Tailwind CSS
44
- - Firebase SDK 10
45
- - React + React Router 6
56
+ ```bash
57
+ npx @rebasepro/cli init my-rebase-app
58
+ ```
46
59
 
47
- ### Quickstart
60
+ Configure your database in `.env`, then start everything:
48
61
 
49
- The easiest way to get going is to check our quickstart guide! You will just
50
- need to follow some quick steps:
62
+ ```bash
63
+ cd my-rebase-app
64
+ npm run dev
65
+ ```
51
66
 
52
- https://rebase.pro/docs
67
+ Your admin panel is running at `http://localhost:5173` and the API at `http://localhost:3001`.
53
68
 
54
- ### Demo
69
+ ---
55
70
 
56
- Check the demo with all the core functionalities.
71
+ ## Features
57
72
 
58
- https://demo.rebase.pro
73
+ ### 🏓 Full Admin Panel & CMS
59
74
 
60
- > You can modify the data, but it gets periodically restored.
75
+ An incredibly fast, windowed spreadsheet view to manage your database with inline editing, real-time updates, filtering, sorting, and text search. Switch between multiple view modes:
61
76
 
62
- ### Changelog
77
+ - **Spreadsheet table** — Inline editing, column reordering, drag-and-drop
78
+ - **Card grid** — Visual overview with image previews
79
+ - **List view** — Compact, scannable layout
80
+ - **Custom views** — Build any React component as a collection view
63
81
 
64
- https://rebase.pro/docs/changelog
82
+ ### 🔒 Typed Schema & Database Migrations
65
83
 
66
- ## Features
84
+ Define your data models using pure TypeScript collections. Rebase automatically generates your Drizzle ORM schema, handles PostgreSQL migrations, and keeps your live database perfectly in sync using built-in tooling like `rebase doctor`.
85
+
86
+ ### 🔐 Authentication & Access Control
87
+
88
+ Built-in authentication with multiple providers:
89
+
90
+ - **Email/Password** — With password reset flow
91
+ - **Google OAuth** — One-click sign-in
92
+ - **Anonymous** — For guest access
93
+
94
+ Granular **role-based access control (RBAC)** with customizable permissions per collection, field, and action.
95
+
96
+ ### 📦 S3-Compatible Storage
97
+
98
+ Native S3-compatible file storage with:
99
+
100
+ - Drag-and-drop uploads with progress tracking
101
+ - Automatic image resizing and optimization
102
+ - File metadata management
103
+ - Storage browser in Studio
104
+
105
+ ### 🛠️ Studio — Developer Toolbox
106
+
107
+ A full developer environment built into the admin panel:
108
+
109
+ | Tool | Description |
110
+ |---|---|
111
+ | **SQL Editor** | Write and execute SQL queries directly against your database with schema-aware autocomplete |
112
+ | **RLS Policy Editor** | Visual editor for PostgreSQL Row-Level Security policies |
113
+ | **Schema Visualizer** | Interactive ER diagram of your database with relationship mapping |
114
+ | **JS/TS Editor** | In-browser code editor for scripts and functions |
115
+ | **API Explorer** | Browse and test your auto-generated REST API endpoints |
116
+ | **Cron Jobs** | Schedule and monitor recurring tasks |
117
+ | **Storage Browser** | Browse and manage files in your S3-compatible storage |
118
+
119
+ ### ⚡ Extensible API & Edge Functions
120
+
121
+ Drop custom Hono routes or scheduled tasks into the `functions/` and `crons/` directories. Rebase auto-loads them with database access and JWT authentication middleware injected automatically.
122
+
123
+ ### 🧬 SDK Generator
124
+
125
+ Auto-generate fully typed **TypeScript SDKs** from your collection definitions. Use them in any frontend, script, or service to interact with your Rebase backend with complete type safety.
126
+
127
+ ```bash
128
+ npx @rebasepro/cli generate-sdk
129
+ ```
67
130
 
68
- Rebase has been meticulously crafted to make it incredibly easy for developers
69
- to build a CMS/admin tool while offering an excellent data editing experience
70
- and a user-friendly interface for marketers and content managers.
131
+ ### 🤖 MCP Server
71
132
 
72
- ### 🏓 Exceptional Table View
133
+ A built-in **Model Context Protocol** server that enables AI assistants to:
73
134
 
74
- We've developed a highly efficient windowed **table view** for
75
- collections, allowing inline editing for most common fields, as well as popup
76
- views for other cases and your custom field implementations.
135
+ - Query and manage your database schema
136
+ - Create, read, update, and delete documents
137
+ - Manage users and roles
138
+ - Introspect your data model
77
139
 
78
- Featuring **real-time** support, Rebase is perfect for apps that require
79
- constant updates. It also supports **text search** (through an external provider
80
- like Algolia, if using Firestore), **filtering and sorting**, and **exporting**
81
- data.
140
+ ### 🔍 Schema Inference & Introspection
82
141
 
83
- ### Robust Forms
142
+ Point Rebase at an existing PostgreSQL database and automatically generate collection definitions from your tables — including types, relations, validation constraints, and more.
84
143
 
85
- ![fields](https://rebase.pro/img/form_editing.webp)
144
+ ### 📥📤 Import & Export
86
145
 
87
- When editing an entity, Rebase offers a nested system of side dialogs for
88
- navigating through **subcollections** and accessing custom views (such as custom
89
- forms or blog previews). This functionality can also be accessed
90
- programmatically using the `useSideEntityController` hook.
146
+ Import data from **CSV, JSON, and Excel** with an intuitive field mapper. Export your data in multiple formats with configurable column selection.
91
147
 
92
- Rebase includes **over 20 built-in fields** with numerous customization and
93
- validation options. The components have been carefully designed for an
94
- outstanding user experience, including advanced features like **references** to
95
- other collections, **markdown**, and **array reordering**.
148
+ ### 🧩 Plugins
96
149
 
97
- For unsupported use cases, create your own **custom field** as a React
98
- component.
150
+ Extend the admin experience with first-party plugins:
99
151
 
100
- Rebase also supports **conditional fields** in forms, allowing you to define
101
- rules for active fields based on your logic.
152
+ - **Data Enhancement** AI-powered field suggestions and auto-fill
153
+ - **Insights** Analytics dashboards and usage metrics
102
154
 
103
- ### 👮 Authentication, Permissions, and Role System
155
+ ### 📜 Standalone Scripting
104
156
 
105
- Define which navigation views users can see and the operations (create, edit,
106
- delete) they can perform based on your role system. You can even configure this
107
- on a per-entity or collection level.
157
+ Write standalone data manipulation scripts that connect directly to your running backend using the `@rebasepro/client` SDK. The CLI persists the dev server URL to `.rebase-dev-url` for zero-config local development.
108
158
 
109
- By default, Rebase supports all Firebase authorization mechanisms, but you can
110
- implement your own.
159
+ ### 🧩 Custom Views & React Extensibility
111
160
 
112
- ### 🏹 Relational Support
161
+ Build entirely custom views — dashboards, previews, charts — and drop them into the main navigation or as entity-level tabs. Use built-in hooks to interact with Rebase's internal state.
113
162
 
114
- Define references to entities in other collections and benefit from the
115
- integrated reference fields and shortcuts.
163
+ ---
116
164
 
117
- You can also define subcollections at the entity level for nesting data in a
118
- collection/document/collection model.
165
+ ## 🛠️ Core Technologies
119
166
 
120
- ### 🆒 Real-Time Data
167
+ Built entirely on modern, battle-tested web standards:
121
168
 
122
- Every view in the CMS supports real-time data, making it suitable for displaying
123
- constantly updated information.
169
+ | Technology | What we use it for |
170
+ |---|---|
171
+ | 💙 **TypeScript 5.x** | End-to-end type safety |
172
+ | ⚛️ **React 19** | Component-driven UI |
173
+ | 🌊 **Tailwind CSS v4** | Utility-first styling |
174
+ | 🔌 **WebSockets** | Real-time synchronization |
175
+ | 🗄️ **Drizzle ORM** | Type-safe SQL migrations and queries |
176
+ | 🧱 **Radix UI** | Accessible UI primitives |
177
+ | 📝 **TipTap v3** | Rich text editing |
178
+ | 🌐 **Hono** | Ultrafast HTTP server framework |
124
179
 
125
- Forms also support this feature, with any modified value in the database being
126
- updated in any open form view as long as it hasn't been touched by the user.
127
- This enables advanced cases where a Cloud Function is triggered after saving an
128
- entity, modifying some values, and requiring real-time updates.
180
+ ---
129
181
 
130
- ### 🗂️ File Storage
182
+ ## 📦 Packages
131
183
 
132
- Rebase supports uploading files to Firebase Storage out of the box and provides
133
- specific fields for handling single and multiple file uploads, as well as
134
- reordering.
184
+ Rebase is structured as a modular monorepo install only the layers you need:
135
185
 
136
- You can replace the Firebase Storage implementation with your own.
186
+ | Package | Description |
187
+ |---|---|
188
+ | `@rebasepro/types` | Core TypeScript type definitions |
189
+ | `@rebasepro/utils` | Shared utility functions |
190
+ | `@rebasepro/common` | Common modules shared across packages |
191
+ | `@rebasepro/formex` | Lightweight form management library |
192
+ | `@rebasepro/ui` | Standalone React component library (Tailwind + Radix) |
193
+ | `@rebasepro/core` | Core CMS logic and controllers |
194
+ | `@rebasepro/client` | Client-side data access layer |
195
+ | `@rebasepro/client-postgresql` | PostgreSQL client adapter |
196
+ | `@rebasepro/client-firebase` | Firebase/Firestore client adapter |
197
+ | `@rebasepro/server-core` | Server framework and middleware (Hono) |
198
+ | `@rebasepro/server-postgresql` | PostgreSQL server adapter with Drizzle |
199
+ | `@rebasepro/server-mongodb` | MongoDB server adapter |
200
+ | `@rebasepro/auth` | Authentication controllers and login views |
201
+ | `@rebasepro/admin` | Full admin panel interface |
202
+ | `@rebasepro/studio` | SQL editor, RLS editor, schema visualizer, API explorer |
203
+ | `@rebasepro/cli` | CLI for project scaffolding and management |
204
+ | `@rebasepro/sdk-generator` | TypeScript SDK code generation |
205
+ | `@rebasepro/mcp-server` | MCP server for AI integrations |
206
+ | `@rebasepro/schema-inference` | Database schema introspection and inference |
207
+ | `@rebasepro/plugin-data-enhancement` | AI-powered data enhancement plugin |
208
+ | `@rebasepro/plugin-insights` | Analytics and insights plugin |
137
209
 
138
- ## Included example
210
+ ---
139
211
 
140
- You can access the code for the demo project under
141
- [`example`](https://github.com/rebasepro/rebase/tree/master/example). It includes
142
- every feature provided by this CMS.
212
+ ## 🎨 Standalone UI Library
143
213
 
144
- Keep in mind you need to update the dependencies in that project if you want to
145
- use it as it is, without linking it to the library source code. More details in
146
- its README
214
+ Rebase exposes its design system as a completely independent library. Fully typed, accessible, and customizable via Tailwind CSS v4:
147
215
 
148
- ## Contact and support
216
+ ```bash
217
+ npm install @rebasepro/ui
218
+ ```
149
219
 
150
- If you need general support, you can open a GitHub issue.
220
+ ---
151
221
 
152
- Do you need consulting setting up your Firestore-based CMS in no time? We are
153
- happy to help!
154
- `hello@rebase.pro`
222
+ ## Demo
155
223
 
156
- ## Development
224
+ Explore a live interactive sandbox with all features — data resets periodically:
157
225
 
158
- If you would like to make changes to the source, feel free to submit a PR!
226
+ **👉 [demo.rebase.pro](https://demo.rebase.pro)**
159
227
 
160
- When developing, the core library can be found under `lib`.
161
- There is an example project in the folder `example`.
228
+ ---
162
229
 
163
- In order to run the project, you need to create a file
164
- called `firebase_config.ts`
165
- in `example/src`.
230
+ ## Support & Community
166
231
 
167
- That file needs to export a valid Firebase config, that you can get
168
- from your Firebase console when creating a webapp for your project.
232
+ - 📖 [Documentation](https://rebase.pro/docs)
233
+ - 💬 [Discord Community](https://discord.gg/fxy7xsQm3m)
234
+ - 🐛 [GitHub Issues](https://github.com/rebasepro/rebase/issues)
235
+ - 📝 [Changelog](./CHANGELOG.md)
169
236
 
170
- Then simply run `npm install` and `npm run dev` (or `yarn` and `yarn dev`)
237
+ ---
171
238
 
172
239
  ## License
173
240
 
174
- MIT © [Rebase](https://github.com/Rebaseco)
241
+ Rebase is open-source and licensed under the **MIT License**.
242
+ See the full [License](https://github.com/rebasepro/rebase/blob/main/LICENSE) for details.
@@ -61,11 +61,6 @@ export interface LoginViewProps {
61
61
  * Error message when user is not allowed access
62
62
  */
63
63
  notAllowedError?: string | Error;
64
- /**
65
- * Override: enable Google login button.
66
- * If not set, checks `authController.capabilities.googleLogin`.
67
- */
68
- googleEnabled?: boolean;
69
64
  /**
70
65
  * Google client ID for Google OAuth.
71
66
  * Required when Google login is enabled via ID token flow.
@@ -87,4 +82,4 @@ export interface LoginViewProps {
87
82
  * Feature-detects capabilities to show/hide login methods.
88
83
  * @group Core
89
84
  */
90
- export declare function LoginView({ logo, authController, noUserComponent, disableSignupScreen, disabled, notAllowedError, googleEnabled, googleClientId, needsSetup, registrationEnabled }: LoginViewProps): import("react/jsx-runtime").JSX.Element;
85
+ export declare function LoginView({ logo, authController, noUserComponent, disableSignupScreen, disabled, notAllowedError, googleClientId, needsSetup, registrationEnabled }: LoginViewProps): import("react/jsx-runtime").JSX.Element;
@@ -1,2 +1,2 @@
1
1
  import React, { PropsWithChildren } from "react";
2
- export declare const SnackbarProvider: React.FC<PropsWithChildren<{}>>;
2
+ export declare const SnackbarProvider: React.FC<PropsWithChildren>;
@@ -4,7 +4,7 @@ import { RebaseData } from "@rebasepro/types";
4
4
  /**
5
5
  * @group Hooks and utilities
6
6
  */
7
- export type SaveEntityWithCallbacksProps<M extends Record<string, any>> = SaveEntityProps<M> & {
7
+ export type SaveEntityWithCallbacksProps<M extends Record<string, unknown>> = SaveEntityProps<M> & {
8
8
  afterSave?: (updatedEntity: Entity<M>) => void;
9
9
  afterSaveError?: (e: Error) => void;
10
10
  };
@@ -27,7 +27,7 @@ export type SaveEntityWithCallbacksProps<M extends Record<string, any>> = SaveEn
27
27
  * @param afterSaveError
28
28
  * @group Hooks and utilities
29
29
  */
30
- export declare function saveEntityWithCallbacks<M extends Record<string, any>>({ collection, path, entityId, values, previousValues, status, data, context, afterSave, afterSaveError }: SaveEntityWithCallbacksProps<M> & {
30
+ export declare function saveEntityWithCallbacks<M extends Record<string, unknown>>({ collection, path, entityId, values, previousValues, status, data, context, afterSave, afterSaveError }: SaveEntityWithCallbacksProps<M> & {
31
31
  collection: EntityCollection;
32
32
  data: RebaseData;
33
33
  context: RebaseContext;
@@ -26,6 +26,11 @@ export interface EntityFetchResult<M extends Record<string, any>> {
26
26
  * @param entities - Array of entities to cache
27
27
  */
28
28
  export declare function populateEntityFetchCache<M extends Record<string, any>>(path: string, entities: Entity<M>[]): void;
29
+ /**
30
+ * Clear the entity fetch cache. Call this on auth state changes (e.g. logout)
31
+ * to prevent stale data from a previous session leaking into the next.
32
+ */
33
+ export declare function clearEntityFetchCache(): void;
29
34
  /**
30
35
  * This hook is used to fetch an entity.
31
36
  * It gives real time updates if the driver supports it.
@@ -35,7 +35,7 @@ import type { ComponentRef } from "@rebasepro/types";
35
35
  * </Suspense>
36
36
  * );
37
37
  * ```
38
- */
38
+ * */
39
39
  export declare function useResolvedComponent<P = unknown>(ref: ComponentRef<P> | undefined): React.ComponentType<P> | undefined;
40
40
  /**
41
41
  * Pure function version of the resolver, for use outside React components.