@burdenoff/microfe-billing 2026.510.114

package/dist/billing/modules/usage/pages/UsagePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UsagePage.js","names":[],"sources":["../../../../../src/billing/modules/usage/pages/UsagePage.tsx"],"sourcesContent":["/**\n * Usage Module - Enhanced Usage Page\n * Displays usage dashboard with billing account selector, aggregated quotas by subscription,\n * pooled quotas, and lazy-loaded past subscriptions\n */\n\nimport { useState, useMemo, useDeferredValue, useCallback, type FC } from 'react';\nimport {\n  ChevronDown,\n  ChevronRight,\n  AlertTriangle,\n  CheckCircle,\n  XCircle,\n  AlertCircle,\n  Layers,\n  Package,\n  Clock,\n  RefreshCw,\n  Info,\n  ChevronLeft,\n  X,\n  Search,\n} from 'lucide-react';\nimport {\n  useEnhancedUsagePage,\n  useBillingAccountsForUsage,\n  useQuotaUsageDetails,\n  type AggregatedQuota,\n  type SubscriptionWithAggregatedQuotas,\n} from '../hooks/useUsage';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport { formatNumber, formatRelativeTime, formatDateTime } from '../../../shared/utils/format';\nimport { statusTokens } from '../../../shared/utils/tokens';\nimport type { QuotaStatus } from '../../../shared/types';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface QuotaDetailModalProps {\n  quota: AggregatedQuota;\n  onClose: () => void;\n}\n\n// ============================================================================\n// Helper Components\n// ============================================================================\n\nconst StatusIcon: FC<{ status: QuotaStatus; className?: string }> = ({\n  status,\n  className = 'w-4 h-4',\n}) => {\n  switch (status) {\n    case 'EXHAUSTED':\n      return <XCircle className={`${className} ${statusTokens.error.icon}`} />;\n    case 'CRITICAL':\n      return <AlertTriangle className={`${className} ${statusTokens.error.icon}`} />;\n    case 'WARNING':\n      return <AlertCircle className={`${className} ${statusTokens.warning.icon}`} />;\n    case 'HEALTHY':\n      return <CheckCircle className={`${className} ${statusTokens.success.icon}`} />;\n    default:\n      return <Info className={`${className} ${statusTokens.neutral.icon}`} />;\n  }\n};\n\nconst StatusBadge: FC<{ status: QuotaStatus }> = ({ status }) => {\n  const colors: Record<QuotaStatus, string> = {\n    EXHAUSTED: `${statusTokens.error.bg} ${statusTokens.error.text}`,\n    CRITICAL: `${statusTokens.error.bg} ${statusTokens.error.text}`,\n    WARNING: `${statusTokens.warning.bg} ${statusTokens.warning.text}`,\n    HEALTHY: `${statusTokens.success.bg} ${statusTokens.success.text}`,\n    INACTIVE: `${statusTokens.neutral.bg} ${statusTokens.neutral.text}`,\n  };\n\n  return (\n    <span className={`px-2 py-0.5 text-xs font-medium rounded ${colors[status]}`}>{status}</span>\n  );\n};\n\nconst ProgressBar: FC<{ percentage: number; status: QuotaStatus }> = ({ percentage, status }) => {\n  const clampedPercentage = Math.min(100, Math.max(0, percentage));\n\n  const barColors: Record<QuotaStatus, string> = {\n    EXHAUSTED: statusTokens.error.dot,\n    CRITICAL: statusTokens.error.dot,\n    WARNING: statusTokens.warning.dot,\n    HEALTHY: statusTokens.success.dot,\n    INACTIVE: statusTokens.neutral.dot,\n  };\n\n  return (\n    <div className=\"w-full bg-muted rounded-full h-2.5 overflow-hidden\">\n      <div\n        className={`h-full rounded-full transition-all duration-300 ${barColors[status]}`}\n        style={{ width: `${clampedPercentage}%` }}\n      />\n    </div>\n  );\n};\n\n// ============================================================================\n// Stat Card Component\n// ============================================================================\n\ntype StatusFilter = 'all' | 'healthy' | 'warning' | 'critical';\n\ninterface StatCardProps {\n  label: string;\n  value: string | number;\n  icon: React.ReactNode;\n  color: 'blue' | 'emerald' | 'amber' | 'red' | 'gray';\n  isActive?: boolean;\n  onClick?: () => void;\n}\n\nconst StatCard: FC<StatCardProps> = ({ label, value, icon, color, isActive, onClick }) => {\n  // Map color prop to semantic status tokens\n  const colorToStatus = {\n    blue: statusTokens.info,\n    emerald: statusTokens.success,\n    amber: statusTokens.warning,\n    red: statusTokens.error,\n    gray: statusTokens.neutral,\n  };\n\n  const tokens = colorToStatus[color];\n\n  const colors = {\n    blue: `${tokens.bg} ${tokens.border}`,\n    emerald: `${tokens.bg} ${tokens.border}`,\n    amber: `${tokens.bg} ${tokens.border}`,\n    red: `${tokens.bg} ${tokens.border}`,\n    gray: `${tokens.bg} ${tokens.border}`,\n  };\n\n  // Active ring colors - using semantic dot color for consistency\n  const activeColors = {\n    blue: `ring-2 ring-offset-2 dark:ring-offset-background ${statusTokens.info.border.replace('border-', 'ring-')}`,\n    emerald: `ring-2 ring-offset-2 dark:ring-offset-background ${statusTokens.success.border.replace('border-', 'ring-')}`,\n    amber: `ring-2 ring-offset-2 dark:ring-offset-background ${statusTokens.warning.border.replace('border-', 'ring-')}`,\n    red: `ring-2 ring-offset-2 dark:ring-offset-background ${statusTokens.error.border.replace('border-', 'ring-')}`,\n    gray: `ring-2 ring-offset-2 dark:ring-offset-background ${statusTokens.neutral.border.replace('border-', 'ring-')}`,\n  };\n\n  const iconColors = {\n    blue: statusTokens.info.icon,\n    emerald: statusTokens.success.icon,\n    amber: statusTokens.warning.icon,\n    red: statusTokens.error.icon,\n    gray: statusTokens.neutral.icon,\n  };\n\n  return (\n    <button\n      onClick={onClick}\n      className={`border rounded-lg p-4 w-full text-left transition-all ${colors[color]} ${\n        onClick ? 'cursor-pointer hover:shadow-md' : ''\n      } ${isActive ? activeColors[color] : ''}`}\n    >\n      <div className=\"flex items-center gap-2 mb-2\">\n        <span className={iconColors[color]}>{icon}</span>\n        <span className=\"text-sm text-muted-foreground\">{label}</span>\n      </div>\n      <p className=\"text-2xl font-bold text-foreground\">{value}</p>\n    </button>\n  );\n};\n\n// ============================================================================\n// Quota Card Component\n// ============================================================================\n\ninterface QuotaCardProps {\n  quota: AggregatedQuota;\n  onClick: () => void;\n}\n\nconst QuotaCard: FC<QuotaCardProps> = ({ quota, onClick }) => {\n  // Check if there's an actual limit (ignore noLimit flag, check actual value)\n  const hasLimit = quota.totalLimit != null && quota.totalLimit > 0;\n  const displayLimit = hasLimit ? formatNumber(quota.totalLimit) : '∞';\n  const displayUsed = formatNumber(quota.totalUsed);\n\n  return (\n    <button\n      onClick={onClick}\n      className=\"w-full text-left border border-border rounded-lg p-4 bg-card hover:shadow-md transition-all hover:border-primary/50\"\n    >\n      <div className=\"flex items-start justify-between gap-4\">\n        <div className=\"flex-1 min-w-0\">\n          <div className=\"flex items-center gap-2 mb-2\">\n            <StatusIcon status={quota.status} />\n            <span className=\"font-medium text-foreground capitalize\">\n              {quota.name.replace(/_/g, ' ')}\n            </span>\n            <StatusBadge status={quota.status} />\n          </div>\n\n          <div className=\"mb-2\">\n            <ProgressBar percentage={quota.usagePercentage} status={quota.status} />\n          </div>\n\n          <div className=\"flex items-center justify-between text-sm\">\n            <span className=\"text-muted-foreground\">\n              {displayUsed} / {displayLimit}\n              {quota.unit && ` ${quota.unit}`}\n            </span>\n            <span className=\"font-medium text-foreground\">\n              {hasLimit ? `${Math.round(quota.usagePercentage)}%` : '-'}\n            </span>\n          </div>\n\n          {quota.quotaCount > 1 && (\n            <p className=\"text-xs text-muted-foreground mt-2\">\n              Across {quota.quotaCount} quota assignments\n            </p>\n          )}\n        </div>\n\n        <ChevronRight className=\"w-5 h-5 text-muted-foreground flex-shrink-0\" />\n      </div>\n    </button>\n  );\n};\n\n// ============================================================================\n// Subscription Section Component\n// ============================================================================\n\ninterface SubscriptionSectionProps {\n  subscription: SubscriptionWithAggregatedQuotas;\n  onQuotaClick: (quota: AggregatedQuota) => void;\n  defaultExpanded?: boolean;\n}\n\nconst SubscriptionSection: FC<SubscriptionSectionProps> = ({\n  subscription,\n  onQuotaClick,\n  defaultExpanded = true,\n}) => {\n  const [isExpanded, setIsExpanded] = useState(defaultExpanded);\n\n  const statusColors: Record<string, string> = {\n    active: `${statusTokens.success.bg} ${statusTokens.success.text}`,\n    trialing: `${statusTokens.info.bg} ${statusTokens.info.text}`,\n    past_due: `${statusTokens.warning.bg} ${statusTokens.warning.text}`,\n    canceled: `${statusTokens.neutral.bg} ${statusTokens.neutral.text}`,\n    expired: `${statusTokens.neutral.bg} ${statusTokens.neutral.text}`,\n    upgraded: `${statusTokens.primary.bg} ${statusTokens.primary.text}`,\n  };\n\n  return (\n    <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n      <button\n        onClick={() => setIsExpanded(!isExpanded)}\n        className=\"w-full flex items-center justify-between p-4 hover:bg-muted/50 transition-colors\"\n      >\n        <div className=\"flex items-center gap-3\">\n          <Package className=\"w-5 h-5 text-primary\" />\n          <div className=\"text-left\">\n            <div className=\"flex items-center gap-2\">\n              <span className=\"font-medium text-foreground\">Subscription</span>\n              <span\n                className={`px-2 py-0.5 text-xs font-medium rounded capitalize ${statusColors[subscription.status.toLowerCase()] || statusColors.active}`}\n              >\n                {subscription.status}\n              </span>\n            </div>\n            <p className=\"text-xs text-muted-foreground\">\n              {subscription.aggregatedQuotas.length} quota type\n              {subscription.aggregatedQuotas.length !== 1 ? 's' : ''}\n            </p>\n          </div>\n        </div>\n        {isExpanded ? (\n          <ChevronDown className=\"w-5 h-5 text-muted-foreground\" />\n        ) : (\n          <ChevronRight className=\"w-5 h-5 text-muted-foreground\" />\n        )}\n      </button>\n\n      {isExpanded && subscription.aggregatedQuotas.length > 0 && (\n        <div className=\"border-t border-border p-4 space-y-3\">\n          {subscription.aggregatedQuotas.map((quota) => (\n            <QuotaCard key={quota.name} quota={quota} onClick={() => onQuotaClick(quota)} />\n          ))}\n        </div>\n      )}\n\n      {isExpanded && subscription.aggregatedQuotas.length === 0 && (\n        <div className=\"border-t border-border p-6 text-center\">\n          <p className=\"text-sm text-muted-foreground\">No quotas assigned to this subscription</p>\n        </div>\n      )}\n    </div>\n  );\n};\n\n// ============================================================================\n// Quota Detail Modal Component\n// ============================================================================\n\nconst QuotaDetailModal: FC<QuotaDetailModalProps> = ({ quota, onClose }) => {\n  // Cursor stack: [null] = page 1, [null, c1] = page 2, etc.\n  const [cursorStack, setCursorStack] = useState<Array<string | null>>([null]);\n  const currentCursor = cursorStack[cursorStack.length - 1] ?? null;\n  const currentPage = cursorStack.length;\n  const { workspaceId } = useBilling();\n\n  // Get usage details for the first quota assignment directly from activity-svc\n  const firstAssignmentId = quota.quotaAssignments[0]?.id;\n  const { usages, hasNextPage, nextCursor, isLoading } = useQuotaUsageDetails(\n    firstAssignmentId,\n    10,\n    currentCursor,\n    workspaceId\n  );\n\n  const handleNext = () => {\n    if (nextCursor) setCursorStack((prev) => [...prev, nextCursor]);\n  };\n\n  const handlePrev = () => {\n    if (cursorStack.length > 1) setCursorStack((prev) => prev.slice(0, -1));\n  };\n\n  return (\n    <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n      <div className=\"absolute inset-0 bg-overlay-scrim\" onClick={onClose} />\n      <div\n        className=\"relative bg-background border border-border rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-auto\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby=\"quota-detail-title\"\n      >\n        {/* Header */}\n        <div className=\"sticky top-0 bg-background border-b border-border p-4 flex items-center justify-between\">\n          <div className=\"flex items-center gap-3\">\n            <StatusIcon status={quota.status} className=\"w-5 h-5\" />\n            <div>\n              <h2 id=\"quota-detail-title\" className=\"text-lg font-semibold capitalize\">\n                {quota.name.replace(/_/g, ' ')}\n              </h2>\n              <p className=\"text-sm text-muted-foreground\">\n                {quota.quotaCount} quota assignment{quota.quotaCount !== 1 ? 's' : ''}\n              </p>\n            </div>\n          </div>\n          <button\n            onClick={onClose}\n            className=\"p-1 rounded-md hover:bg-muted/50 transition-colors\"\n            aria-label=\"Close quota details\"\n          >\n            <X className=\"w-5 h-5\" />\n          </button>\n        </div>\n\n        {/* Summary */}\n        <div className=\"p-4 border-b border-border\">\n          <div className=\"mb-4\">\n            <div className=\"flex items-center justify-between mb-2\">\n              <span className=\"text-sm text-muted-foreground\">Usage</span>\n              <StatusBadge status={quota.status} />\n            </div>\n            <ProgressBar percentage={quota.usagePercentage} status={quota.status} />\n            <div className=\"flex items-center justify-between mt-2 text-sm\">\n              <span className=\"font-medium\">\n                {formatNumber(quota.totalUsed)} /{' '}\n                {quota.totalLimit != null && quota.totalLimit > 0\n                  ? formatNumber(quota.totalLimit)\n                  : '∞'}\n                {quota.unit && ` ${quota.unit}`}\n              </span>\n              <span className=\"text-muted-foreground\">\n                {quota.totalLimit != null && quota.totalLimit > 0\n                  ? `${Math.round(quota.usagePercentage)}% used`\n                  : 'Unlimited'}\n              </span>\n            </div>\n          </div>\n\n          {/* Quota Assignments Breakdown - sorted by expiry date (earliest first) */}\n          {quota.quotaCount > 1 && (\n            <div className=\"mt-4\">\n              <h3 className=\"text-sm font-medium text-foreground mb-3\">Quota Breakdown</h3>\n              <div className=\"border border-border rounded-lg overflow-hidden divide-y divide-border\">\n                {[...quota.quotaAssignments]\n                  .sort((a, b) => {\n                    // Sort by endtime ascending (earliest expiry first)\n                    const dateA = a.endtime ? new Date(a.endtime).getTime() : Infinity;\n                    const dateB = b.endtime ? new Date(b.endtime).getTime() : Infinity;\n                    return dateA - dateB;\n                  })\n                  .map((assignment) => {\n                    const expiryDate = assignment.endtime ? new Date(assignment.endtime) : null;\n                    const now = new Date();\n                    const isExpired = expiryDate && expiryDate < now;\n                    const daysUntilExpiry = expiryDate\n                      ? Math.ceil((expiryDate.getTime() - now.getTime()) / (24 * 60 * 60 * 1000))\n                      : null;\n                    const isExpiringSoon =\n                      daysUntilExpiry !== null && daysUntilExpiry > 0 && daysUntilExpiry <= 7;\n\n                    return (\n                      <div\n                        key={assignment.id}\n                        className={`flex items-center justify-between px-3 py-2.5 ${\n                          isExpired\n                            ? 'bg-muted/30'\n                            : isExpiringSoon\n                              ? statusTokens.warning.bg\n                              : 'bg-background'\n                        }`}\n                      >\n                        <div className=\"flex items-center gap-2\">\n                          {isExpiringSoon && !isExpired && (\n                            <span\n                              className={`w-2 h-2 rounded-full ${statusTokens.warning.dot} animate-pulse`}\n                            />\n                          )}\n                          <div className=\"flex flex-col\">\n                            <span\n                              className={`text-sm ${isExpired ? 'text-muted-foreground' : 'text-foreground'}`}\n                            >\n                              {expiryDate\n                                ? expiryDate.toLocaleDateString('en-US', {\n                                    month: 'short',\n                                    day: 'numeric',\n                                    year: 'numeric',\n                                  })\n                                : 'No expiry'}\n                            </span>\n                            <span\n                              className={`text-xs ${\n                                isExpired\n                                  ? 'text-destructive'\n                                  : isExpiringSoon\n                                    ? statusTokens.warning.text\n                                    : 'text-muted-foreground'\n                              }`}\n                            >\n                              {isExpired\n                                ? 'Expired'\n                                : daysUntilExpiry !== null\n                                  ? daysUntilExpiry === 0\n                                    ? 'Expires today'\n                                    : daysUntilExpiry === 1\n                                      ? 'Expires tomorrow'\n                                      : `${daysUntilExpiry} days left`\n                                  : 'Never expires'}\n                            </span>\n                          </div>\n                        </div>\n                        <div className=\"text-right\">\n                          <span\n                            className={`text-sm font-semibold ${isExpired ? 'text-muted-foreground' : 'text-foreground'}`}\n                          >\n                            {formatNumber(assignment.used)}\n                            <span className=\"text-muted-foreground font-normal\">\n                              {' / '}\n                              {assignment.limit != null && assignment.limit > 0\n                                ? formatNumber(assignment.limit)\n                                : '∞'}\n                              {assignment.unit && ` ${assignment.unit}`}\n                            </span>\n                          </span>\n                        </div>\n                      </div>\n                    );\n                  })}\n              </div>\n            </div>\n          )}\n        </div>\n\n        {/* Usage History */}\n        <div className=\"p-4\">\n          <h3 className=\"text-sm font-medium text-foreground mb-3\">Recent Usage</h3>\n\n          {isLoading ? (\n            <div className=\"space-y-2\">\n              {[1, 2, 3].map((i) => (\n                <div key={i} className=\"h-12 bg-muted animate-pulse rounded\" />\n              ))}\n            </div>\n          ) : usages.length === 0 ? (\n            <p className=\"text-sm text-muted-foreground text-center py-6\">No usage records found</p>\n          ) : (\n            <div className=\"space-y-2\">\n              {usages.map((usage) => (\n                <div\n                  key={usage.id}\n                  className=\"flex items-center justify-between p-3 border border-border rounded-lg\"\n                >\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm font-medium text-foreground\">\n                      {usage.description || 'Usage recorded'}\n                    </p>\n                    <p className=\"text-xs text-muted-foreground\">\n                      {formatRelativeTime(usage.timestamp)} • {formatDateTime(usage.timestamp)}\n                    </p>\n                  </div>\n                  <span className=\"text-sm font-medium text-foreground ml-4\">\n                    {formatNumber(usage.amount)}\n                  </span>\n                </div>\n              ))}\n            </div>\n          )}\n\n          {/* Pagination */}\n          {(cursorStack.length > 1 || hasNextPage) && (\n            <div className=\"flex items-center justify-center gap-2 mt-4\">\n              <button\n                onClick={handlePrev}\n                disabled={cursorStack.length === 1}\n                className=\"px-3 py-1.5 text-sm border border-border rounded-md disabled:opacity-50\"\n                aria-label=\"Previous usage page\"\n              >\n                <ChevronLeft className=\"w-4 h-4\" />\n              </button>\n              <span className=\"text-sm text-muted-foreground\">Page {currentPage}</span>\n              <button\n                onClick={handleNext}\n                disabled={!hasNextPage}\n                className=\"px-3 py-1.5 text-sm border border-border rounded-md disabled:opacity-50\"\n                aria-label=\"Next usage page\"\n              >\n                <ChevronRight className=\"w-4 h-4\" />\n              </button>\n            </div>\n          )}\n        </div>\n\n        {/* Footer */}\n        <div className=\"sticky bottom-0 bg-background border-t border-border p-4\">\n          <button\n            onClick={onClose}\n            className=\"w-full py-2 px-4 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n          >\n            Close\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n\n// ============================================================================\n// Main Usage Page Component\n// ============================================================================\n\nexport const UsagePage: FC = () => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  const permissions = useBillingPermissions();\n\n  // Helper to get billing account ID from URL (for navigation from Overview page)\n  const getInitialBillingAccountId = (): string | undefined => {\n    if (typeof window === 'undefined') return undefined;\n    const urlParams = new URLSearchParams(window.location.search);\n    return urlParams.get('billingAccountId') || undefined;\n  };\n\n  // State - initialize with URL param if present\n  const [selectedBillingAccountId, setSelectedBillingAccountId] = useState<string | undefined>(\n    getInitialBillingAccountId\n  );\n  const [selectedQuota, setSelectedQuota] = useState<AggregatedQuota | null>(null);\n\n  // Search and filter state\n  const [searchQuery, setSearchQuery] = useState('');\n  const [statusFilter, setStatusFilter] = useState<StatusFilter>('all');\n\n  // View mode: 'active' | 'past' | 'all'\n  type ViewMode = 'active' | 'past' | 'all';\n  const [viewMode, setViewMode] = useState<ViewMode>('active');\n\n  // Debounce search query to avoid too many API calls\n  const deferredSearchQuery = useDeferredValue(searchQuery);\n\n  // Fetch billing accounts\n  const { billingAccounts, isLoading: isLoadingAccounts } = useBillingAccountsForUsage();\n\n  // Prefer the default account, fall back to first\n  const defaultBillingAccountId = (billingAccounts.find((a) => a.isDefault) ?? billingAccounts[0])\n    ?.id;\n  // ?? so that an explicit empty string (cleared URL param) still falls back to default\n  const effectiveBillingAccountId = selectedBillingAccountId ?? defaultBillingAccountId;\n\n  // Fetch usage data - passes searchQuery and viewMode to backend for server-side filtering\n  const {\n    dashboard,\n    pooledQuotas,\n    activeSubscriptions,\n    pastSubscriptions,\n    isLoading,\n    isPastSubscriptionsLoading,\n    error,\n    refetch,\n    // Pagination for past subscriptions\n    loadMorePastSubscriptions,\n    hasMorePastSubscriptions,\n    isLoadingMorePast,\n    pastSubscriptionsCount,\n  } = useEnhancedUsagePage({\n    billingAccountId: effectiveBillingAccountId,\n    searchQuery: deferredSearchQuery || undefined,\n    viewMode, // 'active' | 'past' | 'all'\n  });\n\n  // Filter quotas by status (search is now handled by backend)\n  const filterQuotaByStatus = useCallback(\n    (quota: AggregatedQuota): boolean => {\n      if (statusFilter === 'all') return true;\n      if (statusFilter === 'healthy') return quota.status === 'HEALTHY';\n      if (statusFilter === 'warning') return quota.status === 'WARNING';\n      if (statusFilter === 'critical')\n        return quota.status === 'CRITICAL' || quota.status === 'EXHAUSTED';\n      return true;\n    },\n    [statusFilter]\n  );\n\n  // Filtered data - only status filter is client-side, search is backend\n  const filteredPooledQuotas = useMemo(() => {\n    return pooledQuotas.filter(filterQuotaByStatus);\n  }, [pooledQuotas, filterQuotaByStatus]);\n\n  const filteredActiveSubscriptions = useMemo(() => {\n    if (statusFilter === 'all') {\n      return activeSubscriptions;\n    }\n    return activeSubscriptions\n      .map((sub) => ({\n        ...sub,\n        aggregatedQuotas: sub.aggregatedQuotas.filter(filterQuotaByStatus),\n      }))\n      .filter((sub) => sub.aggregatedQuotas.length > 0);\n  }, [activeSubscriptions, statusFilter, filterQuotaByStatus]);\n\n  const filteredPastSubscriptions = useMemo(() => {\n    if (statusFilter === 'all') {\n      return pastSubscriptions;\n    }\n    return pastSubscriptions\n      .map((sub) => ({\n        ...sub,\n        aggregatedQuotas: sub.aggregatedQuotas.filter(filterQuotaByStatus),\n      }))\n      .filter((sub) => sub.aggregatedQuotas.length > 0);\n  }, [pastSubscriptions, statusFilter, filterQuotaByStatus]);\n\n  // Subscriptions to display based on view mode\n  const displayedSubscriptions = useMemo(() => {\n    if (viewMode === 'active') {\n      return { active: filteredActiveSubscriptions, past: [] };\n    }\n    if (viewMode === 'past') {\n      return { active: [], past: filteredPastSubscriptions };\n    }\n    // 'all' - show both\n    return { active: filteredActiveSubscriptions, past: filteredPastSubscriptions };\n  }, [viewMode, filteredActiveSubscriptions, filteredPastSubscriptions]);\n\n  const hasActiveFilters = searchQuery !== '' || statusFilter !== 'all';\n  const isSearching = deferredSearchQuery !== searchQuery; // Show loading indicator while debouncing\n\n  const clearFilters = () => {\n    setSearchQuery('');\n    setStatusFilter('all');\n  };\n\n  // Toggle status filter (click same to deselect)\n  const toggleStatusFilter = (filter: StatusFilter) => {\n    setStatusFilter((prev) => (prev === filter ? 'all' : filter));\n  };\n\n  // Permission check\n  if (!permissions.canViewUsage) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n            <AlertTriangle className=\"w-6 h-6 text-muted-foreground\" />\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">Access Denied</h2>\n          <p className=\"text-sm text-muted-foreground max-w-sm\">\n            You don&apos;t have permission to view usage data.\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Loading state\n  if ((isLoadingAccounts || isLoading) && !dashboard) {\n    return (\n      <div className=\"space-y-6 p-6\">\n        <div className=\"h-8 w-48 bg-muted animate-pulse rounded\" />\n        <div className=\"grid grid-cols-2 sm:grid-cols-4 gap-4\">\n          {[1, 2, 3, 4].map((i) => (\n            <div key={i} className=\"h-24 bg-muted animate-pulse rounded-lg\" />\n          ))}\n        </div>\n        <div className=\"h-64 bg-muted animate-pulse rounded-lg\" />\n      </div>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-4\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n            <AlertTriangle className=\"w-6 h-6 text-destructive\" />\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">Failed to load usage data</h2>\n          <p className=\"text-sm text-muted-foreground\">{error.message}</p>\n          <button\n            onClick={() => refetch()}\n            className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n          >\n            Try Again\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  const selectedAccount = billingAccounts.find((a) => a.id === effectiveBillingAccountId);\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      {/* Header with Billing Account Selector */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-bold text-foreground\">\n            {tr('billing.usage.title', 'Usage')}\n          </h1>\n          <p className=\"text-sm text-muted-foreground mt-1\">\n            Monitor your resource consumption and quota usage\n          </p>\n        </div>\n\n        <div className=\"flex items-center gap-3\">\n          {/* Billing Account Selector */}\n          {billingAccounts.length > 1 && (\n            <select\n              value={effectiveBillingAccountId || ''}\n              onChange={(e) => setSelectedBillingAccountId(e.target.value)}\n              className=\"px-3 py-2 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary min-w-[200px]\"\n            >\n              {billingAccounts.map((account) => (\n                <option key={account.id} value={account.id}>\n                  {account.name}\n                </option>\n              ))}\n            </select>\n          )}\n\n          {/* Refresh Button */}\n          <button\n            onClick={() => refetch()}\n            className=\"p-2 border border-border rounded-md hover:bg-muted/50 transition-colors\"\n            title=\"Refresh\"\n          >\n            <RefreshCw className=\"w-4 h-4\" />\n          </button>\n        </div>\n      </div>\n\n      {/* Search and Filters */}\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center\">\n        {/* Search Input */}\n        <div className=\"relative flex-1 max-w-md\">\n          <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground\" />\n          <input\n            type=\"text\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            placeholder={`Search ${viewMode === 'past' ? 'past' : viewMode === 'all' ? 'all' : 'active'} quotas...`}\n            className=\"w-full pl-9 pr-3 py-2 text-sm border border-border rounded-md bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary\"\n          />\n          {(searchQuery || isSearching) && (\n            <button\n              onClick={() => setSearchQuery('')}\n              className=\"absolute right-2 top-1/2 -translate-y-1/2 p-1 rounded hover:bg-muted/50\"\n            >\n              {isSearching ? (\n                <RefreshCw className=\"w-3 h-3 text-muted-foreground animate-spin\" />\n              ) : (\n                <X className=\"w-3 h-3 text-muted-foreground\" />\n              )}\n            </button>\n          )}\n        </div>\n\n        {/* View Mode Tabs */}\n        <div className=\"flex items-center bg-muted/50 rounded-lg p-1 border border-border\">\n          <button\n            onClick={() => setViewMode('active')}\n            className={`flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${\n              viewMode === 'active'\n                ? 'bg-background text-foreground shadow-sm font-medium'\n                : 'text-muted-foreground hover:text-foreground'\n            }`}\n          >\n            <Package className=\"w-3.5 h-3.5\" />\n            Active\n          </button>\n          <button\n            onClick={() => setViewMode('past')}\n            disabled={isPastSubscriptionsLoading && viewMode !== 'past'}\n            className={`flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md transition-all ${\n              viewMode === 'past'\n                ? 'bg-background text-foreground shadow-sm font-medium'\n                : 'text-muted-foreground hover:text-foreground'\n            } ${isPastSubscriptionsLoading && viewMode !== 'past' ? 'opacity-70' : ''}`}\n          >\n            {isPastSubscriptionsLoading && viewMode === 'past' ? (\n              <RefreshCw className=\"w-3.5 h-3.5 animate-spin\" />\n            ) : (\n              <Clock className=\"w-3.5 h-3.5\" />\n            )}\n            Past\n          </button>\n        </div>\n\n        {/* Active Filters Indicator */}\n        {hasActiveFilters && (\n          <button\n            onClick={clearFilters}\n            className=\"flex items-center gap-1.5 px-3 py-1.5 text-sm text-muted-foreground hover:text-foreground border border-border rounded-md hover:bg-muted/50 transition-colors\"\n          >\n            <X className=\"w-3 h-3\" />\n            Clear filters\n          </button>\n        )}\n      </div>\n\n      {/* Billing Account Info */}\n      {selectedAccount && (\n        <div className=\"text-sm text-muted-foreground\">\n          Viewing usage for{' '}\n          <span className=\"font-medium text-foreground\">{selectedAccount.name}</span>\n        </div>\n      )}\n\n      {/* Overview Stats - Clickable to filter */}\n      {dashboard && (\n        <div className=\"grid grid-cols-2 sm:grid-cols-4 gap-4\">\n          <StatCard\n            label=\"Total Quotas\"\n            value={dashboard.totalQuotas}\n            icon={<Layers className=\"w-5 h-5\" />}\n            color=\"blue\"\n            isActive={statusFilter === 'all'}\n            onClick={() => setStatusFilter('all')}\n          />\n          <StatCard\n            label=\"Healthy\"\n            value={dashboard.healthyQuotas}\n            icon={<CheckCircle className=\"w-5 h-5\" />}\n            color=\"emerald\"\n            isActive={statusFilter === 'healthy'}\n            onClick={() => toggleStatusFilter('healthy')}\n          />\n          <StatCard\n            label=\"Warning\"\n            value={dashboard.warningQuotas}\n            icon={<AlertCircle className=\"w-5 h-5\" />}\n            color=\"amber\"\n            isActive={statusFilter === 'warning'}\n            onClick={() => toggleStatusFilter('warning')}\n          />\n          <StatCard\n            label=\"Critical / Exhausted\"\n            value={dashboard.criticalQuotas + dashboard.exhaustedQuotas}\n            icon={<AlertTriangle className=\"w-5 h-5\" />}\n            color=\"red\"\n            isActive={statusFilter === 'critical'}\n            onClick={() => toggleStatusFilter('critical')}\n          />\n        </div>\n      )}\n\n      {/* Filter Results Info */}\n      {(hasActiveFilters || viewMode !== 'active') && (\n        <div className=\"flex items-center gap-2 text-sm text-muted-foreground flex-wrap\">\n          <span>\n            Showing{' '}\n            {displayedSubscriptions.active.reduce((acc, s) => acc + s.aggregatedQuotas.length, 0) +\n              displayedSubscriptions.past.reduce((acc, s) => acc + s.aggregatedQuotas.length, 0) +\n              (viewMode !== 'past' ? filteredPooledQuotas.length : 0)}{' '}\n            quotas\n          </span>\n          <span className=\"px-2 py-0.5 bg-primary/10 text-primary rounded text-xs capitalize\">\n            {viewMode === 'active' ? 'Active' : viewMode === 'past' ? 'Past' : 'All'} subscriptions\n          </span>\n          {statusFilter !== 'all' && (\n            <span className=\"px-2 py-0.5 bg-muted rounded text-xs capitalize\">\n              {statusFilter === 'critical' ? 'Critical / Exhausted' : statusFilter}\n            </span>\n          )}\n          {searchQuery && (\n            <span className=\"px-2 py-0.5 bg-muted rounded text-xs\">\n              &ldquo;{searchQuery}&rdquo;\n            </span>\n          )}\n        </div>\n      )}\n\n      {/* Active Subscriptions Section */}\n      {displayedSubscriptions.active.length > 0 && (\n        <section>\n          <h2 className=\"text-lg font-semibold text-foreground mb-4 flex items-center gap-2\">\n            <Package className=\"w-5 h-5 text-primary\" />\n            {viewMode === 'all' ? 'Active Subscription Quotas' : 'Subscription Quotas'}\n          </h2>\n          <div className=\"space-y-4\">\n            {displayedSubscriptions.active.map((subscription) => (\n              <SubscriptionSection\n                key={subscription.id}\n                subscription={subscription}\n                onQuotaClick={setSelectedQuota}\n                defaultExpanded={true}\n              />\n            ))}\n          </div>\n        </section>\n      )}\n\n      {/* Past Subscriptions Section (when viewMode is 'past' or 'all') */}\n      {displayedSubscriptions.past.length > 0 && (\n        <section>\n          <h2 className=\"text-lg font-semibold text-foreground mb-4 flex items-center gap-2\">\n            <Clock className=\"w-5 h-5 text-muted-foreground\" />\n            Past Subscription Quotas\n            <span className=\"text-xs font-normal text-muted-foreground\">\n              (Canceled / Expired / Upgraded)\n            </span>\n            {pastSubscriptionsCount > 0 && (\n              <span className=\"text-xs font-normal px-2 py-0.5 bg-muted rounded-full\">\n                {displayedSubscriptions.past.length}\n                {hasMorePastSubscriptions ? '+' : ''} of {pastSubscriptionsCount}\n              </span>\n            )}\n          </h2>\n          <div className=\"space-y-4\">\n            {displayedSubscriptions.past.map((subscription) => (\n              <SubscriptionSection\n                key={subscription.id}\n                subscription={subscription}\n                onQuotaClick={setSelectedQuota}\n                defaultExpanded={viewMode === 'past'}\n              />\n            ))}\n\n            {/* Load More Button */}\n            {hasMorePastSubscriptions && (\n              <div className=\"flex justify-center pt-2\">\n                <button\n                  onClick={loadMorePastSubscriptions}\n                  disabled={isLoadingMorePast}\n                  className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-muted-foreground hover:text-foreground border border-border rounded-md hover:bg-muted/50 transition-colors disabled:opacity-50\"\n                >\n                  {isLoadingMorePast ? (\n                    <>\n                      <RefreshCw className=\"w-4 h-4 animate-spin\" />\n                      Loading...\n                    </>\n                  ) : (\n                    <>\n                      <ChevronDown className=\"w-4 h-4\" />\n                      Load more past subscriptions\n                    </>\n                  )}\n                </button>\n              </div>\n            )}\n          </div>\n        </section>\n      )}\n\n      {/* Pooled Quotas Section - Only show for active/all views (pooled quotas are account-level) */}\n      {viewMode !== 'past' && filteredPooledQuotas.length > 0 && (\n        <section>\n          <h2 className=\"text-lg font-semibold text-foreground mb-4 flex items-center gap-2\">\n            <Layers className={`w-5 h-5 ${statusTokens.info.icon}`} />\n            Pooled Quotas\n            <span className=\"text-xs font-normal text-muted-foreground\">\n              (Shared across all products)\n            </span>\n          </h2>\n          <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            {filteredPooledQuotas.map((quota) => (\n              <QuotaCard key={quota.name} quota={quota} onClick={() => setSelectedQuota(quota)} />\n            ))}\n          </div>\n        </section>\n      )}\n\n      {/* Empty State - No quotas at all (when viewing active) */}\n      {viewMode === 'active' &&\n        activeSubscriptions.length === 0 &&\n        pooledQuotas.length === 0 &&\n        !hasActiveFilters && (\n          <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n            <div className=\"w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n              <Layers className=\"w-6 h-6 text-muted-foreground\" />\n            </div>\n            <h3 className=\"text-lg font-medium text-foreground\">No active quotas found</h3>\n            <p className=\"text-sm text-muted-foreground mt-1 text-center max-w-sm\">\n              Quotas will appear here once you have active subscriptions or pooled allocations.\n            </p>\n          </div>\n        )}\n\n      {/* Empty State - No past subscriptions */}\n      {viewMode === 'past' &&\n        pastSubscriptions.length === 0 &&\n        !hasActiveFilters &&\n        !isPastSubscriptionsLoading && (\n          <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n            <div className=\"w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n              <Clock className=\"w-6 h-6 text-muted-foreground\" />\n            </div>\n            <h3 className=\"text-lg font-medium text-foreground\">No past subscriptions</h3>\n            <p className=\"text-sm text-muted-foreground mt-1 text-center max-w-sm\">\n              You don&apos;t have any canceled, expired, or upgraded subscriptions yet.\n            </p>\n            <button\n              onClick={() => setViewMode('active')}\n              className=\"mt-4 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n            >\n              View active subscriptions\n            </button>\n          </div>\n        )}\n\n      {/* Loading State for Past Subscriptions */}\n      {viewMode === 'past' && isPastSubscriptionsLoading && (\n        <div className=\"space-y-4\">\n          {[1, 2, 3].map((i) => (\n            <div key={i} className=\"h-24 bg-muted animate-pulse rounded-lg\" />\n          ))}\n        </div>\n      )}\n\n      {/* Empty State - No results from search/filter */}\n      {hasActiveFilters &&\n        displayedSubscriptions.active.length === 0 &&\n        displayedSubscriptions.past.length === 0 &&\n        (viewMode === 'past' || filteredPooledQuotas.length === 0) && (\n          <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n            <div className=\"w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n              {statusFilter !== 'all' && !searchQuery ? (\n                <StatusIcon\n                  status={\n                    (statusFilter === 'healthy'\n                      ? 'HEALTHY'\n                      : statusFilter === 'warning'\n                        ? 'WARNING'\n                        : 'CRITICAL') as QuotaStatus\n                  }\n                  className=\"w-6 h-6\"\n                />\n              ) : (\n                <Search className=\"w-6 h-6 text-muted-foreground\" />\n              )}\n            </div>\n            <h3 className=\"text-lg font-medium text-foreground\">\n              {statusFilter !== 'all' && !searchQuery\n                ? `No ${statusFilter === 'critical' ? 'critical or exhausted' : statusFilter} quotas`\n                : 'No matching quotas'}\n            </h3>\n            <p className=\"text-sm text-muted-foreground mt-1 text-center max-w-sm\">\n              {statusFilter !== 'all' && !searchQuery ? (\n                <>\n                  All your quotas are in a different status.\n                  {dashboard && (\n                    <span className=\"block mt-1\">\n                      You have {dashboard.healthyQuotas} healthy, {dashboard.warningQuotas} warning,\n                      and {dashboard.criticalQuotas + dashboard.exhaustedQuotas} critical quotas.\n                    </span>\n                  )}\n                </>\n              ) : (\n                <>\n                  No quotas match your current search or filter criteria in{' '}\n                  {viewMode === 'past' ? 'past' : viewMode === 'all' ? 'any' : 'active'}{' '}\n                  subscriptions.\n                  {viewMode === 'active' && !statusFilter.includes('all') && (\n                    <span className=\"block mt-1\">\n                      Try switching to &ldquo;Past&rdquo; or &ldquo;All&rdquo; to search across more\n                      subscriptions.\n                    </span>\n                  )}\n                </>\n              )}\n            </p>\n            <div className=\"flex gap-2 mt-4\">\n              <button\n                onClick={clearFilters}\n                className=\"px-4 py-2 text-sm font-medium border border-border rounded-md hover:bg-muted/50 transition-colors\"\n              >\n                {statusFilter !== 'all' ? 'Show all quotas' : 'Clear filters'}\n              </button>\n              {viewMode === 'active' && searchQuery && (\n                <button\n                  onClick={() => setViewMode('all')}\n                  className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n                >\n                  Search all\n                </button>\n              )}\n            </div>\n          </div>\n        )}\n\n      {/* Quota Detail Modal */}\n      {selectedQuota && (\n        <QuotaDetailModal quota={selectedQuota} onClose={() => setSelectedQuota(null)} />\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/billing/modules/usage/pages/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Usage Module - Pages
+ */
+export { UsagePage } from './UsagePage';
+//# sourceMappingURL=index.d.ts.map

