@bailaya/react 1.0.7 → 1.0.8

package/README.md

@@ -7,7 +7,7 @@
 `@bailaya/react` builds on top of **@bailaya/core** to provide:
 
 - A **`BailayaProvider`** + **`useBailayaClient`** context  
-- React Query–powered **hooks** for fetching all core data  
+- React **hooks** for fetching all core data (with `loading`, `error`, `data`, and `refetch`)  
 - **Components** with sensible Tailwind defaults (and full styling slots)  
 - Full TypeScript support, including localized text & date formatting  
 
@@ -16,7 +16,7 @@ Whether you need a quick `<StudioProfileCard />` or fine-grained hooks like `use
 ## Features
 
 - **Context + client** (`BailayaProvider` + `useBailayaClient`)  
-- **Hooks**  
+- **Hooks** (all return `{ data, error, loading, refetch }`)  
   - `useStudioProfile(overrideId?)`  
   - `useUserProfile(userId)`  
   - `useInstructors(overrideId?)`  
@@ -37,40 +37,34 @@ Whether you need a quick `<StudioProfileCard />` or fine-grained hooks like `use
 ## Installation
 
 ```bash
-npm install @bailaya/react @tanstack/react-query
+npm install @bailaya/react
 ````
 
 or with Yarn:
 
 ```bash
-yarn add @bailaya/react @tanstack/react-query
+yarn add @bailaya/react
 ```
 
 > **Peer Dependencies**
 >
 > * `"react": ">=17"`
 > * `"react-dom": ">=17"`
-> * `"@tanstack/react-query": ">=5"`
 
 ## Quick Start
 
-First, wrap your app with both **React Query** and **BailayaProvider**:
+First, wrap your app with **BailayaProvider**:
 
 ```tsx
 // App.tsx
 import React from "react";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { BailayaProvider } from "@bailaya/react";
 
-const queryClient = new QueryClient();
-
 export default function App() {
   return (
-    <QueryClientProvider client={queryClient}>
-      <BailayaProvider config={{ studioId: "YOUR_STUDIO_ID" }}>
-        {/* ...your app */}
-      </BailayaProvider>
-    </QueryClientProvider>
+    <BailayaProvider config={{ studioId: "YOUR_STUDIO_ID" }}>
+      {/* ...your app */}
+    </BailayaProvider>
   );
 }
 ```
@@ -84,17 +78,20 @@ import React from "react";
 import { useInstructors } from "@bailaya/react";
 
 export function TeamSection() {
-  const { data: instructors, isLoading, error } = useInstructors();
+  const { data: instructors, loading, error, refetch } = useInstructors();
 
-  if (isLoading) return <p>Loading...</p>;
+  if (loading) return <p>Loading...</p>;
   if (error) return <p>Error: {error.message}</p>;
 
   return (
-    <ul>
-      {instructors.map((i) => (
-        <li key={i.id}>{i.name} {i.lastname}</li>
-      ))}
-    </ul>
+    <>
+      <button onClick={refetch}>Refresh</button>
+      <ul>
+        {instructors?.map((i) => (
+          <li key={i.id}>{i.name} {i.lastname}</li>
+        ))}
+      </ul>
+    </>
   );
 }
 ```
@@ -132,15 +129,24 @@ Provides `useBailayaClient()` context.
 
 ### Hooks
 
-| Hook                                             | Description                                                          |
-|--------------------------------------------------| -------------------------------------------------------------------- |
-| `useStudioProfile(overrideId?)`                  | Fetch & parse a studio’s profile.                                    |
-| `useUserProfile(userId)`                         | Fetch & parse a user’s profile / bio.                                |
-| `useInstructors(overrideId?)`                    | Fetch & parse list of active instructors (owner, admin, instructor). |
-| `useClasses(from?, overrideId?)`                 | Fetch & parse next 7 days of classes (all types).                    |
-| `useClassesByType(typeName, from?, overrideId?)` | Fetch & parse next 7 days of classes filtered by `typeName`.         |
+All hooks return:
+
+```ts
+{
+  data: T | null;
+  error: Error | null;
+  loading: boolean;
+  refetch: () => Promise<void>;
+}
+```
 
