@instantdb/react - npm Package Compare versions

Comparing version 0.5.14 to 0.5.15

dist/index.d.ts

@@ -1,54 +0,53 @@
-import { getLocalId as getLocalIdCore, Config, transact as transactCore } from "@instantdb/core";
-export declare function init(config: Config): any;
-type QueryState<T> = {
-    isLoading: true;
-    error: undefined;
-    data: undefined;
-} | {
-    isLoading: false;
-    error: {
-        message: string;
-    };
-    data: undefined;
-} | {
-    isLoading: false;
-    error: undefined;
-    data: T;
-};
-export declare function useQuery<T = any>(_query: any): QueryState<T>;
-export type User = {
-    id: string;
-    email: string;
-};
-type AuthState = {
-    isLoading: true;
-    error: undefined;
-    user: undefined;
-} | {
-    isLoading: false;
-    error: {
-        message: string;
-    };
-    user: undefined;
-} | {
-    isLoading: false;
-    error: undefined;
-    user: User;
-};
-export declare function useAuth(): AuthState;
-export declare const auth: {
-    sendMagicCode(params: {
-        email: string;
-    }): any;
-    verifyMagicCode(params: {
-        email: string;
-        code: string;
-    }): any;
-    signOut(): void;
-};
-export declare const id: (<T extends ArrayLike<number>>(options: import("uuid").V4Options, buffer: T, offset?: number) => T) & ((options?: import("uuid").V4Options) => string);
-export declare const tx: import("@instantdb/core/dist/module/instatx").EmptyChunk;
-export declare const transact: typeof transactCore;
-export declare const getLocalId: typeof getLocalIdCore;
-export {};
+import { tx, id, getLocalId, Config, transact, auth, Query, QueryResponse, InstantObject, Exactly, QueryState, AuthState, User } from "@instantdb/core";
+/**
+ *
+ * The first step: init your application!
+ *
+ * Visit https://instantdb.com/dash to get your `appId` :)
+ *
+ * @example
+ *  init({appId: "my-app-id"})
+ */
+declare function init(config: Config): any;
+/**
+ * Use this to query your data!
+ *
+ * @see https://docs.instantdb.com/docs/instaql
+ *
+ * @example
+ *  // listen to all goals
+ *  useQuery({ goals: {} })
+ *
+ *  // goals where the title is "Get Fit"
+ *  useQuery({ goals: { $: { where: { title: "Get Fit" } } } })
+ *
+ *  // all goals, _alongside_ their todos
+ *  useQuery({ goals: { todos: {} } })
+ */
+declare function useQuery<Q extends Query>(_query: Exactly<Query, Q>): QueryState<Q>;
+/**
+ * Listen for the logged in state. This is useful
+ * for deciding when to show a login screen.
+ *
+ * Check out the docs for an example `Login` component too!
+ *
+ * @see https://docs.instantdb.com/docs/auth
+ * @example
+ *  function App() {
+ *    const { isLoading, user, error } = useAuth()
+ *    if (isLoading) {
+ *      return <div>Loading...</div>
+ *    }
+ *    if (error) {
+ *      return <div>Uh oh! {error.message}</div>
+ *    }
+ *    if (user) {
+ *      return <Main user={user} />
+ *    }
+ *    return <Login />
+ *  }
+ *
+ */
+declare function useAuth(): AuthState;
+export { Config, Query, QueryResponse, InstantObject, auth, id, tx, transact, getLocalId, useAuth, User, AuthState, useQuery, init, };
 //# sourceMappingURL=index.d.ts.map

dist/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getLocalId = exports.transact = exports.tx = exports.id = exports.auth = exports.useAuth = exports.useQuery = exports.init = void 0;
+exports.init = exports.useQuery = exports.useAuth = exports.getLocalId = exports.transact = exports.tx = exports.id = exports.auth = void 0;
 const core_1 = require("@instantdb/core");
+Object.defineProperty(exports, "tx", { enumerable: true, get: function () { return core_1.tx; } });
+Object.defineProperty(exports, "id", { enumerable: true, get: function () { return core_1.id; } });
+Object.defineProperty(exports, "getLocalId", { enumerable: true, get: function () { return core_1.getLocalId; } });
+Object.defineProperty(exports, "transact", { enumerable: true, get: function () { return core_1.transact; } });
+Object.defineProperty(exports, "auth", { enumerable: true, get: function () { return core_1.auth; } });
 const react_1 = require("react");
