@burdenoff/microfe-billing 2026.821.1 → 2026.825.2

package/dist/billing/shared/utils/status.js.map

@@ -1 +1 @@
-{"version":3,"file":"status.js","names":[],"sources":["../../../../src/billing/shared/utils/status.ts"],"sourcesContent":["/**\n * Status utilities for the billing module\n * Provides status colors, icons, and helper functions\n *\n * Uses semantic design tokens from tokens.ts for consistent theming\n */\n\nimport {\n  SubscriptionStatus,\n  InvoiceStatus,\n  PaymentStatus,\n  ChargeStatus,\n  RefundStatus,\n  QuotaStatus,\n  TransactionStatus,\n  CreditTransactionStatus,\n} from '../types';\nimport { type SemanticStatus, getStatusBadgeTokens, getProgressTokens } from './tokens';\n\n// ============================================================================\n// Status Color Types\n// ============================================================================\n\nexport type StatusColor = SemanticStatus;\n\n// ============================================================================\n// Status Color Mappings\n// ============================================================================\n\nexport function getSubscriptionStatusColor(status: SubscriptionStatus): StatusColor {\n  const colors: Record<SubscriptionStatus, StatusColor> = {\n    [SubscriptionStatus.ACTIVE]: 'success',\n    [SubscriptionStatus.CANCELED]: 'error',\n    [SubscriptionStatus.EXPIRED]: 'neutral',\n    [SubscriptionStatus.UPGRADED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getInvoiceStatusColor(status: InvoiceStatus): StatusColor {\n  const colors: Record<InvoiceStatus, StatusColor> = {\n    [InvoiceStatus.DRAFT]: 'neutral',\n    [InvoiceStatus.OPEN]: 'info',\n    [InvoiceStatus.PAID]: 'success',\n    [InvoiceStatus.VOID]: 'neutral',\n    [InvoiceStatus.UNCOLLECTIBLE]: 'error',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getPaymentStatusColor(status: PaymentStatus): StatusColor {\n  const colors: Record<PaymentStatus, StatusColor> = {\n    [PaymentStatus.PENDING]: 'warning',\n    [PaymentStatus.SUCCEEDED]: 'success',\n    [PaymentStatus.FAILED]: 'error',\n    [PaymentStatus.CANCELED]: 'neutral',\n    [PaymentStatus.REFUNDED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getChargeStatusColor(status: ChargeStatus): StatusColor {\n  const colors: Record<ChargeStatus, StatusColor> = {\n    [ChargeStatus.PENDING]: 'warning',\n    [ChargeStatus.SUCCEEDED]: 'success',\n    [ChargeStatus.FAILED]: 'error',\n    [ChargeStatus.REFUNDED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getRefundStatusColor(status: RefundStatus): StatusColor {\n  const colors: Record<RefundStatus, StatusColor> = {\n    [RefundStatus.PENDING]: 'warning',\n    [RefundStatus.SUCCEEDED]: 'success',\n    [RefundStatus.FAILED]: 'error',\n    [RefundStatus.CANCELED]: 'neutral',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getQuotaStatusColor(status: QuotaStatus): StatusColor {\n  const colors: Record<QuotaStatus, StatusColor> = {\n    [QuotaStatus.HEALTHY]: 'success',\n    [QuotaStatus.WARNING]: 'warning',\n    [QuotaStatus.CRITICAL]: 'error',\n    [QuotaStatus.EXHAUSTED]: 'error',\n    [QuotaStatus.INACTIVE]: 'neutral',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getTransactionStatusColor(status: TransactionStatus): StatusColor {\n  const colors: Record<TransactionStatus, StatusColor> = {\n    [TransactionStatus.PENDING]: 'warning',\n    [TransactionStatus.SUCCESS]: 'success',\n    [TransactionStatus.FAILED]: 'error',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getCreditTransactionStatusColor(status: CreditTransactionStatus): StatusColor {\n  const colors: Record<CreditTransactionStatus, StatusColor> = {\n    [CreditTransactionStatus.PENDING]: 'warning',\n    [CreditTransactionStatus.SUCCESS]: 'success',\n    [CreditTransactionStatus.FAILED]: 'error',\n    [CreditTransactionStatus.REFUND]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\n// ============================================================================\n// CSS Class Mappings (using semantic tokens)\n// ============================================================================\n\n/**\n * Get combined badge classes for a status.\n */\nexport function getStatusBadgeClasses(color: StatusColor): string {\n  return getStatusBadgeTokens(color);\n}\n\n// ============================================================================\n// Quota Status Helpers\n// ============================================================================\n\nexport function getQuotaStatusFromPercentage(percentage: number): QuotaStatus {\n  if (percentage >= 100) return QuotaStatus.EXHAUSTED;\n  if (percentage >= 90) return QuotaStatus.CRITICAL;\n  if (percentage >= 75) return QuotaStatus.WARNING;\n  return QuotaStatus.HEALTHY;\n}\n\nexport function getQuotaProgressColor(percentage: number): string {\n  const tokens = getProgressTokens(percentage);\n  return tokens.bar;\n}\n\nexport function getQuotaProgressBgColor(percentage: number): string {\n  const tokens = getProgressTokens(percentage);\n  return tokens.track;\n}\n\n// ============================================================================\n// Status Checks\n// ============================================================================\n\nexport function isActiveSubscription(status: SubscriptionStatus): boolean {\n  return status === SubscriptionStatus.ACTIVE;\n}\n\nexport function isPaidInvoice(status: InvoiceStatus): boolean {\n  return status === InvoiceStatus.PAID;\n}\n\nexport function isOpenInvoice(status: InvoiceStatus): boolean {\n  return status === InvoiceStatus.OPEN;\n}\n\nexport function isSuccessfulPayment(status: PaymentStatus): boolean {\n  return status === PaymentStatus.SUCCEEDED;\n}\n\nexport function isPendingPayment(status: PaymentStatus): boolean {\n  return status === PaymentStatus.PENDING;\n}\n\nexport function isHealthyQuota(status: QuotaStatus): boolean {\n  return status === QuotaStatus.HEALTHY;\n}\n\nexport function isQuotaAtRisk(status: QuotaStatus): boolean {\n  return status === QuotaStatus.WARNING || status === QuotaStatus.CRITICAL;\n}\n\nexport function isQuotaExhausted(status: QuotaStatus): boolean {\n  return status === QuotaStatus.EXHAUSTED;\n}\n"],"mappings":";;;AA6BA,SAAgB,EAA2B,GAAyC;AAOlF,QANwD;GACrD,EAAmB,SAAS;GAC5B,EAAmB,WAAW;GAC9B,EAAmB,UAAU;GAC7B,EAAmB,WAAW;EAChC,CACa,MAAW;;AAG3B,SAAgB,EAAsB,GAAoC;AAQxE,QAPmD;GAChD,EAAc,QAAQ;GACtB,EAAc,OAAO;GACrB,EAAc,OAAO;GACrB,EAAc,OAAO;GACrB,EAAc,gBAAgB;EAChC,CACa,MAAW;;AA6C3B,SAAgB,EAA0B,GAAwC;AAMhF,QALuD;GACpD,EAAkB,UAAU;GAC5B,EAAkB,UAAU;GAC5B,EAAkB,SAAS;EAC7B,CACa,MAAW;;AAG3B,SAAgB,EAAgC,GAA8C;AAO5F,QAN6D;GAC1D,EAAwB,UAAU;GAClC,EAAwB,UAAU;GAClC,EAAwB,SAAS;GACjC,EAAwB,SAAS;EACnC,CACa,MAAW;;AAU3B,SAAgB,EAAsB,GAA4B;AAChE,QAAO,EAAqB,EAAM;;AAcpC,SAAgB,EAAsB,GAA4B;AAEhE,QADe,EAAkB,EAAW,CAC9B"}
+{"version":3,"file":"status.js","names":[],"sources":["../../../../src/billing/shared/utils/status.ts"],"sourcesContent":["/**\n * Status utilities for the billing module\n * Provides status colors, icons, and helper functions\n *\n * Uses semantic design tokens from tokens.ts for consistent theming\n */\n\nimport {\n  SubscriptionStatus,\n  InvoiceStatus,\n  PaymentStatus,\n  ChargeStatus,\n  RefundStatus,\n  QuotaStatus,\n  TransactionStatus,\n  CreditTransactionStatus,\n} from '../types';\nimport { type SemanticStatus, getStatusBadgeTokens, getProgressTokens } from './tokens';\n\n// ============================================================================\n// Status Color Types\n// ============================================================================\n\nexport type StatusColor = SemanticStatus;\n\n// ============================================================================\n// Status Color Mappings\n// ============================================================================\n\nexport function getSubscriptionStatusColor(status: SubscriptionStatus): StatusColor {\n  const colors: Record<SubscriptionStatus, StatusColor> = {\n    [SubscriptionStatus.ACTIVE]: 'success',\n    [SubscriptionStatus.CANCELED]: 'error',\n    [SubscriptionStatus.EXPIRED]: 'neutral',\n    [SubscriptionStatus.UPGRADED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getInvoiceStatusColor(status: InvoiceStatus): StatusColor {\n  const colors: Record<InvoiceStatus, StatusColor> = {\n    [InvoiceStatus.DRAFT]: 'neutral',\n    [InvoiceStatus.OPEN]: 'info',\n    [InvoiceStatus.PAID]: 'success',\n    [InvoiceStatus.VOID]: 'neutral',\n    [InvoiceStatus.UNCOLLECTIBLE]: 'error',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getPaymentStatusColor(status: PaymentStatus): StatusColor {\n  const colors: Record<PaymentStatus, StatusColor> = {\n    [PaymentStatus.PENDING]: 'warning',\n    [PaymentStatus.SUCCEEDED]: 'success',\n    [PaymentStatus.FAILED]: 'error',\n    [PaymentStatus.CANCELED]: 'neutral',\n    [PaymentStatus.REFUNDED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getChargeStatusColor(status: ChargeStatus): StatusColor {\n  const colors: Record<ChargeStatus, StatusColor> = {\n    [ChargeStatus.PENDING]: 'warning',\n    [ChargeStatus.SUCCEEDED]: 'success',\n    [ChargeStatus.FAILED]: 'error',\n    [ChargeStatus.REFUNDED]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getRefundStatusColor(status: RefundStatus): StatusColor {\n  const colors: Record<RefundStatus, StatusColor> = {\n    [RefundStatus.PENDING]: 'warning',\n    [RefundStatus.SUCCEEDED]: 'success',\n    [RefundStatus.FAILED]: 'error',\n    [RefundStatus.CANCELED]: 'neutral',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getQuotaStatusColor(status: QuotaStatus): StatusColor {\n  const colors: Record<QuotaStatus, StatusColor> = {\n    [QuotaStatus.HEALTHY]: 'success',\n    [QuotaStatus.WARNING]: 'warning',\n    [QuotaStatus.CRITICAL]: 'error',\n    [QuotaStatus.EXHAUSTED]: 'error',\n    [QuotaStatus.INACTIVE]: 'neutral',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getTransactionStatusColor(status: TransactionStatus): StatusColor {\n  const colors: Record<TransactionStatus, StatusColor> = {\n    [TransactionStatus.PENDING]: 'warning',\n    [TransactionStatus.SUCCESS]: 'success',\n    [TransactionStatus.FAILED]: 'error',\n  };\n  return colors[status] || 'neutral';\n}\n\nexport function getCreditTransactionStatusColor(status: CreditTransactionStatus): StatusColor {\n  const colors: Record<CreditTransactionStatus, StatusColor> = {\n    [CreditTransactionStatus.PENDING]: 'warning',\n    [CreditTransactionStatus.SUCCESS]: 'success',\n    [CreditTransactionStatus.FAILED]: 'error',\n    [CreditTransactionStatus.REFUND]: 'info',\n  };\n  return colors[status] || 'neutral';\n}\n\n// ============================================================================\n// CSS Class Mappings (using semantic tokens)\n// ============================================================================\n\n/**\n * Get combined badge classes for a status.\n */\nexport function getStatusBadgeClasses(color: StatusColor): string {\n  return getStatusBadgeTokens(color);\n}\n\n// ============================================================================\n// Quota Status Helpers\n// ============================================================================\n\nexport function getQuotaStatusFromPercentage(percentage: number): QuotaStatus {\n  if (percentage >= 100) return QuotaStatus.EXHAUSTED;\n  if (percentage >= 90) return QuotaStatus.CRITICAL;\n  if (percentage >= 75) return QuotaStatus.WARNING;\n  return QuotaStatus.HEALTHY;\n}\n\nexport function getQuotaProgressColor(percentage: number): string {\n  const tokens = getProgressTokens(percentage);\n  return tokens.bar;\n}\n\nexport function getQuotaProgressBgColor(percentage: number): string {\n  const tokens = getProgressTokens(percentage);\n  return tokens.track;\n}\n\n// ============================================================================\n// Status Checks\n// ============================================================================\n\nexport function isActiveSubscription(status: SubscriptionStatus): boolean {\n  return status === SubscriptionStatus.ACTIVE;\n}\n\nexport function isPaidInvoice(status: InvoiceStatus): boolean {\n  return status === InvoiceStatus.PAID;\n}\n\nexport function isOpenInvoice(status: InvoiceStatus): boolean {\n  return status === InvoiceStatus.OPEN;\n}\n\nexport function isSuccessfulPayment(status: PaymentStatus): boolean {\n  return status === PaymentStatus.SUCCEEDED;\n}\n\nexport function isPendingPayment(status: PaymentStatus): boolean {\n  return status === PaymentStatus.PENDING;\n}\n\nexport function isHealthyQuota(status: QuotaStatus): boolean {\n  return status === QuotaStatus.HEALTHY;\n}\n\nexport function isQuotaAtRisk(status: QuotaStatus): boolean {\n  return status === QuotaStatus.WARNING || status === QuotaStatus.CRITICAL;\n}\n\nexport function isQuotaExhausted(status: QuotaStatus): boolean {\n  return status === QuotaStatus.EXHAUSTED;\n}\n"],"mappings":";;;AA6BA,SAAgB,EAA2B,GAAyC;CAOlF,OAAO;GALJ,EAAmB,SAAS;GAC5B,EAAmB,WAAW;GAC9B,EAAmB,UAAU;GAC7B,EAAmB,WAAW;CAE1B,EAAO,MAAW;AAC3B;AAEA,SAAgB,EAAsB,GAAoC;CAQxE,OAAO;GANJ,EAAc,QAAQ;GACtB,EAAc,OAAO;GACrB,EAAc,OAAO;GACrB,EAAc,OAAO;GACrB,EAAc,gBAAgB;CAE1B,EAAO,MAAW;AAC3B;AA4CA,SAAgB,EAA0B,GAAwC;CAMhF,OAAO;GAJJ,EAAkB,UAAU;GAC5B,EAAkB,UAAU;GAC5B,EAAkB,SAAS;CAEvB,EAAO,MAAW;AAC3B;AAEA,SAAgB,EAAgC,GAA8C;CAO5F,OAAO;GALJ,EAAwB,UAAU;GAClC,EAAwB,UAAU;GAClC,EAAwB,SAAS;GACjC,EAAwB,SAAS;CAE7B,EAAO,MAAW;AAC3B;AASA,SAAgB,EAAsB,GAA4B;CAChE,OAAO,EAAqB,CAAK;AACnC;AAaA,SAAgB,EAAsB,GAA4B;CAEhE,OADe,EAAkB,CAC1B,EAAO;AAChB"}

