@burdenoff/microfe-adaptercloud 2026.624.1 → 2026.625.1

package/dist/adaptercloud/pages/customer/PaymentMethodsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodsPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/PaymentMethodsPage.tsx"],"sourcesContent":["/**\n * Payment Methods Page\n * @module adaptercloud/pages/customer\n *\n * Manage saved payment methods: UPI IDs, credit/debit cards, wallets.\n * Add Payment Method modal with type selection (Card/UPI/Wallet),\n * conditional forms, Quick Pay Options section (Cash on Delivery,\n * Pay at Cart), form state management, grouped display, security badge.\n */\n\nimport { useState } from 'react';\nimport {\n  CreditCard,\n  Smartphone,\n  Wallet,\n  Plus,\n  Trash2,\n  CheckCircle2,\n  Shield,\n  X,\n  Banknote,\n  ShoppingCart,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface PaymentMethod {\n  id: string;\n  type: 'upi' | 'card' | 'wallet';\n  label: string;\n  detail: string;\n  icon: typeof CreditCard;\n  isDefault: boolean;\n}\n\ninterface CardFormState {\n  cardNumber: string;\n  expiry: string;\n  cvv: string;\n  nameOnCard: string;\n}\n\ninterface UpiFormState {\n  upiId: string;\n}\n\ninterface WalletFormState {\n  walletProvider: string;\n  mobile: string;\n}\n\n// ============================================================================\n// Mock Data\n// ============================================================================\n\nconst initialMethods: PaymentMethod[] = [\n  {\n    id: 'pm-1',\n    type: 'upi',\n    label: 'Google Pay',\n    detail: 'priya@okaxis',\n    icon: Smartphone,\n    isDefault: true,\n  },\n  {\n    id: 'pm-2',\n    type: 'upi',\n    label: 'PhonePe',\n    detail: 'priya@ybl',\n    icon: Smartphone,\n    isDefault: false,\n  },\n  {\n    id: 'pm-3',\n    type: 'card',\n    label: 'HDFC Credit Card',\n    detail: '**** **** **** 4242',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-4',\n    type: 'card',\n    label: 'SBI Debit Card',\n    detail: '**** **** **** 8765',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-5',\n    type: 'wallet',\n    label: 'AdapterCloud Wallet',\n    detail: 'Balance: \\u20B9 1,250.00',\n    icon: Wallet,\n    isDefault: false,\n  },\n];\n\n// ============================================================================\n// Payment Method Row\n// ============================================================================\n\nfunction PaymentMethodRow({\n  method,\n  onRemove,\n  onSetDefault,\n}: {\n  method: PaymentMethod;\n  onRemove: (id: string) => void;\n  onSetDefault: (id: string) => void;\n}) {\n  const Icon = method.icon;\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-4 rounded-lg border p-4',\n        method.isDefault ? 'border-foreground/30 bg-accent/50' : 'border-border-subtle bg-bg-surface'\n      )}\n    >\n      <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n        <Icon className=\"h-5 w-5 text-text-secondary\" />\n      </div>\n\n      <div className=\"flex-1 min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <p className=\"text-sm font-medium text-text-primary\">{method.label}</p>\n          {method.isDefault && (\n            <span className=\"inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400\">\n              <CheckCircle2 className=\"h-3 w-3\" />\n              Default\n            </span>\n          )}\n        </div>\n        <p className=\"mt-0.5 text-xs text-text-secondary font-mono\">{method.detail}</p>\n      </div>\n\n      <div className=\"flex items-center gap-1\">\n        {!method.isDefault && (\n          <button\n            type=\"button\"\n            onClick={() => onSetDefault(method.id)}\n            title=\"Set as default\"\n            className=\"rounded-md px-2 py-1 text-xs text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n          >\n            Set Default\n          </button>\n        )}\n        <button\n          type=\"button\"\n          onClick={() => onRemove(method.id)}\n          title=\"Remove payment method\"\n          className=\"rounded-md p-2 text-text-secondary hover:bg-status-error-bg/10 hover:text-status-error-text transition-colors\"\n        >\n          <Trash2 className=\"h-4 w-4\" />\n        </button>\n      </div>\n    </div>\n  );\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function PaymentMethodsPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [methods, setMethods] = useState<PaymentMethod[]>(initialMethods);\n  const [showAddModal, setShowAddModal] = useState(false);\n  const [selectedType, setSelectedType] = useState<'card' | 'upi' | 'wallet'>('card');\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n\n  // Form states\n  const [cardForm, setCardForm] = useState<CardFormState>({\n    cardNumber: '',\n    expiry: '',\n    cvv: '',\n    nameOnCard: '',\n  });\n  const [upiForm, setUpiForm] = useState<UpiFormState>({ upiId: '' });\n  const [walletForm, setWalletForm] = useState<WalletFormState>({\n    walletProvider: 'Paytm',\n    mobile: '',\n  });\n\n  const showStatus = (msg: string) => {\n    setStatusMessage(msg);\n    setTimeout(() => setStatusMessage(null), 3000);\n  };\n\n  const resetForms = () => {\n    setCardForm({ cardNumber: '', expiry: '', cvv: '', nameOnCard: '' });\n    setUpiForm({ upiId: '' });\n    setWalletForm({ walletProvider: 'Paytm', mobile: '' });\n    setSelectedType('card');\n  };\n\n  const handleRemove = (id: string) => {\n    setMethods((prev) => prev.filter((m) => m.id !== id));\n    showStatus('Payment method removed');\n  };\n\n  const handleSetDefault = (id: string) => {\n    setMethods((prev) => prev.map((m) => ({ ...m, isDefault: m.id === id })));\n    showStatus('Default payment method updated');\n  };\n\n  const handleAddPaymentMethod = () => {\n    let label = '';\n    let detail = '';\n    let icon = CreditCard;\n\n    if (selectedType === 'card') {\n      if (\n        !cardForm.cardNumber.trim() ||\n        !cardForm.expiry.trim() ||\n        !cardForm.cvv.trim() ||\n        !cardForm.nameOnCard.trim()\n      ) {\n        alert('Please fill in all card fields.');\n        return;\n      }\n      label = `${cardForm.nameOnCard}'s Card`;\n      detail = `**** **** **** ${cardForm.cardNumber.slice(-4)}`;\n      icon = CreditCard;\n    } else if (selectedType === 'upi') {\n      if (!upiForm.upiId.trim()) {\n        alert('Please enter a UPI ID.');\n        return;\n      }\n      label = 'UPI';\n      detail = upiForm.upiId;\n      icon = Smartphone;\n    } else {\n      if (!walletForm.mobile.trim()) {\n        alert('Please enter mobile number.');\n        return;\n      }\n      label = walletForm.walletProvider;\n      detail = `Mobile: ${walletForm.mobile}`;\n      icon = Wallet;\n    }\n\n    const newMethod: PaymentMethod = {\n      id: `pm-${Date.now()}`,\n      type: selectedType,\n      label,\n      detail,\n      icon,\n      isDefault: false,\n    };\n\n    setMethods((prev) => [...prev, newMethod]);\n    resetForms();\n    setShowAddModal(false);\n    showStatus('Payment method added successfully');\n  };\n\n  const grouped = {\n    upi: methods.filter((m) => m.type === 'upi'),\n    card: methods.filter((m) => m.type === 'card'),\n    wallet: methods.filter((m) => m.type === 'wallet'),\n  };\n\n  return (\n    <PageLayout\n      title=\"Payment Methods\"\n      description=\"Manage your saved payment options\"\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => setShowAddModal(true)}\n          className={cn(\n            'flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity',\n            'bg-foreground text-background hover:opacity-90'\n          )}\n        >\n          <Plus className=\"h-4 w-4\" />\n          Add Method\n        </button>\n      }\n    >\n      {/* Status message */}\n      {statusMessage && (\n        <div className=\"mb-4 rounded-lg border border-green-500/30 bg-green-500/10 p-3 flex items-center gap-2\">\n          <CheckCircle2 className=\"h-4 w-4 text-green-600 dark:text-green-400 shrink-0\" />\n          <p className=\"text-sm text-green-600 dark:text-green-400\">{statusMessage}</p>\n        </div>\n      )}\n\n      {methods.length > 0 ? (\n        <div className=\"space-y-6\">\n          {/* UPI */}\n          {grouped.upi.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Smartphone className=\"h-4 w-4 text-text-secondary\" />\n                UPI\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.upi.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Cards */}\n          {grouped.card.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <CreditCard className=\"h-4 w-4 text-text-secondary\" />\n                Cards\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.card.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Wallets */}\n          {grouped.wallet.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Wallet className=\"h-4 w-4 text-text-secondary\" />\n                Wallets\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.wallet.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Security note */}\n          <div className=\"flex items-start gap-3 rounded-lg border border-border-subtle bg-bg-surface p-4\">\n            <Shield className=\"mt-0.5 h-5 w-5 shrink-0 text-text-secondary\" />\n            <div>\n              <p className=\"text-sm font-medium text-text-primary\">Secure Payments</p>\n              <p className=\"mt-0.5 text-xs text-text-secondary\">\n                Your payment information is encrypted and securely stored. We never share your\n                financial details with third parties.\n              </p>\n            </div>\n          </div>\n        </div>\n      ) : (\n        <EmptyState\n          icon={<CreditCard className=\"h-12 w-12\" />}\n          title=\"No payment methods\"\n          description=\"Add a payment method to make faster checkouts.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => setShowAddModal(true)}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Add Payment Method\n            </button>\n          }\n        />\n      )}\n\n      {/* Quick Pay Options */}\n      <div className=\"mt-8\">\n        <h2 className=\"text-base font-semibold text-text-primary mb-4\">Quick Pay Options</h2>\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <Banknote className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Cash on Delivery</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay when you receive your order</p>\n            <div className=\"flex items-center gap-2 text-green-600 dark:text-green-400\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Available for all orders</span>\n            </div>\n          </div>\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <ShoppingCart className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Pay at Cart</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay directly to the vendor</p>\n            <div className=\"flex items-center gap-2 text-green-600 dark:text-green-400\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Supports all payment methods</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Add Payment Method Modal */}\n      {showAddModal && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg\">\n            <div className=\"p-5\">\n              {/* Header */}\n              <div className=\"flex items-center justify-between mb-4\">\n                <h2 className=\"text-lg font-semibold text-text-primary\">Add Payment Method</h2>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-4 w-4\" />\n                </button>\n              </div>\n              <p className=\"text-sm text-text-secondary mb-5\">\n                Choose a payment method to add to your account\n              </p>\n\n              {/* Type Selection */}\n              <div className=\"space-y-2 mb-5\">\n                {[\n                  {\n                    value: 'card' as const,\n                    label: 'Credit/Debit Card',\n                    sub: 'Visa, Mastercard, Rupay',\n                    Icon: CreditCard,\n                  },\n                  {\n                    value: 'upi' as const,\n                    label: 'UPI',\n                    sub: 'Google Pay, PhonePe, Paytm',\n                    Icon: Smartphone,\n                  },\n                  {\n                    value: 'wallet' as const,\n                    label: 'Wallet',\n                    sub: 'Paytm, Amazon Pay, Mobikwik',\n                    Icon: Wallet,\n                  },\n                ].map(({ value, label, sub, Icon }) => (\n                  <label\n                    key={value}\n                    className={cn(\n                      'flex items-center gap-3 rounded-lg border p-3 cursor-pointer transition-colors',\n                      selectedType === value\n                        ? 'border-foreground bg-accent'\n                        : 'border-border-subtle hover:bg-accent'\n                    )}\n                  >\n                    <input\n                      type=\"radio\"\n                      name=\"paymentType\"\n                      value={value}\n                      checked={selectedType === value}\n                      onChange={() => setSelectedType(value)}\n                      className=\"h-4 w-4 shrink-0\"\n                    />\n                    <Icon className=\"h-5 w-5 text-text-secondary shrink-0\" />\n                    <div>\n                      <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n                      <p className=\"text-xs text-text-secondary\">{sub}</p>\n                    </div>\n                  </label>\n                ))}\n              </div>\n\n              {/* Card Form */}\n              {selectedType === 'card' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Card Number\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"1234 5678 9012 3456\"\n                      value={cardForm.cardNumber}\n                      onChange={(e) => setCardForm((p) => ({ ...p, cardNumber: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                  <div className=\"grid grid-cols-2 gap-3\">\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                        Expiry Date\n                      </label>\n                      <input\n                        type=\"text\"\n                        placeholder=\"MM/YY\"\n                        value={cardForm.expiry}\n                        onChange={(e) => setCardForm((p) => ({ ...p, expiry: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">CVV</label>\n                      <input\n                        type=\"password\"\n                        placeholder=\"123\"\n                        value={cardForm.cvv}\n                        onChange={(e) => setCardForm((p) => ({ ...p, cvv: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Name on Card\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"John Doe\"\n                      value={cardForm.nameOnCard}\n                      onChange={(e) => setCardForm((p) => ({ ...p, nameOnCard: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* UPI Form */}\n              {selectedType === 'upi' && (\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1\">UPI ID</label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"yourname@paytm\"\n                    value={upiForm.upiId}\n                    onChange={(e) => setUpiForm({ upiId: e.target.value })}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              )}\n\n              {/* Wallet Form */}\n              {selectedType === 'wallet' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Select Wallet\n                    </label>\n                    <select\n                      value={walletForm.walletProvider}\n                      onChange={(e) =>\n                        setWalletForm((p) => ({ ...p, walletProvider: e.target.value }))\n                      }\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    >\n                      <option>Paytm</option>\n                      <option>Amazon Pay</option>\n                      <option>Mobikwik</option>\n                      <option>Freecharge</option>\n                    </select>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Mobile Number\n                    </label>\n                    <input\n                      type=\"tel\"\n                      placeholder=\"9876543210\"\n                      value={walletForm.mobile}\n                      onChange={(e) => setWalletForm((p) => ({ ...p, mobile: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* Actions */}\n              <div className=\"flex items-center gap-3 pt-5\">\n                <button\n                  type=\"button\"\n                  onClick={handleAddPaymentMethod}\n                  className=\"flex-1 rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  Add Payment Method\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"PaymentMethodsPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/PaymentMethodsPage.tsx"],"sourcesContent":["/**\n * Payment Methods Page\n * @module adaptercloud/pages/customer\n *\n * Manage saved payment methods: UPI IDs, credit/debit cards, wallets.\n * Add Payment Method modal with type selection (Card/UPI/Wallet),\n * conditional forms, Quick Pay Options section (Cash on Delivery,\n * Pay at Cart), form state management, grouped display, security badge.\n */\n\nimport { useState } from'react';\nimport {\n  CreditCard,\n  Smartphone,\n  Wallet,\n  Plus,\n  Trash2,\n  CheckCircle2,\n  Shield,\n  X,\n  Banknote,\n  ShoppingCart,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { cn } from'../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface PaymentMethod {\n  id: string;\n  type: 'upi' | 'card' | 'wallet';\n  label: string;\n  detail: string;\n  icon: typeof CreditCard;\n  isDefault: boolean;\n}\n\ninterface CardFormState {\n  cardNumber: string;\n  expiry: string;\n  cvv: string;\n  nameOnCard: string;\n}\n\ninterface UpiFormState {\n  upiId: string;\n}\n\ninterface WalletFormState {\n  walletProvider: string;\n  mobile: string;\n}\n\n// ============================================================================\n// Mock Data\n// ============================================================================\n\nconst initialMethods: PaymentMethod[] = [\n  {\n    id: 'pm-1',\n    type: 'upi',\n    label: 'Google Pay',\n    detail: 'priya@okaxis',\n    icon: Smartphone,\n    isDefault: true,\n  },\n  {\n    id: 'pm-2',\n    type: 'upi',\n    label: 'PhonePe',\n    detail: 'priya@ybl',\n    icon: Smartphone,\n    isDefault: false,\n  },\n  {\n    id: 'pm-3',\n    type: 'card',\n    label: 'HDFC Credit Card',\n    detail: '**** **** **** 4242',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-4',\n    type: 'card',\n    label: 'SBI Debit Card',\n    detail: '**** **** **** 8765',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-5',\n    type: 'wallet',\n    label: 'AdapterCloud Wallet',\n    detail: 'Balance: \\u20B9 1,250.00',\n    icon: Wallet,\n    isDefault: false,\n  },\n];\n\n// ============================================================================\n// Payment Method Row\n// ============================================================================\n\nfunction PaymentMethodRow({\n  method,\n  onRemove,\n  onSetDefault,\n}: {\n  method: PaymentMethod;\n  onRemove: (id: string) => void;\n  onSetDefault: (id: string) => void;\n}) {\n  const Icon = method.icon;\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-4 rounded-lg border p-4',\n        method.isDefault ? 'border-foreground/30 bg-accent/50' : 'border-border-subtle bg-bg-surface'\n      )}\n    >\n      <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n        <Icon className=\"h-5 w-5 text-text-secondary\" />\n      </div>\n\n      <div className=\"flex-1 min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <p className=\"text-sm font-medium text-text-primary\">{method.label}</p>\n          {method.isDefault && (\n            <span className=\"inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text\">\n              <CheckCircle2 className=\"h-3 w-3\" />\n              Default\n            </span>\n          )}\n        </div>\n        <p className=\"mt-0.5 text-xs text-text-secondary font-mono\">{method.detail}</p>\n      </div>\n\n      <div className=\"flex items-center gap-1\">\n        {!method.isDefault && (\n          <button\n            type=\"button\"\n            onClick={() => onSetDefault(method.id)}\n            title=\"Set as default\"\n            className=\"rounded-md px-2 py-1 text-xs text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n          >\n            Set Default\n          </button>\n        )}\n        <button\n          type=\"button\"\n          onClick={() => onRemove(method.id)}\n          title=\"Remove payment method\"\n          className=\"rounded-md p-2 text-text-secondary hover:bg-status-error-bg/10 hover:text-status-error-text transition-colors\"\n        >\n          <Trash2 className=\"h-4 w-4\" />\n        </button>\n      </div>\n    </div>\n  );\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function PaymentMethodsPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [methods, setMethods] = useState<PaymentMethod[]>(initialMethods);\n  const [showAddModal, setShowAddModal] = useState(false);\n  const [selectedType, setSelectedType] = useState<'card' | 'upi' | 'wallet'>('card');\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n\n  // Form states\n  const [cardForm, setCardForm] = useState<CardFormState>({\n    cardNumber: '',\n    expiry: '',\n    cvv: '',\n    nameOnCard: '',\n  });\n  const [upiForm, setUpiForm] = useState<UpiFormState>({ upiId: '' });\n  const [walletForm, setWalletForm] = useState<WalletFormState>({\n    walletProvider: 'Paytm',\n    mobile: '',\n  });\n\n  const showStatus = (msg: string) => {\n    setStatusMessage(msg);\n    setTimeout(() => setStatusMessage(null), 3000);\n  };\n\n  const resetForms = () => {\n    setCardForm({ cardNumber: '', expiry: '', cvv: '', nameOnCard: '' });\n    setUpiForm({ upiId: '' });\n    setWalletForm({ walletProvider: 'Paytm', mobile: '' });\n    setSelectedType('card');\n  };\n\n  const handleRemove = (id: string) => {\n    setMethods((prev) => prev.filter((m) => m.id !== id));\n    showStatus('Payment method removed');\n  };\n\n  const handleSetDefault = (id: string) => {\n    setMethods((prev) => prev.map((m) => ({ ...m, isDefault: m.id === id })));\n    showStatus('Default payment method updated');\n  };\n\n  const handleAddPaymentMethod = () => {\n    let label = '';\n    let detail = '';\n    let icon = CreditCard;\n\n    if (selectedType === 'card') {\n      if (\n        !cardForm.cardNumber.trim() ||\n        !cardForm.expiry.trim() ||\n        !cardForm.cvv.trim() ||\n        !cardForm.nameOnCard.trim()\n      ) {\n        alert('Please fill in all card fields.');\n        return;\n      }\n      label = `${cardForm.nameOnCard}'s Card`;\n      detail = `**** **** **** ${cardForm.cardNumber.slice(-4)}`;\n      icon = CreditCard;\n    } else if (selectedType === 'upi') {\n      if (!upiForm.upiId.trim()) {\n        alert('Please enter a UPI ID.');\n        return;\n      }\n      label = 'UPI';\n      detail = upiForm.upiId;\n      icon = Smartphone;\n    } else {\n      if (!walletForm.mobile.trim()) {\n        alert('Please enter mobile number.');\n        return;\n      }\n      label = walletForm.walletProvider;\n      detail = `Mobile: ${walletForm.mobile}`;\n      icon = Wallet;\n    }\n\n    const newMethod: PaymentMethod = {\n      id: `pm-${Date.now()}`,\n      type: selectedType,\n      label,\n      detail,\n      icon,\n      isDefault: false,\n    };\n\n    setMethods((prev) => [...prev, newMethod]);\n    resetForms();\n    setShowAddModal(false);\n    showStatus('Payment method added successfully');\n  };\n\n  const grouped = {\n    upi: methods.filter((m) => m.type === 'upi'),\n    card: methods.filter((m) => m.type === 'card'),\n    wallet: methods.filter((m) => m.type === 'wallet'),\n  };\n\n  return (\n    <PageLayout\n      title=\"Payment Methods\"\n      description=\"Manage your saved payment options\"\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => setShowAddModal(true)}\n          className={cn(\n            'flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity',\n            'bg-foreground text-background hover:opacity-90'\n          )}\n        >\n          <Plus className=\"h-4 w-4\" />\n          Add Method\n        </button>\n      }\n    >\n      {/* Status message */}\n      {statusMessage && (\n        <div className=\"mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2\">\n          <CheckCircle2 className=\"h-4 w-4 text-status-success-text shrink-0\" />\n          <p className=\"text-sm text-status-success-text\">{statusMessage}</p>\n        </div>\n      )}\n\n      {methods.length > 0 ? (\n        <div className=\"space-y-6\">\n          {/* UPI */}\n          {grouped.upi.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Smartphone className=\"h-4 w-4 text-text-secondary\" />\n                UPI\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.upi.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Cards */}\n          {grouped.card.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <CreditCard className=\"h-4 w-4 text-text-secondary\" />\n                Cards\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.card.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Wallets */}\n          {grouped.wallet.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Wallet className=\"h-4 w-4 text-text-secondary\" />\n                Wallets\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.wallet.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Security note */}\n          <div className=\"flex items-start gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 bg-gloss-card shadow-pop\">\n            <Shield className=\"mt-0.5 h-5 w-5 shrink-0 text-text-secondary\" />\n            <div>\n              <p className=\"text-sm font-medium text-text-primary\">Secure Payments</p>\n              <p className=\"mt-0.5 text-xs text-text-secondary\">\n                Your payment information is encrypted and securely stored. We never share your\n                financial details with third parties.\n              </p>\n            </div>\n          </div>\n        </div>\n      ) : (\n        <EmptyState\n          illustration=\"empty-generic\"\n          icon={<CreditCard className=\"h-12 w-12\" />}\n          title=\"No payment methods\"\n          description=\"Add a payment method to make faster checkouts.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => setShowAddModal(true)}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Add Payment Method\n            </button>\n          }\n        />\n      )}\n\n      {/* Quick Pay Options */}\n      <div className=\"mt-8\">\n        <h2 className=\"text-base font-semibold text-text-primary mb-4\">Quick Pay Options</h2>\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n          <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <Banknote className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Cash on Delivery</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay when you receive your order</p>\n            <div className=\"flex items-center gap-2 text-status-success-text\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Available for all orders</span>\n            </div>\n          </div>\n          <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <ShoppingCart className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Pay at Cart</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay directly to the vendor</p>\n            <div className=\"flex items-center gap-2 text-status-success-text\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Supports all payment methods</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Add Payment Method Modal */}\n      {showAddModal && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg\">\n            <div className=\"p-5\">\n              {/* Header */}\n              <div className=\"flex items-center justify-between mb-4\">\n                <h2 className=\"text-lg font-semibold text-text-primary\">Add Payment Method</h2>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-4 w-4\" />\n                </button>\n              </div>\n              <p className=\"text-sm text-text-secondary mb-5\">\n                Choose a payment method to add to your account\n              </p>\n\n              {/* Type Selection */}\n              <div className=\"space-y-2 mb-5\">\n                {[\n                  {\n                    value: 'card' as const,\n                    label: 'Credit/Debit Card',\n                    sub: 'Visa, Mastercard, Rupay',\n                    Icon: CreditCard,\n                  },\n                  {\n                    value: 'upi' as const,\n                    label: 'UPI',\n                    sub: 'Google Pay, PhonePe, Paytm',\n                    Icon: Smartphone,\n                  },\n                  {\n                    value: 'wallet' as const,\n                    label: 'Wallet',\n                    sub: 'Paytm, Amazon Pay, Mobikwik',\n                    Icon: Wallet,\n                  },\n                ].map(({ value, label, sub, Icon }) => (\n                  <label\n                    key={value}\n                    className={cn(\n                      'flex items-center gap-3 rounded-lg border p-3 cursor-pointer transition-colors',\n                      selectedType === value\n                        ? 'border-foreground bg-accent'\n                        : 'border-border-subtle hover:bg-accent'\n                    )}\n                  >\n                    <input\n                      type=\"radio\"\n                      name=\"paymentType\"\n                      value={value}\n                      checked={selectedType === value}\n                      onChange={() => setSelectedType(value)}\n                      className=\"h-4 w-4 shrink-0\"\n                    />\n                    <Icon className=\"h-5 w-5 text-text-secondary shrink-0\" />\n                    <div>\n                      <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n                      <p className=\"text-xs text-text-secondary\">{sub}</p>\n                    </div>\n                  </label>\n                ))}\n              </div>\n\n              {/* Card Form */}\n              {selectedType === 'card' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Card Number\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"1234 5678 9012 3456\"\n                      value={cardForm.cardNumber}\n                      onChange={(e) => setCardForm((p) => ({ ...p, cardNumber: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                  <div className=\"grid grid-cols-2 gap-3\">\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                        Expiry Date\n                      </label>\n                      <input\n                        type=\"text\"\n                        placeholder=\"MM/YY\"\n                        value={cardForm.expiry}\n                        onChange={(e) => setCardForm((p) => ({ ...p, expiry: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">CVV</label>\n                      <input\n                        type=\"password\"\n                        placeholder=\"123\"\n                        value={cardForm.cvv}\n                        onChange={(e) => setCardForm((p) => ({ ...p, cvv: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Name on Card\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"John Doe\"\n                      value={cardForm.nameOnCard}\n                      onChange={(e) => setCardForm((p) => ({ ...p, nameOnCard: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* UPI Form */}\n              {selectedType === 'upi' && (\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1\">UPI ID</label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"yourname@paytm\"\n                    value={upiForm.upiId}\n                    onChange={(e) => setUpiForm({ upiId: e.target.value })}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              )}\n\n              {/* Wallet Form */}\n              {selectedType === 'wallet' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Select Wallet\n                    </label>\n                    <select\n                      value={walletForm.walletProvider}\n                      onChange={(e) =>\n                        setWalletForm((p) => ({ ...p, walletProvider: e.target.value }))\n                      }\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    >\n                      <option>Paytm</option>\n                      <option>Amazon Pay</option>\n                      <option>Mobikwik</option>\n                      <option>Freecharge</option>\n                    </select>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Mobile Number\n                    </label>\n                    <input\n                      type=\"tel\"\n                      placeholder=\"9876543210\"\n                      value={walletForm.mobile}\n                      onChange={(e) => setWalletForm((p) => ({ ...p, mobile: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* Actions */}\n              <div className=\"flex items-center gap-3 pt-5\">\n                <button\n                  type=\"button\"\n                  onClick={handleAddPaymentMethod}\n                  className=\"flex-1 rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  Add Payment Method\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/adaptercloud/pages/customer/ReviewsPage.js

@@ -140,7 +140,7 @@ function S({ value: e, onChange: n }) {
 				onMouseEnter: () => i(e),
 				onMouseLeave: () => i(0),
 				className: "p-0.5 transition-transform",
-				children: /* @__PURE__ */ _(m, { className: t("h-6 w-6", e <= a ? "fill-yellow-400 text-yellow-400" : "fill-none text-text-secondary/40") })
+				children: /* @__PURE__ */ _(m, { className: t("h-6 w-6", e <= a ? "fill-status-warning-text text-status-warning-text" : "fill-none text-text-secondary/40") })
 			}, e))
 		}), /* @__PURE__ */ _("span", {
 			className: "text-sm font-medium text-text-secondary",
@@ -232,9 +232,9 @@ function C() {
 		}),
 		children: [
 			j && /* @__PURE__ */ v("div", {
-				className: "mb-4 rounded-lg border border-green-500/30 bg-green-500/10 p-3 flex items-center gap-2",
-				children: [/* @__PURE__ */ _(c, { className: "h-4 w-4 text-green-600 dark:text-green-400 shrink-0" }), /* @__PURE__ */ _("p", {
-					className: "text-sm text-green-600 dark:text-green-400",
+				className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
+				children: [/* @__PURE__ */ _(c, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ _("p", {
+					className: "text-sm text-status-success-text",
 					children: j
 				})]
 			}),
@@ -248,13 +248,13 @@ function C() {
 						children: [
 							"Average: ",
 							I,
-							/* @__PURE__ */ _(m, { className: "h-3.5 w-3.5 fill-yellow-400 text-yellow-400" })
+							/* @__PURE__ */ _(m, { className: "h-3.5 w-3.5 fill-status-warning-text text-status-warning-text" })
 						]
 					})
 				]
 			}),
 			/* @__PURE__ */ _("div", {
-				className: "rounded-lg border border-border-subtle bg-bg-surface p-4 mb-6",
+				className: "rounded-lg border border-border-seam bg-bg-surface p-4 mb-6 bg-gloss-card shadow-pop",
 				children: /* @__PURE__ */ v("div", {
 					className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3",
 					children: [
@@ -361,6 +361,7 @@ function C() {
 				})
 			}),
 			P.length === 0 ? /* @__PURE__ */ _(r, {
+				illustration: "empty-data",
 				icon: /* @__PURE__ */ _(d, { className: "h-12 w-12" }),
 				title: "No reviews found",
 				description: "Be the first to write a review!",
@@ -395,11 +396,11 @@ function C() {
 													children: e.userName
 												}),
 												e.isVerified && /* @__PURE__ */ v("span", {
-													className: "inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400",
+													className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text",
 													children: [/* @__PURE__ */ _(c, { className: "h-3 w-3" }), "Verified"]
 												}),
 												n && /* @__PURE__ */ _("span", {
-													className: "inline-flex items-center rounded-full bg-blue-500/10 px-2 py-0.5 text-[10px] font-medium text-blue-600 dark:text-blue-400",
+													className: "inline-flex items-center rounded-full bg-accent-blue-subtle/10 px-2 py-0.5 text-[10px] font-medium text-accent-blue",
 													children: "Your Review"
 												})
 											]
@@ -443,17 +444,17 @@ function C() {
 								}, t))
 							}),
 							e.response && /* @__PURE__ */ v("div", {
-								className: "mb-3 rounded-lg border border-blue-500/20 bg-blue-500/5 p-3",
+								className: "mb-3 rounded-lg border border-accent-blue-subtle/20 bg-accent-blue-subtle/5 p-3",
 								children: [/* @__PURE__ */ v("div", {
 									className: "flex flex-wrap items-center gap-2 mb-1.5",
 									children: [
-										/* @__PURE__ */ _(u, { className: "h-3.5 w-3.5 text-blue-600 dark:text-blue-400" }),
+										/* @__PURE__ */ _(u, { className: "h-3.5 w-3.5 text-accent-blue" }),
 										/* @__PURE__ */ v("span", {
-											className: "text-xs font-medium text-blue-600 dark:text-blue-400",
+											className: "text-xs font-medium text-accent-blue",
 											children: ["Response from ", e.response.respondedBy]
 										}),
 										/* @__PURE__ */ _("span", {
-											className: "text-[10px] text-blue-500/70",
+											className: "text-[10px] text-accent-blue",
 											children: i(e.response.respondedAt, {
 												hour: void 0,
 												minute: void 0,
@@ -462,7 +463,7 @@ function C() {
 										})
 									]
 								}), /* @__PURE__ */ _("p", {
-									className: "text-xs text-blue-700 dark:text-blue-300 leading-relaxed",
+									className: "text-xs text-accent-blue leading-relaxed",
 									children: e.response.message
 								})]
 							}),
@@ -471,7 +472,7 @@ function C() {
 								children: [/* @__PURE__ */ v("button", {
 									type: "button",
 									onClick: () => R(e.id),
-									className: t("flex items-center gap-1.5 text-xs transition-colors", e.isHelpful ? "text-blue-600 dark:text-blue-400 font-medium" : "text-text-secondary hover:text-text-primary"),
+									className: t("flex items-center gap-1.5 text-xs transition-colors", e.isHelpful ? "text-accent-blue font-medium" : "text-text-secondary hover:text-text-primary"),
 									children: [
 										/* @__PURE__ */ _(h, { className: t("h-3.5 w-3.5", e.isHelpful && "fill-current") }),
 										"Helpful (",
@@ -517,7 +518,7 @@ function C() {
 									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 										className: "block text-sm font-medium text-text-primary mb-2",
 										children: ["Rating ", /* @__PURE__ */ _("span", {
-											className: "text-red-500",
+											className: "text-status-error-text",
 											children: "*"
 										})]
 									}), /* @__PURE__ */ _(S, {
@@ -530,7 +531,7 @@ function C() {
 									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 										className: "block text-sm font-medium text-text-primary mb-1.5",
 										children: ["Review Title ", /* @__PURE__ */ _("span", {
-											className: "text-red-500",
+											className: "text-status-error-text",
 											children: "*"
 										})]
 									}), /* @__PURE__ */ _("input", {
@@ -546,7 +547,7 @@ function C() {
 									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 										className: "block text-sm font-medium text-text-primary mb-1.5",
 										children: ["Your Review ", /* @__PURE__ */ _("span", {
-											className: "text-red-500",
+											className: "text-status-error-text",
 											children: "*"
 										})]
 									}), /* @__PURE__ */ _("textarea", {

package/dist/adaptercloud/pages/customer/ReviewsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReviewsPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/ReviewsPage.tsx"],"sourcesContent":["/**\n * Reviews Page\n * @module adaptercloud/pages/customer\n *\n * Full-featured reviews: Write Review modal (interactive star rating with\n * text labels, title, comment, guidelines), Owner Response callout,\n * review images, verified badge, Mark as Helpful toggle, 4 filters\n * (search, type, rating, sort), Your Review label, 5 mock reviews.\n */\n\nimport { useState, useCallback } from 'react';\nimport {\n  Star,\n  MessageSquare,\n  ThumbsUp,\n  PenSquare,\n  X,\n  CheckCircle2,\n  Image,\n  MessageCircle,\n  Info,\n  Search,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { RatingDisplay } from '../../components/RatingDisplay';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { cn } from '../../utils/cn';\nimport { formatDate } from '../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface Review {\n  id: string;\n  userId: string;\n  userName: string;\n  userAvatar: string;\n  itemId: string;\n  itemName: string;\n  itemType: 'cart' | 'product';\n  cartId: string;\n  cartName: string;\n  orderId: string;\n  rating: number;\n  title: string;\n  comment: string;\n  images?: string[];\n  helpfulCount: number;\n  isHelpful: boolean;\n  isVerified: boolean;\n  createdAt: string;\n  response?: {\n    message: string;\n    respondedBy: string;\n    respondedAt: string;\n  };\n}\n\ninterface ReviewFormData {\n  rating: number;\n  title: string;\n  comment: string;\n}\n\ninterface ReviewFilters {\n  searchQuery: string;\n  type: 'all' | 'cart' | 'product' | 'my-reviews';\n  rating: string;\n  sortBy: 'recent' | 'helpful' | 'rating-high' | 'rating-low';\n}\n\nconst CURRENT_USER_ID = 'user-001';\n\nconst ratingLabels: Record<number, string> = {\n  1: 'Terrible',\n  2: 'Poor',\n  3: 'Average',\n  4: 'Good',\n  5: 'Excellent',\n};\n\n// ============================================================================\n// Mock Data\n// ============================================================================\n\nconst mockReviews: Review[] = [\n  {\n    id: 'review-001',\n    userId: CURRENT_USER_ID,\n    userName: 'Rahul Sharma',\n    userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n    itemId: 'FOOD-001',\n    itemName: 'Dosa Express',\n    itemType: 'cart',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-001',\n    rating: 5,\n    title: 'Excellent breakfast spot!',\n    comment:\n      'Amazing dosas and filter coffee. The masala dosa was perfectly crispy and the potato filling was delicious. Service was quick and friendly. Highly recommend for authentic South Indian breakfast!',\n    helpfulCount: 12,\n    isHelpful: true,\n    isVerified: true,\n    createdAt: '2024-06-20T09:30:00Z',\n    response: {\n      message:\n        \"Thank you so much for your wonderful review! We're thrilled you enjoyed the dosas. We look forward to serving you again soon!\",\n      respondedBy: 'Dosa Express Team',\n      respondedAt: '2024-06-20T15:45:00Z',\n    },\n  },\n  {\n    id: 'review-002',\n    userId: 'user-002',\n    userName: 'Priya Patel',\n    userAvatar: 'https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=100',\n    itemId: 'prod-002',\n    itemName: 'Pani Puri',\n    itemType: 'product',\n    cartId: 'FOOD-002',\n    cartName: 'Chaat Corner',\n    orderId: 'ORD-2024-002',\n    rating: 4,\n    title: 'Good but could be spicier',\n    comment:\n      'The pani puri was good overall. The puris were crispy and fresh. However, the pani could have been more spicy and tangy. The portions were generous though.',\n    helpfulCount: 8,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-18T19:15:00Z',\n  },\n  {\n    id: 'review-003',\n    userId: 'user-003',\n    userName: 'Amit Kumar',\n    userAvatar: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100',\n    itemId: 'FOOD-002',\n    itemName: 'Chaat Corner',\n    itemType: 'cart',\n    cartId: 'FOOD-002',\n    cartName: 'Chaat Corner',\n    orderId: 'ORD-2024-003',\n    rating: 5,\n    title: 'Authentic Mumbai street food!',\n    comment:\n      'This place brings back memories of Mumbai streets. Every item I ordered was authentic and delicious. The bhel puri and vada pav were exceptional. Will definitely order again!',\n    images: ['https://images.unsplash.com/photo-1601050690597-df0568f70950?w=400'],\n    helpfulCount: 15,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-17T20:30:00Z',\n  },\n  {\n    id: 'review-004',\n    userId: CURRENT_USER_ID,\n    userName: 'Rahul Sharma',\n    userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n    itemId: 'prod-001',\n    itemName: 'Masala Dosa',\n    itemType: 'product',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-004',\n    rating: 5,\n    title: 'Perfect masala dosa!',\n    comment:\n      'The masala dosa here is absolutely perfect. Crispy, golden brown, and the potato masala inside is perfectly spiced. Comes with great chutneys and sambar.',\n    helpfulCount: 6,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-15T08:45:00Z',\n    response: {\n      message: 'Glad you loved it, Rahul! Our chef takes great care with every dosa. See you soon!',\n      respondedBy: 'Dosa Express Team',\n      respondedAt: '2024-06-15T14:00:00Z',\n    },\n  },\n  {\n    id: 'review-005',\n    userId: 'user-004',\n    userName: 'Sneha Reddy',\n    userAvatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100',\n    itemId: 'FOOD-001',\n    itemName: 'Dosa Express',\n    itemType: 'cart',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-005',\n    rating: 3,\n    title: 'Average experience',\n    comment:\n      'The food was okay but delivery took longer than expected. The taste was good but not exceptional. The packaging could be better to keep food warm.',\n    helpfulCount: 4,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-12T12:20:00Z',\n  },\n];\n\n// ============================================================================\n// Star Rating Interactive Component\n// ============================================================================\n\nfunction InteractiveStarRating({\n  value,\n  onChange,\n}: {\n  value: number;\n  onChange: (v: number) => void;\n}) {\n  const [hoverValue, setHoverValue] = useState(0);\n  const displayValue = hoverValue || value;\n\n  return (\n    <div className=\"flex items-center gap-3\">\n      <div className=\"flex items-center gap-0.5\">\n        {[1, 2, 3, 4, 5].map((star) => (\n          <button\n            key={star}\n            type=\"button\"\n            onClick={() => onChange(star)}\n            onMouseEnter={() => setHoverValue(star)}\n            onMouseLeave={() => setHoverValue(0)}\n            className=\"p-0.5 transition-transform\"\n          >\n            <Star\n              className={cn(\n                'h-6 w-6',\n                star <= displayValue\n                  ? 'fill-yellow-400 text-yellow-400'\n                  : 'fill-none text-text-secondary/40'\n              )}\n            />\n          </button>\n        ))}\n      </div>\n      <span className=\"text-sm font-medium text-text-secondary\">\n        {ratingLabels[displayValue] ?? ''}\n      </span>\n    </div>\n  );\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function ReviewsPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [reviews, setReviews] = useState<Review[]>(mockReviews);\n  const [showWriteReview, setShowWriteReview] = useState(false);\n  const [reviewForm, setReviewForm] = useState<ReviewFormData>({\n    rating: 5,\n    title: '',\n    comment: '',\n  });\n  const [filters, setFilters] = useState<ReviewFilters>({\n    searchQuery: '',\n    type: 'all',\n    rating: '',\n    sortBy: 'recent',\n  });\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n\n  const showStatus = (msg: string) => {\n    setStatusMessage(msg);\n    setTimeout(() => setStatusMessage(null), 3000);\n  };\n\n  // --- Filtered reviews ---\n  const filteredReviews = useCallback(() => {\n    let result = [...reviews];\n\n    // Type filter\n    if (filters.type === 'my-reviews') {\n      result = result.filter((r) => r.userId === CURRENT_USER_ID);\n    } else if (filters.type !== 'all') {\n      result = result.filter((r) => r.itemType === filters.type);\n    }\n\n    // Rating filter\n    if (filters.rating) {\n      const ratingVal = parseInt(filters.rating, 10);\n      result = result.filter((r) => r.rating === ratingVal);\n    }\n\n    // Search\n    if (filters.searchQuery) {\n      const q = filters.searchQuery.toLowerCase();\n      result = result.filter(\n        (r) =>\n          r.itemName.toLowerCase().includes(q) ||\n          r.title.toLowerCase().includes(q) ||\n          r.comment.toLowerCase().includes(q) ||\n          r.cartName.toLowerCase().includes(q)\n      );\n    }\n\n    // Sort\n    switch (filters.sortBy) {\n      case 'recent':\n        result.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());\n        break;\n      case 'helpful':\n        result.sort((a, b) => b.helpfulCount - a.helpfulCount);\n        break;\n      case 'rating-high':\n        result.sort((a, b) => b.rating - a.rating);\n        break;\n      case 'rating-low':\n        result.sort((a, b) => a.rating - b.rating);\n        break;\n    }\n\n    return result;\n  }, [reviews, filters])();\n\n  // --- Stats ---\n  const myReviewCount = reviews.filter((r) => r.userId === CURRENT_USER_ID).length;\n  const avgRating =\n    reviews.length > 0\n      ? (reviews.reduce((s, r) => s + r.rating, 0) / reviews.length).toFixed(1)\n      : '0';\n\n  // --- Handlers ---\n  const handleSubmitReview = () => {\n    if (!reviewForm.title.trim() || !reviewForm.comment.trim()) {\n      alert('Please fill in the Review Title and Comment.');\n      return;\n    }\n\n    const newReview: Review = {\n      id: `review-${Date.now()}`,\n      userId: CURRENT_USER_ID,\n      userName: 'Rahul Sharma',\n      userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n      itemId: 'FOOD-001',\n      itemName: 'Dosa Express',\n      itemType: 'cart',\n      cartId: 'FOOD-001',\n      cartName: 'Dosa Express',\n      orderId: `ORD-2024-${Date.now()}`,\n      rating: reviewForm.rating,\n      title: reviewForm.title,\n      comment: reviewForm.comment,\n      helpfulCount: 0,\n      isHelpful: false,\n      isVerified: true,\n      createdAt: new Date().toISOString(),\n    };\n\n    setReviews((prev) => [newReview, ...prev]);\n    setReviewForm({ rating: 5, title: '', comment: '' });\n    setShowWriteReview(false);\n    showStatus('Review submitted successfully!');\n  };\n\n  const handleMarkHelpful = (reviewId: string) => {\n    setReviews((prev) =>\n      prev.map((r) =>\n        r.id === reviewId\n          ? {\n              ...r,\n              isHelpful: !r.isHelpful,\n              helpfulCount: r.isHelpful ? r.helpfulCount - 1 : r.helpfulCount + 1,\n            }\n          : r\n      )\n    );\n  };\n\n  return (\n    <PageLayout\n      title=\"Reviews & Ratings\"\n      description={`${filteredReviews.length} reviews found`}\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => setShowWriteReview(true)}\n          className={cn(\n            'flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity',\n            'bg-foreground text-background hover:opacity-90'\n          )}\n        >\n          <PenSquare className=\"h-4 w-4\" />\n          Write Review\n        </button>\n      }\n    >\n      {/* Status message */}\n      {statusMessage && (\n        <div className=\"mb-4 rounded-lg border border-green-500/30 bg-green-500/10 p-3 flex items-center gap-2\">\n          <CheckCircle2 className=\"h-4 w-4 text-green-600 dark:text-green-400 shrink-0\" />\n          <p className=\"text-sm text-green-600 dark:text-green-400\">{statusMessage}</p>\n        </div>\n      )}\n\n      {/* Stats */}\n      <div className=\"flex flex-wrap items-center gap-4 text-sm text-text-secondary mb-6\">\n        <span>{reviews.length} total reviews</span>\n        <span>{myReviewCount} your reviews</span>\n        <span className=\"flex items-center gap-1\">\n          Average: {avgRating}\n          <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n        </span>\n      </div>\n\n      {/* Filters */}\n      <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-4 mb-6\">\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3\">\n          {/* Search */}\n          <div className=\"relative\">\n            <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n            <input\n              type=\"text\"\n              placeholder=\"Search reviews...\"\n              value={filters.searchQuery}\n              onChange={(e) => setFilters((p) => ({ ...p, searchQuery: e.target.value }))}\n              className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n            />\n          </div>\n\n          {/* Type */}\n          <select\n            value={filters.type}\n            onChange={(e) =>\n              setFilters((p) => ({ ...p, type: e.target.value as ReviewFilters['type'] }))\n            }\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"all\">All Reviews</option>\n            <option value=\"cart\">Cart Reviews</option>\n            <option value=\"product\">Product Reviews</option>\n            <option value=\"my-reviews\">My Reviews</option>\n          </select>\n\n          {/* Rating */}\n          <select\n            value={filters.rating}\n            onChange={(e) => setFilters((p) => ({ ...p, rating: e.target.value }))}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"\">All Ratings</option>\n            <option value=\"5\">5 Stars</option>\n            <option value=\"4\">4 Stars</option>\n            <option value=\"3\">3 Stars</option>\n            <option value=\"2\">2 Stars</option>\n            <option value=\"1\">1 Star</option>\n          </select>\n\n          {/* Sort */}\n          <select\n            value={filters.sortBy}\n            onChange={(e) =>\n              setFilters((p) => ({ ...p, sortBy: e.target.value as ReviewFilters['sortBy'] }))\n            }\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"recent\">Most Recent</option>\n            <option value=\"helpful\">Most Helpful</option>\n            <option value=\"rating-high\">Highest Rating</option>\n            <option value=\"rating-low\">Lowest Rating</option>\n          </select>\n        </div>\n      </div>\n\n      {/* Reviews List */}\n      {filteredReviews.length === 0 ? (\n        <EmptyState\n          icon={<MessageSquare className=\"h-12 w-12\" />}\n          title=\"No reviews found\"\n          description=\"Be the first to write a review!\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => setShowWriteReview(true)}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Write a Review\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"space-y-4\">\n          {filteredReviews.map((review) => {\n            const isMyReview = review.userId === CURRENT_USER_ID;\n            return (\n              <div\n                key={review.id}\n                className={cn(\n                  'rounded-lg border bg-bg-surface p-5',\n                  isMyReview ? 'border-foreground/20' : 'border-border-subtle'\n                )}\n              >\n                {/* Header */}\n                <div className=\"flex items-start gap-3 mb-3\">\n                  <img\n                    src={review.userAvatar}\n                    alt={review.userName}\n                    className=\"h-10 w-10 rounded-full object-cover shrink-0\"\n                  />\n                  <div className=\"flex-1 min-w-0\">\n                    <div className=\"flex items-center gap-2 flex-wrap\">\n                      <span className=\"text-sm font-semibold text-text-primary\">\n                        {review.userName}\n                      </span>\n                      {review.isVerified && (\n                        <span className=\"inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400\">\n                          <CheckCircle2 className=\"h-3 w-3\" />\n                          Verified\n                        </span>\n                      )}\n                      {isMyReview && (\n                        <span className=\"inline-flex items-center rounded-full bg-blue-500/10 px-2 py-0.5 text-[10px] font-medium text-blue-600 dark:text-blue-400\">\n                          Your Review\n                        </span>\n                      )}\n                    </div>\n                    <div className=\"flex flex-wrap items-center gap-2 text-xs text-text-secondary mt-0.5\">\n                      <span>\n                        {review.itemType === 'cart' ? (\n                          <MessageSquare className=\"inline h-3 w-3 mr-0.5\" />\n                        ) : (\n                          <Star className=\"inline h-3 w-3 mr-0.5\" />\n                        )}\n                        {review.itemName}\n                      </span>\n                      <span>\n                        {formatDate(review.createdAt, {\n                          hour: undefined,\n                          minute: undefined,\n                          hour12: undefined,\n                        })}\n                      </span>\n                    </div>\n                  </div>\n                  <div className=\"shrink-0\">\n                    <RatingDisplay value={review.rating} size=\"sm\" />\n                    <p className=\"text-xs text-text-secondary mt-0.5 text-right\">\n                      From: {review.cartName}\n                    </p>\n                  </div>\n                </div>\n\n                {/* Content */}\n                <div className=\"mb-3\">\n                  <h4 className=\"text-sm font-semibold text-text-primary mb-1\">{review.title}</h4>\n                  <p className=\"text-sm text-text-primary leading-relaxed\">{review.comment}</p>\n                </div>\n\n                {/* Review Images */}\n                {review.images && review.images.length > 0 && (\n                  <div className=\"mb-3 flex gap-2 overflow-x-auto pb-1\">\n                    {review.images.map((img, idx) => (\n                      <img\n                        key={idx}\n                        src={img}\n                        alt={`Review image ${idx + 1}`}\n                        className=\"h-20 w-20 rounded-lg object-cover shrink-0\"\n                      />\n                    ))}\n                  </div>\n                )}\n\n                {/* Owner Response */}\n                {review.response && (\n                  <div className=\"mb-3 rounded-lg border border-blue-500/20 bg-blue-500/5 p-3\">\n                    <div className=\"flex flex-wrap items-center gap-2 mb-1.5\">\n                      <MessageCircle className=\"h-3.5 w-3.5 text-blue-600 dark:text-blue-400\" />\n                      <span className=\"text-xs font-medium text-blue-600 dark:text-blue-400\">\n                        Response from {review.response.respondedBy}\n                      </span>\n                      <span className=\"text-[10px] text-blue-500/70\">\n                        {formatDate(review.response.respondedAt, {\n                          hour: undefined,\n                          minute: undefined,\n                          hour12: undefined,\n                        })}\n                      </span>\n                    </div>\n                    <p className=\"text-xs text-blue-700 dark:text-blue-300 leading-relaxed\">\n                      {review.response.message}\n                    </p>\n                  </div>\n                )}\n\n                {/* Footer */}\n                <div className=\"flex items-center justify-between pt-3 border-t border-border-subtle\">\n                  <button\n                    type=\"button\"\n                    onClick={() => handleMarkHelpful(review.id)}\n                    className={cn(\n                      'flex items-center gap-1.5 text-xs transition-colors',\n                      review.isHelpful\n                        ? 'text-blue-600 dark:text-blue-400 font-medium'\n                        : 'text-text-secondary hover:text-text-primary'\n                    )}\n                  >\n                    <ThumbsUp className={cn('h-3.5 w-3.5', review.isHelpful && 'fill-current')} />\n                    Helpful ({review.helpfulCount})\n                  </button>\n\n                  <div className=\"flex items-center gap-3 text-xs text-text-secondary\">\n                    <span>Order: {review.orderId}</span>\n                    <button\n                      type=\"button\"\n                      onClick={() => navigateTo(`/customer/carts/${review.cartId}`)}\n                      className=\"font-medium hover:text-text-primary transition-colors\"\n                    >\n                      View Cart\n                    </button>\n                  </div>\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      )}\n\n      {/* Write Review Modal */}\n      {showWriteReview && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-2xl max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg\">\n            <div className=\"p-5\">\n              {/* Header */}\n              <div className=\"flex items-center justify-between mb-5\">\n                <h3 className=\"text-lg font-semibold text-text-primary\">Write a Review</h3>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowWriteReview(false)}\n                  className=\"rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-4 w-4\" />\n                </button>\n              </div>\n\n              <div className=\"space-y-4\">\n                {/* Rating */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-2\">\n                    Rating <span className=\"text-red-500\">*</span>\n                  </label>\n                  <InteractiveStarRating\n                    value={reviewForm.rating}\n                    onChange={(v) => setReviewForm((p) => ({ ...p, rating: v }))}\n                  />\n                </div>\n\n                {/* Title */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Review Title <span className=\"text-red-500\">*</span>\n                  </label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"Summarize your experience\"\n                    value={reviewForm.title}\n                    onChange={(e) => setReviewForm((p) => ({ ...p, title: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n\n                {/* Comment */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Your Review <span className=\"text-red-500\">*</span>\n                  </label>\n                  <textarea\n                    rows={5}\n                    placeholder=\"Share your experience with others...\"\n                    value={reviewForm.comment}\n                    onChange={(e) => setReviewForm((p) => ({ ...p, comment: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                {/* Guidelines */}\n                <div className=\"rounded-lg bg-bg-sunken p-4\">\n                  <div className=\"flex items-center gap-2 mb-2\">\n                    <Info className=\"h-4 w-4 text-text-secondary\" />\n                    <h4 className=\"text-sm font-medium text-text-primary\">Review Guidelines</h4>\n                  </div>\n                  <ul className=\"text-xs text-text-secondary space-y-1\">\n                    <li>- Be honest and helpful to other customers</li>\n                    <li>- Focus on your experience with the food and service</li>\n                    <li>- Avoid personal information or inappropriate content</li>\n                    <li>- Reviews are public and cannot be deleted once submitted</li>\n                  </ul>\n                </div>\n              </div>\n\n              {/* Actions */}\n              <div className=\"flex items-center gap-3 pt-5\">\n                <button\n                  type=\"button\"\n                  onClick={handleSubmitReview}\n                  className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  Submit Review\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowWriteReview(false)}\n                  className=\"rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ReviewsPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/ReviewsPage.tsx"],"sourcesContent":["/**\n * Reviews Page\n * @module adaptercloud/pages/customer\n *\n * Full-featured reviews: Write Review modal (interactive star rating with\n * text labels, title, comment, guidelines), Owner Response callout,\n * review images, verified badge, Mark as Helpful toggle, 4 filters\n * (search, type, rating, sort), Your Review label, 5 mock reviews.\n */\n\nimport { useState, useCallback } from'react';\nimport {\n  Star,\n  MessageSquare,\n  ThumbsUp,\n  PenSquare,\n  X,\n  CheckCircle2,\n  Image,\n  MessageCircle,\n  Info,\n  Search,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { RatingDisplay } from'../../components/RatingDisplay';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { cn } from'../../utils/cn';\nimport { formatDate } from'../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface Review {\n  id: string;\n  userId: string;\n  userName: string;\n  userAvatar: string;\n  itemId: string;\n  itemName: string;\n  itemType: 'cart' | 'product';\n  cartId: string;\n  cartName: string;\n  orderId: string;\n  rating: number;\n  title: string;\n  comment: string;\n  images?: string[];\n  helpfulCount: number;\n  isHelpful: boolean;\n  isVerified: boolean;\n  createdAt: string;\n  response?: {\n    message: string;\n    respondedBy: string;\n    respondedAt: string;\n  };\n}\n\ninterface ReviewFormData {\n  rating: number;\n  title: string;\n  comment: string;\n}\n\ninterface ReviewFilters {\n  searchQuery: string;\n  type: 'all' | 'cart' | 'product' | 'my-reviews';\n  rating: string;\n  sortBy: 'recent' | 'helpful' | 'rating-high' | 'rating-low';\n}\n\nconst CURRENT_USER_ID = 'user-001';\n\nconst ratingLabels: Record<number, string> = {\n  1: 'Terrible',\n  2: 'Poor',\n  3: 'Average',\n  4: 'Good',\n  5: 'Excellent',\n};\n\n// ============================================================================\n// Mock Data\n// ============================================================================\n\nconst mockReviews: Review[] = [\n  {\n    id: 'review-001',\n    userId: CURRENT_USER_ID,\n    userName: 'Rahul Sharma',\n    userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n    itemId: 'FOOD-001',\n    itemName: 'Dosa Express',\n    itemType: 'cart',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-001',\n    rating: 5,\n    title: 'Excellent breakfast spot!',\n    comment:\n      'Amazing dosas and filter coffee. The masala dosa was perfectly crispy and the potato filling was delicious. Service was quick and friendly. Highly recommend for authentic South Indian breakfast!',\n    helpfulCount: 12,\n    isHelpful: true,\n    isVerified: true,\n    createdAt: '2024-06-20T09:30:00Z',\n    response: {\n      message:\n        \"Thank you so much for your wonderful review! We're thrilled you enjoyed the dosas. We look forward to serving you again soon!\",\n      respondedBy: 'Dosa Express Team',\n      respondedAt: '2024-06-20T15:45:00Z',\n    },\n  },\n  {\n    id: 'review-002',\n    userId: 'user-002',\n    userName: 'Priya Patel',\n    userAvatar: 'https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=100',\n    itemId: 'prod-002',\n    itemName: 'Pani Puri',\n    itemType: 'product',\n    cartId: 'FOOD-002',\n    cartName: 'Chaat Corner',\n    orderId: 'ORD-2024-002',\n    rating: 4,\n    title: 'Good but could be spicier',\n    comment:\n      'The pani puri was good overall. The puris were crispy and fresh. However, the pani could have been more spicy and tangy. The portions were generous though.',\n    helpfulCount: 8,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-18T19:15:00Z',\n  },\n  {\n    id: 'review-003',\n    userId: 'user-003',\n    userName: 'Amit Kumar',\n    userAvatar: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100',\n    itemId: 'FOOD-002',\n    itemName: 'Chaat Corner',\n    itemType: 'cart',\n    cartId: 'FOOD-002',\n    cartName: 'Chaat Corner',\n    orderId: 'ORD-2024-003',\n    rating: 5,\n    title: 'Authentic Mumbai street food!',\n    comment:\n      'This place brings back memories of Mumbai streets. Every item I ordered was authentic and delicious. The bhel puri and vada pav were exceptional. Will definitely order again!',\n    images: ['https://images.unsplash.com/photo-1601050690597-df0568f70950?w=400'],\n    helpfulCount: 15,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-17T20:30:00Z',\n  },\n  {\n    id: 'review-004',\n    userId: CURRENT_USER_ID,\n    userName: 'Rahul Sharma',\n    userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n    itemId: 'prod-001',\n    itemName: 'Masala Dosa',\n    itemType: 'product',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-004',\n    rating: 5,\n    title: 'Perfect masala dosa!',\n    comment:\n      'The masala dosa here is absolutely perfect. Crispy, golden brown, and the potato masala inside is perfectly spiced. Comes with great chutneys and sambar.',\n    helpfulCount: 6,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-15T08:45:00Z',\n    response: {\n      message: 'Glad you loved it, Rahul! Our chef takes great care with every dosa. See you soon!',\n      respondedBy: 'Dosa Express Team',\n      respondedAt: '2024-06-15T14:00:00Z',\n    },\n  },\n  {\n    id: 'review-005',\n    userId: 'user-004',\n    userName: 'Sneha Reddy',\n    userAvatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100',\n    itemId: 'FOOD-001',\n    itemName: 'Dosa Express',\n    itemType: 'cart',\n    cartId: 'FOOD-001',\n    cartName: 'Dosa Express',\n    orderId: 'ORD-2024-005',\n    rating: 3,\n    title: 'Average experience',\n    comment:\n      'The food was okay but delivery took longer than expected. The taste was good but not exceptional. The packaging could be better to keep food warm.',\n    helpfulCount: 4,\n    isHelpful: false,\n    isVerified: true,\n    createdAt: '2024-06-12T12:20:00Z',\n  },\n];\n\n// ============================================================================\n// Star Rating Interactive Component\n// ============================================================================\n\nfunction InteractiveStarRating({\n  value,\n  onChange,\n}: {\n  value: number;\n  onChange: (v: number) => void;\n}) {\n  const [hoverValue, setHoverValue] = useState(0);\n  const displayValue = hoverValue || value;\n\n  return (\n    <div className=\"flex items-center gap-3\">\n      <div className=\"flex items-center gap-0.5\">\n        {[1, 2, 3, 4, 5].map((star) => (\n          <button\n            key={star}\n            type=\"button\"\n            onClick={() => onChange(star)}\n            onMouseEnter={() => setHoverValue(star)}\n            onMouseLeave={() => setHoverValue(0)}\n            className=\"p-0.5 transition-transform\"\n          >\n            <Star\n              className={cn(\n                'h-6 w-6',\n                star <= displayValue\n                  ? 'fill-status-warning-text text-status-warning-text'\n                  : 'fill-none text-text-secondary/40'\n              )}\n            />\n          </button>\n        ))}\n      </div>\n      <span className=\"text-sm font-medium text-text-secondary\">\n        {ratingLabels[displayValue] ?? ''}\n      </span>\n    </div>\n  );\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function ReviewsPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [reviews, setReviews] = useState<Review[]>(mockReviews);\n  const [showWriteReview, setShowWriteReview] = useState(false);\n  const [reviewForm, setReviewForm] = useState<ReviewFormData>({\n    rating: 5,\n    title: '',\n    comment: '',\n  });\n  const [filters, setFilters] = useState<ReviewFilters>({\n    searchQuery: '',\n    type: 'all',\n    rating: '',\n    sortBy: 'recent',\n  });\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n\n  const showStatus = (msg: string) => {\n    setStatusMessage(msg);\n    setTimeout(() => setStatusMessage(null), 3000);\n  };\n\n  // --- Filtered reviews ---\n  const filteredReviews = useCallback(() => {\n    let result = [...reviews];\n\n    // Type filter\n    if (filters.type === 'my-reviews') {\n      result = result.filter((r) => r.userId === CURRENT_USER_ID);\n    } else if (filters.type !== 'all') {\n      result = result.filter((r) => r.itemType === filters.type);\n    }\n\n    // Rating filter\n    if (filters.rating) {\n      const ratingVal = parseInt(filters.rating, 10);\n      result = result.filter((r) => r.rating === ratingVal);\n    }\n\n    // Search\n    if (filters.searchQuery) {\n      const q = filters.searchQuery.toLowerCase();\n      result = result.filter(\n        (r) =>\n          r.itemName.toLowerCase().includes(q) ||\n          r.title.toLowerCase().includes(q) ||\n          r.comment.toLowerCase().includes(q) ||\n          r.cartName.toLowerCase().includes(q)\n      );\n    }\n\n    // Sort\n    switch (filters.sortBy) {\n      case'recent':\n        result.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());\n        break;\n      case'helpful':\n        result.sort((a, b) => b.helpfulCount - a.helpfulCount);\n        break;\n      case'rating-high':\n        result.sort((a, b) => b.rating - a.rating);\n        break;\n      case'rating-low':\n        result.sort((a, b) => a.rating - b.rating);\n        break;\n    }\n\n    return result;\n  }, [reviews, filters])();\n\n  // --- Stats ---\n  const myReviewCount = reviews.filter((r) => r.userId === CURRENT_USER_ID).length;\n  const avgRating =\n    reviews.length > 0\n      ? (reviews.reduce((s, r) => s + r.rating, 0) / reviews.length).toFixed(1)\n      : '0';\n\n  // --- Handlers ---\n  const handleSubmitReview = () => {\n    if (!reviewForm.title.trim() || !reviewForm.comment.trim()) {\n      alert('Please fill in the Review Title and Comment.');\n      return;\n    }\n\n    const newReview: Review = {\n      id: `review-${Date.now()}`,\n      userId: CURRENT_USER_ID,\n      userName: 'Rahul Sharma',\n      userAvatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100',\n      itemId: 'FOOD-001',\n      itemName: 'Dosa Express',\n      itemType: 'cart',\n      cartId: 'FOOD-001',\n      cartName: 'Dosa Express',\n      orderId: `ORD-2024-${Date.now()}`,\n      rating: reviewForm.rating,\n      title: reviewForm.title,\n      comment: reviewForm.comment,\n      helpfulCount: 0,\n      isHelpful: false,\n      isVerified: true,\n      createdAt: new Date().toISOString(),\n    };\n\n    setReviews((prev) => [newReview, ...prev]);\n    setReviewForm({ rating: 5, title: '', comment: '' });\n    setShowWriteReview(false);\n    showStatus('Review submitted successfully!');\n  };\n\n  const handleMarkHelpful = (reviewId: string) => {\n    setReviews((prev) =>\n      prev.map((r) =>\n        r.id === reviewId\n          ? {\n              ...r,\n              isHelpful: !r.isHelpful,\n              helpfulCount: r.isHelpful ? r.helpfulCount - 1 : r.helpfulCount + 1,\n            }\n          : r\n      )\n    );\n  };\n\n  return (\n    <PageLayout\n      title=\"Reviews & Ratings\"\n      description={`${filteredReviews.length} reviews found`}\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => setShowWriteReview(true)}\n          className={cn(\n            'flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity',\n            'bg-foreground text-background hover:opacity-90'\n          )}\n        >\n          <PenSquare className=\"h-4 w-4\" />\n          Write Review\n        </button>\n      }\n    >\n      {/* Status message */}\n      {statusMessage && (\n        <div className=\"mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2\">\n          <CheckCircle2 className=\"h-4 w-4 text-status-success-text shrink-0\" />\n          <p className=\"text-sm text-status-success-text\">{statusMessage}</p>\n        </div>\n      )}\n\n      {/* Stats */}\n      <div className=\"flex flex-wrap items-center gap-4 text-sm text-text-secondary mb-6\">\n        <span>{reviews.length} total reviews</span>\n        <span>{myReviewCount} your reviews</span>\n        <span className=\"flex items-center gap-1\">\n          Average: {avgRating}\n          <Star className=\"h-3.5 w-3.5 fill-status-warning-text text-status-warning-text\" />\n        </span>\n      </div>\n\n      {/* Filters */}\n      <div className=\"rounded-lg border border-border-seam bg-bg-surface p-4 mb-6 bg-gloss-card shadow-pop\">\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3\">\n          {/* Search */}\n          <div className=\"relative\">\n            <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n            <input\n              type=\"text\"\n              placeholder=\"Search reviews...\"\n              value={filters.searchQuery}\n              onChange={(e) => setFilters((p) => ({ ...p, searchQuery: e.target.value }))}\n              className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n            />\n          </div>\n\n          {/* Type */}\n          <select\n            value={filters.type}\n            onChange={(e) =>\n              setFilters((p) => ({ ...p, type: e.target.value as ReviewFilters['type'] }))\n            }\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"all\">All Reviews</option>\n            <option value=\"cart\">Cart Reviews</option>\n            <option value=\"product\">Product Reviews</option>\n            <option value=\"my-reviews\">My Reviews</option>\n          </select>\n\n          {/* Rating */}\n          <select\n            value={filters.rating}\n            onChange={(e) => setFilters((p) => ({ ...p, rating: e.target.value }))}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"\">All Ratings</option>\n            <option value=\"5\">5 Stars</option>\n            <option value=\"4\">4 Stars</option>\n            <option value=\"3\">3 Stars</option>\n            <option value=\"2\">2 Stars</option>\n            <option value=\"1\">1 Star</option>\n          </select>\n\n          {/* Sort */}\n          <select\n            value={filters.sortBy}\n            onChange={(e) =>\n              setFilters((p) => ({ ...p, sortBy: e.target.value as ReviewFilters['sortBy'] }))\n            }\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            <option value=\"recent\">Most Recent</option>\n            <option value=\"helpful\">Most Helpful</option>\n            <option value=\"rating-high\">Highest Rating</option>\n            <option value=\"rating-low\">Lowest Rating</option>\n          </select>\n        </div>\n      </div>\n\n      {/* Reviews List */}\n      {filteredReviews.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-data\"\n          icon={<MessageSquare className=\"h-12 w-12\" />}\n          title=\"No reviews found\"\n          description=\"Be the first to write a review!\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => setShowWriteReview(true)}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Write a Review\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"space-y-4\">\n          {filteredReviews.map((review) => {\n            const isMyReview = review.userId === CURRENT_USER_ID;\n            return (\n              <div\n                key={review.id}\n                className={cn(\n                  'rounded-lg border bg-bg-surface p-5',\n                  isMyReview ? 'border-foreground/20' : 'border-border-subtle'\n                )}\n              >\n                {/* Header */}\n                <div className=\"flex items-start gap-3 mb-3\">\n                  <img\n                    src={review.userAvatar}\n                    alt={review.userName}\n                    className=\"h-10 w-10 rounded-full object-cover shrink-0\"\n                  />\n                  <div className=\"flex-1 min-w-0\">\n                    <div className=\"flex items-center gap-2 flex-wrap\">\n                      <span className=\"text-sm font-semibold text-text-primary\">\n                        {review.userName}\n                      </span>\n                      {review.isVerified && (\n                        <span className=\"inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text\">\n                          <CheckCircle2 className=\"h-3 w-3\" />\n                          Verified\n                        </span>\n                      )}\n                      {isMyReview && (\n                        <span className=\"inline-flex items-center rounded-full bg-accent-blue-subtle/10 px-2 py-0.5 text-[10px] font-medium text-accent-blue\">\n                          Your Review\n                        </span>\n                      )}\n                    </div>\n                    <div className=\"flex flex-wrap items-center gap-2 text-xs text-text-secondary mt-0.5\">\n                      <span>\n                        {review.itemType === 'cart' ? (\n                          <MessageSquare className=\"inline h-3 w-3 mr-0.5\" />\n                        ) : (\n                          <Star className=\"inline h-3 w-3 mr-0.5\" />\n                        )}\n                        {review.itemName}\n                      </span>\n                      <span>\n                        {formatDate(review.createdAt, {\n                          hour: undefined,\n                          minute: undefined,\n                          hour12: undefined,\n                        })}\n                      </span>\n                    </div>\n                  </div>\n                  <div className=\"shrink-0\">\n                    <RatingDisplay value={review.rating} size=\"sm\" />\n                    <p className=\"text-xs text-text-secondary mt-0.5 text-right\">\n                      From: {review.cartName}\n                    </p>\n                  </div>\n                </div>\n\n                {/* Content */}\n                <div className=\"mb-3\">\n                  <h4 className=\"text-sm font-semibold text-text-primary mb-1\">{review.title}</h4>\n                  <p className=\"text-sm text-text-primary leading-relaxed\">{review.comment}</p>\n                </div>\n\n                {/* Review Images */}\n                {review.images && review.images.length > 0 && (\n                  <div className=\"mb-3 flex gap-2 overflow-x-auto pb-1\">\n                    {review.images.map((img, idx) => (\n                      <img\n                        key={idx}\n                        src={img}\n                        alt={`Review image ${idx + 1}`}\n                        className=\"h-20 w-20 rounded-lg object-cover shrink-0\"\n                      />\n                    ))}\n                  </div>\n                )}\n\n                {/* Owner Response */}\n                {review.response && (\n                  <div className=\"mb-3 rounded-lg border border-accent-blue-subtle/20 bg-accent-blue-subtle/5 p-3\">\n                    <div className=\"flex flex-wrap items-center gap-2 mb-1.5\">\n                      <MessageCircle className=\"h-3.5 w-3.5 text-accent-blue\" />\n                      <span className=\"text-xs font-medium text-accent-blue\">\n                        Response from {review.response.respondedBy}\n                      </span>\n                      <span className=\"text-[10px] text-accent-blue\">\n                        {formatDate(review.response.respondedAt, {\n                          hour: undefined,\n                          minute: undefined,\n                          hour12: undefined,\n                        })}\n                      </span>\n                    </div>\n                    <p className=\"text-xs text-accent-blue leading-relaxed\">\n                      {review.response.message}\n                    </p>\n                  </div>\n                )}\n\n                {/* Footer */}\n                <div className=\"flex items-center justify-between pt-3 border-t border-border-subtle\">\n                  <button\n                    type=\"button\"\n                    onClick={() => handleMarkHelpful(review.id)}\n                    className={cn(\n                      'flex items-center gap-1.5 text-xs transition-colors',\n                      review.isHelpful\n                        ? 'text-accent-blue font-medium'\n                        : 'text-text-secondary hover:text-text-primary'\n                    )}\n                  >\n                    <ThumbsUp className={cn('h-3.5 w-3.5', review.isHelpful && 'fill-current')} />\n                    Helpful ({review.helpfulCount})\n                  </button>\n\n                  <div className=\"flex items-center gap-3 text-xs text-text-secondary\">\n                    <span>Order: {review.orderId}</span>\n                    <button\n                      type=\"button\"\n                      onClick={() => navigateTo(`/customer/carts/${review.cartId}`)}\n                      className=\"font-medium hover:text-text-primary transition-colors\"\n                    >\n                      View Cart\n                    </button>\n                  </div>\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      )}\n\n      {/* Write Review Modal */}\n      {showWriteReview && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-2xl max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg\">\n            <div className=\"p-5\">\n              {/* Header */}\n              <div className=\"flex items-center justify-between mb-5\">\n                <h3 className=\"text-lg font-semibold text-text-primary\">Write a Review</h3>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowWriteReview(false)}\n                  className=\"rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-4 w-4\" />\n                </button>\n              </div>\n\n              <div className=\"space-y-4\">\n                {/* Rating */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-2\">\n                    Rating <span className=\"text-status-error-text\">*</span>\n                  </label>\n                  <InteractiveStarRating\n                    value={reviewForm.rating}\n                    onChange={(v) => setReviewForm((p) => ({ ...p, rating: v }))}\n                  />\n                </div>\n\n                {/* Title */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Review Title <span className=\"text-status-error-text\">*</span>\n                  </label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"Summarize your experience\"\n                    value={reviewForm.title}\n                    onChange={(e) => setReviewForm((p) => ({ ...p, title: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n\n                {/* Comment */}\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Your Review <span className=\"text-status-error-text\">*</span>\n                  </label>\n                  <textarea\n                    rows={5}\n                    placeholder=\"Share your experience with others...\"\n                    value={reviewForm.comment}\n                    onChange={(e) => setReviewForm((p) => ({ ...p, comment: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                {/* Guidelines */}\n                <div className=\"rounded-lg bg-bg-sunken p-4\">\n                  <div className=\"flex items-center gap-2 mb-2\">\n                    <Info className=\"h-4 w-4 text-text-secondary\" />\n                    <h4 className=\"text-sm font-medium text-text-primary\">Review Guidelines</h4>\n                  </div>\n                  <ul className=\"text-xs text-text-secondary space-y-1\">\n                    <li>- Be honest and helpful to other customers</li>\n                    <li>- Focus on your experience with the food and service</li>\n                    <li>- Avoid personal information or inappropriate content</li>\n                    <li>- Reviews are public and cannot be deleted once submitted</li>\n                  </ul>\n                </div>\n              </div>\n\n              {/* Actions */}\n              <div className=\"flex items-center gap-3 pt-5\">\n                <button\n                  type=\"button\"\n                  onClick={handleSubmitReview}\n                  className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  Submit Review\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowWriteReview(false)}\n                  className=\"rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/adaptercloud/pages/customer/SavedAddressesPage.js

@@ -74,9 +74,9 @@ var y = {
 	office: o,
 	other: d
 }, S = {
-	home: "bg-green-500/10 text-green-600 dark:text-green-400",
-	office: "bg-blue-500/10 text-blue-600 dark:text-blue-400",
-	other: "bg-purple-500/10 text-purple-600 dark:text-purple-400"
+	home: "bg-status-success-bg-subtle/10 text-status-success-text",
+	office: "bg-accent-blue-subtle/10 text-accent-blue",
+	other: "bg-accent-purple-subtle/10 text-accent-purple"
 };
 function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 	return /* @__PURE__ */ v("div", {
@@ -87,7 +87,7 @@ function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 				children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 					className: "block text-sm font-medium text-text-primary mb-1.5",
 					children: ["Address Type ", /* @__PURE__ */ _("span", {
-						className: "text-red-500",
+						className: "text-status-error-text",
 						children: "*"
 					})]
 				}), /* @__PURE__ */ v("select", {
@@ -122,7 +122,7 @@ function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 			/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 				className: "block text-sm font-medium text-text-primary mb-1.5",
 				children: ["Address Line 1 ", /* @__PURE__ */ _("span", {
-					className: "text-red-500",
+					className: "text-status-error-text",
 					children: "*"
 				})]
 			}), /* @__PURE__ */ _("input", {
@@ -148,7 +148,7 @@ function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 					/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 						className: "block text-sm font-medium text-text-primary mb-1.5",
 						children: ["City ", /* @__PURE__ */ _("span", {
-							className: "text-red-500",
+							className: "text-status-error-text",
 							children: "*"
 						})]
 					}), /* @__PURE__ */ _("input", {
@@ -161,7 +161,7 @@ function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 					/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 						className: "block text-sm font-medium text-text-primary mb-1.5",
 						children: ["State ", /* @__PURE__ */ _("span", {
-							className: "text-red-500",
+							className: "text-status-error-text",
 							children: "*"
 						})]
 					}), /* @__PURE__ */ _("input", {
@@ -174,7 +174,7 @@ function C({ data: e, onChange: t, onSubmit: n, onCancel: r, submitLabel: i }) {
 					/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("label", {
 						className: "block text-sm font-medium text-text-primary mb-1.5",
 						children: ["ZIP Code ", /* @__PURE__ */ _("span", {
-							className: "text-red-500",
+							className: "text-status-error-text",
 							children: "*"
 						})]
 					}), /* @__PURE__ */ _("input", {
@@ -272,14 +272,14 @@ function w() {
 		}),
 		children: [
 			j && /* @__PURE__ */ v("div", {
-				className: "mb-4 rounded-lg border border-green-500/30 bg-green-500/10 p-3 flex items-center gap-2",
-				children: [/* @__PURE__ */ _(s, { className: "h-4 w-4 text-green-600 dark:text-green-400 shrink-0" }), /* @__PURE__ */ _("p", {
-					className: "text-sm text-green-600 dark:text-green-400",
+				className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
+				children: [/* @__PURE__ */ _(s, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ _("p", {
+					className: "text-sm text-status-success-text",
 					children: j
 				})]
 			}),
 			T && /* @__PURE__ */ v("div", {
-				className: "rounded-lg border border-border-subtle bg-bg-surface p-5 mb-6",
+				className: "rounded-lg border border-border-seam bg-bg-surface p-5 mb-6 bg-gloss-card shadow-pop",
 				children: [/* @__PURE__ */ _("h3", {
 					className: "text-base font-semibold text-text-primary mb-4",
 					children: "Add New Address"
@@ -315,7 +315,7 @@ function w() {
 												className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium capitalize", S[e.type]),
 												children: e.type
 											}), e.isDefault && /* @__PURE__ */ v("span", {
-												className: "inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400",
+												className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text",
 												children: [/* @__PURE__ */ _(s, { className: "h-3 w-3" }), "Default"]
 											})]
 										}),
@@ -397,6 +397,7 @@ function w() {
 					}, e.id);
 				})
 			}) : /* @__PURE__ */ _(r, {
+				illustration: "empty-generic",
 				icon: /* @__PURE__ */ _(d, { className: "h-12 w-12" }),
 				title: "No saved addresses",
 				description: "Add a delivery address to get started.",