@bailaya/react 1.0.14 → 1.0.15

package/README.md

@@ -6,39 +6,37 @@
 
 `@bailaya/react` builds on top of **@bailaya/core** to provide:
 
-- A **`BailayaProvider`** + **`useBailayaClient`** context  
-- 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  
+* A **`BailayaProvider`** + **`useBailayaClient`** context
+* 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
 
-Whether you need a quick `<StudioProfileCard />` or fine-grained hooks like `useClassesByType()`, this package has you covered.
+> Works **with or without Tailwind**. If you don’t use Tailwind, just override the class props (or use the render props) to apply your own styling.
 
 ## Features
 
-- **Context + client** (`BailayaProvider` + `useBailayaClient`)  
-- **Hooks** (all return `{ data, error, loading, refetch }`)  
-  - `useStudioProfile(overrideId?)`  
-  - `useUserProfile(userId)`  
-  - `useInstructors(overrideId?)`  
-  - `useClasses(from?, overrideId?)`  
-  - `useClassesByType(typeName, from?, overrideId?)`  
-- **Components** (all props overridable)  
-  - `<StudioProfileCard />`  
-  - `<UserProfileCard />`  
-  - `<InstructorList />`  
-  - `<ClassSchedule />`  
-  - `<ClassScheduleByType />`  
-  - `<StudioDescription />`
-- **Localization**  
-  - Select description by `locale` prop  
-  - Date formatting via Intl  
-  - Custom text labels  
+* **Context + client** (`BailayaProvider` + `useBailayaClient`)
+* **Hooks** (all return `{ data, error, loading, refetch }`)
+
+  * `useStudioProfile(overrideId?)`
+  * `useUserProfile(userId)`
+  * `useInstructors(overrideId?)`
+  * `useClasses(from?, overrideId?)`
+  * `useClassesByType(typeName, from?, overrideId?)`
+* **Components** (all props overridable)
+
+  * `<StudioProfileCard />`
+  * `<UserProfileCard />`
+  * `<InstructorList />`
+  * `<ClassSchedule />`
+  * `<ClassScheduleByType />`
+  * `<StudioDescription />`
 
 ## Installation
 
 ```bash
 npm install @bailaya/react
-````
+```
 
 or with Yarn:
 
@@ -51,6 +49,52 @@ yarn add @bailaya/react
 > * `"react": ">=17"`
 > * `"react-dom": ">=17"`
 
+---
+
+## Tailwind Setup (optional)
+
+If your app uses Tailwind, add this glob so JIT scans our package classes:
+
+```js
+// tailwind.config.js or tailwind.config.ts
+module.exports = {
+  content: [
+    './node_modules/@bailaya/**/*.{js,mjs,ts,tsx}',
+  ],
+}
+```
+
+> If you’re not using Tailwind, skip this section.
+
+---
+
+## Styling without Tailwind
+
+You can use all components in non-Tailwind projects:
+
+* Pass your own `className`/`*ClassName` props to inject your CSS classes.
+* Or use `renderItem` / `renderProfile` props to fully control markup.
+
+```tsx
+import { InstructorList } from '@bailaya/react'
+
+export function Team() {
+  return (
+    <InstructorList
+      className="team"
+      itemClassName="card"
+      imageWrapperClassName="avatarWrap"
+      imageClassName="avatar"
+      bodyClassName="cardBody"
+      nameClassName="cardTitle"
+      bioClassName="cardText"
+    />
+  )
+}
+```
+
+---
+
 ## Quick Start
 
 First, wrap your app with **BailayaProvider**:
@@ -69,8 +113,6 @@ export default function App() {
 }
 ```
 
----
-
 ### Using a Hook
 
 ```tsx
@@ -96,8 +138,6 @@ export function TeamSection() {
 }
 ```
 
----
-
 ### Using a Component
 
 ```tsx
@@ -107,10 +147,7 @@ import { StudioProfileCard } from "@bailaya/react";
 export function Dashboard() {
   return (
     <div className="max-w-md mx-auto">
-      <StudioProfileCard
-        locale="en"
-        className="bg-white rounded-lg shadow p-6"
-      />
+      <StudioProfileCard locale="en" />
     </div>
   );
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bailaya/react",
-  "version": "1.0.14",
+  "version": "1.0.15",
   "description": "A React component library for the BailaYa public API",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",