@homefile/components-v2 2.39.20 → 2.39.22

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

@@ -548,6 +548,7 @@
     },
     "form": {
       "externalLink": "Add optional external link",
+      "homeName": "Name your home",
       "name": "Name or Project Number",
       "projectName": "Create Name or Project Number",
       "required": "is required"
@@ -582,8 +583,8 @@
       "subtitle": "We are currently searching public records"
     },
     "select": {
-      "description": "Homefile will search for and locate public records related to your property, such as tax records and purchase information. This can provide you with a better understanding of your property’s value and the related information. The information we locate may not be the most current.",
-      "include": "Select to include a public records search of your home.",
+      "description": "We’ll pull basic property info from county records—such as lot size, purchase price, and tax history. This is all publicly searchable data; we save you the hassle of manual entry. ",
+      "include": "Add public property records to your homefile.",
       "title": "Select option",
       "option1": "Active homes",
       "option2": "Inactive homes"

package/dist/components/myHomes/IncludePublicRecords.js

@@ -2,5 +2,5 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { t } from 'i18next';
 import { Box, Checkbox, Flex, Stack, Text } from '@chakra-ui/react';
 export const IncludePublicRecords = ({ isChecked, onSelectRecords, }) => {
-    return (_jsx(Box, { borderRadius: "sm", bg: "lightViolet.1", p: "base", children: _jsxs(Flex, { gap: "base", align: "start", children: [_jsx(Checkbox, { isChecked: isChecked, onChange: onSelectRecords }), _jsxs(Stack, { children: [_jsx(Text, { fontFamily: "secondary", children: t('myHomes.select.include') }), _jsx(Text, { variant: "home", color: "gray.2", children: t('myHomes.select.description') })] })] }) }));
+    return (_jsx(Box, { borderRadius: "md", bg: "lightViolet.1", p: "base", children: _jsxs(Flex, { gap: "base", align: "start", children: [_jsx(Checkbox, { isChecked: isChecked, onChange: onSelectRecords }), _jsxs(Stack, { children: [_jsx(Text, { fontFamily: "secondary", children: t('myHomes.select.include') }), _jsx(Text, { variant: "home", color: "gray.2", children: t('myHomes.select.description') })] })] }) }));
 };

package/dist/components/myHomes/WrapperWithShadow.d.ts

@@ -1,3 +1,3 @@
 import { PropsWithChildren } from 'react';
 import { WrapperWithShadowI } from '../../interfaces';
-export declare const WrapperWithShadow: ({ animation, children, fadeDelay, isWizard, }: PropsWithChildren<WrapperWithShadowI>) => import("react/jsx-runtime").JSX.Element;
+export declare const WrapperWithShadow: ({ animation, children, fadeDelay, isWizard, padding, pb, }: PropsWithChildren<WrapperWithShadowI>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/myHomes/WrapperWithShadow.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Stack, Fade } from '@chakra-ui/react';
-export const WrapperWithShadow = ({ animation, children, fadeDelay = 0.3, isWizard = false, }) => {
+export const WrapperWithShadow = ({ animation, children, fadeDelay = 0.3, isWizard = false, padding = 'base', pb = '3rem', }) => {
     const styles = isWizard
         ? {}
         : {
@@ -10,5 +10,5 @@ export const WrapperWithShadow = ({ animation, children, fadeDelay = 0.3, isWiza
             h: 'full',
             overflowY: 'scroll',
         };
-    return (_jsx(Stack, Object.assign({}, styles, { w: "full", spacing: "base", p: "base", pb: "3rem", children: _jsx(Fade, { delay: fadeDelay, in: true, children: children }) })));
+    return (_jsx(Stack, Object.assign({}, styles, { w: "full", spacing: "base", p: padding, pb: pb, children: _jsx(Fade, { delay: fadeDelay, in: true, children: children }) })));
 };

package/dist/components/myHomes/steps/ConfirmProperty.js

@@ -30,7 +30,7 @@ export const ConfirmProperty = ({ handleAddress = () => { }, isFirstHome, isLoad
         handleAddress === null || handleAddress === void 0 ? void 0 : handleAddress(currentProperty);
     };
     if (isWizard) {
-        return (_jsxs(Stack, { children: [_jsxs(Stack, { align: "center", borderRadius: "sm", w: "100%", py: "4", children: [_jsx(PropertyCards, { properties: propertiesWithNoneOfTheAbove, currentProperty: currentProperty, onChange: setCurrentProperty }), _jsx(Box, { px: "6", children: _jsx(Text, { variant: "home", textAlign: "center", children: footerText }) })] }), _jsx(Button, { onClick: handleContinue, disabled: isLoading, children: t('buttons.continue') })] }));
+        return (_jsxs(Stack, { spacing: "4", children: [_jsxs(Stack, { align: "center", w: "full", spacing: "base", children: [_jsx(PropertyCards, { properties: propertiesWithNoneOfTheAbove, currentProperty: currentProperty, onChange: setCurrentProperty }), _jsx(Box, { children: _jsx(Text, { variant: "home", textAlign: "center", children: footerText }) })] }), _jsx(Button, { onClick: handleContinue, disabled: isLoading, variant: "wizard", children: t('buttons.confirm') })] }));
     }
     return (_jsx(MyHomesStepWrapper, { isFirstHome: isFirstHome, children: _jsxs(MyHomesStepBody, { fadeDelay: 0, title: t('myHomes.properties.title'), subtitle: t('myHomes.properties.subtitle'), children: [_jsxs(Stack, { align: "center", bg: "lightViolet.1", borderRadius: "sm", w: "100%", py: "6", children: [_jsx(PropertyCards, { properties: propertiesWithNoneOfTheAbove, currentProperty: currentProperty, onChange: setCurrentProperty }), _jsx(Box, { px: "6", children: _jsx(Text, { variant: "home", textAlign: "center", children: footerText }) })] }), _jsx(Button, { onClick: handleContinue, disabled: isLoading, children: t('buttons.continue') })] }) }));
 };

package/dist/components/myHomes/steps/NewHomeDetails.d.ts

@@ -0,0 +1,2 @@
+import { AddHomeContentI } from '../../../interfaces';
+export declare const NewHomeDetails: ({ handleCreateHomeClick, values, isLoading, }: AddHomeContentI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/myHomes/steps/NewHomeDetails.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useSnapshot } from 'valtio';
+import { t } from 'i18next';
+import { Stack, Center, Flex, Button, Divider, } from '@chakra-ui/react';
+import { AddressStored, TextInput, IncludePublicRecords, WrapperWithShadow, } from '../../../components';
+import { firstHomeProxy } from '../../../proxies';
+import { useAddHouseContent } from '../../../hooks';
+import { BeatLoader } from 'react-spinners';
+import { up } from './MyHomeDetails';
+export const NewHomeDetails = ({ handleCreateHomeClick, values, isLoading, }) => {
+    const { handleErrorMessage, handleNameChange, handleNameValidation, handleSelectRecords, handleSubmit, } = useAddHouseContent(values, handleCreateHomeClick);
+    const { name, isNameValid, searchRecords } = useSnapshot(firstHomeProxy, {
+        sync: true,
+    });
+    return (_jsxs(Stack, { spacing: "base", children: [isLoading && (_jsx(Center, { h: "4rem", children: _jsx(BeatLoader, { color: "gray", size: 8 }) })), !isLoading && (_jsxs(Stack, { spacing: "base", children: [_jsx(TextInput, { errorMessage: handleErrorMessage(), hasError: !isNameValid, id: "homeName", placeholder: t('myHomes.form.homeName'), handleChange: handleNameChange, onBlurCapture: handleNameValidation, value: name }), _jsx(Divider, { borderStyle: "dashed", borderColor: "lightBlue.6" }), _jsx(AddressStored, {})] })), _jsx(WrapperWithShadow, { animation: up, fadeDelay: 0.2, isWizard: true, padding: "0", pb: "0", children: _jsx(Flex, { direction: "column", justify: "space-between", gap: "10", h: "full", children: _jsxs(Stack, { spacing: "4", children: [_jsx(IncludePublicRecords, { isChecked: searchRecords, onSelectRecords: handleSelectRecords }), _jsx(Button, { onClick: handleSubmit, disabled: isLoading, variant: "wizard", children: t('buttons.confirm') })] }) }) })] }));
+};

package/dist/components/myHomes/steps/PropertyCards.js

@@ -12,8 +12,8 @@ export const PropertyCards = ({ properties, currentProperty, onChange, }) => {
     const hasProperties = ((_a = properties === null || properties === void 0 ? void 0 : properties.length) !== null && _a !== void 0 ? _a : 0) > 0;
     if (!hasProperties)
         return null;
-    return (_jsx(Stack, Object.assign({}, group, { spacing: "base", p: "6", w: "100%", children: properties === null || properties === void 0 ? void 0 : properties.map(({ id, address: { address } }) => {
+    return (_jsx(Stack, Object.assign({}, group, { spacing: "1", w: "full", children: properties === null || properties === void 0 ? void 0 : properties.map(({ id, address: { address } }) => {
             const radio = getRadioProps({ value: id });
-            return (_jsx(RadioCard, Object.assign({}, radio, { children: _jsx(Text, { fontSize: "sm", children: address }) }), id));
+            return (_jsx(RadioCard, Object.assign({}, radio, { children: _jsx(Text, { children: address }) }), id));
         }) })));
 };

package/dist/components/myHomes/steps/index.d.ts

@@ -4,4 +4,5 @@ export * from './MyHomesStepBody';
 export * from './SearchRecords';
 export * from './MyHomesStepHeader';
 export * from './MyHomesStepWrapper';
+export * from './NewHomeDetails';
 export * from './PropertyCards';

package/dist/components/myHomes/steps/index.js

@@ -4,4 +4,5 @@ export * from './MyHomesStepBody';
 export * from './SearchRecords';
 export * from './MyHomesStepHeader';
 export * from './MyHomesStepWrapper';
+export * from './NewHomeDetails';
 export * from './PropertyCards';

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

@@ -1,2 +1,2 @@
 import { ControlledWizardI } from '../../interfaces';
-export declare function ControlledWizard({ step, setStep, steps, minHeight, headerBlink, }: ControlledWizardI): import("react/jsx-runtime").JSX.Element;
+export declare function ControlledWizard({ bodyWidth, step, setStep, steps, height, headerBlink, }: ControlledWizardI): import("react/jsx-runtime").JSX.Element;

package/dist/components/wizard/ControlledWizard.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Stack } from '@chakra-ui/react';
+import { Box, Flex, Stack } from '@chakra-ui/react';
 import { AnimatePresence, motion } from 'framer-motion';
 const MotionBox = motion.create(typeof Box);
-export function ControlledWizard({ step, setStep, steps, minHeight = '770px', headerBlink, }) {
+export function ControlledWizard({ bodyWidth = '80%', step, setStep, steps, height = '700px', headerBlink, }) {
     const current = steps[step];
     const headerVariants = {
         initial: { opacity: 0, y: 8 },
@@ -16,5 +16,5 @@ export function ControlledWizard({ step, setStep, steps, minHeight = '770px', he
         animate: { opacity: 1, y: 0, scale: 1 },
         exit: { opacity: 0, y: -8, scale: 0.98 },
     };
-    return (_jsxs(Stack, { spacing: "0", shadow: "md", minH: minHeight, bg: "white", children: [_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: headerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", 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", children: _jsx(Box, { w: "full", p: { base: 4, md: 6 }, children: current.body({ setStep }) }) }, `b-${step}`) })] }));
+    return (_jsxs(Stack, { spacing: { base: '4', md: '8' }, shadow: "md", h: height, bg: "white", overflowY: "hidden", pb: { base: '8', md: '16' }, children: [_jsx(AnimatePresence, { mode: "wait", children: _jsx(Box, { as: MotionBox, variants: headerVariants, initial: "initial", animate: "animate", exit: "exit", w: "full", 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: "1", overflowY: "auto", minH: "0", align: "center", children: _jsx(Box, { w: bodyWidth, children: current.body({ setStep }) }) }) }, `b-${step}`) })] }));
 }

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

@@ -1,2 +1,2 @@
 import { WizardTextHeaderI } from '../../interfaces';
-export declare const WizardTextHeader: ({ title, subtitle }: WizardTextHeaderI) => import("react/jsx-runtime").JSX.Element;
+export declare const WizardTextHeader: ({ title, subtitle, width, }: WizardTextHeaderI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/wizard/WizardTextHeader.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Center, Show, Stack, Text, Box } from '@chakra-ui/react';
 import { Logo } from '../../components';
-export const WizardTextHeader = ({ title, subtitle }) => {
-    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(Stack, { spacing: "6", w: "80%", children: [_jsx(Text, { fontSize: { base: '2xl', md: '3xl' }, lineHeight: { base: 'shorter', md: 'base' }, textAlign: "center", children: title }), subtitle && (_jsx(Text, { fontFamily: "secondary", textAlign: "center", children: subtitle })), _jsx(Show, { below: "md", children: _jsx(Box, { h: "6" }) })] })] }) }));
+export const WizardTextHeader = ({ title, subtitle, width = '80%', }) => {
+    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(Stack, { spacing: "6", w: width, children: [_jsx(Text, { fontSize: { base: '22px', md: '26px' }, lineHeight: { base: '26px', md: '30px' }, textAlign: "center", whiteSpace: "pre-wrap", children: title }), subtitle && (_jsx(Text, { fontFamily: "secondary", textAlign: "center", whiteSpace: "pre-wrap", children: subtitle })), _jsx(Show, { below: "md", children: _jsx(Box, { h: "6" }) })] })] }) }));
 };

