@pfm-platform/goals-ui-mui 0.2.0 → 0.2.1

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SavingsGoal, PayoffGoal } from '@pfm-platform/shared';
+import { SavingsGoalRow, PayoffGoalRow } from '@pfm-platform/shared';
 
 interface GoalCreateFormProps {
     userId: string;
@@ -9,7 +9,7 @@ declare function GoalCreateForm({ userId, onSuccess, }: GoalCreateFormProps): re
 
 interface GoalDeleteButtonProps {
     userId: string;
-    goalId: number;
+    goalId: string;
     goalName: string;
     goalType: 'savings' | 'payoff';
 }
@@ -17,7 +17,7 @@ declare function GoalDeleteButton({ userId, goalId, goalName, goalType, }: GoalD
 
 interface GoalEditFormProps {
     userId: string;
-    goal: SavingsGoal | PayoffGoal;
+    goal: SavingsGoalRow | PayoffGoalRow;
     goalType: 'savings' | 'payoff';
     open: boolean;
     onClose: () => void;
@@ -64,11 +64,11 @@ interface GoalProgressCardProps {
     /** Goal name */
     name: string;
     /** Current value/progress */
-    currentValue: string;
+    currentValue: number;
     /** Target value */
-    targetValue: string;
+    targetValue: number;
     /** Initial value (for payoff goals) */
-    initialValue?: string;
+    initialValue?: number;
     /** Percent complete (0-100) */
     percentComplete: number;
     /** Goal type */
@@ -82,7 +82,7 @@ interface GoalProgressCardProps {
     /** Estimated months remaining */
     monthsRemaining?: number;
     /** Monthly contribution amount */
-    monthlyContribution?: string;
+    monthlyContribution?: number;
 }
 /**
  * GoalProgressCard component displays individual goal progress.
@@ -92,8 +92,8 @@ interface GoalProgressCardProps {
  * ```tsx
  * <GoalProgressCard
  *   name="Emergency Fund"
- *   currentValue="5000.00"
- *   targetValue="10000.00"
+ *   currentValue={5000}
+ *   targetValue={10000}
  *   percentComplete={50}
  *   goalType="savings"
  *   currencySymbol="$"

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SavingsGoal, PayoffGoal } from '@pfm-platform/shared';
+import { SavingsGoalRow, PayoffGoalRow } from '@pfm-platform/shared';
 
 interface GoalCreateFormProps {
     userId: string;
@@ -9,7 +9,7 @@ declare function GoalCreateForm({ userId, onSuccess, }: GoalCreateFormProps): re
 
 interface GoalDeleteButtonProps {
     userId: string;
-    goalId: number;
+    goalId: string;
     goalName: string;
     goalType: 'savings' | 'payoff';
 }
@@ -17,7 +17,7 @@ declare function GoalDeleteButton({ userId, goalId, goalName, goalType, }: GoalD
 
 interface GoalEditFormProps {
     userId: string;
-    goal: SavingsGoal | PayoffGoal;
+    goal: SavingsGoalRow | PayoffGoalRow;
     goalType: 'savings' | 'payoff';
     open: boolean;
     onClose: () => void;
@@ -64,11 +64,11 @@ interface GoalProgressCardProps {
     /** Goal name */
     name: string;
     /** Current value/progress */
-    currentValue: string;
+    currentValue: number;
     /** Target value */
-    targetValue: string;
+    targetValue: number;
     /** Initial value (for payoff goals) */
-    initialValue?: string;
+    initialValue?: number;
     /** Percent complete (0-100) */
     percentComplete: number;
     /** Goal type */
@@ -82,7 +82,7 @@ interface GoalProgressCardProps {
     /** Estimated months remaining */
     monthsRemaining?: number;
     /** Monthly contribution amount */
-    monthlyContribution?: string;
+    monthlyContribution?: number;
 }
 /**
  * GoalProgressCard component displays individual goal progress.
@@ -92,8 +92,8 @@ interface GoalProgressCardProps {
  * ```tsx
  * <GoalProgressCard
  *   name="Emergency Fund"
- *   currentValue="5000.00"
- *   targetValue="10000.00"
+ *   currentValue={5000}
+ *   targetValue={10000}
  *   percentComplete={50}
  *   goalType="savings"
  *   currencySymbol="$"

package/dist/index.js

@@ -64,11 +64,10 @@ function GoalCreateForm({
       setError("Target value must be a positive number");
       return;
     }
-    const formattedAmount = amount.toFixed(2);
     const data = {
       name: name.trim(),
       image_name: imageName.trim(),
-      target_value: formattedAmount,
+      target_value: amount,
       target_completion_on: targetCompletionOn || void 0
     };
     if (goalType === "savings") {
@@ -284,7 +283,7 @@ function GoalEditForm({
 }) {
   const [name, setName] = useState(goal.name);
   const [imageName, setImageName] = useState(goal.image_name);
-  const [targetValue, setTargetValue] = useState(goal.target_value);
+  const [targetValue, setTargetValue] = useState(String(goal.target_value));
   const [targetCompletionOn, setTargetCompletionOn] = useState(
     goal.target_completion_on || ""
   );
@@ -322,12 +321,11 @@ function GoalEditForm({
       setError("Target value must be a positive number");
       return;
     }
-    const formattedAmount = amount.toFixed(2);
     const data = {
       id: goal.id,
       name: name.trim(),
       image_name: imageName.trim(),
-      target_value: formattedAmount,
+      target_value: amount,
       target_completion_on: targetCompletionOn || void 0
     };
     if (goalType === "savings") {
@@ -835,8 +833,8 @@ function GoalProgressCard({
   monthsRemaining,
   monthlyContribution
 }) {
-  const current = parseFloat(currentValue);
-  const target = parseFloat(targetValue);
+  const current = currentValue;
+  const target = targetValue;
   const remaining = goalType === "savings" ? target - current : current;
   const progressColor = complete ? "success" : percentComplete >= 75 ? "primary" : percentComplete >= 50 ? "info" : percentComplete >= 25 ? "warning" : "error";
   const formatCurrency = (amount) => {
@@ -905,10 +903,10 @@ function GoalProgressCard({
       }
     ),
     /* @__PURE__ */ jsxs(Box, { display: "flex", flexDirection: "column", gap: 1, children: [
-      monthlyContribution && parseFloat(monthlyContribution) > 0 && /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
+      monthlyContribution != null && monthlyContribution > 0 && /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
         /* @__PURE__ */ jsx(TrendingUp, { fontSize: "small", color: "action" }),
         /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", children: [
-          formatCurrency(parseFloat(monthlyContribution)),
+          formatCurrency(monthlyContribution),
           "/month"
         ] })
       ] }),