npm - hey-pharmacist-ecommerce - Versions diffs - 1.0.0 → 1.0.2 - Mend

hey-pharmacist-ecommerce 1.0.0 → 1.0.2

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 (2) hide show

package/README.md +47 -214
package/package.json +8 -8

package/README.md CHANGED Viewed

@@ -1,71 +1,61 @@
-# Multi-Tenant E-commerce Package
+# Hey Pharmacist E-commerce Package
-A reusable, customizable e-commerce package for Next.js with dynamic theming, built for multi-tenant applications.
+A multi-tenant e-commerce package for Next.js applications with stunning design and full functionality.
 ## Features
-- 🎨 **Dynamic Theming** - Customize colors, logos, and store name per deployment
-- 🏪 **Multi-Tenant** - Automatic store ID injection in all API calls
-- 🛍️ **Complete E-commerce** - Products, cart, checkout, orders, user accounts
-- 💳 **Stripe Integration** - Secure checkout with Stripe payment links
-- 🔐 **Authentication** - JWT-based auth with token refresh
-- 📱 **Responsive Design** - Beautiful UI that works on all devices
-- ⚡ **Performance** - Built with Next.js 14, React 18, and Tailwind CSS
-- 🎭 **Animations** - Smooth transitions with Framer Motion
+- 🛒 **Complete E-commerce Flow**: Shop, cart, checkout, orders
+- 🎨 **Stunning Design**: Modern UI with smooth animations
+- 🔐 **Authentication**: Login, register, profile management
+- 💳 **Stripe Integration**: Secure payment processing
+- 🏪 **Multi-tenant**: Single package, multiple stores
+- 📱 **Responsive**: Works on all devices
+- ⚡ **Fast**: Optimized for performance
 ## Installation
 ```bash
-npm install @hey-pharmacist/ecommerce
-```
-### Peer Dependencies
-Make sure you have these installed in your project:
-```bash
-npm install react@^18.0.0 react-dom@^18.0.0 next@^14.0.0
+npm install hey-pharmacist-ecommerce react-hook-form @hookform/resolvers
 ```
 ## Quick Start
-### 1. Create Configuration
+### 1. Configure Your Store
-Create a configuration file for your store:
+Create a config file for your store:
 ```typescript
 // ecommerce.config.ts
-import { EcommerceConfig } from '@hey-pharmacist/ecommerce';
-export const config: EcommerceConfig = {
-  storeId: 'your-store-id',
-  storeName: 'Your Store Name',
-  logo: '/logo.png',
+export const ecommerceConfig = {
+  storeId: "your-store-id",
+  storeName: "Your Store Name",
+  logo: "/path/to/logo.png",
   colors: {
-    primary: '#3B82F6',   // Blue
-    secondary: '#8B5CF6', // Purple
-    accent: '#10B981',    // Green
+    primary: "#3B82F6",
+    secondary: "#1E40AF",
+    accent: "#F59E0B",
   },
-  apiBaseUrl: 'https://api.yourbackend.com',
-  stripePublicKey: 'pk_test_...',
+  apiBaseUrl: "https://your-api.com",
+  stripePublicKey: "pk_test_...",
 };
 ```
 ### 2. Wrap Your App