package/dist/components/wizard/WizardValueSummary.js

@@ -4,5 +4,5 @@ import { Stack, Text, Flex, Divider, Button } from '@chakra-ui/react';
 import { TrendingValueCard, RecordsSession, ReactionTag } from '../../components';
 export const WizardValueSummary = ({ title, subtitle, address, estimatedValue, purchasePrice, assessedValue, purchasePriceDetails, assessedValueDetails, onAccurate, onNotAccurate, onComplete, accuracyStatus, }) => {
     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: "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') })] }));
+    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') })] }));
 };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BackendAlert, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, 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, HomeAssistantWizardPanel, 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, MessagePanel, MessageChatPanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, 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, SectionHeader, SendCommunication, SearchItemLoader, 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, ViewContactPanel, VideoPlayer, VideoPlayerModal, WeatherWidget, WellDone, YtdTile, WizardStepGoal, WizardTextHeader, WizardValueSummary, } from './components';
+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, 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';
 export { useCustomToast } from './hooks';
 export { randomColor, mapApiObjectToFormFields, mapForecastToWidget, } from './utils';
 export { CookTop, Contacts, GuestBedroom, MagnifyingGlassReport, Message, Register, Receipts, Price, BlueFolderShared, Calendar, Create, Notes, WallDecor, } from './assets/images';

