@apptimate/ui 6.0.0 → 6.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apptimate/ui",
-  "version": "6.0.0",
+  "version": "6.1.0",
   "main": "src/index.tsx",
   "types": "src/index.tsx",
   "dependencies": {

package/src/common-components/item-wizard/QuickItemWizard.tsx

@@ -0,0 +1,86 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import ItemFormWizard from "./ItemFormWizard";
+import { emptyFormData } from "./ItemFormWizard";
+import { createItem } from "@apptimate/core-lib";
+import toast from "react-hot-toast";
+
+interface Props {
+  isOpen: boolean;
+  onClose: () => void;
+  onSuccess?: (newItem: any) => void;
+}
+
+export function QuickItemWizard({ isOpen, onClose, onSuccess }: Props) {
+  const [formData, setFormData] = useState<any>(emptyFormData);
+  const [uoms, setUoms] = useState<any[]>([]);
+
+  useEffect(() => {
+    if (isOpen) {
+      setFormData(emptyFormData);
+      fetchLookups();
+    }
+  }, [isOpen]);
+
+  const fetchLookups = async () => {
+    try {
+      const { lookupUoms } = await import("@apptimate/core-lib");
+      const uomRes = await lookupUoms();
+      if (uomRes.is_success) setUoms(uomRes.result || []);
+    } catch { }
+  };
+
+  const handleSubmit = async () => {
+    try {
+      if (!formData.name || !formData.sku || !formData.category_id || !formData.uom_id) {
+        toast.error("Please fill required fields (Name, SKU, Category, UOM)");
+        return;
+      }
+      
+      const payload: any = {
+        ...formData,
+        sale_price: parseFloat(formData.sale_price) || 0,
+        cost_price: parseFloat(formData.cost_price) || 0,
+        min_stock_level: formData.min_stock_level ? parseFloat(formData.min_stock_level) : null,
+        max_stock_level: formData.max_stock_level ? parseFloat(formData.max_stock_level) : null,
+        reorder_point: formData.reorder_point ? parseFloat(formData.reorder_point) : null,
+        reorder_qty: formData.reorder_qty ? parseFloat(formData.reorder_qty) : null,
+        lead_time_days: formData.lead_time_days ? parseInt(formData.lead_time_days) : null,
+        weight: formData.weight ? parseFloat(formData.weight) : null,
+        variants: formData.has_variants ? formData.variants.map((v: any) => ({
+          ...v, sale_price: v.sale_price ? parseFloat(v.sale_price) : null,
+          cost_price: v.cost_price ? parseFloat(v.cost_price) : null,
+        })) : undefined,
+      };
+      
+      delete payload.category_name; 
+      delete payload.brand_name;
+
+      const res = await createItem(payload);
+      if (res.is_success) {
+        toast.success(res.message || "Item created successfully");
+        onClose();
+        if (onSuccess && res.result) {
+          onSuccess(res.result);
+        }
+      } else {
+        toast.error(res.message || "Failed to create item");
+      }
+    } catch (e: any) {
+      toast.error(e.message || "An error occurred while creating item");
+    }
+  };
+
+  return (
+    <ItemFormWizard
+      isOpen={isOpen}
+      onClose={onClose}
+      formData={formData}
+      setFormData={setFormData}
+      uoms={uoms}
+      onSubmit={handleSubmit}
+      isEditing={false}
+    />
+  );
+}

package/src/common-components/transaction/ProductSelectionPanel.tsx

@@ -3,7 +3,7 @@
 import React, { useState, useEffect, useCallback, useMemo } from 'react';
 import { cn } from '@apptimate/core-lib';
 import {
-  Search, ScanBarcode, X, ShoppingCart, Package, Loader2,
+  Search, ScanBarcode, X, ShoppingCart, Package, Loader2, Plus,
   Trash2, ChevronDown, ChevronRight, AlertTriangle, Tag
 } from 'lucide-react';
 import { Badge } from '../../base-components/Badge';
@@ -24,6 +24,7 @@ interface ProductSelectionPanelProps {
   onUpdateLine: (uid: string, updates: Partial<TransactionLineItem>) => void;
   onRemoveLine: (uid: string) => void;
   onToggleExpand: (uid: string) => void;
+  onAddNewItem?: (callbacks: { setItemSearch: (value: string) => void }) => void;
 }
 
 export function ProductSelectionPanel({
@@ -35,6 +36,7 @@ export function ProductSelectionPanel({
   onUpdateLine,
   onRemoveLine,
   onToggleExpand,
+  onAddNewItem,
 }: ProductSelectionPanelProps) {
   const [searchValue, setSearchValue] = useState('');
   const [searchResults, setSearchResults] = useState<TransactionItem[]>([]);
@@ -400,18 +402,22 @@ export function ProductSelectionPanel({
                 </button>
               }
             />
-            <div className="w-[1px] h-5 bg-border-subtle mx-1" />
-            <button
-              type="button"
-              onClick={() => inputRef.current?.focus()}
-              title="Click to focus input for barcode scanning"
-              className="flex items-center justify-center outline-none"
-            >
-              <ScanBarcode 
-                size={18} 
-                className="text-foreground-disabled shrink-0 cursor-pointer hover:text-primary transition-colors" 
-              />
-            </button>
+            {onAddNewItem && (
+              <>
+                <div className="w-[1px] h-5 bg-border-subtle mx-1" />
+                <button
+                  type="button"
+                  onClick={() => onAddNewItem({ setItemSearch: handleSearch })}
+                  title="Create new item"
+                  className="flex items-center justify-center outline-none mr-1"
+                >
+                  <Plus 
+                    size={18} 
+                    className="text-foreground-disabled shrink-0 cursor-pointer hover:text-primary transition-colors" 
+                  />
+                </button>
+              </>
+            )}
           </div>
         </div>
 

package/src/common-components/transaction/ProductTransactionScreen.tsx

@@ -30,6 +30,7 @@ export function ProductTransactionScreen({
   renderExtraMeta,
   fetchChequeLeaves,
   initialData,
+  onAddNewItem,
 }: ProductTransactionScreenProps) {
   // ── State ──
   const [lineItems, setLineItems] = useState<TransactionLineItem[]>([]);
@@ -469,6 +470,7 @@ export function ProductTransactionScreen({
             onUpdateLine={handleUpdateLine}
             onRemoveLine={handleRemoveLine}
             onToggleExpand={handleToggleExpand}
+            onAddNewItem={onAddNewItem}
           />
         </div>
 

package/src/common-components/transaction/types.ts

@@ -316,6 +316,8 @@ export interface ProductTransactionScreenProps {
   fetchChequeLeaves?: (query: string, page: number) => Promise<{ is_success: boolean; result?: any[] }>;
   /** Initial data for populating the transaction screen (e.g., from a PO) */
   initialData?: any;
+  /** Optional callback to create a new item directly from the search bar */
+  onAddNewItem?: (callbacks: { setItemSearch: (value: string) => void }) => void;
 }
 
 export interface TransactionPayload {

package/src/index.tsx

@@ -54,6 +54,7 @@ export * from './common-components/pickers/WarehousePicker';
 // Item Wizard
 export { default as ItemFormWizard } from './common-components/item-wizard/ItemFormWizard';
 export * from './common-components/item-wizard/ItemFormWizard';
+export * from './common-components/item-wizard/QuickItemWizard';
 export { default as SkuConfigModal } from './common-components/item-wizard/SkuConfigModal';
 export * from './common-components/item-wizard/SkuConfigModal';