@homefile/components-v2 2.36.27 → 2.36.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/buttons/ReactionTag.d.ts +2 -1
- package/dist/components/buttons/ReactionTag.js +3 -3
- package/dist/components/wizard/WizardValueSummary.d.ts +1 -1
- package/dist/components/wizard/WizardValueSummary.js +2 -2
- package/dist/interfaces/wizard/WizardValueSummary.interface.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
type ReactionTagProps = {
|
|
2
2
|
type: 'like' | 'dislike';
|
|
3
3
|
isActive?: boolean;
|
|
4
|
+
isSelected?: boolean;
|
|
4
5
|
size?: string | number;
|
|
5
6
|
onClick?: () => void;
|
|
6
7
|
ariaLabel?: string;
|
|
7
8
|
};
|
|
8
|
-
export declare const ReactionTag: ({ type, isActive, size, onClick, ariaLabel, }: ReactionTagProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const ReactionTag: ({ type, isActive, isSelected, size, onClick, ariaLabel, }: ReactionTagProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
10
|
export {};
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Box, Icon } from '@chakra-ui/react';
|
|
3
3
|
import { BiLike } from 'react-icons/bi';
|
|
4
|
-
export const ReactionTag = ({ type, isActive = true, size = 12, onClick, ariaLabel, }) => {
|
|
4
|
+
export const ReactionTag = ({ type, isActive = true, isSelected = false, size = 12, onClick, ariaLabel, }) => {
|
|
5
5
|
const types = {
|
|
6
6
|
like: {
|
|
7
|
-
color: isActive ? 'green.1' : 'gray.
|
|
7
|
+
color: isSelected ? 'blue.2' : isActive ? 'green.1' : 'gray.2',
|
|
8
8
|
},
|
|
9
9
|
dislike: {
|
|
10
|
-
color: isActive ? 'red.1' : 'gray.
|
|
10
|
+
color: isSelected ? 'blue.2' : isActive ? 'red.1' : 'gray.2',
|
|
11
11
|
},
|
|
12
12
|
};
|
|
13
13
|
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 }) }));
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { WizardValueSummaryProps } from '../../interfaces';
|
|
2
|
-
export declare const WizardValueSummary: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, }: WizardValueSummaryProps) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const WizardValueSummary: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, accuracyStatus, }: WizardValueSummaryProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { t } from 'i18next';
|
|
3
3
|
import { Stack, Text, Flex, Divider, Button } from '@chakra-ui/react';
|
|
4
4
|
import { TrendingValueCard, RecordsSession, ReactionTag } from '../../components';
|
|
5
|
-
export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, }) => {
|
|
5
|
+
export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, accuracyStatus, }) => {
|
|
6
6
|
const estimatedValueFormatted = `$${estimatedValue.toLocaleString('en-US')}.`;
|
|
7
|
-
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') })] }));
|
|
7
|
+
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, isSelected: accuracyStatus === 'not-accurate' }), _jsx(ReactionTag, { type: "like", ariaLabel: t('buttons.accurate'), onClick: onAccurate, isSelected: accuracyStatus === 'accurate' })] }), _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') })] }));
|
|
8
8
|
};
|