package/dist/billing/modules/usage/pages/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/billing/modules/usage/pages/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/dist/billing/modules/usage/pages/index.js

@@ -0,0 +1 @@
+import "./UsagePage.js";

package/dist/billing/providers/BillingProvider.d.ts

@@ -0,0 +1,16 @@
+import { FC, PropsWithChildren } from 'react';
+import { BillingRootProps } from '../types';
+
+/**
+ * Hook to access Billing context
+ */
+export declare const useBilling: () => BillingRootProps;
+/**
+ * Provider component for Billing microfrontend
+ * Sets up routing and context
+ *
+ * When integrated into a shell (basePath provided), the shell already has a router
+ * so we don't create another one. When standalone (no basePath), use MemoryRouter.
+ */
+export declare const BillingProvider: FC<PropsWithChildren<BillingRootProps>>;
+//# sourceMappingURL=BillingProvider.d.ts.map

package/dist/billing/providers/BillingProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BillingProvider.d.ts","sourceRoot":"","sources":["../../../src/billing/providers/BillingProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAInD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AASjD;;GAEG;AACH,eAAO,MAAM,UAAU,wBAMtB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAoDnE,CAAC"}

package/dist/billing/providers/BillingProvider.js

@@ -0,0 +1,40 @@
+import { createContext as e, useContext as t } from "react";
+import { MemoryRouter as n } from "react-router-dom";
+import { PermissionProvider as r } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/billing/providers/BillingProvider.tsx
+var a = e(null), o = () => {
+	let e = t(a);
+	if (!e) throw Error("useBilling must be used within BillingProvider");
+	return e;
+}, s = ({ children: e, basePath: t, navigate: o, currentUser: s, workspaceId: c, orgId: l, productId: u, apiGatewayUrl: d, authToken: f, stripePublishableKey: p, razorpayKey: m, onSubscriptionCreate: h, onSubscriptionUpdate: g, onPaymentProcess: _, registerNavItems: v, registerFooterItems: y }) => {
+	let b = {
+		basePath: t,
+		navigate: o,
+		currentUser: s,
+		workspaceId: c,
+		orgId: l,
+		productId: u,
+		apiGatewayUrl: d,
+		authToken: f,
+		stripePublishableKey: p,
+		razorpayKey: m,
+		onSubscriptionCreate: h,
+		onSubscriptionUpdate: g,
+		onPaymentProcess: _,
+		registerNavItems: v,
+		registerFooterItems: y
+	}, x = /* @__PURE__ */ i(a.Provider, {
+		value: b,
+		children: /* @__PURE__ */ i(r, {
+			scopeId: l,
+			gateway: "global",
+			children: e
+		})
+	});
+	return t ? x : /* @__PURE__ */ i(n, { children: x });
+};
+//#endregion
+export { s as BillingProvider, o as useBilling };
+
+//# sourceMappingURL=BillingProvider.js.map