-Each returns a **`UseQueryResult<..., Error>`**.
+| Hook                                             | Description                                                  |
+| ------------------------------------------------ | ------------------------------------------------------------ |
+| `useStudioProfile(overrideId?)`                  | Fetch a studio’s profile.                                    |
+| `useUserProfile(userId)`                         | Fetch a user’s profile / bio.                                |
+| `useInstructors(overrideId?)`                    | Fetch list of active instructors (owner, admin, instructor). |
+| `useClasses(from?, overrideId?)`                 | Fetch next 7 days of classes (all types).                    |
+| `useClassesByType(typeName, from?, overrideId?)` | Fetch next 7 days of classes filtered by `typeName`.         |
 
 ### Components
 
@@ -152,7 +158,7 @@ All components share:
 * **`renderItem`** for full JSX override
 
 | Component                 | Props                                                                                                                             |
-|---------------------------|-----------------------------------------------------------------------------------------------------------------------------------|
+| ------------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
 | `<StudioProfileCard />`   | `overrideId?`, `locale?`, `labels?`, `className?`, `nameClassName?`, `descriptionClassName?`, `labelClassName?`, `renderProfile?` |
 | `<UserProfileCard />`     | `userId`, `locale?`, `labels?`, `className?`, `nameClassName?`, `bioClassName?`, `renderProfile?`                                 |
 | `<InstructorList />`      | `overrideId?`, `renderItem?`, plus styling slots: `className?`, `itemClassName?`, `imageWrapperClassName?`, etc.                  |

package/dist/components/ClassSchedule.js

