@homefile/components-v2 2.7.0 → 2.7.1

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

@@ -0,0 +1,2 @@
+import { HomeDetailsContentI } from '../../interfaces';
+export declare const HomeDetailsContent: ({ ...props }: HomeDetailsContentI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/myHomes/HomeDetailsContent.js

@@ -0,0 +1,21 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { t } from 'i18next';
+import { Box, DrawerContent, DrawerHeader, DrawerBody } from '@chakra-ui/react';
+import { PanelHeader, Loading, HomeCard, FooterDrawer } from '..';
+import { House } from '../../assets/images';
+export const HomeDetailsContent = (_a) => {
+    var props = __rest(_a, []);
+    const { handleClose, isLoading, children, showFooter, footerButtons } = props;
+    return (_jsxs(DrawerContent, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { icon: House, handleCloseButton: handleClose, title: t("myHomes.details.header") }) }), _jsx(DrawerBody, { padding: "0 0 6rem 0", bg: "#F4F7F8", children: _jsxs(Box, { children: [isLoading ? (_jsx(Loading, {})) : (_jsxs(_Fragment, { children: [_jsx(HomeCard, Object.assign({}, props)), children] })), _jsx(FooterDrawer, { isOpen: showFooter, children: footerButtons })] }) })] }));
+};

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

@@ -7,3 +7,4 @@ export * from './steps';
 export * from './MyHomeCard';
 export * from './MyHomes';
 export * from './WrapperWithShadow';
+export * from './HomeDetailsContent';

package/dist/components/myHomes/index.js

@@ -7,3 +7,4 @@ export * from './steps';
 export * from './MyHomeCard';
 export * from './MyHomes';
 export * from './WrapperWithShadow';
+export * from './HomeDetailsContent';

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ContactList, ContactsContent, ContainerHeader, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomefileMonitoring, HomeHeader, HomeMonitor, HomeMonitorSteps, HomeSharedWith, InboxForwardBanner, InboxTile, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadTour, LeftPanel, MediaDetailsStep, MessagePanel, MessageChatPanel, MonitorAlerts, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, 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, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, 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, WellDone, YtdTile, } from './components';
+export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ContactList, ContactsContent, ContainerHeader, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeMonitor, HomeMonitorSteps, HomeSharedWith, InboxForwardBanner, InboxTile, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadTour, LeftPanel, MediaDetailsStep, MessagePanel, MessageChatPanel, MonitorAlerts, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, 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, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, 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, WellDone, YtdTile, } from './components';
 export { useCustomToast } from './hooks';
 export { randomColor } from './utils';
 export { billingProxy, dynamicFormProxy, homeCardProxy, partnerContentProxy, partnerDetailsProxy, paymentMethodProxy, recordsInputsProxy, recordsInputsToDBProxy, userDetailsProxy, confirmAddressProxy, } from './proxies';

package/dist/index.js

@@ -1,4 +1,4 @@
-export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ContactList, ContactsContent, ContainerHeader, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomefileMonitoring, HomeHeader, HomeMonitor, HomeMonitorSteps, HomeSharedWith, InboxForwardBanner, InboxTile, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadTour, LeftPanel, MediaDetailsStep, MessagePanel, MessageChatPanel, MonitorAlerts, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, 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, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, 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, WellDone, YtdTile, } from './components';
+export { ActivateAccount, ActiveSubscription, AddCardBanner, AddEditContactPanel, AddFolder, AddHomeContent, AddHomeItem, AddHomeItemHeader, AddMedia, AddPropertyRecords, Address, AddPopup, AddTile, AlertBanner, AphwTile, AppBar, AssignableReceipts, BackHeader, BarDivider, CancelAccount, CatalogPopup, CloudsAnimation, ContactList, ContactsContent, ContainerHeader, CreateDocumentHeader, CreateHouseholdItemHeader, CreditCardContainer, CreditCardError, CustomerTile, DeleteBanner, Dialog, DisplayFiles, DisplayFilesDetail, DisplayOptions, DisplayReceipts, DocumentMenu, DocumentNameHeader, DocumentPreview, DynamicForm, EditAccountType, EditHomeBody, EditHomeFooter, EditHomeHeader, EditHomePanel, EmailPermissions, EmailValidation, Feedback, FileDetail, FilesUploader, FlowStep, FolderDetail, FolderDetailBody, FolderDetailContent, FolderDetailFooter, FolderDetailHeader, FolderInfo, FolderSharing, FolderTypeSelection, FooterButtons, FooterDrawer, GenericBackHeader, GroupCard, GroupsContainer, GroupsHeader, Header, HelpContent, HomeAssistant, HomeAssistantPanel, HomeBoardGrid, HomeBoardTour, HomeCard, HomeCardWithRecipent, HomeDetailsContent, HomefileMonitoring, HomeHeader, HomeMonitor, HomeMonitorSteps, HomeSharedWith, InboxForwardBanner, InboxTile, ItemNameHeader, ItemsReviewBanner, ItemSubTypeSelect, Launchpad, LaunchpadAutofilerBanner, LaunchpadReceiptAutofiler, LaunchpadTour, LeftPanel, MediaDetailsStep, MessagePanel, MessageChatPanel, MonitorAlerts, MonthlyCharge, MortgageInfo, MoveModal, MyHomes, MyProfileBody, MyProfileContent, MyProfileFooter, MyProfileHeader, MyProfilePanel, NewCreditCard, NewCreditCardHeader, NewPassword, NotBeChargedBanner, Notifications, NotificationsReminder, NotificationsPanel, NotificationCard, Overlay, PanelHeader, PartnerActiveSubscription, PartnerCatalogPanel, PartnerContent, PartnerCustomerCode, PartnerDetails, PartnerImages, PartnerPanel, PasswordInput, 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, ShareContactsContent, SharedAccounts, SharedHomeContent, SharedHomeHeader, ShareHome, ShareHomeConnections, ShareHomeForm, ShineTile, ShortPartnerTile, SignIn, SignUp, 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, WellDone, YtdTile, } from './components';
 export { useCustomToast } from './hooks';
 export { randomColor } from './utils';
 export { billingProxy, dynamicFormProxy, homeCardProxy, partnerContentProxy, partnerDetailsProxy, paymentMethodProxy, recordsInputsProxy, recordsInputsToDBProxy, userDetailsProxy, confirmAddressProxy, } from './proxies';

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