package/dist/index.js

@@ -1,4 +1,4 @@
-export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AddToHomefile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BackendAlert, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, 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, HomeAssistantWizardPanel, 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, MessagePanel, MessageChatPanel, MinimizedTiles, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, 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, SectionHeader, SendCommunication, SearchItemLoader, 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, ViewContactPanel, VideoPlayer, VideoPlayerModal, WeatherWidget, WellDone, YtdTile, WizardStepGoal, WizardTextHeader, WizardValueSummary, } from './components';
+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, 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';
 export { useCustomToast } from './hooks';
 export { randomColor, mapApiObjectToFormFields, mapForecastToWidget, } from './utils';
 export { CookTop, Contacts, GuestBedroom, MagnifyingGlassReport, Message, Register, Receipts, Price, BlueFolderShared, Calendar, Create, Notes, WallDecor, } from './assets/images';

package/dist/interfaces/myHomes/WrapperWithShadow.interface.d.ts

@@ -2,4 +2,6 @@ export interface WrapperWithShadowI {
     animation?: string;
     fadeDelay?: number;
     isWizard?: boolean;
+    padding?: string;
+    pb?: string;
 }

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

@@ -9,6 +9,7 @@ export interface ControlledWizardI {
     step: number;
     setStep: (i: number) => void;
     steps: WizardStep[];
-    minHeight?: string | number;
+    height?: string | number;
+    bodyWidth?: string | number;
     headerBlink?: boolean;
 }

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