@@ -19,7 +19,7 @@ const LoadingIcon_1 = require("./ui/LoadingIcon");
  */
 const ClassSchedule = ({ from, overrideId, locale, labels = {}, className = 'mt-6 md:mt-12 space-y-4', itemClassName = 'p-4 bg-white rounded-lg shadow', nameClassName = 'font-semibold text-lg', detailsClassName = 'text-sm text-gray-600', instructorClassName = 'text-sm text-gray-800 mt-1', renderItem, }) => {
     var _a;
-    const { data: classes, isLoading, error } = (0, useClasses_1.useClasses)(from, overrideId);
+    const { data: classes, loading: isLoading, error } = (0, useClasses_1.useClasses)(from, overrideId);
     const weekdayFmt = new Intl.DateTimeFormat(locale !== null && locale !== void 0 ? locale : 'en', { weekday: 'long' });
     const dateFmt = new Intl.DateTimeFormat(locale !== null && locale !== void 0 ? locale : 'en', { month: 'short', day: 'numeric' });
     const instructorLabel = (_a = labels === null || labels === void 0 ? void 0 : labels.instructor) !== null && _a !== void 0 ? _a : 'Instructor:';

package/dist/components/ClassScheduleByType.js

@@ -18,7 +18,7 @@ const useClassesByType_1 = require("../hooks/useClassesByType");
  */
 const ClassScheduleByType = ({ typeName, from, overrideId, locale, labels = {}, className = 'mt-6 md:mt-12 space-y-4', itemClassName = 'p-4 bg-white rounded-lg shadow', nameClassName = 'font-semibold text-lg', detailsClassName = 'text-sm text-gray-600', instructorClassName = 'text-sm text-gray-800 mt-1', renderItem, }) => {
     var _a;
-    const { data: classes, isLoading, error } = (0, useClassesByType_1.useClassesByType)(typeName, from, overrideId);
+    const { data: classes, loading: isLoading, error } = (0, useClassesByType_1.useClassesByType)(typeName, from, overrideId);
     const weekdayFmt = new Intl.DateTimeFormat(locale !== null && locale !== void 0 ? locale : 'en', { weekday: 'long' });
     const dateFmt = new Intl.DateTimeFormat(locale !== null && locale !== void 0 ? locale : 'en', { month: 'short', day: 'numeric' });
     const instructorLabel = (_a = labels === null || labels === void 0 ? void 0 : labels.instructor) !== null && _a !== void 0 ? _a : 'Instructor:';

package/dist/components/InstructorList.js

@@ -16,7 +16,7 @@ const LoadingIcon_1 = require("./ui/LoadingIcon");
  * or completely replace the layout with `renderItem`.
  */
 const InstructorList = ({ overrideId, className = 'mt-6 md:mt-12 space-y-8', itemClassName = 'flex flex-col md:flex-row items-center rounded-lg border border-[#DCDCDC] shadow-lg overflow-hidden', imageWrapperClassName = 'w-full p-4 pb-0 md:pb-4 md:w-1/3 aspect-square', imageClassName = 'w-full h-full rounded-xl object-cover', bodyClassName = 'p-6 flex-1 text-left', nameClassName = 'text-xl md:text-3xl font-geologica font-semibold text-[#2A2343]', bioClassName = 'mt-2 text-xs md:text-xl font-sourcesans font-semibold text-[#464646]', renderItem, }) => {
-    const { data: instructors, isLoading, error } = (0, useInstructors_1.useInstructors)(overrideId);
+    const { data: instructors, loading: isLoading, error } = (0, useInstructors_1.useInstructors)(overrideId);
     if (isLoading) {
         return react_1.default.createElement("div", { className: className },
             react_1.default.createElement(LoadingIcon_1.LoadingIcon, null));

package/dist/components/StudioDescription.js

@@ -16,7 +16,7 @@ const LoadingIcon_1 = require("./ui/LoadingIcon");
  * - Safe text rendering (no HTML injection).
  */
 const StudioDescription = ({ overrideId, locale, className = '', paragraphClassName = 'text-xs md:text-2xl font-geologica text-[#464646]', render, }) => {
-    const { data: profile, isLoading, error } = (0, useStudioProfile_1.useStudioProfile)(overrideId);
+    const { data: profile, loading: isLoading, error } = (0, useStudioProfile_1.useStudioProfile)(overrideId);
     if (isLoading)
         return react_1.default.createElement("div", { className: className },
             react_1.default.createElement(LoadingIcon_1.LoadingIcon, null));

package/dist/components/StudioProfileCard.js

@@ -18,7 +18,7 @@ const LoadingIcon_1 = require("./ui/LoadingIcon");
  */
 const StudioProfileCard = ({ overrideId, locale, className = 'mt-6 md:mt-12 space-y-8', itemClassName = 'flex flex-col md:flex-row items-center rounded-lg border border-[#DCDCDC] shadow-lg overflow-hidden', imageWrapperClassName = 'w-full p-4 pb-0 md:pb-4 md:w-1/3 aspect-square', imageClassName = 'w-full h-full rounded-xl object-cover', bodyClassName = 'p-6 flex-1 text-left', nameClassName = 'text-xl md:text-3xl font-geologica font-semibold text-[#2A2343]', descriptionClassName = 'mt-2 text-xs md:text-lg font-sourcesans text-[#464646]', labelClassName = 'mt-1 text-sm text-gray-600', renderProfile, labels = {}, }) => {
     var _a, _b;
-    const { data: profile, isLoading, error } = (0, useStudioProfile_1.useStudioProfile)(overrideId);
+    const { data: profile, loading: isLoading, error } = (0, useStudioProfile_1.useStudioProfile)(overrideId);
     if (isLoading) {
         return react_1.default.createElement("div", { className: className },
             react_1.default.createElement(LoadingIcon_1.LoadingIcon, null));

package/dist/components/UserProfileCard.js

@@ -18,7 +18,7 @@ const LoadingIcon_1 = require("./ui/LoadingIcon");
  */
 const UserProfileCard = ({ userId, locale, className = 'mt-6 md:mt-12 space-y-8', itemClassName = 'flex flex-col md:flex-row items-center rounded-lg border border-[#DCDCDC] shadow-lg overflow-hidden', imageWrapperClassName = 'w-full p-4 pb-0 md:pb-4 md:w-1/3 aspect-square', imageClassName = 'w-full h-full rounded-xl object-cover', bodyClassName = 'p-6 flex-1 text-left', nameClassName = 'text-xl md:text-3xl font-geologica font-semibold text-[#2A2343]', bioClassName = 'mt-2 text-xs md:text-xl font-sourcesans font-semibold text-[#464646]', labelClassName = 'mt-1 text-sm text-gray-600', renderProfile, labels = {}, }) => {
     var _a, _b;
-    const { data: profile, isLoading, error } = (0, useUserProfile_1.useUserProfile)(userId);
+    const { data: profile, loading: isLoading, error } = (0, useUserProfile_1.useUserProfile)(userId);
     if (isLoading) {
         return react_1.default.createElement("div", { className: className },
             react_1.default.createElement(LoadingIcon_1.LoadingIcon, null));

package/dist/hooks/useClasses.d.ts

@@ -1,15 +1,16 @@
-import { UseQueryResult } from '@tanstack/react-query';
 import type { StudioClass } from '@bailaya/core';
+type UseClassesResult = {
+    data: StudioClass[] | null;
+    error: Error | null;
+    loading: boolean;
+    refetch: () => Promise<void>;
+};
 /**
  * Hook to fetch upcoming classes for a studio within a 7-day window.
  *
- * Utilizes the Bailaya API client from context and caches results with React Query.
- *
- * @param from - Optional Date object to start the 7-day window; defaults to today.
+ * @param from - Optional Date to start the 7-day window; defaults to today.
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with an array of `StudioClass` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider`.
  */
-export declare function useClasses(from?: Date, overrideId?: string): UseQueryResult<StudioClass[], Error>;
+export declare function useClasses(from?: Date, overrideId?: string): UseClassesResult;
+export {};
 //# sourceMappingURL=useClasses.d.ts.map

package/dist/hooks/useClasses.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useClasses.d.ts","sourceRoot":"","sources":["../../src/hooks/useClasses.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CACxB,IAAI,CAAC,EAAE,IAAI,EACX,UAAU,CAAC,EAAE,MAAM,GAClB,cAAc,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,CAUtC"}
+{"version":3,"file":"useClasses.d.ts","sourceRoot":"","sources":["../../src/hooks/useClasses.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,gBAAgB,CA+C7E"}

package/dist/hooks/useClasses.js

@@ -1,25 +1,60 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useClasses = useClasses;
-const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const BailayaProvider_1 = require("../context/BailayaProvider");
 /**
  * Hook to fetch upcoming classes for a studio within a 7-day window.
  *
- * Utilizes the Bailaya API client from context and caches results with React Query.
- *
- * @param from - Optional Date object to start the 7-day window; defaults to today.
+ * @param from - Optional Date to start the 7-day window; defaults to today.
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with an array of `StudioClass` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider`.
  */
 function useClasses(from, overrideId) {
     const client = (0, BailayaProvider_1.useBailayaClient)();
-    // Convert `from` to YYYY-MM-DD for the query key
-    const fromKey = from ? from.toISOString().split('T')[0] : 'today';
-    return (0, react_query_1.useQuery)({
-        queryKey: ['classes', fromKey],
-        queryFn: () => client.getClasses(from),
+    // Normalize `from` to a day key so the effect only re-runs when the day changes
+    const fromKey = (0, react_1.useMemo)(() => (from ? from.toISOString().split('T')[0] : 'today'), [from]);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    // Prevent race conditions when params change quickly
+    const seqRef = (0, react_1.useRef)(0);
+    const doFetch = () => __awaiter(this, void 0, void 0, function* () {
+        const seq = ++seqRef.current;
+        setLoading(true);
+        setError(null);
+        try {
+            const classes = yield client.getClasses(from, overrideId);
+            if (seq === seqRef.current) {
+                setData(classes);
+            }
+        }
+        catch (err) {
+            if (seq === seqRef.current) {
+                setError(err);
+            }
+        }
+        finally {
+            if (seq === seqRef.current) {
+                setLoading(false);
+            }
+        }
     });
+    (0, react_1.useEffect)(() => {
+        doFetch();
+        // cleanup just bumps the sequence so late resolves are ignored
+        return () => {
+            seqRef.current++;
+        };
+        // Depend on the normalized key + overrideId + client
+    }, [client, fromKey, overrideId]);
+    return { data, error, loading, refetch: doFetch };
 }

package/dist/hooks/useClassesByType.d.ts

@@ -1,16 +1,17 @@
-import { UseQueryResult } from '@tanstack/react-query';
 import type { StudioClass } from '@bailaya/core';
+type UseClassesByTypeResult = {
+    data: StudioClass[] | null;
+    error: Error | null;
+    loading: boolean;
+    refetch: () => Promise<void>;
+};
 /**
  * Hook to fetch upcoming classes of a specific dance type for a studio within a 7-day window.
  *
- * Utilizes the Bailaya API client from context and caches results with React Query.
- *
- * @param typeName - Name of the dance type to filter by (e.g., "Salsa").
- * @param from - Optional start `Date` for the 7-day window; defaults to today.
+ * @param typeName - Name of the dance type (e.g., "Salsa").
+ * @param from - Optional start Date for the 7-day window; defaults to today.
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with an array of `StudioClass` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider` or if `typeName` is missing.
  */
-export declare function useClassesByType(typeName: string, from?: Date, overrideId?: string): UseQueryResult<StudioClass[], Error>;
+export declare function useClassesByType(typeName: string, from?: Date, overrideId?: string): UseClassesByTypeResult;
+export {};
 //# sourceMappingURL=useClassesByType.d.ts.map

package/dist/hooks/useClassesByType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useClassesByType.d.ts","sourceRoot":"","sources":["../../src/hooks/useClassesByType.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;;;;;GAWG;AACH,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,MAAM,EAChB,IAAI,CAAC,EAAE,IAAI,EACX,UAAU,CAAC,EAAE,MAAM,GAClB,cAAc,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,CAatC"}
+{"version":3,"file":"useClassesByType.d.ts","sourceRoot":"","sources":["../../src/hooks/useClassesByType.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,KAAK,sBAAsB,GAAG;IAC5B,IAAI,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAEF;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC5B,QAAQ,EAAE,MAAM,EAChB,IAAI,CAAC,EAAE,IAAI,EACX,UAAU,CAAC,EAAE,MAAM,GACpB,sBAAsB,CA6CxB"}

package/dist/hooks/useClassesByType.js

@@ -1,28 +1,61 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useClassesByType = useClassesByType;
-const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const BailayaProvider_1 = require("../context/BailayaProvider");
 /**
  * Hook to fetch upcoming classes of a specific dance type for a studio within a 7-day window.
  *
- * Utilizes the Bailaya API client from context and caches results with React Query.
- *
- * @param typeName - Name of the dance type to filter by (e.g., "Salsa").
- * @param from - Optional start `Date` for the 7-day window; defaults to today.
+ * @param typeName - Name of the dance type (e.g., "Salsa").
+ * @param from - Optional start Date for the 7-day window; defaults to today.
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with an array of `StudioClass` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider` or if `typeName` is missing.
  */
 function useClassesByType(typeName, from, overrideId) {
-    const client = (0, BailayaProvider_1.useBailayaClient)();
     if (!typeName) {
         throw new Error('useClassesByType requires a typeName argument');
     }
-    const fromKey = from ? from.toISOString().split('T')[0] : 'today';
-    return (0, react_query_1.useQuery)({
-        queryKey: ['classesByType', typeName, overrideId !== null && overrideId !== void 0 ? overrideId : 'default', fromKey],
-        queryFn: () => client.getClasses(from),
+    const client = (0, BailayaProvider_1.useBailayaClient)();
+    // Normalize keys so effect only re-runs when they *meaningfully* change.
+    const fromKey = (0, react_1.useMemo)(() => (from ? from.toISOString().split('T')[0] : 'today'), [from]);
+    const normType = (0, react_1.useMemo)(() => typeName.trim().toLowerCase(), [typeName]);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    // Prevent stale updates when inputs change quickly or on unmount.
+    const seqRef = (0, react_1.useRef)(0);
+    const doFetch = () => __awaiter(this, void 0, void 0, function* () {
+        const seq = ++seqRef.current;
+        setLoading(true);
+        setError(null);
+        try {
+            const classes = yield client.getClassesByType(normType, from, overrideId);
+            if (seq === seqRef.current)
+                setData(classes);
+        }
+        catch (err) {
+            if (seq === seqRef.current)
+                setError(err);
+        }
+        finally {
+            if (seq === seqRef.current)
+                setLoading(false);
+        }
     });
+    (0, react_1.useEffect)(() => {
+        doFetch();
+        return () => {
+            // invalidate any in-flight requests
+            seqRef.current++;
+        };
+    }, [client, fromKey, normType, overrideId]);
+    return { data, error, loading, refetch: doFetch };
 }

package/dist/hooks/useInstructors.d.ts

@@ -1,15 +1,15 @@
-import { UseQueryResult } from '@tanstack/react-query';
 import type { Instructor } from '@bailaya/core';
+type UseInstructorsResult = {
+    data: Instructor[] | null;
+    error: Error | null;
+    loading: boolean;
+    refetch: () => Promise<void>;
+};
 /**
  * Hook to fetch the list of instructors for a studio.
  *
- * Utilizes the Bailaya API client from context to retrieve instructor data
- * and caches results using React Query.
- *
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result containing an array of `Instructor` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider`.
  */
-export declare function useInstructors(overrideId?: string): UseQueryResult<Instructor[], Error>;
+export declare function useInstructors(overrideId?: string): UseInstructorsResult;
+export {};
 //# sourceMappingURL=useInstructors.d.ts.map

package/dist/hooks/useInstructors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useInstructors.d.ts","sourceRoot":"","sources":["../../src/hooks/useInstructors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAC5B,UAAU,CAAC,EAAE,MAAM,GAClB,cAAc,CAAC,UAAU,EAAE,EAAE,KAAK,CAAC,CAOrC"}
+{"version":3,"file":"useInstructors.d.ts","sourceRoot":"","sources":["../../src/hooks/useInstructors.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;IAC1B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,oBAAoB,CAqCxE"}

package/dist/hooks/useInstructors.js

@@ -1,23 +1,55 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useInstructors = useInstructors;
-const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const BailayaProvider_1 = require("../context/BailayaProvider");
 /**
  * Hook to fetch the list of instructors for a studio.
  *
- * Utilizes the Bailaya API client from context to retrieve instructor data
- * and caches results using React Query.
- *
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result containing an array of `Instructor` objects,
- *          or an error if the fetch fails.
- * @throws If used outside of a `BailayaProvider`.
  */
 function useInstructors(overrideId) {
     const client = (0, BailayaProvider_1.useBailayaClient)();
-    return (0, react_query_1.useQuery)({
-        queryKey: ['instructors', overrideId !== null && overrideId !== void 0 ? overrideId : 'default'],
-        queryFn: () => client.getInstructors(overrideId),
+    // Normalize to a stable key so effect only fires on meaningful changes
+    const idKey = (0, react_1.useMemo)(() => overrideId !== null && overrideId !== void 0 ? overrideId : 'default', [overrideId]);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    // Sequence guard to avoid race conditions on quick prop changes / unmount
+    const seqRef = (0, react_1.useRef)(0);
+    const doFetch = () => __awaiter(this, void 0, void 0, function* () {
+        const seq = ++seqRef.current;
+        setLoading(true);
+        setError(null);
+        try {
+            const instructors = yield client.getInstructors(overrideId);
+            if (seq === seqRef.current)
+                setData(instructors);
+        }
+        catch (err) {
+            if (seq === seqRef.current)
+                setError(err);
+        }
+        finally {
+            if (seq === seqRef.current)
+                setLoading(false);
+        }
     });
+    (0, react_1.useEffect)(() => {
+        doFetch();
+        return () => {
+            // invalidate any in-flight request
+            seqRef.current++;
+        };
+    }, [client, idKey]);
+    return { data, error, loading, refetch: doFetch };
 }

package/dist/hooks/useStudioProfile.d.ts

@@ -1,10 +1,15 @@
-import { UseQueryResult } from '@tanstack/react-query';
 import type { StudioProfile } from '@bailaya/core';
+type UseStudioProfileResult = {
+    data: StudioProfile | null;
+    error: Error | null;
+    loading: boolean;
+    refetch: () => Promise<void>;
+};
 /**
  * Hook to fetch the studio profile.
  *
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with the `StudioProfile` object.
  */
-export declare function useStudioProfile(overrideId?: string): UseQueryResult<StudioProfile, Error>;
+export declare function useStudioProfile(overrideId?: string): UseStudioProfileResult;
+export {};
 //# sourceMappingURL=useStudioProfile.d.ts.map

package/dist/hooks/useStudioProfile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStudioProfile.d.ts","sourceRoot":"","sources":["../../src/hooks/useStudioProfile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,UAAU,CAAC,EAAE,MAAM,GAClB,cAAc,CAAC,aAAa,EAAE,KAAK,CAAC,CAOtC"}
+{"version":3,"file":"useStudioProfile.d.ts","sourceRoot":"","sources":["../../src/hooks/useStudioProfile.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnD,KAAK,sBAAsB,GAAG;IAC5B,IAAI,EAAE,aAAa,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,sBAAsB,CAqC5E"}

package/dist/hooks/useStudioProfile.js

@@ -1,18 +1,55 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useStudioProfile = useStudioProfile;
-const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const BailayaProvider_1 = require("../context/BailayaProvider");
 /**
  * Hook to fetch the studio profile.
  *
  * @param overrideId - Optional studio ID to override the default configured ID.
- * @returns A React Query result with the `StudioProfile` object.
  */
 function useStudioProfile(overrideId) {
     const client = (0, BailayaProvider_1.useBailayaClient)();
-    return (0, react_query_1.useQuery)({
-        queryKey: ['instructors', overrideId !== null && overrideId !== void 0 ? overrideId : 'default'],
-        queryFn: () => client.getStudioProfile(overrideId),
+    // Stable dependency key so effect only fires on meaningful changes
+    const idKey = (0, react_1.useMemo)(() => overrideId !== null && overrideId !== void 0 ? overrideId : 'default', [overrideId]);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    // Prevent stale state updates if inputs change quickly or on unmount
+    const seqRef = (0, react_1.useRef)(0);
+    const doFetch = () => __awaiter(this, void 0, void 0, function* () {
+        const seq = ++seqRef.current;
+        setLoading(true);
+        setError(null);
+        try {
+            const profile = yield client.getStudioProfile(overrideId);
+            if (seq === seqRef.current)
+                setData(profile);
+        }
+        catch (err) {
+            if (seq === seqRef.current)
+                setError(err);
+        }
+        finally {
+            if (seq === seqRef.current)
+                setLoading(false);
+        }
     });
+    (0, react_1.useEffect)(() => {
+        doFetch();
+        return () => {
+            // invalidate any in-flight promise
+            seqRef.current++;
+        };
+    }, [client, idKey]);
+    return { data, error, loading, refetch: doFetch };
 }

package/dist/hooks/useUserProfile.d.ts

@@ -1,12 +1,16 @@
-import { UseQueryResult } from '@tanstack/react-query';
 import type { UserProfile } from '@bailaya/core';
+type UseUserProfileResult = {
+    data: UserProfile | null;
+    error: Error | null;
+    loading: boolean;
+    refetch: () => Promise<void>;
+};
 /**
  * Hook to fetch a user’s profile by their ID.
  *
- * Wraps the BailayaClient.getUserProfile call in React Query.
- *
  * @param userId - The ID of the user to fetch.
- * @returns A React Query result containing a `UserProfile` or an error.
+ * @returns { data, error, loading, refetch }
  */
-export declare function useUserProfile(userId: string): UseQueryResult<UserProfile, Error>;
+export declare function useUserProfile(userId: string): UseUserProfileResult;
+export {};
 //# sourceMappingURL=useUserProfile.d.ts.map

package/dist/hooks/useUserProfile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useUserProfile.d.ts","sourceRoot":"","sources":["../../src/hooks/useUserProfile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAC5B,MAAM,EAAE,MAAM,GACb,cAAc,CAAC,WAAW,EAAE,KAAK,CAAC,CAOpC"}
+{"version":3,"file":"useUserProfile.d.ts","sourceRoot":"","sources":["../../src/hooks/useUserProfile.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,oBAAoB,CA6CnE"}

package/dist/hooks/useUserProfile.js

@@ -1,20 +1,62 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useUserProfile = useUserProfile;
-const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const BailayaProvider_1 = require("../context/BailayaProvider");
 /**
  * Hook to fetch a user’s profile by their ID.
  *
- * Wraps the BailayaClient.getUserProfile call in React Query.
- *
  * @param userId - The ID of the user to fetch.
- * @returns A React Query result containing a `UserProfile` or an error.
+ * @returns { data, error, loading, refetch }
  */
 function useUserProfile(userId) {
     const client = (0, BailayaProvider_1.useBailayaClient)();
-    return (0, react_query_1.useQuery)({
-        queryKey: ['userProfile', userId],
-        queryFn: () => client.getUserProfile(userId),
+    // Stable key so the effect only re-runs on meaningful change
+    const idKey = (0, react_1.useMemo)(() => userId || 'missing', [userId]);
+    const [data, setData] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    // Prevent race conditions on quick param changes / unmount
+    const seqRef = (0, react_1.useRef)(0);
+    const doFetch = () => __awaiter(this, void 0, void 0, function* () {
+        const seq = ++seqRef.current;
+        if (!userId) {
+            setData(null);
+            setError(new Error('useUserProfile requires a userId'));
+            setLoading(false);
+            return;
+        }
+        setLoading(true);
+        setError(null);
+        try {
+            const profile = yield client.getUserProfile(userId);
+            if (seq === seqRef.current)
+                setData(profile);
+        }
+        catch (err) {
+            if (seq === seqRef.current)
+                setError(err);
+        }
+        finally {
+            if (seq === seqRef.current)
+                setLoading(false);
+        }
     });
+    (0, react_1.useEffect)(() => {
+        doFetch();
+        return () => {
+            // invalidate any in-flight request
+            seqRef.current++;
+        };
+    }, [client, idKey]);
+    return { data, error, loading, refetch: doFetch };
 }

package/dist/types.d.ts

@@ -2,8 +2,4 @@
  * Core API data structures re-exported from @bailaya/core for convenience.
  */
 export type { RawStudioProfile, StudioProfile, RawStudioType, StudioType, RawUserProfile, UserProfile, RawInstructor, Instructor, RawStudioClass, StudioClass, } from '@bailaya/core';
-/**
- * React Query result types for library hooks.
- */
-export type { UseQueryResult, } from '@tanstack/react-query';
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,YAAY,EACV,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,UAAU,EACV,cAAc,EACd,WAAW,EACX,aAAa,EACb,UAAU,EACV,cAAc,EACd,WAAW,GACZ,MAAM,eAAe,CAAC;AAEvB;;GAEG;AACH,YAAY,EACV,cAAc,GACf,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,YAAY,EACV,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,UAAU,EACV,cAAc,EACd,WAAW,EACX,aAAa,EACb,UAAU,EACV,cAAc,EACd,WAAW,GACZ,MAAM,eAAe,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bailaya/react",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "A React component library for the BailaYa public API",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -13,11 +13,9 @@
   },
   "peerDependencies": {
     "react": ">=17.0.0 <20.0.0",
-    "react-dom": ">=17.0.0 <20.0.0",
-    "@tanstack/react-query": ">=5"
+    "react-dom": ">=17.0.0 <20.0.0"
   },
   "devDependencies": {
-    "@tanstack/react-query": "^5.84.1",
     "@types/jest": "^30.0.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",