@@ -0,0 +1,9 @@
+import { ReactElement, ReactNode } from "react";
+import { HomeCardI } from "../homeBoard";
+export interface HomeDetailsContentI extends HomeCardI {
+    children: ReactNode;
+    footerButtons: ReactElement[];
+    isLoading: boolean;
+    showFooter: boolean;
+    handleClose: () => void;
+}

package/dist/interfaces/myHomes/HomeDetails.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/myHomes/index.d.ts

@@ -8,3 +8,4 @@ export * from './MyHomesHeader.interface';
 export * from './WrapperWithShadow.interface';
 export * from './MyHomesStepBody.interface';
 export * from './PropertyCards.interface';
+export * from './HomeDetails.interface';

package/dist/interfaces/myHomes/index.js

@@ -8,3 +8,4 @@ export * from './MyHomesHeader.interface';
 export * from './WrapperWithShadow.interface';
 export * from './MyHomesStepBody.interface';
 export * from './PropertyCards.interface';
+export * from './HomeDetails.interface';

package/dist/stories/myHomes/HomeDetailsContent.stories.d.ts

@@ -0,0 +1,29 @@
+import { Meta } from '@storybook/react';
+import { HomeDetailsContentI } from '../../interfaces';
+declare const _default: Meta<HomeDetailsContentI>;
+export default _default;
+export declare const HomeDetailsContentComponent: {
+    (args: HomeDetailsContentI): import("react/jsx-runtime").JSX.Element;
+    args: {
+        apartmentNumber: string | undefined;
+        city: string;
+        name: string;
+        externalLink: string;
+        mail: string;
+        number: string | undefined;
+        obs: string | undefined;
+        street: string;
+        state: string;
+        zip: string;
+        imageUrl: null;
+        children: {
+            (args: import("../../interfaces").ShareHomeConnectionsI): import("react/jsx-runtime").JSX.Element;
+            args: {
+                recipients: import("../../interfaces").AssociatedAccountI[];
+            };
+        };
+        handleClose: () => null;
+        showFooter: boolean;
+        footerButtons: import("react/jsx-runtime").JSX.Element;
+    };
+};

package/dist/stories/myHomes/HomeDetailsContent.stories.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Drawer } from '@chakra-ui/react';
+import { HomeDetailsContent, FooterButtons } from '../../components';
+import { HomeCards, ButtonsFooter } from '../../helpers';
+import { ShareHomeConnectionsComponent } from '../sharedHomePanel/ShareHomeConnections.stories';
+const { name, image, address } = HomeCards[0];
+export default {
+    title: 'Components/MyHomes',
+    component: HomeDetailsContent,
+};
+export const HomeDetailsContentComponent = (args) => {
+    return (_jsx(Drawer, { placement: "right", onClose: () => null, isOpen: true, size: "md", children: _jsx(HomeDetailsContent, Object.assign({}, args)) }));
+};
+HomeDetailsContentComponent.args = {
+    apartmentNumber: address.apartmentNumber,
+    city: address.city,
+    name,
+    externalLink: 'https://www.google.com',
+    mail: 'user@user.com.br',
+    number: address.number,
+    obs: address.obs,
+    street: address.street,
+    state: address.state,
+    zip: address.zip,
+    imageUrl: image,
+    children: ShareHomeConnectionsComponent,
+    handleClose: () => null,
+    showFooter: true,
+    footerButtons: _jsx(FooterButtons, { button1: ButtonsFooter.button1 })
+};