+/**
+ *
+ * The first step: init your application!
+ *
+ * Visit https://instantdb.com/dash to get your `appId` :)
+ *
+ * @example
+ *  init({appId: "my-app-id"})
+ */
 function init(config) {
@@ -10,2 +24,17 @@ return (0, core_1.init)(config);
 exports.init = init;
+/**
+ * Use this to query your data!
+ *
+ * @see https://docs.instantdb.com/docs/instaql
+ *
+ * @example
+ *  // listen to all goals
+ *  useQuery({ goals: {} })
+ *
+ *  // goals where the title is "Get Fit"
+ *  useQuery({ goals: { $: { where: { title: "Get Fit" } } } })
+ *
+ *  // all goals, _alongside_ their todos
+ *  useQuery({ goals: { todos: {} } })
+ */
 function useQuery(_query) {
@@ -31,4 +60,29 @@ const query = (0, core_1.coerceQuery)(_query);
 exports.useQuery = useQuery;
+/**
+ * Listen for the logged in state. This is useful
+ * for deciding when to show a login screen.
+ *
+ * Check out the docs for an example `Login` component too!
+ *
+ * @see https://docs.instantdb.com/docs/auth
+ * @example
+ *  function App() {
+ *    const { isLoading, user, error } = useAuth()
+ *    if (isLoading) {
+ *      return <div>Loading...</div>
+ *    }
+ *    if (error) {
+ *      return <div>Uh oh! {error.message}</div>
+ *    }
+ *    if (user) {
+ *      return <Main user={user} />
+ *    }
+ *    return <Login />
+ *  }
+ *
+ */
 function useAuth() {
     const db = (0, core_1.getDB)();
+    // (XXX): Don't set `isLoading` true if we already have data, would
+    // be better to immediately show loaded data
     const [state, setState] = (0, react_1.useState)({
@@ -48,7 +102,2 @@ isLoading: true,
 exports.useAuth = useAuth;
-exports.auth = core_1.auth;
-exports.id = core_1.id;
-exports.tx = core_1.tx;
-exports.transact = core_1.transact;
-exports.getLocalId = core_1.getLocalId;
 //# sourceMappingURL=index.js.map

dist/module/index.d.ts

@@ -1,54 +0,53 @@
-import { getLocalId as getLocalIdCore, Config, transact as transactCore } from "@instantdb/core";
-export declare function init(config: Config): any;
-type QueryState<T> = {
-    isLoading: true;
-    error: undefined;
-    data: undefined;
-} | {
-    isLoading: false;
-    error: {
-        message: string;
-    };
-    data: undefined;
-} | {
-    isLoading: false;
-    error: undefined;
-    data: T;
-};
-export declare function useQuery<T = any>(_query: any): QueryState<T>;
-export type User = {
-    id: string;
-    email: string;
-};
-type AuthState = {
-    isLoading: true;
-    error: undefined;
-    user: undefined;
-} | {
-    isLoading: false;
-    error: {
-        message: string;
-    };
-    user: undefined;
-} | {
-    isLoading: false;
-    error: undefined;
-    user: User;
-};
-export declare function useAuth(): AuthState;
-export declare const auth: {
-    sendMagicCode(params: {
-        email: string;
-    }): any;
-    verifyMagicCode(params: {
-        email: string;
-        code: string;
-    }): any;
-    signOut(): void;
-};
-export declare const id: (<T extends ArrayLike<number>>(options: import("uuid").V4Options, buffer: T, offset?: number) => T) & ((options?: import("uuid").V4Options) => string);
-export declare const tx: import("@instantdb/core/dist/module/instatx").EmptyChunk;
-export declare const transact: typeof transactCore;
-export declare const getLocalId: typeof getLocalIdCore;
-export {};
+import { tx, id, getLocalId, Config, transact, auth, Query, QueryResponse, InstantObject, Exactly, QueryState, AuthState, User } from "@instantdb/core";
+/**
+ *
+ * The first step: init your application!
+ *
+ * Visit https://instantdb.com/dash to get your `appId` :)
+ *
+ * @example
+ *  init({appId: "my-app-id"})
+ */
+declare function init(config: Config): any;
+/**
+ * Use this to query your data!
+ *
+ * @see https://docs.instantdb.com/docs/instaql
+ *
+ * @example
+ *  // listen to all goals
+ *  useQuery({ goals: {} })
+ *
+ *  // goals where the title is "Get Fit"
+ *  useQuery({ goals: { $: { where: { title: "Get Fit" } } } })
+ *
+ *  // all goals, _alongside_ their todos
+ *  useQuery({ goals: { todos: {} } })
+ */
+declare function useQuery<Q extends Query>(_query: Exactly<Query, Q>): QueryState<Q>;
+/**
+ * Listen for the logged in state. This is useful
+ * for deciding when to show a login screen.
+ *
+ * Check out the docs for an example `Login` component too!
+ *
+ * @see https://docs.instantdb.com/docs/auth
+ * @example
+ *  function App() {
+ *    const { isLoading, user, error } = useAuth()
+ *    if (isLoading) {
+ *      return <div>Loading...</div>
+ *    }
+ *    if (error) {
+ *      return <div>Uh oh! {error.message}</div>
+ *    }
+ *    if (user) {
+ *      return <Main user={user} />
+ *    }
+ *    return <Login />
+ *  }
+ *
+ */
+declare function useAuth(): AuthState;
+export { Config, Query, QueryResponse, InstantObject, auth, id, tx, transact, getLocalId, useAuth, User, AuthState, useQuery, init, };
 //# sourceMappingURL=index.d.ts.map

dist/module/index.js

@@ -1,7 +0,31 @@
-import { getDB, weakHash, tx as txCore, id as idCore, init as initCore, getLocalId as getLocalIdCore, transact as transactCore, coerceQuery, auth as authCore } from "@instantdb/core";
+import { getDB, weakHash, tx, id, init as initCore, getLocalId, transact, coerceQuery, auth } from "@instantdb/core";
 import { useEffect, useState } from "react";
-export function init(config) {
+/**
+ *
+ * The first step: init your application!
+ *
+ * Visit https://instantdb.com/dash to get your `appId` :)
+ *
+ * @example
+ *  init({appId: "my-app-id"})
+ */
+function init(config) {
     return initCore(config);
 }
-export function useQuery(_query) {
+/**
+ * Use this to query your data!
+ *
+ * @see https://docs.instantdb.com/docs/instaql
+ *
+ * @example
+ *  // listen to all goals
+ *  useQuery({ goals: {} })
+ *
+ *  // goals where the title is "Get Fit"
+ *  useQuery({ goals: { $: { where: { title: "Get Fit" } } } })
+ *
+ *  // all goals, _alongside_ their todos
+ *  useQuery({ goals: { todos: {} } })
+ */
+function useQuery(_query) {
     const query = coerceQuery(_query);
@@ -25,4 +49,29 @@ const db = getDB();
 }
-export function useAuth() {
+/**
+ * Listen for the logged in state. This is useful
+ * for deciding when to show a login screen.
+ *
+ * Check out the docs for an example `Login` component too!
+ *
+ * @see https://docs.instantdb.com/docs/auth
+ * @example
+ *  function App() {
+ *    const { isLoading, user, error } = useAuth()
+ *    if (isLoading) {
+ *      return <div>Loading...</div>
+ *    }
+ *    if (error) {
+ *      return <div>Uh oh! {error.message}</div>
+ *    }
+ *    if (user) {
+ *      return <Main user={user} />
+ *    }
+ *    return <Login />
+ *  }
+ *
+ */
+function useAuth() {
     const db = getDB();
+    // (XXX): Don't set `isLoading` true if we already have data, would
+    // be better to immediately show loaded data
     const [state, setState] = useState({
@@ -41,7 +90,3 @@ isLoading: true,
 }
-export const auth = authCore;
-export const id = idCore;
-export const tx = txCore;
-export const transact = transactCore;
-export const getLocalId = getLocalIdCore;
+export { auth, id, tx, transact, getLocalId, useAuth, useQuery, init, };
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@instantdb/react",
-  "version": "0.5.14",
+  "version": "0.5.15",
   "description": "Instant DB for React",
@@ -32,4 +32,4 @@ "main": "dist/index.js",
   "dependencies": {
-    "@instantdb/core": "0.5.14"
+    "@instantdb/core": "0.5.15"
   }
 }

src/index.ts

 import {
   getDB,
   weakHash,
-  tx as txCore,
-  id as idCore,
+  tx,
+  id,
   init as initCore,
-  getLocalId as getLocalIdCore,
+  getLocalId,
   Config,
-  transact as transactCore,
+  transact,
   coerceQuery,
-  auth as authCore
+  auth,
+  Query,
+  QueryResponse,
+  InstantObject,
+  Exactly,
+  QueryState,
+  AuthState,
+  User
 } from "@instantdb/core";
@@ -16,12 +23,31 @@
 
-export function init(config: Config) {
+/**
+ *
+ * The first step: init your application! 
+ * 
+ * Visit https://instantdb.com/dash to get your `appId` :)
+ *
+ * @example
+ *  init({appId: "my-app-id"})
+ */
+function init(config: Config) {
   return initCore(config);
 }
 
-type QueryState<T> =
-  | { isLoading: true; error: undefined; data: undefined }
-  | { isLoading: false; error: { message: string }; data: undefined }
-  | { isLoading: false; error: undefined; data: T };
-
-export function useQuery<T = any>(_query: any): QueryState<T> {
+/**
+ * Use this to query your data!
+ * 
+ * @see https://docs.instantdb.com/docs/instaql
+ * 
+ * @example
+ *  // listen to all goals
+ *  useQuery({ goals: {} })
+ * 
+ *  // goals where the title is "Get Fit"
+ *  useQuery({ goals: { $: { where: { title: "Get Fit" } } } })
+ * 
+ *  // all goals, _alongside_ their todos
+ *  useQuery({ goals: { todos: {} } })
+ */
+function useQuery<Q extends Query>(_query: Exactly<Query, Q>): QueryState<Q> {
   const query = coerceQuery(_query);
@@ -31,3 +57,3 @@ const db = getDB();
   // be better to immediately show loaded data
-  const [state, setState] = useState<QueryState<T>>({
+  const [state, setState] = useState<QueryState<Q>>({
     isLoading: true,
@@ -48,11 +74,29 @@ data: undefined,
 
-
-export type User = { id: string; email: string };
-type AuthState =
-  | { isLoading: true; error: undefined; user: undefined }
-  | { isLoading: false; error: { message: string }; user: undefined }
-  | { isLoading: false; error: undefined; user: User };
-
-export function useAuth(): AuthState {
+/**
+ * Listen for the logged in state. This is useful 
+ * for deciding when to show a login screen.
+ * 
+ * Check out the docs for an example `Login` component too!
+ * 
+ * @see https://docs.instantdb.com/docs/auth
+ * @example 
+ *  function App() {
+ *    const { isLoading, user, error } = useAuth()
+ *    if (isLoading) {
+ *      return <div>Loading...</div>
+ *    }
+ *    if (error) {
+ *      return <div>Uh oh! {error.message}</div>
+ *    }
+ *    if (user) {
+ *      return <Main user={user} />
+ *    }
+ *    return <Login />
+ *  }
+ * 
+ */
+function useAuth(): AuthState {
   const db = getDB();
+  // (XXX): Don't set `isLoading` true if we already have data, would
+  // be better to immediately show loaded data
   const [state, setState] = useState({
@@ -73,6 +117,18 @@ isLoading: true,
 
-export const auth = authCore;
-export const id = idCore;
-export const tx = txCore;
-export const transact = transactCore;
-export const getLocalId = getLocalIdCore;
+export {
+  Config,
+  Query,
+  QueryResponse,
+  InstantObject,
+  auth,
+  id,
+  tx,
+  transact,
+  getLocalId,
+  useAuth,
+  User,
+  AuthState,
+  useQuery,
+  init,
+};
+

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17690

increased by15.89%

Lines of code

440

increased by51.72%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@instantdb/core@0.5.15(transitive)

• - Removed@instantdb/core@0.5.14(transitive)

• Updated@instantdb/core@0.5.15