@homefile/components-v2 2.39.24 → 2.39.26

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.
@@ -446,9 +446,9 @@
446
446
  "structure": "Structure"
447
447
  },
448
448
  "title": "Homi - Set Up",
449
- "tutorialButton": "Start Quick Setup",
450
- "tutorialDescription": "Homi helps you manage every aspect of your home. We've added a short overview to help you learn more about it.",
451
- "tutorialTitle": "Let’s quickly set up Homi, your friendly AI home assistant.",
449
+ "tutorialButton": "Set up Homi",
450
+ "tutorialDescription": "Homi learns your home’s systems, tracks details automatically, and \nhelps you be proactive in your home’s care. Setup takes 2 minutes.",
451
+ "tutorialTitle": "Meet Homi, your intelligent \nhome assistant.",
452
452
  "tutorialNote": "Just a few set-up questions to help Homi get going."
453
453
  },
454
454
  "homeBoard": {
@@ -1,2 +1,2 @@
1
1
  import { HomeAssistantTutorialI } from '../../interfaces';
2
- export declare const HomeAssistantTutorial: ({ onStart, videoUrl, maxWidth, }: HomeAssistantTutorialI) => import("react/jsx-runtime").JSX.Element;
2
+ export declare const HomeAssistantTutorial: ({ onStart, videoUrl, }: HomeAssistantTutorialI) => import("react/jsx-runtime").JSX.Element;
@@ -4,7 +4,7 @@ import { t } from 'i18next';
4
4
  import { Box, Button, Circle, Flex, Stack, Text } from '@chakra-ui/react';
5
5
  import { ChevronRight, VideoPlayerModal, VideoPlayerTrigger, } from '../../components';
6
6
  import { colors } from '../../theme/colors';
7
- export const HomeAssistantTutorial = ({ onStart, videoUrl, maxWidth, }) => {
7
+ export const HomeAssistantTutorial = ({ onStart, videoUrl, }) => {
8
8
  const [url, setUrl] = useState();
9
- return (_jsxs(Stack, { spacing: 4, align: "center", maxW: maxWidth || '483px', px: ['base', 0], zIndex: "2", children: [_jsx(Text, { fontSize: "30px", lineHeight: "32px", textAlign: "center", children: t('homeAssistant.tutorialTitle') }), _jsx(Text, { fontFamily: "secondary", textAlign: "center", children: t('homeAssistant.tutorialDescription') }), _jsxs(Stack, { spacing: "base", w: "284px", children: [videoUrl && (_jsx(Box, { boxShadow: "lg", children: _jsx(VideoPlayerTrigger, { url: videoUrl, value: videoUrl, ratio: 16 / 9, onPlay: (value) => setUrl(value) }) })), _jsx(Button, { onClick: onStart, textTransform: "capitalize", children: _jsxs(Flex, { align: "center", justify: "space-between", w: "100%", px: "base", children: [_jsx(Text, { color: "neutral.white", children: t('homeAssistant.tutorialButton') }), _jsx(Circle, { size: "40px", bg: "blue.1", color: "neutral.white", children: _jsx(ChevronRight, { size: 26, stroke: colors.neutral.white }) })] }) })] }), _jsx(Text, { fontFamily: "secondary", textAlign: "center", children: t('homeAssistant.tutorialNote') }), url && (_jsx(VideoPlayerModal, { url: url, onClose: () => setUrl(undefined), showOverlay: true }))] }));
9
+ return (_jsxs(Stack, { w: "full", h: "full", spacing: "4", align: "center", justify: "center", children: [_jsx(Text, { fontSize: "24px", lineHeight: "28px", textAlign: "center", whiteSpace: "pre-line", children: t('homeAssistant.tutorialTitle') }), _jsx(Text, { fontFamily: "secondary", textAlign: "center", whiteSpace: "pre-line", children: t('homeAssistant.tutorialDescription') }), _jsxs(Stack, { spacing: "base", w: "395px", children: [videoUrl && (_jsx(Box, { boxShadow: "lg", children: _jsx(VideoPlayerTrigger, { url: videoUrl, value: videoUrl, ratio: 16 / 9, onPlay: (value) => setUrl(value) }) })), _jsx(Button, { onClick: onStart, textTransform: "capitalize", mt: "4", children: _jsxs(Flex, { align: "center", justify: "space-between", w: "full", px: "base", children: [_jsx(Text, { color: "neutral.white", children: t('homeAssistant.tutorialButton') }), _jsx(Circle, { size: "40px", bg: "blue.1", color: "neutral.white", children: _jsx(ChevronRight, { size: 26, stroke: colors.neutral.white }) })] }) })] }), url && (_jsx(VideoPlayerModal, { url: url, onClose: () => setUrl(undefined), showOverlay: true }))] }));
10
10
  };
@@ -7,7 +7,7 @@ import { useState } from 'react';
7
7
  export const MyHomes = ({ cardList = [], cardMenuItems = [], handleCardClick, handleFilterClick, handleNewHomeClick, headerMenuItems, addImage, loading, loadingId, showLoadMore, handleLoadMore, loadMoreDisabled, }) => {
8
8
  const [showChildren, setShowChildren] = useState(false);
9
9
  const handleHelpClick = () => setShowChildren(!showChildren);
10
- return (_jsx(TileTooltip, { label: "myHomes", children: _jsxs(Container, { variant: "launchpad", maxW: "none", pb: "3rem", position: "relative", children: [showChildren && (_jsx(BaseStep, { top: "60px", right: "60px", onClose: handleHelpClick, children: _jsx(InviteRolesStep, {}) })), _jsx(ContainerHeader, { disabled: true, menuItems: headerMenuItems, title: t('myHomes.title'), icon: _jsx(MoreHorizontal, { size: 38 }), titleIcon: House, showHelp: true, onHelpClick: handleHelpClick }), _jsx(MyHomesHeader, { onFilterClick: handleFilterClick, onNewHomeClick: handleNewHomeClick }), _jsx(Wrap, { spacing: "base", px: "base", alignItems: "start", children: cardList.length > 0 &&
10
+ return (_jsx(TileTooltip, { label: "myHomes", children: _jsxs(Container, { variant: "launchpad", maxW: "none", pb: "3rem", position: "relative", children: [showChildren && (_jsx(BaseStep, { top: "60px", right: "60px", onClose: handleHelpClick, children: _jsx(InviteRolesStep, {}) })), _jsx(ContainerHeader, { disabled: true, menuItems: headerMenuItems, title: t('myHomes.title'), icon: _jsx(MoreHorizontal, { size: 38 }), titleIcon: House, showHelp: true }), _jsx(MyHomesHeader, { onFilterClick: handleFilterClick, onNewHomeClick: handleNewHomeClick }), _jsx(Wrap, { spacing: "base", px: "base", alignItems: "start", children: cardList.length > 0 &&
11
11
  (cardList === null || cardList === void 0 ? void 0 : cardList.map(({ accountType, address, active, _id, image, name }, index) => (_jsx(WrapItem, { children: _jsxs(Container, { w: "179px", position: "relative", transition: "all 0.3s ease-in-out", _hover: {
12
12
  boxShadow: 'xl',
13
13
  }, id: index === 0 ? 'homeCard' : '', children: [_jsx(ContainerHeader, { menuItems: accountType === 'Member' ? [] : cardMenuItems, itemForm: { _id, name }, icon: _jsx(MoreHorizontal, { size: 32 }), isThin: true, index: index }), _jsx(Box, { w: "179px", textAlign: "left", children: _jsx(MyHomeCard, { accountType: accountType, address: address, image: image, name: name, active: active, _id: _id, index: index, handleCardClick: handleCardClick, addImage: addImage, loading: loading, loadingId: loadingId, editImage: false }) })] }) }, _id)))) }), showLoadMore && (_jsx(Flex, { justifyContent: 'center', mt: '2rem', children: _jsx(Button, { onClick: handleLoadMore, variant: 'primaryFooter', disabled: loadMoreDisabled, children: t('buttons.loadMore') }) }))] }) }));
@@ -2,5 +2,5 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Box, Stack, Text } from '@chakra-ui/react';
3
3
  import { PropertyCards } from '../../../components';
4
4
  export function ConfirmPropertyBody({ properties, currentProperty, onChange, footerText, }) {
5
- return (_jsx(Stack, { spacing: "4", align: "center", w: "full", children: _jsxs(Stack, { align: "center", w: "full", spacing: "base", children: [_jsx(PropertyCards, { properties: properties, currentProperty: currentProperty, onChange: onChange }), _jsx(Box, { px: "6", children: _jsx(Text, { variant: "home", textAlign: "center", children: footerText }) })] }) }));
5
+ return (_jsx(Stack, { spacing: "4", align: "center", children: _jsxs(Stack, { align: "center", w: "full", spacing: "base", children: [_jsx(PropertyCards, { properties: properties, currentProperty: currentProperty, onChange: onChange }), _jsx(Box, { px: "6", children: _jsx(Text, { variant: "home", textAlign: "center", children: footerText }) })] }) }));
6
6
  }
@@ -14,7 +14,9 @@ export const RoomVideo = ({ files = [], loading, menuItems, onDelete, onUpload,
14
14
  const showFiles = filesLength > 0;
15
15
  const handlePlay = (file) => setFileToPlay(file);
16
16
  const { imageUrl, title } = fileToPlay || {};
17
- return (_jsxs(_Fragment, { children: [_jsx(TileTooltip, { label: "roomVideo", children: _jsxs(Container, { variant: "launchpad", h: "full", position: "relative", maxW: "none", children: [showBubble && _jsx(RoomVideoHelp, { onClose: handleToggle }), _jsx(ContainerHeader, { title: t('roomVideo.title'), titleIcon: VideoIcon, icon: _jsx(MoreHorizontal, { size: 38 }), iconSize: "20px", menuItems: menuItems, onHelpClick: handleToggle, showHelp: true, fontWeight: 'normal' }), !showFiles && _jsx(RoomVideoInstruction, {}), showFiles && (_jsx(RoomVideoFiles, { files: files, loading: loading, onDelete: onDelete, uploading: uploading, onPlay: handlePlay })), showDragDrop && (_jsx(AddMedia, { accept: {
17
+ return (_jsxs(_Fragment, { children: [_jsx(TileTooltip, { label: "roomVideo", children: _jsxs(Container, { variant: "launchpad", h: "full", position: "relative", maxW: "none", children: [showBubble && _jsx(RoomVideoHelp, { onClose: handleToggle }), _jsx(ContainerHeader, { title: t('roomVideo.title'), titleIcon: VideoIcon, icon: _jsx(MoreHorizontal, { size: 38 }), iconSize: "20px", menuItems: menuItems,
18
+ // onHelpClick={handleToggle}
19
+ showHelp: true, fontWeight: 'normal' }), !showFiles && _jsx(RoomVideoInstruction, {}), showFiles && (_jsx(RoomVideoFiles, { files: files, loading: loading, onDelete: onDelete, uploading: uploading, onPlay: handlePlay })), showDragDrop && (_jsx(AddMedia, { accept: {
18
20
  'video/mp4': ['.mp4', '.MP4', '.webm'],
19
21
  'video/mov': ['.mov', '.MOV'],
20
22
  }, bgColor: "transparent", errorTypeMessage: t('addMedia.errorVideoType'), maxFiles: 4, handleDelete: onDelete, handleEdit: () => null, handleUpload: onUpload, uploading: uploading, showHeader: false, loading: loading, dropAreaHeight: dragDropHeight }))] }) }), imageUrl && (_jsx(VideoPlayerModal, { url: imageUrl, title: title, onClose: () => setFileToPlay(undefined), showOverlay: true }))] }));
@@ -7,5 +7,5 @@ import { ShareHome } from '../../assets/images';
7
7
  export const SharedHomeHeader = ({ children, onClose }) => {
8
8
  const [showChildren, setShowChildren] = useState(false);
9
9
  const handleHelpClick = () => setShowChildren(!showChildren);
10
- return (_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, icon: ShareHome, title: t('shareHome.title'), children: _jsx(Box, { mr: "base", position: "relative", children: _jsx(HelpButton, { onClick: handleHelpClick, children: showChildren && (_jsx(RolesHelpModal, { top: "40px", right: "0", onClose: handleHelpClick })) }) }) }), children] }));
10
+ return (_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, icon: ShareHome, title: t('shareHome.title'), children: _jsx(Box, { mr: "base", position: "relative", children: _jsx(HelpButton, { onClick: () => { }, children: showChildren && (_jsx(RolesHelpModal, { top: "40px", right: "0", onClose: handleHelpClick })) }) }) }), children] }));
11
11
  };
@@ -1,2 +1,5 @@
1
1
  import { ControlledWizardI } from '../../interfaces';
2
2
  export declare function ControlledWizard({ bodyWidth, step, setStep, steps, height, headerBlink, footerBlink, }: ControlledWizardI): import("react/jsx-runtime").JSX.Element;
3
+ export declare const WizardBodyPadding: ({ children, }: {
4
+ children: React.ReactNode;
5
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -53,5 +53,8 @@ export function ControlledWizard({ bodyWidth = '80%', step, setStep, steps, heig
53
53
  transition: { duration: 0.18 },
54
54
  },
55
55
  };
56
- return (_jsxs(Stack, { shadow: "md", h: height, bg: "white", overflow: "hidden", spacing: "0", children: [_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: headerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", flexShrink: 0, children: current.header }, `h-${step}`) }), _jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: bodyVariants, initial: "initial", animate: "animate", exit: "exit", flex: "1", display: "flex", minH: "0", children: _jsx(Flex, { direction: "column", flex: "auto", overflowY: "auto", minH: "0", align: "center", py: { base: '4', md: '8' }, children: _jsx(Box, { w: bodyWidth, children: current.body({ setStep }) }) }) }, `b-${step}`) }), current.footer && (_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: footerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", flexShrink: 0, bg: "white", borderTopWidth: "1px", borderColor: "lightBlue.3", children: _jsx(Flex, { justify: "center", py: { base: '4', md: '5' }, children: _jsx(Box, { w: bodyWidth, children: current.footer }) }) }, `f-${step}`) }))] }));
56
+ return (_jsxs(Stack, { shadow: "md", h: height, bg: "white", overflow: "hidden", spacing: "0", children: [_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: headerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", flexShrink: 0, children: current.header }, `h-${step}`) }), _jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: bodyVariants, initial: "initial", animate: "animate", exit: "exit", flex: "1", display: "flex", minH: "0", children: _jsx(Flex, { direction: "column", flex: "auto", overflowY: "auto", minH: "0", children: _jsx(Flex, { justify: "center", h: "full", w: "full", children: _jsx(Box, { w: bodyWidth, children: current.body({ setStep }) }) }) }) }, `b-${step}`) }), current.footer && (_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: footerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", flexShrink: 0, bg: "white", borderTopWidth: "1px", borderColor: "lightBlue.3", children: _jsx(Flex, { justify: "center", py: { base: '4', md: '5' }, children: _jsx(Box, { w: bodyWidth, children: current.footer }) }) }, `f-${step}`) }))] }));
57
57
  }
58
+ export const WizardBodyPadding = ({ children, }) => {
59
+ return _jsx(Box, { py: { base: '4', md: '8' }, children: children });
60
+ };
@@ -5,7 +5,7 @@ import { ContainerHeader, Logo } from '../../components';
5
5
  import { randomImages } from '../../utils';
6
6
  import { useMyHomeCard } from '../../hooks';
7
7
  export const WizardSuccessHeader = ({ title, subtitle, address, name, image, }) => {
8
- return (_jsx(Center, { w: "full", bg: "lightGreen.1", minH: "212px", children: _jsxs(Stack, { w: "full", spacing: "0", align: "center", children: [_jsx(Show, { below: "md", children: _jsx(Logo, {}) }), _jsxs(Flex, { gap: "8", w: { base: '80%', md: '70%' }, align: "center", pt: { base: '0', md: '8' }, direction: { base: 'column', md: 'row' }, children: [_jsx(WizardHomeCard, { address: address, name: name, image: image }), _jsxs(Stack, { spacing: "2", children: [_jsxs(Text, { fontSize: "xl", fontWeight: "semibold", color: "green.1", children: [t('ariaLabels.success'), "!"] }), _jsx(Text, { fontSize: { base: '2xl', md: '3xl' }, lineHeight: "shorter", children: title }), subtitle && _jsx(Text, { fontFamily: "secondary", children: subtitle }), _jsx(Show, { below: "md", children: _jsx(Box, { h: "6" }) })] })] })] }) }));
8
+ return (_jsx(Center, { w: "full", bg: "lightGreen.1", minH: "212px", children: _jsxs(Stack, { w: "full", spacing: "0", align: "center", children: [_jsx(Show, { below: "md", children: _jsx(Logo, {}) }), _jsxs(Flex, { gap: "8", w: "80%", align: "center", pt: { base: '0', md: '8' }, direction: { base: 'column', md: 'row' }, children: [_jsx(Box, { maxW: "205px", children: _jsx(WizardHomeCard, { address: address, name: name, image: image }) }), _jsxs(Stack, { spacing: "2", children: [_jsxs(Text, { fontSize: "xl", fontWeight: "semibold", color: "green.1", children: [t('ariaLabels.success'), "!"] }), _jsx(Text, { fontSize: { base: '2xl', md: '3xl' }, lineHeight: "shorter", children: title }), subtitle && _jsx(Text, { fontFamily: "secondary", children: subtitle }), _jsx(Show, { below: "md", children: _jsx(Box, { h: "6" }) })] })] })] }) }));
9
9
  };
10
10
  const WizardHomeCard = ({ address, name, image, }) => {
11
11
  const { imageUrl } = useMyHomeCard({
@@ -1,2 +1,2 @@
1
- import { WizardValueSummaryProps } from '../../interfaces';
2
- export declare const WizardValueSummary: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, accuracyStatus, }: WizardValueSummaryProps) => import("react/jsx-runtime").JSX.Element;
1
+ import { WizardValueSummaryI } from '../../interfaces';
2
+ export declare const WizardValueSummary: (props: WizardValueSummaryI) => import("react/jsx-runtime").JSX.Element;
@@ -1,8 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { t } from 'i18next';
3
- import { Stack, Text, Flex, Divider, Button } from '@chakra-ui/react';
4
- import { TrendingValueCard, RecordsSession, ReactionTag } from '../../components';
5
- export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, accuracyStatus, }) => {
6
- const estimatedValueFormatted = `$${estimatedValue.toLocaleString('en-US')}.`;
7
- return (_jsxs(Stack, { 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, variant: "wizard", children: t('buttons.continue') })] }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", textAlign: "center", color: "gray.2", lineHeight: "shorter", whiteSpace: "pre-line", children: t('wizardValueSummary.info') })] }));
2
+ import { Stack } from '@chakra-ui/react';
3
+ import { WizardValueSummaryBody, WizardValueSummaryFooter } from '../../components';
4
+ export const WizardValueSummary = (props) => {
5
+ return (_jsxs(Stack, { spacing: "6", children: [_jsx(WizardValueSummaryBody, Object.assign({}, props)), _jsx(WizardValueSummaryFooter, Object.assign({}, props))] }));
8
6
  };
@@ -0,0 +1,2 @@
1
+ import { WizardValueSummaryBodyI } from '../../interfaces';
2
+ export declare const WizardValueSummaryBody: ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, }: WizardValueSummaryBodyI) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { t } from 'i18next';
3
+ import { Divider, Flex, Stack, Text } from '@chakra-ui/react';
4
+ import { RecordsSession, TrendingValueCard } from '../../components';
5
+ export const WizardValueSummaryBody = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, }) => {
6
+ const estimatedValueFormatted = `$${estimatedValue.toLocaleString('en-US')}.`;
7
+ return (_jsxs(Stack, { spacing: "6", w: "full", 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" })] }));
8
+ };
@@ -0,0 +1,2 @@
1
+ import { WizardValueSummaryFooterI } from '../../interfaces';
2
+ export declare const WizardValueSummaryFooter: ({ onAccurate, onNotAccurate, onComplete, accuracyStatus, }: WizardValueSummaryFooterI) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,7 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { t } from 'i18next';
3
+ import { Button, Flex, Stack, Text } from '@chakra-ui/react';
4
+ import { ReactionTag } from '../../components';
5
+ export const WizardValueSummaryFooter = ({ onAccurate, onNotAccurate, onComplete, accuracyStatus, }) => {
6
+ return (_jsxs(Stack, { spacing: "6", children: [_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, variant: "wizard", children: t('buttons.continue') })] }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", textAlign: "center", color: "gray.2", lineHeight: "shorter", whiteSpace: "pre-line", children: t('wizardValueSummary.info') })] }));
7
+ };
@@ -6,3 +6,5 @@ export * from './WizardSuccessHeader';
6
6
  export * from './WizardTextHeader';
7
7
  export * from './WizardTextBody';
8
8
  export * from './WizardValueSummary';
9
+ export * from './WizardValueSummaryBody';
10
+ export * from './WizardValueSummaryFooter';
@@ -6,3 +6,5 @@ export * from './WizardSuccessHeader';
6
6
  export * from './WizardTextHeader';
7
7
  export * from './WizardTextBody';
8
8
  export * from './WizardValueSummary';
9
+ export * from './WizardValueSummaryBody';
10
+ export * from './WizardValueSummaryFooter';
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPopup, AddPropertyRecords, Address, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackendAlert, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ConfirmProperty, ConfirmPropertyBody, ConfirmPropertyFooter, ContactList, ContactsContent, ContainerHeader, ControlledWizard, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EditItemName, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeAssistantTutorial, HomeAssistantWizardPanel, HomeAssistantWizardSteps, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeItemList, HomeItemManualInfo, HomeMonitor, HomeMonitorPanel, HomeMonitorSteps, HomeSharedWith, HomieAddItems, InboxForwardBanner, InboxTile, ItemFormPanel, ItemFormTabs, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadReceiptPanel, LaunchpadTour, LeftPanel, Loading, MediaDetailsStep, MessageChatPanel, MessagePanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewHomeDetails, NewPassword, NotBeChargedBanner, NotificationCard, Notifications, NotificationsPanel, NotificationsReminder, NpsScore, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, PaymentBanner, PaymentReceipts, PdfButton, PeopleConnected, ProfileDetailsTab, ProfilePaymentTab, ProjectList, PropertyRecords, PropertyTaxes, ReadOnlyDynamicForm, ReadOnlyImage, ReadOnlyToggle, ReceiptAutofiler, ReceiptBody, ReceiptContent, ReceiptDetails, ReceiptFilters, ReceiptFooter, ReceiptHeader, ReceiptInfos, ReceiptItem, ReceiptItems, ReceiptPDF, ReceiptsDisplayOptions, ReceiptsFiled, ReceiptsHeader, ReceiptsInfo, ReceiptsReceivedContent, RecipientForm, RecipientsToShare, RecipientTab, RecordsInputs, ResendResetPassword, ResetPassword, ReviewBanner, RightPanel, RolePermissionsTab, RoomHeader, RoomsBoardTour, RoomsMenu, RoomsMenuMobile, RoomStep, RoomVideo, SalesTax, SatisfactionTile, SearchItemLoader, SearchRecords, SectionHeader, SendCommunication, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, SkeletonBox, StepHeader, StorageUsed, Subscription, SubscriptionCard, SubscriptionTable, Summary, TabsHeader, TextInput, ToBeDeletedBody, ToBeDeletedContent, ToBeDeletedFooter, ToBeDeletedHeader, TourButton, Trash, TrendingValue, TrialBanner, TutorialsButton, TwoFactor, TwoFactorSetting, UpdateList, UserDetails, ValueMonitor, VideoPlayer, VideoPlayerModal, ViewContactPanel, WeatherWidget, WellDone, WizardStepGoal, WizardSuccessHeader, WizardTextHeader, WizardValueSummary, YtdTile, } from './components';
1
+ export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPopup, AddPropertyRecords, Address, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackendAlert, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ConfirmProperty, ConfirmPropertyBody, ConfirmPropertyFooter, ContactList, ContactsContent, ContainerHeader, ControlledWizard, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EditItemName, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeAssistantTutorial, HomeAssistantWizardPanel, HomeAssistantWizardSteps, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeItemList, HomeItemManualInfo, HomeMonitor, HomeMonitorPanel, HomeMonitorSteps, HomeSharedWith, HomieAddItems, InboxForwardBanner, InboxTile, ItemFormPanel, ItemFormTabs, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadReceiptPanel, LaunchpadTour, LeftPanel, Loading, MediaDetailsStep, MessageChatPanel, MessagePanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewHomeDetails, NewPassword, NotBeChargedBanner, NotificationCard, Notifications, NotificationsPanel, NotificationsReminder, NpsScore, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, PaymentBanner, PaymentReceipts, PdfButton, PeopleConnected, ProfileDetailsTab, ProfilePaymentTab, ProjectList, PropertyRecords, PropertyTaxes, ReadOnlyDynamicForm, ReadOnlyImage, ReadOnlyToggle, ReceiptAutofiler, ReceiptBody, ReceiptContent, ReceiptDetails, ReceiptFilters, ReceiptFooter, ReceiptHeader, ReceiptInfos, ReceiptItem, ReceiptItems, ReceiptPDF, ReceiptsDisplayOptions, ReceiptsFiled, ReceiptsHeader, ReceiptsInfo, ReceiptsReceivedContent, RecipientForm, RecipientsToShare, RecipientTab, RecordsInputs, ResendResetPassword, ResetPassword, ReviewBanner, RightPanel, RolePermissionsTab, RoomHeader, RoomsBoardTour, RoomsMenu, RoomsMenuMobile, RoomStep, RoomVideo, SalesTax, SatisfactionTile, SearchItemLoader, SearchRecords, SectionHeader, SendCommunication, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, SkeletonBox, StepHeader, StorageUsed, Subscription, SubscriptionCard, SubscriptionTable, Summary, TabsHeader, TextInput, ToBeDeletedBody, ToBeDeletedContent, ToBeDeletedFooter, ToBeDeletedHeader, TourButton, Trash, TrendingValue, TrialBanner, TutorialsButton, TwoFactor, TwoFactorSetting, UpdateList, UserDetails, ValueMonitor, VideoPlayer, VideoPlayerModal, ViewContactPanel, WeatherWidget, WellDone, WizardStepGoal, WizardSuccessHeader, WizardTextHeader, WizardValueSummary, WizardValueSummaryBody, WizardValueSummaryFooter, YtdTile, } from './components';
2
2
  export { useCustomToast, useConfirmPropertyModel } from './hooks';
3
3
  export { randomColor, mapApiObjectToFormFields, mapForecastToWidget, } from './utils';
4
4
  export { CookTop, Contacts, GuestBedroom, MagnifyingGlassReport, Message, Register, Receipts, Price, BlueFolderShared, Calendar, Create, Notes, WallDecor, } from './assets/images';
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPopup, AddPropertyRecords, Address, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackendAlert, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ConfirmProperty, ConfirmPropertyBody, ConfirmPropertyFooter, ContactList, ContactsContent, ContainerHeader, ControlledWizard, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EditItemName, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeAssistantTutorial, HomeAssistantWizardPanel, HomeAssistantWizardSteps, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeItemList, HomeItemManualInfo, HomeMonitor, HomeMonitorPanel, HomeMonitorSteps, HomeSharedWith, HomieAddItems, InboxForwardBanner, InboxTile, ItemFormPanel, ItemFormTabs, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadReceiptPanel, LaunchpadTour, LeftPanel, Loading, MediaDetailsStep, MessageChatPanel, MessagePanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewHomeDetails, NewPassword, NotBeChargedBanner, NotificationCard, Notifications, NotificationsPanel, NotificationsReminder, NpsScore, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, PaymentBanner, PaymentReceipts, PdfButton, PeopleConnected, ProfileDetailsTab, ProfilePaymentTab, ProjectList, PropertyRecords, PropertyTaxes, ReadOnlyDynamicForm, ReadOnlyImage, ReadOnlyToggle, ReceiptAutofiler, ReceiptBody, ReceiptContent, ReceiptDetails, ReceiptFilters, ReceiptFooter, ReceiptHeader, ReceiptInfos, ReceiptItem, ReceiptItems, ReceiptPDF, ReceiptsDisplayOptions, ReceiptsFiled, ReceiptsHeader, ReceiptsInfo, ReceiptsReceivedContent, RecipientForm, RecipientsToShare, RecipientTab, RecordsInputs, ResendResetPassword, ResetPassword, ReviewBanner, RightPanel, RolePermissionsTab, RoomHeader, RoomsBoardTour, RoomsMenu, RoomsMenuMobile, RoomStep, RoomVideo, SalesTax, SatisfactionTile, SearchItemLoader, SearchRecords, SectionHeader, SendCommunication, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, SkeletonBox, StepHeader, StorageUsed, Subscription, SubscriptionCard, SubscriptionTable, Summary, TabsHeader, TextInput, ToBeDeletedBody, ToBeDeletedContent, ToBeDeletedFooter, ToBeDeletedHeader, TourButton, Trash, TrendingValue, TrialBanner, TutorialsButton, TwoFactor, TwoFactorSetting, UpdateList, UserDetails, ValueMonitor, VideoPlayer, VideoPlayerModal, ViewContactPanel, WeatherWidget, WellDone, WizardStepGoal, WizardSuccessHeader, WizardTextHeader, WizardValueSummary, YtdTile, } from './components';
1
+ export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPopup, AddPropertyRecords, Address, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackendAlert, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ConfirmProperty, ConfirmPropertyBody, ConfirmPropertyFooter, ContactList, ContactsContent, ContainerHeader, ControlledWizard, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EditItemName, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeAssistantTutorial, HomeAssistantWizardPanel, HomeAssistantWizardSteps, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeItemList, HomeItemManualInfo, HomeMonitor, HomeMonitorPanel, HomeMonitorSteps, HomeSharedWith, HomieAddItems, InboxForwardBanner, InboxTile, ItemFormPanel, ItemFormTabs, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadReceiptPanel, LaunchpadTour, LeftPanel, Loading, MediaDetailsStep, MessageChatPanel, MessagePanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewHomeDetails, NewPassword, NotBeChargedBanner, NotificationCard, Notifications, NotificationsPanel, NotificationsReminder, NpsScore, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, PaymentBanner, PaymentReceipts, PdfButton, PeopleConnected, ProfileDetailsTab, ProfilePaymentTab, ProjectList, PropertyRecords, PropertyTaxes, ReadOnlyDynamicForm, ReadOnlyImage, ReadOnlyToggle, ReceiptAutofiler, ReceiptBody, ReceiptContent, ReceiptDetails, ReceiptFilters, ReceiptFooter, ReceiptHeader, ReceiptInfos, ReceiptItem, ReceiptItems, ReceiptPDF, ReceiptsDisplayOptions, ReceiptsFiled, ReceiptsHeader, ReceiptsInfo, ReceiptsReceivedContent, RecipientForm, RecipientsToShare, RecipientTab, RecordsInputs, ResendResetPassword, ResetPassword, ReviewBanner, RightPanel, RolePermissionsTab, RoomHeader, RoomsBoardTour, RoomsMenu, RoomsMenuMobile, RoomStep, RoomVideo, SalesTax, SatisfactionTile, SearchItemLoader, SearchRecords, SectionHeader, SendCommunication, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, SkeletonBox, StepHeader, StorageUsed, Subscription, SubscriptionCard, SubscriptionTable, Summary, TabsHeader, TextInput, ToBeDeletedBody, ToBeDeletedContent, ToBeDeletedFooter, ToBeDeletedHeader, TourButton, Trash, TrendingValue, TrialBanner, TutorialsButton, TwoFactor, TwoFactorSetting, UpdateList, UserDetails, ValueMonitor, VideoPlayer, VideoPlayerModal, ViewContactPanel, WeatherWidget, WellDone, WizardStepGoal, WizardSuccessHeader, WizardTextHeader, WizardValueSummary, WizardValueSummaryBody, WizardValueSummaryFooter, YtdTile, } from './components';
2
2
  export { useCustomToast, useConfirmPropertyModel } from './hooks';