@@ -2,4 +2,5 @@ export interface WizardTextHeaderI {
     title: string;
     subtitle?: string;
     style?: 'wizard' | 'panel';
+    width?: string;
 }

package/dist/stories/wizard/ControlledWizard.stories.js

@@ -9,16 +9,16 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-import { ConfirmProperty, ControlledWizard, DynamicForm, FooterButtons, HomeAssistantTutorial, HomeAssistantWizardSteps, MyHomeDetails, SearchRecords, WizardTextHeader, WizardSuccessHeader, WizardValueSummary, } from '../../components';
+import { ConfirmProperty, ControlledWizard, DynamicForm, FooterButtons, HomeAssistantTutorial, HomeAssistantWizardSteps, SearchRecords, WizardTextHeader, WizardSuccessHeader, WizardValueSummary, NewHomeDetails, } from '../../components';
 import { Box, Center, Stack } from '@chakra-ui/react';
 import { action } from '@storybook/addon-actions';
-import { formValues } from '../../helpers';
 import { assessedValueMock, homeWizardForm, propertiesMock, purchasePriceMock, } from '../../mocks';
+import { formValues } from '../../helpers';
 export default {
     title: 'Components/Wizard/ControlledWizard',
     component: ControlledWizard,
     decorators: [
-        (story) => (_jsx(Box, { maxW: "800px", mx: "auto", children: story() })),
+        (story) => (_jsx(Box, { maxW: "600px", mx: "auto", children: story() })),
     ],
 };
 function fakeLookup() {
@@ -38,10 +38,10 @@ export const ControlledWizardComponent = () => {
                             label: 'Next',
                         } }) })] })),
     }));
