@homefile/components-v2 2.36.15 → 2.36.16

package/dist/assets/locales/en/index.json

@@ -102,6 +102,7 @@
   "buttons": {
     "accurate": "Accurate",
     "back": "Back",
+    "complete": "Complete",
     "cancel": "Cancel",
     "confirm": "Confirm",
     "contacts": "Contacts",
@@ -1297,9 +1298,10 @@
     "title": "Value Monitor"
   },
   "wizardValueSummary": {
+    "accurateData": "Is this data \naccurate?",
     "assessedValue": "[Year] Assessed Value",
     "estimatedValue": "Estimated Value",
-    "info": "You can edit this record within your Homefile. Your information remains private and is never shared or sold.",
+    "info": "You can edit this record within your Homefile. \nYour information remains private and is never shared or sold.",
     "purchasePrice": "Purchase Price"
   }
 }

package/dist/components/buttons/ReactionTag.d.ts

@@ -0,0 +1,9 @@
+type ReactionTagProps = {
+    type: 'like' | 'dislike';
+    isActive?: boolean;
+    size?: string | number;
+    onClick?: () => void;
+    ariaLabel?: string;
+};
+export declare const ReactionTag: ({ type, isActive, size, onClick, ariaLabel, }: ReactionTagProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/buttons/ReactionTag.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Icon } from '@chakra-ui/react';
+import { BiLike } from 'react-icons/bi';
+export const ReactionTag = ({ type, isActive = true, size = 12, onClick, ariaLabel, }) => {
+    const types = {
+        like: {
+            color: isActive ? 'green.1' : 'gray.1',
+        },
+        dislike: {
+            color: isActive ? 'red.1' : 'gray.1',
+        },
+    };
+    return (_jsx(Box, { as: "button", "aria-label": ariaLabel, onClick: onClick, width: size, height: size, minW: size, minH: size, borderRadius: "full", display: "inline-flex", alignItems: "center", justifyContent: "center", borderWidth: "2px", borderColor: types[type].color, cursor: "pointer", transition: "all 150ms", _hover: { transform: 'scale(1.06)' }, children: _jsx(Icon, { as: BiLike, boxSize: Math.max(Number(String(size).replace('px', '')) * 0.5, 7), color: types[type].color, transform: type === 'dislike' ? 'scale(-1)' : undefined }) }));
+};

package/dist/components/buttons/index.d.ts

@@ -6,4 +6,5 @@ export * from './IconAndText';
 export * from './LeftButton';
 export * from './LeftButtonAnimated';
 export * from './PreviousCircleButton';
+export * from './ReactionTag';
 export * from './YesNoSwitch';

package/dist/components/buttons/index.js

@@ -6,4 +6,5 @@ export * from './IconAndText';
 export * from './LeftButton';
 export * from './LeftButtonAnimated';
 export * from './PreviousCircleButton';
+export * from './ReactionTag';
 export * from './YesNoSwitch';

package/dist/components/wizard/WizardValueSummary.d.ts

@@ -1,2 +1,2 @@
 import { WizardValueSummaryProps } from '../../interfaces';
-export declare const WizardValueSummary: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, }: WizardValueSummaryProps) => import("react/jsx-runtime").JSX.Element;
+export declare const WizardValueSummary: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, }: WizardValueSummaryProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/wizard/WizardValueSummary.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { t } from 'i18next';
 import { Stack, Text, Flex, Divider, Button } from '@chakra-ui/react';