3
3
  export { randomColor, mapApiObjectToFormFields, mapForecastToWidget, } from './utils';
4
4
  export { CookTop, Contacts, GuestBedroom, MagnifyingGlassReport, Message, Register, Receipts, Price, BlueFolderShared, Calendar, Create, Notes, WallDecor, } from './assets/images';
@@ -1,4 +1,5 @@
1
- export interface WizardValueSummaryProps {
1
+ export type WizardValueSummaryI = WizardValueSummaryBodyI & WizardValueSummaryFooterI;
2
+ export interface WizardValueSummaryBodyI {
2
3
  title: string;
3
4
  subtitle?: string;
4
5
  address: string;
@@ -7,8 +8,10 @@ export interface WizardValueSummaryProps {
7
8
  assessedValue: number;
8
9
  purchasePriceDetails: Record<string, string | undefined>;
9
10
  assessedValueDetails: Record<string, string | undefined>;
11
+ }
12
+ export interface WizardValueSummaryFooterI {
10
13
  onAccurate: () => void;
11
14
  onNotAccurate: () => void;
12
- onComplete?: () => void;
15
+ onComplete: () => void;
13
16
  accuracyStatus?: 'accurate' | 'not-accurate' | null;
14
17
  }
@@ -7,10 +7,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
7
7
  step((generator = generator.apply(thisArg, _arguments || [])).next());
8
8
  });