-In your root layout or `_app.tsx`:
-```typescript
-// app/layout.tsx (App Router)
-import { EcommerceProvider } from '@hey-pharmacist/ecommerce';
-import { config } from './ecommerce.config';
-import '@hey-pharmacist/ecommerce/styles/globals.css';
+```tsx
+// app/layout.tsx
+import { EcommerceProvider } from 'hey-pharmacist-ecommerce';
+import { ecommerceConfig } from './ecommerce.config';
-export default function RootLayout({ children }) {
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   return (
     <html lang="en">
       <body>
-        <EcommerceProvider config={config}>
+        <EcommerceProvider config={ecommerceConfig}>
           {children}
         </EcommerceProvider>
       </body>
@@ -74,11 +64,11 @@ export default function RootLayout({ children }) {
 }
 ```
-### 3. Use Screens in Your Pages
+### 3. Use the Screens
-```typescript
+```tsx
 // app/shop/page.tsx
-import { ShopScreen } from '@hey-pharmacist/ecommerce';
+import { ShopScreen } from 'hey-pharmacist-ecommerce';
 export default function ShopPage() {
   return <ShopScreen />;
@@ -87,183 +77,26 @@ export default function ShopPage() {
 ## Available Screens
-All screens are ready-to-use React components:
-- `<ShopScreen />` - Product listing with filters and search
-- `<ProductDetailScreen productId={id} />` - Product details and add to cart
-- `<CartScreen />` - Shopping cart management
-- `<CheckoutScreen />` - Checkout form with Stripe integration
+- `<ShopScreen />` - Product listing with filters
+- `<ProductDetailScreen />` - Individual product page
+- `<CartScreen />` - Shopping cart
+- `<CheckoutScreen />` - Checkout flow
 - `<LoginScreen />` - User login
 - `<RegisterScreen />` - User registration
-- `<ProfileScreen />` - User profile management
+- `<ProfileScreen />` - User profile
 - `<OrdersScreen />` - Order history
-- `<CurrentOrdersScreen />` - Active orders tracking
-## Components
-Reusable components for custom pages:
-```typescript
-import {
-  Header,
-  Footer,
-  ProductCard,
-  CartItem,
-  OrderCard,
-  Button,
-  Input,
-  Badge,
-  Modal,
-} from '@hey-pharmacist/ecommerce';
-```
-## Hooks
-Custom hooks for data fetching:
-```typescript
-import {
-  useAuth,
-  useCart,
-  useProducts,
-  useProduct,
-  useFeaturedProducts,
-  useCategories,
-  useOrders,
-  useCurrentOrders,
-} from '@hey-pharmacist/ecommerce';
-function MyComponent() {
-  const { user, login, logout } = useAuth();
-  const { cart, addToCart, removeFromCart } = useCart();
-  const { products, isLoading } = useProducts();
-  // ... your component logic
-}
-```
-## API Integration
-The package automatically handles:
-- Store ID injection in all requests
-- Authentication tokens
-- Token refresh
-- Error handling
-### Expected Backend Endpoints
-Your backend should implement these endpoints:
-**Products**
-- `GET /products` - List products (with pagination, filters)
-- `GET /products/:id` - Get product details
-- `GET /products/featured` - Get featured products
-- `GET /categories` - List categories
-**Cart**
-- `GET /cart` - Get user's cart
-- `POST /cart/items` - Add item to cart
-- `PUT /cart/items/:productId` - Update item quantity
-- `DELETE /cart/items/:productId` - Remove item from cart
-**Orders**
-- `GET /orders` - List user's orders
-- `GET /orders/current` - Get active orders
-- `GET /orders/:id` - Get order details
-- `POST /orders` - Create new order (returns Stripe checkout URL)
-**Auth**
-- `POST /auth/register` - Register new user
-- `POST /auth/login` - Login user
-- `GET /auth/me` - Get current user
-- `PUT /auth/profile` - Update profile
-- `POST /auth/logout` - Logout
-All requests include:
-- Header: `X-Store-Id: your-store-id`
-- Header: `Authorization: Bearer <token>` (when authenticated)
+- `<CurrentOrdersScreen />` - Active orders
-## Styling
+## Customization
-The package uses Tailwind CSS with CSS variables for dynamic theming. Include the styles:
+The package uses CSS variables for theming. Your colors are automatically applied throughout the interface.
-```typescript
-import '@hey-pharmacist/ecommerce/styles/globals.css';
-```
-### Customize Tailwind
-Extend the default Tailwind config if needed:
-```javascript
-// tailwind.config.js
-module.exports = {
-  content: [
-    './app/**/*.{js,ts,jsx,tsx}',
-    './node_modules/@hey-pharmacist/ecommerce/**/*.{js,ts,jsx,tsx}',
-  ],
-  // ... your config
-};
-```
-## Example Routes
+## Requirements
-Here's a complete routing setup:
-```
-/shop → <ShopScreen />
-/products/[id] → <ProductDetailScreen productId={id} />
-/cart → <CartScreen />
-/checkout → <CheckoutScreen />
-/login → <LoginScreen />
-/register → <RegisterScreen />
-/account → <ProfileScreen />
-/orders → <OrdersScreen />
-/orders/current → <CurrentOrdersScreen />
-```
-## TypeScript Support
-Full TypeScript support with exported types:
-```typescript
-import type {
-  EcommerceConfig,
-  Product,
-  Cart,
-  Order,
-  User,
-} from '@hey-pharmacist/ecommerce';
-```
-## Advanced Usage
-### Custom API Client
-If you need to make custom API calls:
-```typescript
-import { getApiClient } from '@hey-pharmacist/ecommerce';
-const apiClient = getApiClient();
-const response = await apiClient.get('/custom-endpoint');
-```
-### Direct API Access
-```typescript
-import { productsApi, authApi, cartApi, ordersApi } from '@hey-pharmacist/ecommerce';
-// Use API methods directly
-const products = await productsApi.getProducts({ category: 'electronics' });
-const order = await ordersApi.getOrder('order-id');
-```
+- React 18+
+- Next.js 14+
+- react-hook-form 7+
 ## License
-MIT
-## Support
-For issues and questions, please open an issue on GitHub.
+MIT

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "hey-pharmacist-ecommerce",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Multi-tenant e-commerce package for Next.js",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -16,13 +16,9 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "next": "^14.0.0",
     "axios": "^1.6.0",
     "framer-motion": "^10.16.0",
     "lucide-react": "^0.294.0",
-    "react-hook-form": "^7.48.0",
     "zod": "^3.22.0",
     "@hookform/resolvers": "^3.3.0",
     "sonner": "^1.2.0",
@@ -39,12 +35,17 @@
     "autoprefixer": "^10.4.0",
     "tsup": "^8.0.0",
     "eslint": "^8.0.0",
-    "eslint-config-next": "^14.0.0"
+    "eslint-config-next": "^14.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "next": "^14.0.0",
+    "react-hook-form": "^7.48.0"
   },
   "peerDependencies": {
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "next": "^14.0.0"
+    "next": "^14.0.0",
+    "react-hook-form": "^7.0.0"
   },
   "keywords": [
     "ecommerce",
@@ -67,4 +68,3 @@
   },
   "homepage": "https://github.com/yourusername/hey-pharmacist-customer#readme"
 }