@wealthx/shadcn 1.2.2 → 1.3.1

package/src/lib/format-date.ts

@@ -0,0 +1,50 @@
+/**
+ * Date formatting utilities for the WealthX design system.
+ * Uses date-fns for consistent, locale-independent formatting.
+ */
+import { format, parseISO } from "date-fns";
+
+/**
+ * Parse an ISO date string safely, handling both full ISO and date-only strings.
+ * Date-only strings ("2026-01-15") are parsed via parseISO to avoid timezone shifts.
+ */
+function safeParse(iso: string): Date {
+  return parseISO(iso);
+}
+
+/**
+ * Format an ISO date string as "15 Jan 2026".
+ * Returns "—" for falsy input, raw string on parse failure.
+ */
+export function formatDateShort(iso?: string): string {
+  if (!iso) return "—";
+  try {
+    return format(safeParse(iso), "dd MMM yyyy");
+  } catch {
+    return iso;
+  }
+}
+
+/**
+ * Format an ISO date string as "15 Jan" (day + month only).
+ * Returns raw string on parse failure.
+ */
+export function formatDateDayMonth(iso: string): string {
+  try {
+    return format(safeParse(iso), "dd MMM");
+  } catch {
+    return iso;
+  }
+}
+
+/**
+ * Format an ISO date string with weekday: "Wed, 15 Jan 2026".
+ * Returns raw string on parse failure.
+ */
+export function formatDateWithWeekday(iso: string): string {
+  try {
+    return format(safeParse(iso), "EEE, dd MMM yyyy");
+  } catch {
+    return iso;
+  }
+}

package/src/lib/opportunity-constants.ts

@@ -0,0 +1,12 @@
+/**
+ * Shared constants for the opportunity / loan pipeline domain.
+ */
+
+/** Asset types that represent real property (map to PropertyCard). */
+export const PROPERTY_ASSET_TYPES = new Set([
+  "Primary Residence",
+  "Investment Property",
+  "Holiday Home",
+  "Commercial Property",
+  "Rural Property",
+]);

package/src/styles/globals.css

@@ -11,7 +11,7 @@
  * (e.g. when packages/shadcn is outside the Vite root apps/docs).
  * These cover all state-dependent classes used in Checkbox, Button, etc.
  */
-@source inline("h-2 h-10 h-12 h-16 h-20 h-24 h-28 h-32 h-36 h-40 h-44 h-48 size-10 size-12 size-14 size-16 rounded-full w-4/5 shrink-0 bg-muted transition-all flex-wrap gap-x-4 gap-y-1.5 mt-3");
+@source inline("h-2 h-10 h-12 h-16 h-20 h-24 h-28 h-32 h-36 h-40 h-44 h-48 size-10 size-12 size-14 size-16 rounded-full w-4/5 shrink-0 bg-muted transition-all flex-wrap gap-x-4 gap-y-1.5 mt-3 text-success-text text-warning-text text-destructive-text text-info-text");
 
 @source inline("has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 border-border border-destructive/40 bg-destructive/10 border-warning/40 bg-warning/10 text-warning border-success/40 bg-success/10 text-success border-info/40 bg-info/10 text-info *:data-[slot=alert-description]:text-warning/90 *:data-[slot=alert-description]:text-success/90 *:data-[slot=alert-description]:text-info/90 *:data-[slot=alert-description]:text-destructive/90 [&>svg]:text-destructive [&>svg]:text-warning [&>svg]:text-success [&>svg]:text-info");
 
@@ -19,7 +19,7 @@
 
 /* Toggle / ToggleGroup pressed-state safelist — data-pressed is set by @base-ui/react/toggle */
 @source inline("data-pressed:bg-primary/10 data-pressed:inset-ring data-pressed:inset-ring-primary data-pressed:text-foreground data-pressed:hover:bg-primary/10 data-pressed:hover:text-foreground");
-@source inline("bg-foreground/50 hover:bg-foreground/5 focus:ring-border focus:ring-2 focus:ring-offset-0 fixed inset-0 translate-x-[-50%] translate-y-[-50%] max-w-[calc(100%-2rem)] sm:max-w-lg border-t pt-4 justify-end gap-1.5");
+@source inline("bg-foreground/50 hover:bg-foreground/5 focus:ring-border focus:ring-2 focus:ring-offset-0 fixed inset-0 translate-x-[-50%] translate-y-[-50%] max-w-[calc(100%-2rem)] sm:max-w-sm sm:max-w-md sm:max-w-lg sm:max-w-xl sm:max-w-2xl sm:max-w-3xl sm:max-w-4xl sm:max-w-full border-t pt-4 justify-end gap-1.5 aria-expanded:border-ring aria-expanded:ring-2 aria-expanded:ring-ring/20");
 
 @source inline("data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20");
 
@@ -462,7 +462,9 @@
   --accent-foreground: oklch(0.152 0.02 235); /* #040D13 */
 
   /* Destructive — error state */
-  --destructive: oklch(0.643 0.215 28.8); /* #F44336 — palette/error/main */
+  --destructive: oklch(
+    0.48 0.215 28
+  ); /* #C62828 — darkened for 4.5:1 with white */
   --destructive-foreground: oklch(1 0 0); /* #FFFFFF — light text on red */
 
   /* Borders */
@@ -472,25 +474,25 @@
     0.894 0.208 163
   ); /* #33FF99 — primary (focus ring uses brand color) */
 
-  /* WealthX custom: state colors */
-  --warning: oklch(0.77 0.174 64.1); /* #FF9800 — palette/warning/main */
+  /* WealthX custom: state colors
+   * Base colors are darkened to achieve ≥4.5:1 contrast with white foreground.
+   * *-text tokens are for colored text on light/white surfaces (not affected). */
+  --warning: oklch(0.565 0.18 67); /* #B45309 — darkened for 4.5:1 with white */
   --warning-foreground: oklch(1 0 0); /* #FFFFFF */
   --warning-text: oklch(
     0.44 0.14 58
-  ); /* ~#7A5200 — darkened for text on light bg (4.5:1 on white) */
-  --success: oklch(0.673 0.162 144.2); /* #4CAF50 — palette/success/main */
+  ); /* ~#7A5200 — colored text on light bg (4.5:1 on white) */
+  --success: oklch(
+    0.485 0.145 145
+  ); /* #2E7D32 — darkened for 4.5:1 with white */
   --success-foreground: oklch(1 0 0); /* #FFFFFF */
-  --success-text: oklch(
-    0.4 0.12 145
-  ); /* ~#1B5E20 — darkened for text on light bg */
-  --info: oklch(0.658 0.169 248.8); /* #2196F3 — palette/info/main */
+  --success-text: oklch(0.4 0.12 145); /* ~#1B5E20 — colored text on light bg */
+  --info: oklch(0.465 0.19 252); /* #1565C0 — darkened for 4.5:1 with white */
   --info-foreground: oklch(1 0 0); /* #FFFFFF */
-  --info-text: oklch(
-    0.4 0.13 250
-  ); /* ~#0D47A1 — darkened for text on light bg */
+  --info-text: oklch(0.4 0.13 250); /* ~#0D47A1 — colored text on light bg */
   --destructive-text: oklch(
     0.44 0.2 28.8
-  ); /* ~#8B0000 — darkened for text on light bg */
+  ); /* ~#8B0000 — colored text on light bg */
 
   /* Chart series — WealthX Charts collection */
   --chart-1: oklch(0.59 0.217 261.8); /* #2B72FB — series/blue */