9
9
  };
10
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
10
+ import { jsx as _jsx } from "react/jsx-runtime";
11
11
  import { useState } from 'react';
12
- import { ControlledWizard, DynamicForm, FooterButtons, HomeAssistantTutorial, HomeAssistantWizardSteps, SearchRecords, WizardTextHeader, WizardSuccessHeader, WizardValueSummary, NewHomeDetails, ConfirmHomeDetails, ConfirmPropertyBody, ConfirmPropertyFooter, } from '../../components';
13
- import { Box, Center, Stack } from '@chakra-ui/react';
12
+ import { ControlledWizard, DynamicForm, FooterButtons, HomeAssistantTutorial, HomeAssistantWizardSteps, SearchRecords, WizardTextHeader, WizardSuccessHeader, NewHomeDetails, ConfirmHomeDetails, ConfirmPropertyBody, ConfirmPropertyFooter, WizardValueSummaryBody, WizardValueSummaryFooter, WizardBodyPadding, } from '../../components';
13
+ import { Box, Center, Flex } from '@chakra-ui/react';
14
14
  import { action } from '@storybook/addon-actions';
15
15
  import { assessedValueMock, homeWizardForm, propertiesMock, purchasePriceMock, } from '../../mocks';
16
16
  import { formValues } from '../../helpers';