package/package.json

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

package/src/components/myHomes/HomeDetailsContent.tsx

@@ -0,0 +1,43 @@
+import { t } from 'i18next'
+import { Box, DrawerContent, DrawerHeader, DrawerBody } from '@chakra-ui/react'
+import {
+  PanelHeader,
+  Loading,
+  HomeCard,
+  FooterDrawer
+} from '@/components'
+import { HomeDetailsContentI } from '@/interfaces'
+import { House } from '@/assets/images'
+
+export const HomeDetailsContent = ({...props}: HomeDetailsContentI) => {
+  const {handleClose, isLoading, children, showFooter, footerButtons} = props
+
+  return (
+    <DrawerContent>
+      <DrawerHeader p="0">
+        <PanelHeader
+          icon={House}
+          handleCloseButton={handleClose}
+          title={t("myHomes.details.header")}
+        />
+      </DrawerHeader>
+      <DrawerBody padding="0 0 6rem 0" bg={"#F4F7F8"}>
+        <Box>
+          {
+            isLoading ? (
+              <Loading />
+            ) : (
+              <>
+                <HomeCard {...props} />
+                {children}
+              </>
+            )
+          }
+          <FooterDrawer isOpen={showFooter}>
+            {footerButtons}
+          </FooterDrawer>
+        </Box>
+      </DrawerBody>
+    </DrawerContent>
+  )
+}

package/src/components/myHomes/index.ts

@@ -7,3 +7,4 @@ export * from './steps'
 export * from './MyHomeCard'
 export * from './MyHomes'
 export * from './WrapperWithShadow'
+export * from './HomeDetailsContent'

package/src/index.ts

@@ -72,6 +72,7 @@ export {
   HomeBoardTour,
   HomeCard,
   HomeCardWithRecipent,
+  HomeDetailsContent,
   HomefileMonitoring,
   HomeHeader,
   HomeMonitor,

package/src/interfaces/myHomes/HomeDetails.interface.ts

@@ -0,0 +1,10 @@
+import {  ReactElement, ReactNode } from "react"
+import { HomeCardI } from "../homeBoard";
+
+export interface HomeDetailsContentI extends HomeCardI {
+    children: ReactNode
+    footerButtons: ReactElement[]
+    isLoading: boolean
+    showFooter: boolean
+    handleClose: () => void
+}

package/src/interfaces/myHomes/index.ts

@@ -8,3 +8,4 @@ export * from './MyHomesHeader.interface'
 export * from './WrapperWithShadow.interface'
 export * from './MyHomesStepBody.interface'
 export * from './PropertyCards.interface'
+export * from './HomeDetails.interface'

package/src/stories/myHomes/HomeDetailsContent.stories.tsx

@@ -0,0 +1,39 @@
+import { Meta } from '@storybook/react'
+import { Drawer } from '@chakra-ui/react'
+import { HomeDetailsContent, FooterButtons } from '@/components'
+import { HomeCards, ButtonsFooter } from '@/helpers'
+import { HomeDetailsContentI } from '@/interfaces'
+import { ShareHomeConnectionsComponent } from '../sharedHomePanel/ShareHomeConnections.stories'
+
+const { name, image, address } = HomeCards[0]
+
+export default {
+    title: 'Components/MyHomes',
+    component: HomeDetailsContent,
+} as Meta<HomeDetailsContentI>
+
+export const HomeDetailsContentComponent = (args: HomeDetailsContentI) => {
+    return (
+        <Drawer placement="right" onClose={() => null} isOpen size="md">
+            <HomeDetailsContent {...args} />
+        </Drawer>
+    )
+}
+
+HomeDetailsContentComponent.args = {
+    apartmentNumber: address.apartmentNumber,
+    city: address.city,
+    name,
+    externalLink: 'https://www.google.com',
+    mail: 'user@user.com.br',
+    number: address.number,
+    obs: address.obs,
+    street: address.street,
+    state: address.state,
+    zip: address.zip,
+    imageUrl: image,
+    children: ShareHomeConnectionsComponent,
+    handleClose: () => null,
+    showFooter: true,
+    footerButtons: <FooterButtons button1={ButtonsFooter.button1}/>
+}