package/dist/billing/providers/BillingProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BillingProvider.js","names":[],"sources":["../../../src/billing/providers/BillingProvider.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from 'react';\nimport { createContext, useContext } from 'react';\nimport { MemoryRouter } from 'react-router-dom';\nimport { PermissionProvider } from '@burdenoff/fe-libs/shared/providers/shell';\nimport type { BillingRootProps } from '../types';\n\n/**\n * Context value for Billing microfrontend\n */\ntype BillingContextValue = BillingRootProps;\n\nconst BillingContext = createContext<BillingContextValue | null>(null);\n\n/**\n * Hook to access Billing context\n */\nexport const useBilling = () => {\n  const context = useContext(BillingContext);\n  if (!context) {\n    throw new Error('useBilling must be used within BillingProvider');\n  }\n  return context;\n};\n\n/**\n * Provider component for Billing microfrontend\n * Sets up routing and context\n *\n * When integrated into a shell (basePath provided), the shell already has a router\n * so we don't create another one. When standalone (no basePath), use MemoryRouter.\n */\nexport const BillingProvider: FC<PropsWithChildren<BillingRootProps>> = ({\n  children,\n  basePath,\n  navigate,\n  currentUser,\n  workspaceId,\n  orgId,\n  productId,\n  apiGatewayUrl,\n  authToken,\n  stripePublishableKey,\n  razorpayKey,\n  onSubscriptionCreate,\n  onSubscriptionUpdate,\n  onPaymentProcess,\n  registerNavItems,\n  registerFooterItems,\n}) => {\n  const contextValue: BillingContextValue = {\n    basePath,\n    navigate,\n    currentUser,\n    workspaceId,\n    orgId,\n    productId,\n    apiGatewayUrl,\n    authToken,\n    stripePublishableKey,\n    razorpayKey,\n    onSubscriptionCreate,\n    onSubscriptionUpdate,\n    onPaymentProcess,\n    registerNavItems,\n    registerFooterItems,\n  };\n\n  const content = (\n    <BillingContext.Provider value={contextValue}>\n      <PermissionProvider scopeId={orgId} gateway=\"global\">\n        {children}\n      </PermissionProvider>\n    </BillingContext.Provider>\n  );\n\n  // When integrated into a shell (basePath provided), the shell already has a router\n  // so we don't create another one. When standalone (no basePath), use MemoryRouter.\n  if (basePath) {\n    return content;\n  }\n\n  // Standalone mode: create MemoryRouter for independent operation\n  return <MemoryRouter>{content}</MemoryRouter>;\n};\n"],"mappings":";;;;;AAWA,IAAM,IAAiB,EAA0C,KAAK,EAKzD,UAAmB;CAC9B,IAAM,IAAU,EAAW,EAAe;AAC1C,KAAI,CAAC,EACH,OAAU,MAAM,iDAAiD;AAEnE,QAAO;GAUI,KAA4D,EACvE,aACA,aACA,aACA,gBACA,gBACA,UACA,cACA,kBACA,cACA,yBACA,gBACA,yBACA,yBACA,qBACA,qBACA,6BACI;CACJ,IAAM,IAAoC;EACxC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,EAEK,IACJ,kBAAC,EAAe,UAAhB;EAAyB,OAAO;YAC9B,kBAAC,GAAD;GAAoB,SAAS;GAAO,SAAQ;GACzC;GACkB,CAAA;EACG,CAAA;AAU5B,QALI,IACK,IAIF,kBAAC,GAAD,EAAA,UAAe,GAAuB,CAAA"}