@@ -19,7 +19,7 @@ export default {
19
19
  title: 'Components/Wizard/ControlledWizard',
20
20
  component: ControlledWizard,
21
21
  decorators: [
22
- (story) => (_jsx(Box, { maxW: "600px", mx: "auto", children: story() })),
22
+ (story) => (_jsx(Box, { maxW: "700px", mx: "auto", children: story() })),
23
23
  ],
24
24
  };
25
25
  function fakeLookup() {
@@ -36,20 +36,22 @@ export const ControlledWizardComponent = () => {
36
36
  });
37
37
  const homeAssistantSteps = homeWizardForm.map((form, index) => ({
38
38
  header: _jsx(HomeAssistantWizardSteps, { currentStep: index + 1 }),
39
- body: () => (_jsxs(Stack, { h: "full", spacing: "10", w: { base: 'full', md: '600px' }, justify: "space-around", m: "auto", children: [_jsx(DynamicForm, { form: [form], showTitle: false, callback: action('DynamicForm') }), _jsx(Box, { alignSelf: "flex-end", children: _jsx(FooterButtons, { button1: {
40
- buttonStyle: 'secondaryFooter',
41
- onClick: () => setStep(step - 1),
42
- label: 'Back',
43
- }, button2: {
44
- buttonStyle: 'tertiaryFooter',
45
- onClick: () => setStep(step + 1),
46
- label: 'Next',
47
- } }) })] })),
39
+ body: () => (_jsx(Box, { pt: "4", children: _jsx(DynamicForm, { form: [form], showTitle: false, callback: action('DynamicForm') }) })),
40
+ footer: (_jsx(Flex, { w: "full", justify: "flex-end", children: _jsx(Box, { children: _jsx(FooterButtons, { button1: {
41
+ buttonStyle: 'secondaryFooter',
42
+ onClick: () => setStep(step - 1),
43
+ label: 'Back',
44
+ }, button2: {
45
+ buttonStyle: 'tertiaryFooter',
46
+ onClick: () => setStep(step + 1),
47
+ isDisabled: step === homeWizardForm.length + 4,
48
+ label: 'Next',
49
+ } }) }) })),
48
50
  }));