package/dist/billing/shared/utils/tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.js","names":[],"sources":["../../../../src/billing/shared/utils/tokens.ts"],"sourcesContent":["/**\n * Semantic Design Tokens for Billing Module\n *\n * Maps semantic status colors to fe-libs design tokens.\n * This ensures consistent theming across all micro-frontends.\n *\n * Token Reference (from fe-libs):\n * - Status: --color-status-{success|warning|error|info}-{bg|bgSubtle|text|border}\n * - Action: --color-action-{primary|secondary|danger}-{bg|bgHover|text}\n * - Text: --color-text-{primary|secondary|muted}\n * - Background: --color-bg-{canvas|surface|elevated|sunken}\n */\n\n// ============================================================================\n// Status Color Token Mappings\n// ============================================================================\n\nexport type SemanticStatus = 'success' | 'warning' | 'error' | 'info' | 'neutral' | 'primary';\n\nexport interface StatusTokenClasses {\n  /** Background for subtle/badge usage */\n  bg: string;\n  /** Text color */\n  text: string;\n  /** Border color */\n  border: string;\n  /** Dot/indicator color */\n  dot: string;\n  /** Icon color */\n  icon: string;\n}\n\n/**\n * Semantic status color classes using design tokens\n * These map to CSS custom properties defined in fe-libs\n */\nexport const statusTokens: Record<SemanticStatus, StatusTokenClasses> = {\n  success: {\n    bg: 'bg-status-success-bg-subtle',\n    text: 'text-status-success-text',\n    border: 'border-status-success-border',\n    dot: 'bg-status-success-bg',\n    icon: 'text-status-success-bg',\n  },\n  warning: {\n    bg: 'bg-status-warning-bg-subtle',\n    text: 'text-status-warning-text',\n    border: 'border-status-warning-border',\n    dot: 'bg-status-warning-bg',\n    icon: 'text-status-warning-bg',\n  },\n  error: {\n    bg: 'bg-status-error-bg-subtle',\n    text: 'text-status-error-text',\n    border: 'border-status-error-border',\n    dot: 'bg-status-error-bg',\n    icon: 'text-status-error-bg',\n  },\n  info: {\n    bg: 'bg-status-info-bg-subtle',\n    text: 'text-status-info-text',\n    border: 'border-status-info-border',\n    dot: 'bg-status-info-bg',\n    icon: 'text-status-info-bg',\n  },\n  neutral: {\n    bg: 'bg-status-neutral-bg-subtle',\n    text: 'text-status-neutral-text',\n    border: 'border-status-neutral-border',\n    dot: 'bg-status-neutral-bg',\n    icon: 'text-status-neutral-text',\n  },\n  primary: {\n    bg: 'bg-[var(--color-accent-soft)]',\n    text: 'text-text-link',\n    border: 'border-border-strong',\n    dot: 'bg-action-primary-bg',\n    icon: 'text-text-link',\n  },\n};\n\n/**\n * Get status token classes for a given status\n */\nexport function getStatusTokens(status: SemanticStatus): StatusTokenClasses {\n  return statusTokens[status] || statusTokens.neutral;\n}\n\n/**\n * Get combined badge classes for a status\n */\nexport function getStatusBadgeTokens(status: SemanticStatus): string {\n  const tokens = getStatusTokens(status);\n  return `${tokens.bg} ${tokens.text} ${tokens.border} border`;\n}\n\n// ============================================================================\n// Trend/Change Indicators\n// ============================================================================\n\nexport const trendTokens = {\n  positive: {\n    text: 'text-status-success-text',\n    icon: 'text-status-success-bg',\n  },\n  negative: {\n    text: 'text-status-error-text',\n    icon: 'text-status-error-bg',\n  },\n  neutral: {\n    text: 'text-status-neutral-text',\n    icon: 'text-status-neutral-text',\n  },\n};\n\n/**\n * Get trend indicator classes\n */\nexport function getTrendTokens(isPositive: boolean | null) {\n  if (isPositive === null) return trendTokens.neutral;\n  return isPositive ? trendTokens.positive : trendTokens.negative;\n}\n\n// ============================================================================\n// Progress Bar Colors\n// ============================================================================\n\nexport const progressTokens = {\n  healthy: {\n    bar: 'bg-status-success-bg',\n    track: 'bg-status-success-bg-subtle',\n  },\n  warning: {\n    bar: 'bg-status-warning-bg',\n    track: 'bg-status-warning-bg-subtle',\n  },\n  critical: {\n    bar: 'bg-status-error-bg',\n    track: 'bg-status-error-bg-subtle',\n  },\n};\n\n/**\n * Get progress bar colors based on percentage\n */\nexport function getProgressTokens(percentage: number) {\n  if (percentage >= 90) return progressTokens.critical;\n  if (percentage >= 75) return progressTokens.warning;\n  return progressTokens.healthy;\n}\n\n// ============================================================================\n// Category/Type Badge Colors\n// ============================================================================\n\nexport const categoryTokens = {\n  plan: {\n    bg: 'bg-status-info-bg-subtle',\n    text: 'text-status-info-text',\n    border: 'border-status-info-border',\n  },\n  addon: {\n    bg: 'bg-[var(--color-accent-soft)]',\n    text: 'text-text-link',\n    border: 'border-border-strong',\n  },\n  credits: {\n    bg: 'bg-status-warning-bg-subtle',\n    text: 'text-status-warning-text',\n    border: 'border-status-warning-border',\n  },\n};\n\n/**\n * Get category badge classes\n */\nexport function getCategoryTokens(category: 'plan' | 'addon' | 'credits') {\n  return categoryTokens[category] || categoryTokens.plan;\n}\n\n// ============================================================================\n// Alert/Banner Colors\n// ============================================================================\n\nexport const alertTokens = {\n  success: {\n    container: 'bg-status-success-bg-subtle border-status-success-border',\n    text: 'text-status-success-text',\n    icon: 'text-status-success-bg',\n  },\n  warning: {\n    container: 'bg-status-warning-bg-subtle border-status-warning-border',\n    text: 'text-status-warning-text',\n    icon: 'text-status-warning-bg',\n  },\n  error: {\n    container: 'bg-status-error-bg-subtle border-status-error-border',\n    text: 'text-status-error-text',\n    icon: 'text-status-error-bg',\n  },\n  info: {\n    container: 'bg-status-info-bg-subtle border-status-info-border',\n    text: 'text-status-info-text',\n    icon: 'text-status-info-bg',\n  },\n};\n\n/**\n * Get alert/banner classes\n */\nexport function getAlertTokens(type: 'success' | 'warning' | 'error' | 'info') {\n  return alertTokens[type];\n}\n"],"mappings":";AAoCA,IAAa,IAA2D;CACtE,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACD,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACD,OAAO;EACL,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACD,MAAM;EACJ,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACD,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACD,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;EACP;CACF;AAKD,SAAgB,EAAgB,GAA4C;AAC1E,QAAO,EAAa,MAAW,EAAa;;AAM9C,SAAgB,EAAqB,GAAgC;CACnE,IAAM,IAAS,EAAgB,EAAO;AACtC,QAAO,GAAG,EAAO,GAAG,GAAG,EAAO,KAAK,GAAG,EAAO,OAAO;;AAkCtD,IAAa,IAAiB;CAC5B,SAAS;EACP,KAAK;EACL,OAAO;EACR;CACD,SAAS;EACP,KAAK;EACL,OAAO;EACR;CACD,UAAU;EACR,KAAK;EACL,OAAO;EACR;CACF;AAKD,SAAgB,EAAkB,GAAoB;AAGpD,QAFI,KAAc,KAAW,EAAe,WACxC,KAAc,KAAW,EAAe,UACrC,EAAe;;AAOxB,IAAa,IAAiB;CAC5B,MAAM;EACJ,IAAI;EACJ,MAAM;EACN,QAAQ;EACT;CACD,OAAO;EACL,IAAI;EACJ,MAAM;EACN,QAAQ;EACT;CACD,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACT;CACF,EAaY,IAAc;CACzB,SAAS;EACP,WAAW;EACX,MAAM;EACN,MAAM;EACP;CACD,SAAS;EACP,WAAW;EACX,MAAM;EACN,MAAM;EACP;CACD,OAAO;EACL,WAAW;EACX,MAAM;EACN,MAAM;EACP;CACD,MAAM;EACJ,WAAW;EACX,MAAM;EACN,MAAM;EACP;CACF"}
+{"version":3,"file":"tokens.js","names":[],"sources":["../../../../src/billing/shared/utils/tokens.ts"],"sourcesContent":["/**\n * Semantic Design Tokens for Billing Module\n *\n * Maps semantic status colors to fe-libs design tokens.\n * This ensures consistent theming across all micro-frontends.\n *\n * Token Reference (from fe-libs):\n * - Status: --color-status-{success|warning|error|info}-{bg|bgSubtle|text|border}\n * - Action: --color-action-{primary|secondary|danger}-{bg|bgHover|text}\n * - Text: --color-text-{primary|secondary|muted}\n * - Background: --color-bg-{canvas|surface|elevated|sunken}\n */\n\n// ============================================================================\n// Status Color Token Mappings\n// ============================================================================\n\nexport type SemanticStatus = 'success' | 'warning' | 'error' | 'info' | 'neutral' | 'primary';\n\nexport interface StatusTokenClasses {\n  /** Background for subtle/badge usage */\n  bg: string;\n  /** Text color */\n  text: string;\n  /** Border color */\n  border: string;\n  /** Dot/indicator color */\n  dot: string;\n  /** Icon color */\n  icon: string;\n}\n\n/**\n * Semantic status color classes using design tokens\n * These map to CSS custom properties defined in fe-libs\n */\nexport const statusTokens: Record<SemanticStatus, StatusTokenClasses> = {\n  success: {\n    bg: 'bg-status-success-bg-subtle',\n    text: 'text-status-success-text',\n    border: 'border-status-success-border',\n    dot: 'bg-status-success-bg',\n    icon: 'text-status-success-bg',\n  },\n  warning: {\n    bg: 'bg-status-warning-bg-subtle',\n    text: 'text-status-warning-text',\n    border: 'border-status-warning-border',\n    dot: 'bg-status-warning-bg',\n    icon: 'text-status-warning-bg',\n  },\n  error: {\n    bg: 'bg-status-error-bg-subtle',\n    text: 'text-status-error-text',\n    border: 'border-status-error-border',\n    dot: 'bg-status-error-bg',\n    icon: 'text-status-error-bg',\n  },\n  info: {\n    bg: 'bg-status-info-bg-subtle',\n    text: 'text-status-info-text',\n    border: 'border-status-info-border',\n    dot: 'bg-status-info-bg',\n    icon: 'text-status-info-bg',\n  },\n  neutral: {\n    bg: 'bg-status-neutral-bg-subtle',\n    text: 'text-status-neutral-text',\n    border: 'border-status-neutral-border',\n    dot: 'bg-status-neutral-bg',\n    icon: 'text-status-neutral-text',\n  },\n  primary: {\n    bg: 'bg-[var(--color-accent-soft)]',\n    text: 'text-text-link',\n    border: 'border-border-strong',\n    dot: 'bg-action-primary-bg',\n    icon: 'text-text-link',\n  },\n};\n\n/**\n * Get status token classes for a given status\n */\nexport function getStatusTokens(status: SemanticStatus): StatusTokenClasses {\n  return statusTokens[status] || statusTokens.neutral;\n}\n\n/**\n * Get combined badge classes for a status\n */\nexport function getStatusBadgeTokens(status: SemanticStatus): string {\n  const tokens = getStatusTokens(status);\n  return `${tokens.bg} ${tokens.text} ${tokens.border} border`;\n}\n\n// ============================================================================\n// Trend/Change Indicators\n// ============================================================================\n\nexport const trendTokens = {\n  positive: {\n    text: 'text-status-success-text',\n    icon: 'text-status-success-bg',\n  },\n  negative: {\n    text: 'text-status-error-text',\n    icon: 'text-status-error-bg',\n  },\n  neutral: {\n    text: 'text-status-neutral-text',\n    icon: 'text-status-neutral-text',\n  },\n};\n\n/**\n * Get trend indicator classes\n */\nexport function getTrendTokens(isPositive: boolean | null) {\n  if (isPositive === null) return trendTokens.neutral;\n  return isPositive ? trendTokens.positive : trendTokens.negative;\n}\n\n// ============================================================================\n// Progress Bar Colors\n// ============================================================================\n\nexport const progressTokens = {\n  healthy: {\n    bar: 'bg-status-success-bg',\n    track: 'bg-status-success-bg-subtle',\n  },\n  warning: {\n    bar: 'bg-status-warning-bg',\n    track: 'bg-status-warning-bg-subtle',\n  },\n  critical: {\n    bar: 'bg-status-error-bg',\n    track: 'bg-status-error-bg-subtle',\n  },\n};\n\n/**\n * Get progress bar colors based on percentage\n */\nexport function getProgressTokens(percentage: number) {\n  if (percentage >= 90) return progressTokens.critical;\n  if (percentage >= 75) return progressTokens.warning;\n  return progressTokens.healthy;\n}\n\n// ============================================================================\n// Category/Type Badge Colors\n// ============================================================================\n\nexport const categoryTokens = {\n  plan: {\n    bg: 'bg-status-info-bg-subtle',\n    text: 'text-status-info-text',\n    border: 'border-status-info-border',\n  },\n  addon: {\n    bg: 'bg-[var(--color-accent-soft)]',\n    text: 'text-text-link',\n    border: 'border-border-strong',\n  },\n  credits: {\n    bg: 'bg-status-warning-bg-subtle',\n    text: 'text-status-warning-text',\n    border: 'border-status-warning-border',\n  },\n};\n\n/**\n * Get category badge classes\n */\nexport function getCategoryTokens(category: 'plan' | 'addon' | 'credits') {\n  return categoryTokens[category] || categoryTokens.plan;\n}\n\n// ============================================================================\n// Alert/Banner Colors\n// ============================================================================\n\nexport const alertTokens = {\n  success: {\n    container: 'bg-status-success-bg-subtle border-status-success-border',\n    text: 'text-status-success-text',\n    icon: 'text-status-success-bg',\n  },\n  warning: {\n    container: 'bg-status-warning-bg-subtle border-status-warning-border',\n    text: 'text-status-warning-text',\n    icon: 'text-status-warning-bg',\n  },\n  error: {\n    container: 'bg-status-error-bg-subtle border-status-error-border',\n    text: 'text-status-error-text',\n    icon: 'text-status-error-bg',\n  },\n  info: {\n    container: 'bg-status-info-bg-subtle border-status-info-border',\n    text: 'text-status-info-text',\n    icon: 'text-status-info-bg',\n  },\n};\n\n/**\n * Get alert/banner classes\n */\nexport function getAlertTokens(type: 'success' | 'warning' | 'error' | 'info') {\n  return alertTokens[type];\n}\n"],"mappings":";AAoCA,IAAa,IAA2D;CACtE,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;CACA,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;CACA,OAAO;EACL,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;CACA,MAAM;EACJ,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;CACA,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;CACA,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACL,MAAM;CACR;AACF;AAKA,SAAgB,EAAgB,GAA4C;CAC1E,OAAO,EAAa,MAAW,EAAa;AAC9C;AAKA,SAAgB,EAAqB,GAAgC;CACnE,IAAM,IAAS,EAAgB,CAAM;CACrC,OAAO,GAAG,EAAO,GAAG,GAAG,EAAO,KAAK,GAAG,EAAO,OAAO;AACtD;AAiCA,IAAa,IAAiB;CAC5B,SAAS;EACP,KAAK;EACL,OAAO;CACT;CACA,SAAS;EACP,KAAK;EACL,OAAO;CACT;CACA,UAAU;EACR,KAAK;EACL,OAAO;CACT;AACF;AAKA,SAAgB,EAAkB,GAAoB;CAGpD,OAFI,KAAc,KAAW,EAAe,WACxC,KAAc,KAAW,EAAe,UACrC,EAAe;AACxB;AAMA,IAAa,IAAiB;CAC5B,MAAM;EACJ,IAAI;EACJ,MAAM;EACN,QAAQ;CACV;CACA,OAAO;EACL,IAAI;EACJ,MAAM;EACN,QAAQ;CACV;CACA,SAAS;EACP,IAAI;EACJ,MAAM;EACN,QAAQ;CACV;AACF,GAaa,IAAc;CACzB,SAAS;EACP,WAAW;EACX,MAAM;EACN,MAAM;CACR;CACA,SAAS;EACP,WAAW;EACX,MAAM;EACN,MAAM;CACR;CACA,OAAO;EACL,WAAW;EACX,MAAM;EACN,MAAM;CACR;CACA,MAAM;EACJ,WAAW;EACX,MAAM;EACN,MAAM;CACR;AACF"}

package/dist/generated/global-operations.js

@@ -1,4 +1,4 @@
-import * as e from "@apollo/client/react";
+import * as e from "@apollo/client";
 import { gql as t } from "@apollo/client";
 //#region src/generated/global-operations.ts
 var n = {}, r = t`
@@ -3660,6 +3660,8 @@ var Br = t`
     id
     status
     createdAt
+    planName
+    productId
     quotas {
       id
       name
@@ -3750,6 +3752,8 @@ var Hr = t`
     id
     status
     createdAt
+    planName
+    productId
     quotas {
       id
       name