package/dist/billing/shared/components/AccessDenied.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+
+interface AccessDeniedProps {
+    message?: string;
+}
+export declare const AccessDenied: FC<AccessDeniedProps>;
+export {};
+//# sourceMappingURL=AccessDenied.d.ts.map

package/dist/billing/shared/components/AccessDenied.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessDenied.d.ts","sourceRoot":"","sources":["../../../../src/billing/shared/components/AccessDenied.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,UAAU,iBAAiB;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAoC9C,CAAC"}

package/dist/billing/shared/components/AccessDenied.js

@@ -0,0 +1,44 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { useI18n as n } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+//#region src/billing/shared/components/AccessDenied.tsx
+var r = ({ message: r }) => {
+	let { t: i } = n(), a = (e, t) => {
+		let n = i(e);
+		return n === e ? t : n;
+	}, o = r ?? a("billing.accessDenied.defaultMessage", "You don't have permission to access this page.");
+	return /* @__PURE__ */ e("div", {
+		className: "flex items-center justify-center h-full min-h-[400px]",
+		children: /* @__PURE__ */ t("div", {
+			className: "text-center space-y-2",
+			children: [
+				/* @__PURE__ */ e("div", {
+					className: "w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center",
+					children: /* @__PURE__ */ e("svg", {
+						className: "w-6 h-6 text-muted-foreground",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ e("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+						})
+					})
+				}),
+				/* @__PURE__ */ e("h2", {
+					className: "text-lg font-semibold text-foreground",
+					children: a("billing.accessDenied.title", "Access Denied")
+				}),
+				/* @__PURE__ */ e("p", {
+					className: "text-sm text-muted-foreground max-w-sm",
+					children: o
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { r as AccessDenied };
+
+//# sourceMappingURL=AccessDenied.js.map

package/dist/billing/shared/components/AccessDenied.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessDenied.js","names":[],"sources":["../../../../src/billing/shared/components/AccessDenied.tsx"],"sourcesContent":["/**\n * Shared Access Denied Component\n * Displays when user lacks permission to view a page\n */\n\nimport type { FC } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\ninterface AccessDeniedProps {\n  message?: string;\n}\n\nexport const AccessDenied: FC<AccessDeniedProps> = ({ message }) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n\n  const displayMessage =\n    message ??\n    tr('billing.accessDenied.defaultMessage', \"You don't have permission to access this page.\");\n\n  return (\n    <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n      <div className=\"text-center space-y-2\">\n        <div className=\"w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n          <svg\n            className=\"w-6 h-6 text-muted-foreground\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n            />\n          </svg>\n        </div>\n        <h2 className=\"text-lg font-semibold text-foreground\">\n          {tr('billing.accessDenied.title', 'Access Denied')}\n        </h2>\n        <p className=\"text-sm text-muted-foreground max-w-sm\">{displayMessage}</p>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;AAYA,IAAa,KAAuC,EAAE,iBAAc;CAClE,IAAM,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAa,EAAE,EAAI;AACzB,SAAO,MAAe,IAAM,IAAW;IAGnC,IACJ,KACA,EAAG,uCAAuC,iDAAiD;AAE7F,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MACE,WAAU;MACV,MAAK;MACL,SAAQ;MACR,QAAO;gBAEP,kBAAC,QAAD;OACE,eAAc;OACd,gBAAe;OACf,aAAa;OACb,GAAE;OACF,CAAA;MACE,CAAA;KACF,CAAA;IACN,kBAAC,MAAD;KAAI,WAAU;eACX,EAAG,8BAA8B,gBAAgB;KAC/C,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAA0C;KAAmB,CAAA;IACtE;;EACF,CAAA"}

package/dist/billing/shared/components/CurrencyPriceOverridesEditor.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { CurrencyPriceOverrideInput } from '../types';
+
+interface CurrencyPriceOverridesEditorProps {
+    overrides: CurrencyPriceOverrideInput[];
+    onChange: (overrides: CurrencyPriceOverrideInput[]) => void;
+    showPerSeatAmount?: boolean;
+}
+export declare const CurrencyPriceOverridesEditor: FC<CurrencyPriceOverridesEditorProps>;
+export {};
+//# sourceMappingURL=CurrencyPriceOverridesEditor.d.ts.map

package/dist/billing/shared/components/CurrencyPriceOverridesEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyPriceOverridesEditor.d.ts","sourceRoot":"","sources":["../../../../src/billing/shared/components/CurrencyPriceOverridesEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAE3D,UAAU,iCAAiC;IACzC,SAAS,EAAE,0BAA0B,EAAE,CAAC;IACxC,QAAQ,EAAE,CAAC,SAAS,EAAE,0BAA0B,EAAE,KAAK,IAAI,CAAC;IAC5D,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAyBD,eAAO,MAAM,4BAA4B,EAAE,EAAE,CAAC,iCAAiC,CAgJ9E,CAAC"}

package/dist/billing/shared/components/CurrencyPriceOverridesEditor.js

@@ -0,0 +1,230 @@
+import { useState as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/billing/shared/components/CurrencyPriceOverridesEditor.tsx
+var r = [
+	{
+		code: "EUR",
+		name: "Euro",
+		symbol: "€"
+	},
+	{
+		code: "GBP",
+		name: "British Pound",
+		symbol: "£"
+	},
+	{
+		code: "INR",
+		name: "Indian Rupee",
+		symbol: "₹"
+	},
+	{
+		code: "AUD",
+		name: "Australian Dollar",
+		symbol: "A$"
+	},
+	{
+		code: "CAD",
+		name: "Canadian Dollar",
+		symbol: "C$"
+	},
+	{
+		code: "SGD",
+		name: "Singapore Dollar",
+		symbol: "S$"
+	},
+	{
+		code: "JPY",
+		name: "Japanese Yen",
+		symbol: "¥"
+	},
+	{
+		code: "MXN",
+		name: "Mexican Peso",
+		symbol: "MX$"
+	},
+	{
+		code: "BRL",
+		name: "Brazilian Real",
+		symbol: "R$"
+	},
+	{
+		code: "CHF",
+		name: "Swiss Franc",
+		symbol: "Fr"
+	},
+	{
+		code: "CNY",
+		name: "Chinese Yuan",
+		symbol: "¥"
+	},
+	{
+		code: "HKD",
+		name: "Hong Kong Dollar",
+		symbol: "HK$"
+	},
+	{
+		code: "NZD",
+		name: "New Zealand Dollar",
+		symbol: "NZ$"
+	},
+	{
+		code: "SEK",
+		name: "Swedish Krona",
+		symbol: "kr"
+	},
+	{
+		code: "KRW",
+		name: "South Korean Won",
+		symbol: "₩"
+	},
+	{
+		code: "NOK",
+		name: "Norwegian Krone",
+		symbol: "kr"
+	},
+	{
+		code: "DKK",
+		name: "Danish Krone",
+		symbol: "kr"
+	},
+	{
+		code: "PLN",
+		name: "Polish Złoty",
+		symbol: "zł"
+	},
+	{
+		code: "THB",
+		name: "Thai Baht",
+		symbol: "฿"
+	},
+	{
+		code: "MYR",
+		name: "Malaysian Ringgit",
+		symbol: "RM"
+	}
+], i = ({ overrides: i, onChange: a, showPerSeatAmount: o = !1 }) => {
+	let [s, c] = e(!1), l = (e) => i.find((t) => t.currency === e), u = (e, t) => {
+		let n = t.trim(), r = i.filter((t) => t.currency !== e);
+		if (n === "") {
+			a(r);
+			return;
+		}
+		let o = parseFloat(n);
+		if (isNaN(o) || o < 0) return;
+		let s = l(e);
+		a([...r, {
+			currency: e,
+			amount: o,
+			...s?.perSeatAmount === void 0 ? {} : { perSeatAmount: s.perSeatAmount }
+		}]);
+	}, d = (e, t) => {
+		let n = t.trim(), r = i.filter((t) => t.currency !== e), o = l(e);
+		if (!o) return;
+		if (n === "") {
+			a([...r, {
+				currency: e,
+				amount: o.amount
+			}]);
+			return;
+		}
+		let s = parseFloat(n);
+		isNaN(s) || s < 0 || a([...r, {
+			...o,
+			perSeatAmount: s
+		}]);
+	}, f = i.length;
+	return /* @__PURE__ */ n("div", {
+		className: "border border-border rounded-lg bg-card overflow-hidden",
+		children: [/* @__PURE__ */ n("button", {
+			type: "button",
+			onClick: () => c((e) => !e),
+			className: "w-full p-4 border-b border-border bg-muted/30 flex items-center justify-between hover:bg-muted/50 transition-colors",
+			children: [/* @__PURE__ */ n("div", {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ t("h2", {
+					className: "font-semibold text-foreground",
+					children: "Currency Price Overrides"
+				}), f > 0 && /* @__PURE__ */ n("span", {
+					className: "px-2 py-0.5 text-xs font-medium bg-primary/10 text-primary rounded-full",
+					children: [f, " set"]
+				})]
+			}), /* @__PURE__ */ n("div", {
+				className: "flex items-center gap-2 text-sm text-muted-foreground",
+				children: [/* @__PURE__ */ n("span", { children: [s ? "Hide" : "Show", " — leave blank to use auto-calculated exchange rates"] }), /* @__PURE__ */ t("svg", {
+					className: `w-4 h-4 transition-transform ${s ? "rotate-180" : ""}`,
+					fill: "none",
+					viewBox: "0 0 24 24",
+					stroke: "currentColor",
+					children: /* @__PURE__ */ t("path", {
+						strokeLinecap: "round",
+						strokeLinejoin: "round",
+						strokeWidth: 2,
+						d: "M19 9l-7 7-7-7"
+					})
+				})]
+			})]
+		}), s && /* @__PURE__ */ n("div", {
+			className: "p-4",
+			children: [
+				/* @__PURE__ */ t("p", {
+					className: "text-xs text-muted-foreground mb-4",
+					children: "Set a specific price for any currency. Leave a field empty to auto-calculate from the USD base price using live exchange rates."
+				}),
+				/* @__PURE__ */ t("div", {
+					className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3",
+					children: r.map(({ code: e, name: r, symbol: i }) => {
+						let a = l(e);
+						return /* @__PURE__ */ n("div", {
+							className: "space-y-1",
+							children: [/* @__PURE__ */ n("label", {
+								className: "flex items-center gap-1 text-xs font-medium text-foreground",
+								children: [
+									/* @__PURE__ */ t("span", {
+										className: "text-muted-foreground",
+										children: i
+									}),
+									/* @__PURE__ */ t("span", { children: e }),
+									/* @__PURE__ */ n("span", {
+										className: "text-muted-foreground font-normal truncate",
+										children: ["— ", r]
+									})
+								]
+							}), /* @__PURE__ */ n("div", {
+								className: o ? "flex gap-1" : "",
+								children: [/* @__PURE__ */ t("input", {
+									type: "number",
+									step: "0.01",
+									min: "0",
+									value: a?.amount ?? "",
+									onChange: (t) => u(e, t.target.value),
+									placeholder: "auto",
+									className: `px-2 py-1.5 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary placeholder:text-muted-foreground ${o ? "flex-1 min-w-0" : "w-full"} ${a?.amount === void 0 ? "" : "border-primary/50"}`
+								}), o && /* @__PURE__ */ t("input", {
+									type: "number",
+									step: "0.01",
+									min: "0",
+									value: a?.perSeatAmount ?? "",
+									onChange: (t) => d(e, t.target.value),
+									placeholder: "/seat",
+									disabled: !a,
+									title: "Per-seat amount (requires flat amount to be set first)",
+									className: "flex-1 min-w-0 px-2 py-1.5 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary placeholder:text-muted-foreground disabled:opacity-40"
+								})]
+							})]
+						}, e);
+					})
+				}),
+				f > 0 && /* @__PURE__ */ t("button", {
+					type: "button",
+					onClick: () => a([]),
+					className: "mt-4 text-xs text-status-error-text hover:underline",
+					children: "Clear all overrides"
+				})
+			]
+		})]
+	});
+};
+//#endregion
+export { i as CurrencyPriceOverridesEditor };
+
+//# sourceMappingURL=CurrencyPriceOverridesEditor.js.map

package/dist/billing/shared/components/CurrencyPriceOverridesEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyPriceOverridesEditor.js","names":[],"sources":["../../../../src/billing/shared/components/CurrencyPriceOverridesEditor.tsx"],"sourcesContent":["import { useState, type FC } from 'react';\n\nimport type { CurrencyPriceOverrideInput } from '../types';\n\ninterface CurrencyPriceOverridesEditorProps {\n  overrides: CurrencyPriceOverrideInput[];\n  onChange: (overrides: CurrencyPriceOverrideInput[]) => void;\n  showPerSeatAmount?: boolean;\n}\n\nconst PRICING_CURRENCIES: { code: string; name: string; symbol: string }[] = [\n  { code: 'EUR', name: 'Euro', symbol: '€' },\n  { code: 'GBP', name: 'British Pound', symbol: '£' },\n  { code: 'INR', name: 'Indian Rupee', symbol: '₹' },\n  { code: 'AUD', name: 'Australian Dollar', symbol: 'A$' },\n  { code: 'CAD', name: 'Canadian Dollar', symbol: 'C$' },\n  { code: 'SGD', name: 'Singapore Dollar', symbol: 'S$' },\n  { code: 'JPY', name: 'Japanese Yen', symbol: '¥' },\n  { code: 'MXN', name: 'Mexican Peso', symbol: 'MX$' },\n  { code: 'BRL', name: 'Brazilian Real', symbol: 'R$' },\n  { code: 'CHF', name: 'Swiss Franc', symbol: 'Fr' },\n  { code: 'CNY', name: 'Chinese Yuan', symbol: '¥' },\n  { code: 'HKD', name: 'Hong Kong Dollar', symbol: 'HK$' },\n  { code: 'NZD', name: 'New Zealand Dollar', symbol: 'NZ$' },\n  { code: 'SEK', name: 'Swedish Krona', symbol: 'kr' },\n  { code: 'KRW', name: 'South Korean Won', symbol: '₩' },\n  { code: 'NOK', name: 'Norwegian Krone', symbol: 'kr' },\n  { code: 'DKK', name: 'Danish Krone', symbol: 'kr' },\n  { code: 'PLN', name: 'Polish Złoty', symbol: 'zł' },\n  { code: 'THB', name: 'Thai Baht', symbol: '฿' },\n  { code: 'MYR', name: 'Malaysian Ringgit', symbol: 'RM' },\n];\n\nexport const CurrencyPriceOverridesEditor: FC<CurrencyPriceOverridesEditorProps> = ({\n  overrides,\n  onChange,\n  showPerSeatAmount = false,\n}) => {\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  const getOverride = (currency: string): CurrencyPriceOverrideInput | undefined =>\n    overrides.find((o) => o.currency === currency);\n\n  const handleAmountChange = (currency: string, value: string) => {\n    const trimmed = value.trim();\n    const existing = overrides.filter((o) => o.currency !== currency);\n\n    if (trimmed === '') {\n      onChange(existing);\n      return;\n    }\n\n    const amount = parseFloat(trimmed);\n    if (isNaN(amount) || amount < 0) return;\n\n    const currentOverride = getOverride(currency);\n    onChange([\n      ...existing,\n      {\n        currency,\n        amount,\n        ...(currentOverride?.perSeatAmount !== undefined\n          ? { perSeatAmount: currentOverride.perSeatAmount }\n          : {}),\n      },\n    ]);\n  };\n\n  const handlePerSeatChange = (currency: string, value: string) => {\n    const trimmed = value.trim();\n    const existing = overrides.filter((o) => o.currency !== currency);\n    const currentOverride = getOverride(currency);\n\n    if (!currentOverride) return;\n\n    if (trimmed === '') {\n      onChange([...existing, { currency, amount: currentOverride.amount }]);\n      return;\n    }\n\n    const perSeatAmount = parseFloat(trimmed);\n    if (isNaN(perSeatAmount) || perSeatAmount < 0) return;\n\n    onChange([...existing, { ...currentOverride, perSeatAmount }]);\n  };\n\n  const overrideCount = overrides.length;\n\n  return (\n    <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n      <button\n        type=\"button\"\n        onClick={() => setIsExpanded((v) => !v)}\n        className=\"w-full p-4 border-b border-border bg-muted/30 flex items-center justify-between hover:bg-muted/50 transition-colors\"\n      >\n        <div className=\"flex items-center gap-2\">\n          <h2 className=\"font-semibold text-foreground\">Currency Price Overrides</h2>\n          {overrideCount > 0 && (\n            <span className=\"px-2 py-0.5 text-xs font-medium bg-primary/10 text-primary rounded-full\">\n              {overrideCount} set\n            </span>\n          )}\n        </div>\n        <div className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n          <span>\n            {isExpanded ? 'Hide' : 'Show'} — leave blank to use auto-calculated exchange rates\n          </span>\n          <svg\n            className={`w-4 h-4 transition-transform ${isExpanded ? 'rotate-180' : ''}`}\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 9l-7 7-7-7\" />\n          </svg>\n        </div>\n      </button>\n\n      {isExpanded && (\n        <div className=\"p-4\">\n          <p className=\"text-xs text-muted-foreground mb-4\">\n            Set a specific price for any currency. Leave a field empty to auto-calculate from the\n            USD base price using live exchange rates.\n          </p>\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3\">\n            {PRICING_CURRENCIES.map(({ code, name, symbol }) => {\n              const override = getOverride(code);\n              return (\n                <div key={code} className=\"space-y-1\">\n                  <label className=\"flex items-center gap-1 text-xs font-medium text-foreground\">\n                    <span className=\"text-muted-foreground\">{symbol}</span>\n                    <span>{code}</span>\n                    <span className=\"text-muted-foreground font-normal truncate\">— {name}</span>\n                  </label>\n                  <div className={showPerSeatAmount ? 'flex gap-1' : ''}>\n                    <input\n                      type=\"number\"\n                      step=\"0.01\"\n                      min=\"0\"\n                      value={override?.amount ?? ''}\n                      onChange={(e) => handleAmountChange(code, e.target.value)}\n                      placeholder=\"auto\"\n                      className={`px-2 py-1.5 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary placeholder:text-muted-foreground ${\n                        showPerSeatAmount ? 'flex-1 min-w-0' : 'w-full'\n                      } ${override?.amount !== undefined ? 'border-primary/50' : ''}`}\n                    />\n                    {showPerSeatAmount && (\n                      <input\n                        type=\"number\"\n                        step=\"0.01\"\n                        min=\"0\"\n                        value={override?.perSeatAmount ?? ''}\n                        onChange={(e) => handlePerSeatChange(code, e.target.value)}\n                        placeholder=\"/seat\"\n                        disabled={!override}\n                        title=\"Per-seat amount (requires flat amount to be set first)\"\n                        className=\"flex-1 min-w-0 px-2 py-1.5 text-sm border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary placeholder:text-muted-foreground disabled:opacity-40\"\n                      />\n                    )}\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n          {overrideCount > 0 && (\n            <button\n              type=\"button\"\n              onClick={() => onChange([])}\n              className=\"mt-4 text-xs text-status-error-text hover:underline\"\n            >\n              Clear all overrides\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/billing/shared/components/EmptyState.d.ts

@@ -0,0 +1,11 @@
+import { FC, ReactNode } from 'react';
+
+interface EmptyStateProps {
+    icon?: ReactNode;
+    title: string;
+    description?: string;
+    action?: ReactNode;
+}
+export declare const EmptyState: FC<EmptyStateProps>;
+export {};
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/billing/shared/components/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../../src/billing/shared/components/EmptyState.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3C,UAAU,eAAe;IACvB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAe1C,CAAC"}

package/dist/billing/shared/components/EmptyState.js

@@ -0,0 +1,27 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region src/billing/shared/components/EmptyState.tsx
+var n = ({ icon: n, title: r, description: i, action: a }) => /* @__PURE__ */ t("div", {
+	className: "flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg",
+	children: [
+		n && /* @__PURE__ */ e("div", {
+			className: "w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4",
+			children: n
+		}),
+		/* @__PURE__ */ e("h3", {
+			className: "text-lg font-medium text-foreground",
+			children: r
+		}),
+		i && /* @__PURE__ */ e("p", {
+			className: "text-sm text-muted-foreground mt-1 text-center max-w-sm",
+			children: i
+		}),
+		a && /* @__PURE__ */ e("div", {
+			className: "mt-4",
+			children: a
+		})
+	]
+});
+//#endregion
+export { n as EmptyState };
+
+//# sourceMappingURL=EmptyState.js.map