-import { TrendingValueCard, RecordsSession } from '../../components';
-export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, }) => {
+import { TrendingValueCard, RecordsSession, ReactionTag } from '../../components';
+export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, }) => {
     const estimatedValueFormatted = `$${estimatedValue.toLocaleString('en-US')}.`;
-    return (_jsxs(Stack, { w: { base: 'full', md: '70%' }, m: "auto", spacing: "6", children: [_jsxs(Stack, { spacing: "1", align: "center", children: [_jsx(Text, { fontSize: "2xl", textTransform: "capitalize", children: title }), _jsx(Text, { fontFamily: "secondary", children: address }), subtitle && _jsx(Text, { fontFamily: "secondary", children: subtitle })] }), _jsxs(Stack, { bg: "lightGreen.3", spacing: "base", pt: "base", pb: "6", align: "center", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: t('wizardValueSummary.estimatedValue') }), _jsx(Text, { fontSize: "3xl", children: estimatedValueFormatted })] }), _jsxs(Flex, { gap: "base", direction: { base: 'column', md: 'row' }, children: [_jsxs(Stack, { flex: "1", spacing: "6", children: [_jsx(TrendingValueCard, { bg: "lightBlue.1", label: t('wizardValueSummary.purchasePrice'), value: purchasePrice }), _jsx(RecordsSession, { details: purchasePriceDetails, showLine: false, gap: "1", textAlign: "right", p: "0" })] }), _jsxs(Stack, { flex: "1", spacing: "6", children: [_jsx(TrendingValueCard, { bg: "lightBlue.1", label: t('wizardValueSummary.assessedValue'), value: assessedValue }), _jsx(RecordsSession, { details: assessedValueDetails, showLine: false, gap: "1", textAlign: "right", p: "0" })] })] }), _jsx(Divider, { borderStyle: "dotted", borderColor: "lightBlue.11" }), _jsxs(Flex, { gap: "base", children: [_jsx(Button, { onClick: onNotAccurate, children: t('buttons.notAccurate') }), _jsx(Button, { onClick: onAccurate, children: t('buttons.accurate') })] }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", textAlign: "center", color: "gray.2", lineHeight: "shorter", children: t('wizardValueSummary.info') })] }));
+    return (_jsxs(Stack, { w: { base: 'full', md: '70%' }, m: "auto", spacing: "6", children: [_jsxs(Stack, { spacing: "1", align: "center", children: [_jsx(Text, { fontSize: "2xl", textTransform: "capitalize", children: title }), _jsx(Text, { fontFamily: "secondary", children: address }), subtitle && _jsx(Text, { fontFamily: "secondary", children: subtitle })] }), _jsxs(Stack, { bg: "lightGreen.3", spacing: "base", pt: "base", pb: "6", align: "center", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: t('wizardValueSummary.estimatedValue') }), _jsx(Text, { fontSize: "3xl", children: estimatedValueFormatted })] }), _jsxs(Flex, { gap: "base", direction: { base: 'column', md: 'row' }, children: [_jsxs(Stack, { flex: "1", spacing: "6", children: [_jsx(TrendingValueCard, { bg: "lightBlue.1", label: t('wizardValueSummary.purchasePrice'), value: purchasePrice }), _jsx(RecordsSession, { details: purchasePriceDetails, showLine: false, gap: "1", textAlign: "right", p: "0" })] }), _jsxs(Stack, { flex: "1", spacing: "6", children: [_jsx(TrendingValueCard, { bg: "lightBlue.1", label: t('wizardValueSummary.assessedValue'), value: assessedValue }), _jsx(RecordsSession, { details: assessedValueDetails, showLine: false, gap: "1", textAlign: "right", p: "0" })] })] }), _jsx(Divider, { borderStyle: "dashed", borderColor: "lightBlue.11" }), _jsxs(Flex, { align: "center", justify: "space-between", children: [_jsxs(Flex, { gap: "base", align: "center", children: [_jsx(Text, { fontFamily: "secondary", fontSize: "xs", color: "gray.2", lineHeight: "shorter", whiteSpace: "pre-line", children: t('wizardValueSummary.accurateData') }), _jsx(ReactionTag, { type: "dislike", ariaLabel: t('buttons.notAccurate'), onClick: onNotAccurate }), _jsx(ReactionTag, { type: "like", ariaLabel: t('buttons.accurate'), onClick: onAccurate })] }), _jsx(Button, { w: "154px", onClick: onComplete, children: t('buttons.complete') })] }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", textAlign: "center", color: "gray.2", lineHeight: "shorter", whiteSpace: "pre-line", children: t('wizardValueSummary.info') })] }));
 };

package/dist/interfaces/wizard/WizardValueSummary.interface.d.ts

@@ -9,4 +9,5 @@ export interface WizardValueSummaryProps {
     assessedValueDetails: Record<string, string | undefined>;
     onAccurate: () => void;
     onNotAccurate: () => void;
+    onComplete?: () => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homefile/components-v2",
-  "version": "2.36.15",
+  "version": "2.36.16",
   "author": "Homefile",
   "license": "UNLICENSED",
   "typings": "dist/index.d.ts",