-    return (_jsx(ControlledWizard, { minHeight: "700px", step: step, setStep: setStep, steps: [
+    return (_jsx(ControlledWizard, { height: "700px", step: step, setStep: setStep, steps: [
             {
-                header: (_jsx(WizardTextHeader, { title: "Hi John, let\u2019s get your Homefile set up.", subtitle: "Complete this quick setup and we\u2019ll handle the rest." })),
-                body: ({ setStep }) => (_jsx(MyHomeDetails, { isWizard: true, userFirstName: "Adam", values: formValues, properties: propertiesMock, handleCreateHomeClick: (values) => __awaiter(void 0, void 0, void 0, function* () {
+                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." })),
+                body: ({ setStep }) => (_jsx(NewHomeDetails, { values: formValues, handleCreateHomeClick: (values) => __awaiter(void 0, void 0, void 0, function* () {
                         setStep(1);
                         yield fakeLookup();
                         setStep(2);
@@ -52,13 +52,13 @@ export const ControlledWizardComponent = () => {
                 body: () => _jsx(SearchRecords, { isWizard: true }),
             },
             {
-                header: (_jsx(WizardTextHeader, { title: "This is the data we found in public records.", subtitle: "Details may not represent the most up-to-date info about your home." })),
-                body: () => (_jsx(ConfirmProperty, { isWizard: true, properties: [propertiesMock[0]], handleAddress: () => {
+                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." })),
+                body: () => (_jsx(ConfirmProperty, { isWizard: true, properties: propertiesMock, handleAddress: () => {
                         setStep(3);
                     } })),
             },
             {
-                header: (_jsx(WizardTextHeader, { title: "This is the data we found in public records.", subtitle: "The details linked to your address come from public data sources and may not \nrepresent the most up-to-date information about your home." })),
+                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." })),
                 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) })),
             },
             {

package/dist/theme/components/ButtonStyles.d.ts

@@ -393,6 +393,28 @@ export declare const Button: {
                 backgroundColor: string;
             };
         };
+        wizard: {
+            fontSize: string;
+            h: string;
+            fontWeight: string;
+            borderRadius: string;
+            boxShadow: string;
+            color: string;
+            backgroundColor: string;
+            _disabled: {
+                filter: string;
+                pointerEvents: string;
+            };
+            _active: {
+                backgroundColor: string;
+                borderRadius: string;
+                fontWeight: string;
+                boxShadow: string;
+            };
+            _hover: {
+                boxShadow: string;
+            };
+        };
     };
     defaultProps: {
         size: string;

package/dist/theme/components/ButtonStyles.js

@@ -393,6 +393,28 @@ export const Button = {
                 backgroundColor: 'lightGreen.3',
             },
         },
+        wizard: {
+            fontSize: 'lg',
+            h: 'button.xs',
+            fontWeight: 'medium',
+            borderRadius: 'none',
+            boxShadow: 'base',
+            color: 'neutral.white',
+            backgroundColor: 'blue.2',
+            _disabled: {
+                filter: 'grayscale(100%)',
+                pointerEvents: 'none',
+            },
+            _active: {
+                backgroundColor: 'blue.3',
+                borderRadius: 'lg',
+                fontWeight: 'medium',
+                boxShadow: 'none',
+            },
+            _hover: {
+                boxShadow: 'xl',
+            },
+        },
     },
     defaultProps: {
         size: 'full',

package/package.json

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