@startsimpli/billing 0.4.15 → 0.4.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startsimpli/billing",
-  "version": "0.4.15",
+  "version": "0.4.16",
   "description": "Universal billing integration for StartSimpli Next.js apps",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/__tests__/theme-contract.test.ts

@@ -0,0 +1,40 @@
+/**
+ * Theme-contract guard for @startsimpli/billing (startsim-1f3n.3).
+ *
+ * Shared components may only use the semantic tokens from
+ * packages/ui/theme/contract.css. The numeric Tailwind ramp
+ * (`bg-primary-600`, `focus:ring-primary-500`, …) is not part of it — an app
+ * that declares `--color-primary` without a ramp gets NO rule for those
+ * classes, which renders a plan card border as invisible white-on-white.
+ * Use an opacity modifier on the token instead (`hover:bg-primary/90`).
+ */
+import * as fs from 'fs'
+import * as path from 'path'
+import { describe, it, expect } from 'vitest'
+
+const SRC = path.resolve(__dirname, '..')
+const RAMP = /\b[a-z-]*-(primary|accent|secondary)-\d{2,3}\b/
+
+function sources(dir: string, acc: string[] = []): string[] {
+  for (const e of fs.readdirSync(dir, { withFileTypes: true })) {
+    const full = path.join(dir, e.name)
+    if (e.isDirectory()) {
+      if (e.name !== '__tests__' && e.name !== 'node_modules') sources(full, acc)
+    } else if (/\.tsx?$/.test(e.name)) acc.push(full)
+  }
+  return acc
+}
+
+describe('@startsimpli/billing theme contract', () => {
+  it('no component styles against a numeric color ramp', () => {
+    const offenders: string[] = []
+    for (const file of sources(SRC)) {
+      fs.readFileSync(file, 'utf8').split('\n').forEach((line, i) => {
+        const code = line.replace(/^\s*(\*|\/\/).*$/, '')
+        const hit = code.match(RAMP)
+        if (hit) offenders.push(`${path.relative(SRC, file)}:${i + 1} ${hit[0]}`)
+      })
+    }
+    expect(offenders).toEqual([])
+  })
+})

package/src/components/SubscriptionManager.tsx

@@ -433,7 +433,7 @@ export function SubscriptionManager({
 
               // Border: current = solid ring; featured upgrade = blue; else gray.
               const cardBorder =
-                isCurrent ? "border-2 border-primary-600 ring-2 ring-primary-100 bg-white shadow-md"
+                isCurrent ? "border-2 border-primary ring-2 ring-primary/20 bg-white shadow-md"
                 : offer.isFeatured ? "border border-blue-600 shadow-md bg-white"
                 : "border border-gray-200 bg-white shadow-sm";
 
@@ -457,7 +457,7 @@ export function SubscriptionManager({
                   {isCurrent && (
                     <span
                       data-testid={`current-plan-badge-${offer.slug}`}
-                      className="absolute -top-2.5 right-4 inline-block bg-primary-600 text-white text-xs font-bold uppercase tracking-wide px-2.5 py-0.5 rounded-full"
+                      className="absolute -top-2.5 right-4 inline-block bg-primary text-primary-foreground text-xs font-bold uppercase tracking-wide px-2.5 py-0.5 rounded-full"
                     >
                       Current Plan
                     </span>