49
51
  return (_jsx(ControlledWizard, { height: "700px", step: step, setStep: setStep, steps: [
50
52
  {
51
53
  header: (_jsx(WizardTextHeader, { title: "Welcome to Homefile John.", subtitle: "We\u2019re about to make owning your home dramatically easier. Answer a few quick questions and we\u2019ll handle everything that usually slips through the cracks." })),
52
- body: () => _jsx(NewHomeDetails, { values: formValues }),
54
+ body: () => (_jsx(WizardBodyPadding, { children: _jsx(NewHomeDetails, { values: formValues }) })),
53
55
  footer: (_jsx(ConfirmHomeDetails, { handleCreateHomeClick: (values) => __awaiter(void 0, void 0, void 0, function* () {
54
56
  setStep(1);
55
57
  yield fakeLookup();
@@ -63,22 +65,23 @@ export const ControlledWizardComponent = () => {
63
65
  },
64
66
  {
65
67
  header: (_jsx(WizardTextHeader, { title: `This is the data we found \n in public records.`, subtitle: "Details may not represent the most up-to-date info about your home." })),
66
- body: () => (_jsx(ConfirmPropertyBody, { isWizard: true, properties: confirmModel.propertiesWithNoneOfTheAbove, currentProperty: confirmModel.currentProperty, onChange: confirmModel.setCurrentProperty, footerText: confirmModel.footerText })),
68
+ body: () => (_jsx(WizardBodyPadding, { children: _jsx(ConfirmPropertyBody, { isWizard: true, properties: confirmModel.propertiesWithNoneOfTheAbove, currentProperty: confirmModel.currentProperty, onChange: confirmModel.setCurrentProperty, footerText: confirmModel.footerText }) })),
67
69
  footer: (_jsx(ConfirmPropertyFooter, { isWizard: true, onContinue: confirmModel.handleContinue, isLoading: false, label: "Confirm" })),
68
70
  },
69
71
  {
70
72
  header: (_jsx(WizardTextHeader, { title: `This is the data we \n found in public records.`, subtitle: "The details linked to your address come from public data sources and may not represent the most up-to-date information about your home." })),
71
- body: ({ setStep }) => (_jsx(WizardValueSummary, { title: "The Edmunds", address: "113 South First Street, Austin TX 89853", estimatedValue: 894000, purchasePrice: 456432, assessedValue: 726678, purchasePriceDetails: purchasePriceMock, assessedValueDetails: assessedValueMock, onAccurate: () => setStep(step + 1), onNotAccurate: () => setStep(step + 1) })),
73
+ body: ({ setStep }) => (_jsx(WizardBodyPadding, { children: _jsx(WizardValueSummaryBody, { title: "The Edmunds", address: "113 South First Street, Austin TX 89853", estimatedValue: 894000, purchasePrice: 456432, assessedValue: 726678, purchasePriceDetails: purchasePriceMock, assessedValueDetails: assessedValueMock }) })),
74
+ footer: (_jsx(WizardValueSummaryFooter, { onAccurate: () => setStep(step + 1), onNotAccurate: () => setStep(step + 1), onComplete: () => setStep(step + 1), accuracyStatus: null })),
72
75
  },
73
76
  {
74
- header: (_jsx(WizardSuccessHeader, { title: "Your homefile has been created.", subtitle: "Your Homefile is created. You will be able to edit and update your home details once setup is complete.", address: {
77
+ header: (_jsx(WizardSuccessHeader, { title: "Your Homefile is live.", subtitle: "Now let\u2019s set up Homi so you never guess, never search, and never get blindsided again.", address: {
75
78
  city: 'Austin',
76
79
  state: 'Texas',
77
80
  street: 'Ronald Regan long name st here',
78
81
  number: '123',
79
82
  zip: '80123',
80
83
  }, name: "your home" })),
81
- body: () => (_jsx(Center, { w: "full", h: "full", children: _jsx(HomeAssistantTutorial, { onStart: () => setStep(step + 1) }) })),
84
+ body: () => (_jsx(Center, { h: "full", children: _jsx(HomeAssistantTutorial, { onStart: () => setStep(step + 1) }) })),
82
85
  },
83
86
  ...homeAssistantSteps,
84
87
  ] }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homefile/components-v2",
3
- "version": "2.39.24",
3
+ "version": "2.39.26",
4
4
  "author": "Homefile",
5
5
  "license": "UNLICENSED",
6
6
  "typings": "dist/index.d.ts",