@homefile/components-v2 2.4.0 → 2.6.0

package/dist/assets/images/book.svg

@@ -0,0 +1,25 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="36.229" height="25.49" viewBox="0 0 36.229 25.49">
+  <defs>
+    <clipPath id="clip-path">
+      <rect id="Rectangle_24874" data-name="Rectangle 24874" width="36.229" height="25.49" transform="translate(0 0)" fill="none"/>
+    </clipPath>
+  </defs>
+  <g id="Group_20984" data-name="Group 20984" transform="translate(0 0)">
+    <g id="Group_20983" data-name="Group 20983" transform="translate(0 0)" clip-path="url(#clip-path)">
+      <path id="Path_15109" data-name="Path 15109" d="M23.19,0V23.3A2.195,2.195,0,0,0,21,21.1H7.4V0Z" transform="translate(-5.076 0)" fill="#d2edef"/>
+      <path id="Path_15110" data-name="Path 15110" d="M59.866,21.1a2.194,2.194,0,0,0-2.191,2.2V0H73.461V21.1Z" transform="translate(-39.561 0)" fill="#d2edef"/>
+      <path id="Path_15111" data-name="Path 15111" d="M15.919,24.116H2.324V4.392H0V26.311H15.919A2.192,2.192,0,0,0,18.114,28.5V26.311a2.195,2.195,0,0,0-2.195-2.2" transform="translate(0 -3.013)" fill="#e24c5d"/>
+      <path id="Path_15112" data-name="Path 15112" d="M73.461,4.393V24.117H59.866a2.194,2.194,0,0,0-2.191,2.2V28.5a2.191,2.191,0,0,0,2.191-2.192H75.789V4.393Z" transform="translate(-39.561 -3.013)" fill="#cd4160"/>
+      <rect id="Rectangle_24864" data-name="Rectangle 24864" width="5.916" height="0.942" transform="translate(7.209 2.445)" fill="#40566b"/>
+      <rect id="Rectangle_24865" data-name="Rectangle 24865" width="10.4" height="0.942" transform="translate(4.965 7.581)" fill="#40566b"/>
+      <rect id="Rectangle_24866" data-name="Rectangle 24866" width="10.4" height="0.942" transform="translate(4.965 10.636)" fill="#40566b"/>
+      <rect id="Rectangle_24867" data-name="Rectangle 24867" width="10.4" height="0.942" transform="translate(4.965 13.689)" fill="#40566b"/>
+      <rect id="Rectangle_24868" data-name="Rectangle 24868" width="10.4" height="0.942" transform="translate(4.965 16.744)" fill="#40566b"/>
+      <rect id="Rectangle_24869" data-name="Rectangle 24869" width="10.4" height="0.942" transform="translate(20.807 7.581)" fill="#40566b"/>
+      <rect id="Rectangle_24870" data-name="Rectangle 24870" width="10.4" height="0.942" transform="translate(20.807 4.4)" fill="#40566b"/>
+      <rect id="Rectangle_24871" data-name="Rectangle 24871" width="10.4" height="0.942" transform="translate(20.807 10.636)" fill="#40566b"/>
+      <rect id="Rectangle_24872" data-name="Rectangle 24872" width="10.4" height="0.942" transform="translate(20.807 13.689)" fill="#40566b"/>
+      <rect id="Rectangle_24873" data-name="Rectangle 24873" width="10.4" height="0.942" transform="translate(20.807 16.744)" fill="#40566b"/>
+    </g>
+  </g>
+</svg>

package/dist/assets/images/company2.svg

@@ -0,0 +1,29 @@
+<svg id="Group_22676" data-name="Group 22676" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="31.034" height="28.695" viewBox="0 0 31.034 28.695">
+  <defs>
+    <clipPath id="clip-path">
+      <rect id="Rectangle_25833" data-name="Rectangle 25833" width="31.034" height="28.695" fill="none"/>
+    </clipPath>
+  </defs>
+  <rect id="Rectangle_25824" data-name="Rectangle 25824" width="1.715" height="1.79" transform="translate(21.445 8.853)" fill="#323954"/>
+  <rect id="Rectangle_25825" data-name="Rectangle 25825" width="3.14" height="15.1" transform="translate(21.875 13.595)" fill="#00c0b7"/>
+  <g id="Group_22672" data-name="Group 22672" transform="translate(0 0)">
+    <g id="Group_22671" data-name="Group 22671" clip-path="url(#clip-path)">
+      <path id="Path_17688" data-name="Path 17688" d="M71.515,21.209a1.5,1.5,0,0,1,.847.263,1.39,1.39,0,0,1,.28-.414v0a1.483,1.483,0,0,1,1.086-.47,1.522,1.522,0,0,1,.339.04,2.411,2.411,0,0,1,.29-.527,2.358,2.358,0,0,1,4.059.406,1.7,1.7,0,0,1,1.89.785A1.344,1.344,0,0,1,82.23,22.5a1.484,1.484,0,0,1-.043.328H70.023c0-.022,0-.04,0-.062v-.116a1.492,1.492,0,0,1,1.495-1.446" transform="translate(-51.196 -13.98)" fill="#d2edef"/>
+      <rect id="Rectangle_25826" data-name="Rectangle 25826" width="3.14" height="15.1" transform="translate(16.902 13.595)" fill="#00c0b7"/>
+      <path id="Path_17689" data-name="Path 17689" d="M72.362,23.147A1.495,1.495,0,0,0,70.02,24.33V21.41h2.621v1.323a1.389,1.389,0,0,0-.28.414" transform="translate(-51.196 -15.654)" fill="#00c0b7"/>
+      <path id="Path_17690" data-name="Path 17690" d="M54.55,0V3.678H53V1.624H50.386V3.678H48.84V0h5.71Z" transform="translate(-35.71 0)" fill="#40566b"/>
+      <path id="Path_17691" data-name="Path 17691" d="M70.023,32.762h2.618v1.79H70.02V32.7c0,.022,0,.04,0,.062" transform="translate(-51.196 -23.909)" fill="#00c0b7"/>
+      <path id="Path_17692" data-name="Path 17692" d="M42.785,18.793v1.852h-1.53V15.758H38.637v4.887h-1.53V15.758H34.486v4.887H32.771V13.68h14.35v2.441a2.376,2.376,0,0,0-.29.527,1.526,1.526,0,0,0-.339-.041,1.483,1.483,0,0,0-1.086.47v-1.32H42.785v2.92a.272.272,0,0,0,0,.051.433.433,0,0,0,0,.065" transform="translate(-23.961 -10.002)" fill="#323954"/>
+      <rect id="Rectangle_25827" data-name="Rectangle 25827" width="2.618" height="4.887" transform="translate(14.676 5.756)" fill="#00c0b7"/>
+      <rect id="Rectangle_25828" data-name="Rectangle 25828" width="2.618" height="2.054" transform="translate(14.676 1.623)" fill="#00c0b7"/>
+      <path id="Path_17693" data-name="Path 17693" d="M47.51,50.57v15.1H44.37V60.485H45.2a1.344,1.344,0,0,0,.046-.344,1.412,1.412,0,0,0-.876-1.307V50.57Z" transform="translate(-32.442 -36.975)" fill="#00c0b7"/>
+      <rect id="Rectangle_25829" data-name="Rectangle 25829" width="2.621" height="4.887" transform="translate(10.525 5.756)" fill="#00c0b7"/>
+      <rect id="Rectangle_25830" data-name="Rectangle 25830" width="1.833" height="5.186" transform="translate(10.095 23.509)" fill="#40566b"/>
+      <path id="Path_17694" data-name="Path 17694" d="M18.807,42.542V48.6a2.433,2.433,0,0,0-.4-.032,2.471,2.471,0,0,0-2.183,1.309l-.013-.005V39.59H39.464V57.642h-2.6v-15.1h-3.14v15.1H31.894v-15.1h-3.14v15.1H26.92v-15.1H23.78v8.264a1.41,1.41,0,0,0-1.14.032,1.8,1.8,0,0,0-.694-.669V42.542Z" transform="translate(-11.852 -28.947)" fill="#40566b"/>
+      <rect id="Rectangle_25831" data-name="Rectangle 25831" width="3.14" height="5.186" transform="translate(6.955 23.509)" fill="#00c0b7"/>
+      <path id="Path_17695" data-name="Path 17695" d="M28.166,57.984a1.731,1.731,0,0,0-.444.059,2.485,2.485,0,0,0-1.852-1.42V50.57h3.14V58.2a1.779,1.779,0,0,0-.844-.212" transform="translate(-18.915 -36.975)" fill="#00c0b7"/>
+      <rect id="Rectangle_25832" data-name="Rectangle 25832" width="2.597" height="5.186" transform="translate(4.358 23.509)" fill="#40566b"/>
+      <path id="Path_17696" data-name="Path 17696" d="M3.89,74.505a1.559,1.559,0,0,1,.355.043,2.054,2.054,0,0,1,.126-.269,2.474,2.474,0,0,1,4.436.142,1.743,1.743,0,0,1,.444-.059,1.779,1.779,0,0,1,.844.212,1.8,1.8,0,0,1,.694.669A1.41,1.41,0,0,1,12.8,76.518a1.332,1.332,0,0,1-.046.344H.006C0,76.817,0,76.774,0,76.728a1.57,1.57,0,0,1,2.457-1.293,1.571,1.571,0,0,1,1.433-.93" transform="translate(0 -53.353)" fill="#d2edef"/>
+    </g>
+  </g>
+</svg>

package/dist/assets/images/index.d.ts

@@ -12,6 +12,7 @@ import Billing from './billing.svg';
 import BillingAddress from './billing-address.svg';
 import BlueFolder from './blue-folder.svg';
 import BlueFolderShared from './blue-folder-shared.svg';
+import BookOpened from './book.svg';
 import Box from './box.svg';
 import Building from './building.svg';
 import Calc from './calc.svg';
@@ -28,6 +29,7 @@ import Closet from './closet.svg';
 import Clouds from './clouds.png';
 import Co2 from './co2.svg';
 import Company from './company.svg';
+import Company2 from './company2.svg';
 import ComputerReport from './computer-report.svg';
 import Confirmation from './confirmation.svg';
 import Construction from './construction.svg';
@@ -157,7 +159,7 @@ import WizardDetailed from './wizard-detailed.svg';
 import WizardQuick from './wizard-quick.svg';
 import YellowFolder from './yellow-folder.svg';
 import YellowFolderUnshared from './yellow-folder-unshared.svg';
-export { AlertDelete, AlertDeletePurple, Arrow, Batery, Bathroom, Battery, Battery2, Bedroom, BgBlue, BgLogo, Billing, BillingAddress, BlueFolder, BlueFolderShared, Box, Building, Calc, Calendar2, Catalog, ChatBubble, Check, CheckInCircle, CheckPen, Chemistry, CircleFace, Cleaning, Closet, Clouds, Co2, Company, ComputerReport, Confirmation, Construction, Contacts, Contacts2, Contributor, CreditCard, Detector, Diamond, DiningRoom, DocIcon, Document, Document2, Drop, DropCalendar, Electricity, Entryway, Exclamation, Face, Feedback, FileUploading, Finance, Fire, Flag, FormSent, Foundation, Garage, GearPencil, GearTime, GenericField, GlassWater, GreenFolder, Group, Groups, GuestBedroom, Hallway, HandPencil, Heater, Help, HomeAddress, Homeowner, House, HouseHands, IA, ImageDefault, ImgIcon, Inbox, Insect, Kitchen, Laundry, Light, LivingRoom, Loading, Location, LogoCompany, LogoSmall, MagnifyingGlassReport, Manager, MasterBedroom, Member, Message, MobileDrop, Money, Mudroom, NeedHelp, Office, Painting, PartnerGeneric, Patio, PdfIcon, PersonMail, Plate, Play, Plus, Pool, Pool2, PressureWasher, Price, Profile, ProgressReport, Proposal, RealEstate, Receipt, ReceiptBg, ReceiptHouse, Receipts, Recipient, Records, Register, RelationshipHome, ResendPassword, Rocket, Roof2, Security, Send, ShareHome, ShareWith, SixtyEight, SMS, Social, SolarPanel, Speaker, Sprinkler, Structure, Subscription, Target, Temperature, Theatre, Thumbnail, ThumbnailSmall, ThumbUp, Trash, Trees, TreesCrop, TreesCrop2, VideoIcon, VideoPlay, VioletFolder, Warning, Warranty, WellDone, WholeHome, Wind, WindWhite, Wizard, WizardDetailed, WizardQuick, YellowFolder, YellowFolderUnshared, };
+export { AlertDelete, AlertDeletePurple, Arrow, Batery, Bathroom, Battery, Battery2, Bedroom, BgBlue, BgLogo, Billing, BillingAddress, BlueFolder, BlueFolderShared, BookOpened, Box, Building, Calc, Calendar2, Catalog, ChatBubble, Check, CheckInCircle, CheckPen, Chemistry, CircleFace, Cleaning, Closet, Clouds, Co2, Company, Company2, ComputerReport, Confirmation, Construction, Contacts, Contacts2, Contributor, CreditCard, Detector, Diamond, DiningRoom, DocIcon, Document, Document2, Drop, DropCalendar, Electricity, Entryway, Exclamation, Face, Feedback, FileUploading, Finance, Fire, Flag, FormSent, Foundation, Garage, GearPencil, GearTime, GenericField, GlassWater, GreenFolder, Group, Groups, GuestBedroom, Hallway, HandPencil, Heater, Help, HomeAddress, Homeowner, House, HouseHands, IA, ImageDefault, ImgIcon, Inbox, Insect, Kitchen, Laundry, Light, LivingRoom, Loading, Location, LogoCompany, LogoSmall, MagnifyingGlassReport, Manager, MasterBedroom, Member, Message, MobileDrop, Money, Mudroom, NeedHelp, Office, Painting, PartnerGeneric, Patio, PdfIcon, PersonMail, Plate, Play, Plus, Pool, Pool2, PressureWasher, Price, Profile, ProgressReport, Proposal, RealEstate, Receipt, ReceiptBg, ReceiptHouse, Receipts, Recipient, Records, Register, RelationshipHome, ResendPassword, Rocket, Roof2, Security, Send, ShareHome, ShareWith, SixtyEight, SMS, Social, SolarPanel, Speaker, Sprinkler, Structure, Subscription, Target, Temperature, Theatre, Thumbnail, ThumbnailSmall, ThumbUp, Trash, Trees, TreesCrop, TreesCrop2, VideoIcon, VideoPlay, VioletFolder, Warning, Warranty, WellDone, WholeHome, Wind, WindWhite, Wizard, WizardDetailed, WizardQuick, YellowFolder, YellowFolderUnshared, };
 export * from './alerts';
 export * from './animations';
 export * from './appliances';

package/dist/assets/images/index.js

@@ -12,6 +12,7 @@ import Billing from './billing.svg';
 import BillingAddress from './billing-address.svg';
 import BlueFolder from './blue-folder.svg';
 import BlueFolderShared from './blue-folder-shared.svg';
+import BookOpened from './book.svg';
 import Box from './box.svg';
 import Building from './building.svg';
 import Calc from './calc.svg';
@@ -28,6 +29,7 @@ import Closet from './closet.svg';
 import Clouds from './clouds.png';
 import Co2 from './co2.svg';
 import Company from './company.svg';
+import Company2 from './company2.svg';
 import ComputerReport from './computer-report.svg';
 import Confirmation from './confirmation.svg';
 import Construction from './construction.svg';
@@ -157,7 +159,7 @@ import WizardDetailed from './wizard-detailed.svg';
 import WizardQuick from './wizard-quick.svg';
 import YellowFolder from './yellow-folder.svg';
 import YellowFolderUnshared from './yellow-folder-unshared.svg';
-export { AlertDelete, AlertDeletePurple, Arrow, Batery, Bathroom, Battery, Battery2, Bedroom, BgBlue, BgLogo, Billing, BillingAddress, BlueFolder, BlueFolderShared, Box, Building, Calc, Calendar2, Catalog, ChatBubble, Check, CheckInCircle, CheckPen, Chemistry, CircleFace, Cleaning, Closet, Clouds, Co2, Company, ComputerReport, Confirmation, Construction, Contacts, Contacts2, Contributor, CreditCard, Detector, Diamond, DiningRoom, DocIcon, Document, Document2, Drop, DropCalendar, Electricity, Entryway, Exclamation, Face, Feedback, FileUploading, Finance, Fire, Flag, FormSent, Foundation, Garage, GearPencil, GearTime, GenericField, GlassWater, GreenFolder, Group, Groups, GuestBedroom, Hallway, HandPencil, Heater, Help, HomeAddress, Homeowner, House, HouseHands, IA, ImageDefault, ImgIcon, Inbox, Insect, Kitchen, Laundry, Light, LivingRoom, Loading, Location, LogoCompany, LogoSmall, MagnifyingGlassReport, Manager, MasterBedroom, Member, Message, MobileDrop, Money, Mudroom, NeedHelp, Office, Painting, PartnerGeneric, Patio, PdfIcon, PersonMail, Plate, Play, Plus, Pool, Pool2, PressureWasher, Price, Profile, ProgressReport, Proposal, RealEstate, Receipt, ReceiptBg, ReceiptHouse, Receipts, Recipient, Records, Register, RelationshipHome, ResendPassword, Rocket, Roof2, Security, Send, ShareHome, ShareWith, SixtyEight, SMS, Social, SolarPanel, Speaker, Sprinkler, Structure, Subscription, Target, Temperature, Theatre, Thumbnail, ThumbnailSmall, ThumbUp, Trash, Trees, TreesCrop, TreesCrop2, VideoIcon, VideoPlay, VioletFolder, Warning, Warranty, WellDone, WholeHome, Wind, WindWhite, Wizard, WizardDetailed, WizardQuick, YellowFolder, YellowFolderUnshared, };
+export { AlertDelete, AlertDeletePurple, Arrow, Batery, Bathroom, Battery, Battery2, Bedroom, BgBlue, BgLogo, Billing, BillingAddress, BlueFolder, BlueFolderShared, BookOpened, Box, Building, Calc, Calendar2, Catalog, ChatBubble, Check, CheckInCircle, CheckPen, Chemistry, CircleFace, Cleaning, Closet, Clouds, Co2, Company, Company2, ComputerReport, Confirmation, Construction, Contacts, Contacts2, Contributor, CreditCard, Detector, Diamond, DiningRoom, DocIcon, Document, Document2, Drop, DropCalendar, Electricity, Entryway, Exclamation, Face, Feedback, FileUploading, Finance, Fire, Flag, FormSent, Foundation, Garage, GearPencil, GearTime, GenericField, GlassWater, GreenFolder, Group, Groups, GuestBedroom, Hallway, HandPencil, Heater, Help, HomeAddress, Homeowner, House, HouseHands, IA, ImageDefault, ImgIcon, Inbox, Insect, Kitchen, Laundry, Light, LivingRoom, Loading, Location, LogoCompany, LogoSmall, MagnifyingGlassReport, Manager, MasterBedroom, Member, Message, MobileDrop, Money, Mudroom, NeedHelp, Office, Painting, PartnerGeneric, Patio, PdfIcon, PersonMail, Plate, Play, Plus, Pool, Pool2, PressureWasher, Price, Profile, ProgressReport, Proposal, RealEstate, Receipt, ReceiptBg, ReceiptHouse, Receipts, Recipient, Records, Register, RelationshipHome, ResendPassword, Rocket, Roof2, Security, Send, ShareHome, ShareWith, SixtyEight, SMS, Social, SolarPanel, Speaker, Sprinkler, Structure, Subscription, Target, Temperature, Theatre, Thumbnail, ThumbnailSmall, ThumbUp, Trash, Trees, TreesCrop, TreesCrop2, VideoIcon, VideoPlay, VioletFolder, Warning, Warranty, WellDone, WholeHome, Wind, WindWhite, Wizard, WizardDetailed, WizardQuick, YellowFolder, YellowFolderUnshared, };
 export * from './alerts';
 export * from './animations';
 export * from './appliances';

package/dist/assets/images/index.ts

@@ -12,6 +12,7 @@ import Billing from './billing.svg'
 import BillingAddress from './billing-address.svg'
 import BlueFolder from './blue-folder.svg'
 import BlueFolderShared from './blue-folder-shared.svg'
+import BookOpened from './book.svg'
 import Box from './box.svg'
 import Building from './building.svg'
 import Calc from './calc.svg'
@@ -28,6 +29,7 @@ import Closet from './closet.svg'
 import Clouds from './clouds.png'
 import Co2 from './co2.svg'
 import Company from './company.svg'
+import Company2 from './company2.svg'
 import ComputerReport from './computer-report.svg'
 import Confirmation from './confirmation.svg'
 import Construction from './construction.svg'
@@ -173,6 +175,7 @@ export {
   BillingAddress,
   BlueFolder,
   BlueFolderShared,
+  BookOpened,
   Box,
   Building,
   Calc,
@@ -189,6 +192,7 @@ export {
   Clouds,
   Co2,
   Company,
+  Company2,
   ComputerReport,
   Confirmation,
   Construction,

package/dist/components/forms/dynamicForm/DynamicForm.js

@@ -14,7 +14,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { FormProvider } from 'react-hook-form';
 import { t } from 'i18next';
 import { Box, Stack, Text } from '@chakra-ui/react';
-import { HiddenFieldSection, GroupField, TextField, TextAreaField, SelectField, RatingField, GridField, FieldWithDelete, FileField, SwitchField, DateField, NumberField, CurrencyField, TileBody, CheckboxGroupField, } from '../..';
+import { HiddenFieldSection, GroupField, TextField, TextAreaField, SelectField, RatingField, GridField, FieldWithDelete, FileField, SwitchField, DateField, NumberField, CurrencyField, TileBody, CheckboxGroupField, CheckboxAgreement, } from '../..';
 import { useDynamicForm } from '../../../hooks';
 import { fieldIcons } from '../../../helpers';
 export const DynamicForm = (_a) => {
@@ -64,6 +64,8 @@ export const DynamicForm = (_a) => {
                                 return (_jsx(GroupField, { id: id, fields: children, onRemove: handleRemove, canBeHidden: canBeHidden }, id));
                             case 'checkbox-group':
                                 return (_jsx(FieldWithDelete, Object.assign({}, fieldWithDeleteBaseProps, { children: _jsx(CheckboxGroupField, { id: id, children: children, description: description, icon: baseProps.icon }, id) })));
+                            case 'checkbox-agreement':
+                                return (_jsx(CheckboxAgreement, { id: id, name: name, value: value, description: description }, id));
                             case 'tile-body':
                                 return (_createElement(TileBody, Object.assign({}, props, { key: id, callback: callback, fields: children, menuItems: menuItems })));
                             default:

package/dist/components/forms/dynamicForm/fields/CheckboxAgreement.d.ts

@@ -0,0 +1,2 @@
+import { ReportI } from '../../../../interfaces';
+export declare const CheckboxAgreement: ({ description, id, name, value, }: Pick<ReportI, "name" | "id" | "description" | "value">) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/dynamicForm/fields/CheckboxAgreement.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ChevronRight } from '../../../icons';
+import { Accordion, AccordionItem, AccordionButton, Flex, Box, AccordionPanel, Checkbox, Text, } from '@chakra-ui/react';
+import { Controller, useFormContext } from 'react-hook-form';
+export const CheckboxAgreement = ({ description, id, name, value, }) => {
+    const { control } = useFormContext();
+    return (_jsx(Accordion, { flex: "1", allowToggle: true, defaultIndex: [0], children: _jsx(AccordionItem, { border: "none", bg: "lightViolet.1", children: ({ isExpanded }) => (_jsxs(_Fragment, { children: [_jsxs(Flex, { p: "base", justify: "space-between", children: [_jsx(Controller, { control: control, name: id, defaultValue: value, render: ({ field: { onChange, value } }) => {
+                                    return (_jsx(Checkbox, { value: String(name), isChecked: Boolean(value), onChange: onChange, children: _jsx(Text, { fontFamily: "secondary", fontWeight: "semibold", fontSize: "sm", color: "violet.1", children: name }) }, id));
+                                } }), _jsx(AccordionButton, { w: "fit-content", p: "0", _hover: {
+                                    bg: 'transparent',
+                                }, _focus: {
+                                    outline: 'none',
+                                }, children: _jsx(Box, { rounded: "full", border: "1px solid", padding: "1", borderColor: "neutral.white", transition: "all .2s ease-in-out", transform: isExpanded ? 'rotate(-90deg)' : 'rotate(0)', children: _jsx(ChevronRight, { size: 18 }) }) })] }), _jsx(AccordionPanel, { px: "base", pb: "base", children: _jsx(Text, { variant: "home", fontSize: "xs", marginInlineStart: "8", position: "relative", top: "-10px", children: description }) })] })) }) }));
+};

package/dist/components/forms/dynamicForm/fields/index.d.ts

@@ -1,3 +1,4 @@
+export * from './CheckboxAgreement';
 export * from './CheckboxGroupField';
 export * from './CurrencyField';
 export * from './DateField';

package/dist/components/forms/dynamicForm/fields/index.js

@@ -1,3 +1,4 @@
+export * from './CheckboxAgreement';
 export * from './CheckboxGroupField';
 export * from './CurrencyField';
 export * from './DateField';

package/dist/components/forms/dynamicForm/fields/uiFields/TileCta.js

@@ -14,5 +14,5 @@ import { Button } from '@chakra-ui/react';
 export const TileCta = (_a) => {
     var { callback } = _a, props = __rest(_a, ["callback"]);
     const { type, value } = props;
-    return (_jsx(Button, { onClick: () => callback === null || callback === void 0 ? void 0 : callback(Object.assign({}, props)), variant: type === 'primary-cta' ? 'tertiaryFooter' : 'secondaryFooter', fontSize: "sm", maxW: "full", children: value }));
+    return (_jsx(Button, { onClick: () => callback === null || callback === void 0 ? void 0 : callback(Object.assign({}, props)), variant: type === 'primary-cta' ? 'primary' : 'secondary', fontSize: "sm", textTransform: "capitalize", px: "none", bg: type === 'primary-cta' ? '' : 'neutral.white', children: value }));
 };

package/dist/components/forms/dynamicForm/fields/uiFields/TileCta.tsx

@@ -6,9 +6,11 @@ export const TileCta = ({ callback, ...props }: TileCtaI) => {
   return (
     <Button
       onClick={() => callback?.({ ...props })}
-      variant={type === 'primary-cta' ? 'tertiaryFooter' : 'secondaryFooter'}
+      variant={type === 'primary-cta' ? 'primary' : 'secondary'}
       fontSize="sm"
-      maxW="full"
+      textTransform="capitalize"
+      px="none"
+      bg={type === 'primary-cta' ? '' : 'neutral.white'}
     >
       {value}
     </Button>

package/dist/components/forms/readOnly/ReadOnlyDynamicForm.d.ts

@@ -1,2 +1,2 @@
 import { ReadOnlyDynamicFormI } from '../../../interfaces';
-export declare const ReadOnlyDynamicForm: ({ form: fields, onEdit, }: ReadOnlyDynamicFormI) => import("react/jsx-runtime").JSX.Element;
+export declare const ReadOnlyDynamicForm: ({ form: fields, onClick, onEdit, }: ReadOnlyDynamicFormI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/readOnly/ReadOnlyDynamicForm.js

@@ -1,10 +1,10 @@
 import { createElement as _createElement } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box } from '@chakra-ui/react';
-import { ReadOnlyAppliances, ReadOnlyDate, ReadOnlyGrid, ReadOnlyGroup, ReadOnlyInput, ReadOnlyRating, ReadOnlyTextArea, } from '../..';
+import { ReadOnlyAppliances, ReadOnlyDate, ReadOnlyGrid, ReadOnlyGroup, ReadOnlyInput, ReadOnlyNotes, ReadOnlyRating, ReadOnlyTextArea, } from '../..';
 import { fieldIcons } from '../../../helpers';
-export const ReadOnlyDynamicForm = ({ form: fields, onEdit = () => { }, }) => {
-    return (_jsx(Box, { bg: "lightBlue.1", children: fields === null || fields === void 0 ? void 0 : fields.map((field) => {
+export const ReadOnlyDynamicForm = ({ form: fields, onClick, onEdit = () => { }, }) => {
+    return (_jsx(Box, { bg: "lightBlue.1", overflow: "scroll", children: fields === null || fields === void 0 ? void 0 : fields.map((field) => {
             const { children = [], icon, id, name, type, value } = field;
             const baseProps = {
                 key: `${id}-${name}-${value}-${type}`,
@@ -29,11 +29,13 @@ export const ReadOnlyDynamicForm = ({ form: fields, onEdit = () => { }, }) => {
                 case 'textarea':
                     return _jsx(ReadOnlyTextArea, Object.assign({}, baseProps));
                 case 'grid':
-                    return _jsx(ReadOnlyGrid, { children: children }, id);
+                    return (_jsx(ReadOnlyGrid, { children: children, onClick: onClick }, id));
                 case 'group':
                     return _jsx(ReadOnlyGroup, { children: children }, id);
                 case 'appliances':
                     return _createElement(ReadOnlyAppliances, Object.assign({}, field, { key: id, onEdit: onEdit }));
+                case 'notes':
+                    return _createElement(ReadOnlyNotes, Object.assign({}, field, { key: id }));
                 default:
                     return null;
             }

package/dist/components/forms/readOnly/fields/ReadOnlyGrid.d.ts

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

package/dist/components/forms/readOnly/fields/ReadOnlyGrid.js

@@ -11,11 +11,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Flex } from '@chakra-ui/react';
-import { ReadOnlyDate, ReadOnlyInput } from '../../..';
+import { ReadOnlyDate, ReadOnlyGuidelines, ReadOnlyInput, ReadOnlyItemRelated, } from '../../..';
 import { fieldIcons } from '../../../../helpers';
 export const ReadOnlyGrid = (_a) => {
-    var { children } = _a, props = __rest(_a, ["children"]);
-    return (_jsx(Flex, Object.assign({ align: "stretch", gap: "base", borderBottom: "1px dashed", borderColor: "lightBlue.6", p: "base" }, props, { children: children === null || children === void 0 ? void 0 : children.map(({ id, name, value, type, icon }) => {
+    var { children, onClick } = _a, props = __rest(_a, ["children", "onClick"]);
+    return (_jsx(Flex, Object.assign({ align: "stretch", gap: "base", borderBottom: "1px dashed", borderColor: "lightBlue.6", p: "base" }, props, { children: children === null || children === void 0 ? void 0 : children.map(({ children, id, name, value, type, icon }) => {
             const baseProps = {
                 key: `${id}-${name}-${value}-${type}`,
                 id,
@@ -34,6 +34,10 @@ export const ReadOnlyGrid = (_a) => {
                     return (_jsx(ReadOnlyInput, Object.assign({}, baseProps, { border: "none", flex: "auto", p: "0" })));
                 case 'date':
                     return _jsx(ReadOnlyDate, Object.assign({}, baseProps, { name: name, p: "0" }));
+                case 'guidelines':
+                    return (_jsx(ReadOnlyGuidelines, { name: name, children: children, onClick: onClick }, id));
+                case 'item-related':
+                    return (_jsx(ReadOnlyItemRelated, { name: name, children: children, onClick: onClick }, id));
                 default:
                     return null;
             }

package/dist/components/forms/readOnly/fields/ReadOnlyNotes.d.ts

@@ -0,0 +1,2 @@
+import { ReportI } from '../../../../interfaces';
+export declare const ReadOnlyNotes: ({ name, value, }: Pick<ReportI, "name" | "value">) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/readOnly/fields/ReadOnlyNotes.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Stack, Text } from '@chakra-ui/react';
+export const ReadOnlyNotes = ({ name, value, }) => {
+    return (_jsxs(Stack, { p: "base", spacing: "base", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(Text, { fontFamily: "secondary", children: value })] }));
+};

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyAppliances.js

@@ -5,7 +5,7 @@ import { colors } from '../../../../../theme/colors';
 export const ReadOnlyAppliances = ({ description, id, name, children, onEdit, value, }) => {
     const rating = children === null || children === void 0 ? void 0 : children.find(({ type }) => type === 'rating');
     const images = children === null || children === void 0 ? void 0 : children.find(({ type }) => type === 'images');
-    return (_jsxs(Stack, { spacing: "base", p: "base", children: [_jsxs(Flex, { justify: "space-between", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(IconButton, { "aria-label": "Edit appliance", variant: "ghost", w: "fit-content", icon: _jsx(Edit, { size: 18, stroke: colors.blue[3] }), onClick: () => onEdit(id) })] }), _jsxs(Flex, { gap: "base", children: [_jsx(ReadOnlyHomeItemImages, Object.assign({}, images)), _jsxs(Stack, { spacing: "4", flex: "1", children: [_jsx(ReadOnlyHomeItemRating, Object.assign({}, rating)), _jsxs(Stack, { spacing: "base", children: [_jsx(Text, { fontSize: "22px", fontWeight: "semibold", children: value }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", children: description })] }), _jsx(Box, { flex: "1", borderBottom: "1px dashed", borderColor: "lightBlue.6", h: "1px" }), _jsx(Box, { children: children === null || children === void 0 ? void 0 : children.map(({ id, name, value, type }) => {
+    return (_jsxs(Stack, { spacing: "base", p: "base", bg: "neutral.white", mt: "2px", children: [_jsxs(Flex, { justify: "space-between", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(IconButton, { "aria-label": "Edit appliance", variant: "ghost", w: "fit-content", icon: _jsx(Edit, { size: 18, stroke: colors.blue[3] }), onClick: () => onEdit(id) })] }), _jsxs(Flex, { gap: "base", children: [_jsx(ReadOnlyHomeItemImages, Object.assign({}, images)), _jsxs(Stack, { spacing: "4", flex: "1", children: [_jsx(ReadOnlyHomeItemRating, Object.assign({}, rating)), _jsxs(Stack, { spacing: "base", children: [_jsx(Text, { fontSize: "22px", fontWeight: "semibold", children: value }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", children: description })] }), _jsx(Box, { flex: "1", borderBottom: "1px dashed", borderColor: "lightBlue.6", h: "1px" }), _jsx(Box, { children: children === null || children === void 0 ? void 0 : children.map(({ id, name, value, type }) => {
                                     const baseProps = {
                                         key: `${id}-${name}-${value}-${type}`,
                                         id,

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyAppliances.tsx

@@ -19,7 +19,7 @@ export const ReadOnlyAppliances = ({
   const rating = children?.find(({ type }) => type === 'rating')
   const images = children?.find(({ type }) => type === 'images')
   return (
-    <Stack spacing="base" p="base">
+    <Stack spacing="base" p="base" bg="neutral.white" mt="2px">
       <Flex justify="space-between">
         <Text fontSize="xs" textTransform="uppercase">
           {name}

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyGuidelines.d.ts

@@ -0,0 +1,2 @@
+import { ReadOnlyGuidelinesI } from '../../../../../interfaces';
+export declare const ReadOnlyGuidelines: ({ name, children, onClick, }: ReadOnlyGuidelinesI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyGuidelines.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text, Stack, Grid } from '@chakra-ui/react';
+import { HiddenField } from '../../../..';
+import { fieldIcons } from '../../../../../helpers';
+export const ReadOnlyGuidelines = ({ name, children, onClick, }) => {
+    return (_jsxs(Stack, { spacing: "base", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(Grid, { templateColumns: "repeat(2, minmax(80px, 1fr))", gap: "base", children: children === null || children === void 0 ? void 0 : children.map((child) => {
+                    const { id, icon, value } = child;
+                    const btnIcon = icon ? fieldIcons[icon] : '';
+                    return (_jsx(HiddenField, { id: id, icon: btnIcon, name: value, onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(id) }, id));
+                }) })] }));
+};

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyGuidelines.tsx

@@ -0,0 +1,33 @@
+import { Text, Stack, Grid } from '@chakra-ui/react'
+import { HiddenField } from '@/components'
+import { ReadOnlyGuidelinesI } from '@/interfaces'
+import { fieldIcons } from '@/helpers'
+
+export const ReadOnlyGuidelines = ({
+  name,
+  children,
+  onClick,
+}: ReadOnlyGuidelinesI) => {
+  return (
+    <Stack spacing="base">
+      <Text fontSize="xs" textTransform="uppercase">
+        {name}
+      </Text>
+      <Grid templateColumns="repeat(2, minmax(80px, 1fr))" gap="base">
+        {children?.map((child) => {
+          const { id, icon, value } = child
+          const btnIcon = icon ? fieldIcons[icon] : ''
+          return (
+            <HiddenField
+              key={id}
+              id={id}
+              icon={btnIcon}
+              name={value as string}
+              onClick={() => onClick?.(id)}
+            />
+          )
+        })}
+      </Grid>
+    </Stack>
+  )
+}

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyHomeItemImages.js

@@ -6,5 +6,5 @@ export const ReadOnlyHomeItemImages = (props) => {
     const [mainImage, setMainImage] = useState(images === null || images === void 0 ? void 0 : images[0]);
     if (!images)
         return null;
-    return (_jsxs(Stack, { spacing: "base", children: [_jsx(Image, { src: mainImage, alt: "home item", boxSize: "174px" }), _jsx(SimpleGrid, { columns: 4, spacing: "base", children: images === null || images === void 0 ? void 0 : images.map((image) => (_jsx(Box, { as: "button", backgroundImage: image, backgroundSize: "cover", backgroundPosition: "center", boxSize: "34px", onClick: () => setMainImage(image) }))) })] }));
+    return (_jsxs(Stack, { spacing: "base", children: [_jsx(Image, { src: mainImage, alt: "home item", boxSize: "174px" }), _jsx(SimpleGrid, { columns: 4, spacing: "base", children: images === null || images === void 0 ? void 0 : images.map((image) => (_jsx(Box, { as: "button", backgroundImage: image, backgroundSize: "cover", backgroundPosition: "center", boxSize: "34px", onClick: () => setMainImage(image) }, image))) })] }));
 };

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyHomeItemImages.tsx

@@ -14,6 +14,7 @@ export const ReadOnlyHomeItemImages = (props: Partial<ReportI>) => {
       <SimpleGrid columns={4} spacing="base">
         {images?.map((image) => (
           <Box
+            key={image}
             as="button"
             backgroundImage={image}
             backgroundSize="cover"

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyItemRelated.d.ts

@@ -0,0 +1,2 @@
+import { ReadOnlyGuidelinesI } from '../../../../../interfaces';
+export declare const ReadOnlyItemRelated: ({ name, children, onClick, }: ReadOnlyGuidelinesI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyItemRelated.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text, Stack, Grid, Box } from '@chakra-ui/react';
+import { HiddenField } from '../../../..';
+import { fieldIcons } from '../../../../../helpers';
+export const ReadOnlyItemRelated = ({ name, children, onClick, }) => {
+    return (_jsx(Box, { borderLeft: "1px solid", borderColor: "lightBlue.6", pl: "4", marginInlineStart: "auto", children: _jsxs(Stack, { spacing: "base", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(Grid, { templateColumns: "repeat(2, minmax(80px, 1fr))", gap: "base", children: children === null || children === void 0 ? void 0 : children.map((child) => {
+                        const { id, icon, value } = child;
+                        const btnIcon = icon ? fieldIcons[icon] : '';
+                        return (_jsx(HiddenField, { id: id, icon: btnIcon, name: value, onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(id) }, id));
+                    }) })] }) }));
+};

package/dist/components/forms/readOnly/fields/homeItem/ReadOnlyItemRelated.tsx

@@ -0,0 +1,40 @@
+import { Text, Stack, Grid, Box } from '@chakra-ui/react'
+import { HiddenField } from '@/components'
+import { ReadOnlyGuidelinesI } from '@/interfaces'
+import { fieldIcons } from '@/helpers'
+
+export const ReadOnlyItemRelated = ({
+  name,
+  children,
+  onClick,
+}: ReadOnlyGuidelinesI) => {
+  return (
+    <Box
+      borderLeft="1px solid"
+      borderColor="lightBlue.6"
+      pl="4"
+      marginInlineStart="auto"
+    >
+      <Stack spacing="base">
+        <Text fontSize="xs" textTransform="uppercase">
+          {name}
+        </Text>
+        <Grid templateColumns="repeat(2, minmax(80px, 1fr))" gap="base">
+          {children?.map((child) => {
+            const { id, icon, value } = child
+            const btnIcon = icon ? fieldIcons[icon] : ''
+            return (
+              <HiddenField
+                key={id}
+                id={id}
+                icon={btnIcon}
+                name={value as string}
+                onClick={() => onClick?.(id)}
+              />
+            )
+          })}
+        </Grid>
+      </Stack>
+    </Box>
+  )
+}

package/dist/components/forms/readOnly/fields/homeItem/index.d.ts

@@ -1,4 +1,6 @@
 export * from './ReadOnlyAppliances';
+export * from './ReadOnlyGuidelines';
 export * from './ReadOnlyHomeItemImages';
 export * from './ReadOnlyHomeItemRating';
 export * from './ReadOnlyHomeItemText';
+export * from './ReadOnlyItemRelated';

package/dist/components/forms/readOnly/fields/homeItem/index.js

@@ -1,4 +1,6 @@
 export * from './ReadOnlyAppliances';
+export * from './ReadOnlyGuidelines';
 export * from './ReadOnlyHomeItemImages';
 export * from './ReadOnlyHomeItemRating';
 export * from './ReadOnlyHomeItemText';
+export * from './ReadOnlyItemRelated';

package/dist/components/forms/readOnly/fields/homeItem/index.ts

@@ -1,4 +1,6 @@
 export * from './ReadOnlyAppliances'
+export * from './ReadOnlyGuidelines'
 export * from './ReadOnlyHomeItemImages'
 export * from './ReadOnlyHomeItemRating'
 export * from './ReadOnlyHomeItemText'
+export * from './ReadOnlyItemRelated'

package/dist/components/forms/readOnly/fields/index.d.ts

@@ -4,6 +4,7 @@ export * from './ReadOnlyImage';
 export * from './ReadOnlyGrid';
 export * from './ReadOnlyGroup';
 export * from './ReadOnlyInput';
+export * from './ReadOnlyNotes';
 export * from './ReadOnlyRating';
 export * from './ReadOnlyTextArea';
 export * from './ReadOnlyWrapper';

package/dist/components/forms/readOnly/fields/index.js

@@ -4,6 +4,7 @@ export * from './ReadOnlyImage';
 export * from './ReadOnlyGrid';
 export * from './ReadOnlyGroup';
 export * from './ReadOnlyInput';
+export * from './ReadOnlyNotes';
 export * from './ReadOnlyRating';
 export * from './ReadOnlyTextArea';
 export * from './ReadOnlyWrapper';

package/dist/components/homeItems/ViewingHomeItemPanel.d.ts

@@ -1,2 +1,2 @@
 import { ViewingHomeItemPanelI } from '../../interfaces';
-export declare const ViewingHomeItemPanel: ({ form, onClose, onEdit, }: ViewingHomeItemPanelI) => import("react/jsx-runtime").JSX.Element;
+export declare const ViewingHomeItemPanel: ({ form, onClick, onClose, onEdit, }: ViewingHomeItemPanelI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/homeItems/ViewingHomeItemPanel.js

@@ -3,7 +3,7 @@ import { t } from 'i18next';
 import { Box, Divider, DrawerContent, DrawerHeader } from '@chakra-ui/react';
 import { PanelHeader, ReadOnlyDynamicForm, TabsHeader } from '..';
 import { Painting } from '../../assets/images';
-export const ViewingHomeItemPanel = ({ form, onClose, onEdit, }) => {
+export const ViewingHomeItemPanel = ({ form, onClick, onClose, onEdit, }) => {
     const tabs = [
         {
             label: t('contacts.details'),
@@ -20,5 +20,5 @@ export const ViewingHomeItemPanel = ({ form, onClose, onEdit, }) => {
             component: _jsx("div", {}),
         },
     ];
-    return (_jsxs(DrawerContent, { bg: "lightBlue.1", children: [_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, title: t('homeItems.title'), icon: Painting }), _jsx(Divider, {}), _jsx(Box, { pt: "1", bg: "neutral.white", children: _jsx(TabsHeader, { tabList: tabs, rightTabList: rightTabs }) })] }), _jsx(ReadOnlyDynamicForm, { form: form, onEdit: onEdit })] }));
+    return (_jsxs(DrawerContent, { bg: "lightBlue.1", children: [_jsxs(DrawerHeader, { p: "0", children: [_jsx(PanelHeader, { handleCloseButton: onClose, title: t('homeItems.title'), icon: Painting }), _jsx(Divider, {}), _jsx(Box, { pt: "1", bg: "neutral.white", children: _jsx(TabsHeader, { tabList: tabs, rightTabList: rightTabs }) })] }), _jsx(ReadOnlyDynamicForm, { form: form, onClick: onClick, onEdit: onEdit })] }));
 };

package/dist/components/inboxTile/panel/MessageCard.js

@@ -5,10 +5,14 @@ import { ChatBubble } from '../../../assets/images';
 import { TextBadge } from '../..';
 import { formatDateWithAt } from '../../../utils';
 export const MessageCard = ({ message, onClick, variant = 'inbox', }) => {
-    const { currentUser, from, subject, date, isNew, chatReplies, description } = message;
+    const { currentUser, from, subject, date, isNew, chatReplies, description = '', } = message;
     const formattedDate = formatDateWithAt({ date });
     const showChatBubble = Number(chatReplies === null || chatReplies === void 0 ? void 0 : chatReplies.length) > 0;
     const isInbox = variant === 'inbox';
     const isCurrentUser = (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userName) === from;
-    return (_jsxs(Flex, { gap: "base", children: [!isCurrentUser && !isInbox && (_jsx(Avatar, { size: "sm", name: from, bg: "blue.4", fontWeight: "bold", color: "neutral.white" })), _jsx(Container, { as: isInbox ? 'button' : 'div', bg: isCurrentUser ? 'yellow.6' : 'neutral.white', transition: "background-color 0.3s", textAlign: "left", _hover: isInbox ? { bg: 'lightGreen.1' } : {}, onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(message), children: _jsxs(Box, { children: [!isCurrentUser && (_jsxs(Flex, { justify: "space-between", align: "center", py: "1", pr: "base", pl: isNew ? '' : 'base', children: [_jsxs(Flex, { gap: "base", align: "center", position: "relative", left: isNew ? '-13px' : '', children: [isNew && isInbox && (_jsx(TextBadge, { text: "New", showAnimation: false, bgColor: "violet.1" })), _jsxs(Text, { variant: "home", color: "gray.1", children: [t('inbox.from'), _jsx(chakra.span, { color: "gray.4", children: from })] })] }), _jsx(Text, { variant: "home", fontSize: "xs", children: formattedDate })] })), isInbox && _jsx(Divider, {}), _jsxs(Stack, { spacing: "base", p: "base", children: [_jsxs(Flex, { align: "center", justify: "space-between", children: [_jsx(Text, { variant: "home", fontWeight: "bold", children: subject }), showChatBubble && isInbox && (_jsx(Center, { backgroundImage: `url(${ChatBubble})`, backgroundRepeat: "no-repeat", backgroundSize: "contain", backgroundPosition: "bottom", w: "20px", h: "24px", children: _jsx(Text, { fontSize: "10px", color: "blue.2", fontWeight: "bold", children: chatReplies === null || chatReplies === void 0 ? void 0 : chatReplies.length }) }))] }), isInbox && (_jsx(Text, { variant: "home", noOfLines: 3, textOverflow: "ellipsis", children: description })), !isInbox && _jsx(Text, { variant: "home", children: description })] })] }) })] }));
+    return (_jsxs(Flex, { gap: "base", children: [!isCurrentUser && !isInbox && (_jsx(Avatar, { size: "sm", name: from, bg: "blue.4", fontWeight: "bold", color: "neutral.white" })), _jsx(Container, { as: isInbox ? 'button' : 'div', bg: isCurrentUser ? 'yellow.6' : 'neutral.white', transition: "background-color 0.3s", textAlign: "left", _hover: isInbox ? { bg: 'lightGreen.1' } : {}, onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(message), children: _jsxs(Box, { children: [!isCurrentUser && (_jsxs(Flex, { justify: "space-between", align: "center", py: "1", pr: "base", pl: isNew ? '' : 'base', children: [_jsxs(Flex, { gap: "base", align: "center", position: "relative", left: isNew ? '-13px' : '', children: [isNew && isInbox && (_jsx(TextBadge, { text: "New", showAnimation: false, bgColor: "violet.1" })), _jsxs(Text, { variant: "home", color: "gray.1", children: [t('inbox.from'), _jsx(chakra.span, { color: "gray.4", children: from })] })] }), _jsx(Text, { variant: "home", fontSize: "xs", children: formattedDate })] })), isInbox && _jsx(Divider, {}), _jsxs(Stack, { spacing: "base", p: "base", children: [_jsxs(Flex, { align: "center", justify: "space-between", children: [_jsx(Text, { variant: "home", fontWeight: "bold", children: subject }), showChatBubble && isInbox && (_jsx(Center, { backgroundImage: `url(${ChatBubble})`, backgroundRepeat: "no-repeat", backgroundSize: "contain", backgroundPosition: "bottom", w: "20px", h: "24px", children: _jsx(Text, { fontSize: "10px", color: "blue.2", fontWeight: "bold", children: chatReplies === null || chatReplies === void 0 ? void 0 : chatReplies.length }) }))] }), isInbox && (_jsx(Text, { variant: "home", noOfLines: 3, textOverflow: "ellipsis", dangerouslySetInnerHTML: {
+                                        __html: description,
+                                    } })), !isInbox && (_jsx(Text, { variant: "home", dangerouslySetInnerHTML: {
+                                        __html: description,
+                                    } }))] })] }) })] }));
 };

package/dist/helpers/forms/dynamicForm.helper.js

@@ -1,8 +1,9 @@
-import { Paint, Receipt, Barcode, GoldenBars, Heart, Rating, Notes, Book, ImgIcon, Registry, ShareWith, Calendar, Contacts, Tools2, Billing, Calc, CheckPen, GenericField, Price, Battery2, Co2, Detector, Electricity, Sprinkler, SixtyEight, DropCalendar, MobileDrop, SolarPanel, Calendar2, Drop, Wind, Foundation, Heater, Light, Plate, Pool2, Closet, Structure, GlassWater, Roof2, Target, CircleFace, Company, Pressure, WindowCleaning, RoofCleaning, HolidayLights, GutterCleaning, HomeCleaning, HouseWashing, PressureWasher, } from '../../assets/images';
+import { Paint, Receipt, Barcode, GoldenBars, Heart, Rating, Notes, Book, ImgIcon, Registry, ShareWith, Calendar, Contacts, Tools2, Billing, Calc, CheckPen, GenericField, Price, Battery2, Co2, Detector, Electricity, Sprinkler, SixtyEight, DropCalendar, MobileDrop, SolarPanel, Calendar2, Drop, Wind, Foundation, Heater, Light, Plate, Pool2, Closet, Structure, GlassWater, Roof2, Target, CircleFace, Pressure, WindowCleaning, RoofCleaning, HolidayLights, GutterCleaning, HomeCleaning, HouseWashing, PressureWasher, BookOpened, Company2, } from '../../assets/images';
 export const fieldIcons = {
     barcode: Barcode,
     billing: Billing,
     book: Book,
+    'book-opened': BookOpened,
     calc: Calc,
     check: CheckPen,
     contact: Contacts,
@@ -44,7 +45,7 @@ export const fieldIcons = {
     house: Structure,
     target: Target,
     title: CircleFace,
-    company: Company,
+    company: Company2,
     'sh-gutter': GutterCleaning,
     'sh-home': HomeCleaning,
     'sh-house': HouseWashing,

package/dist/hooks/inbox/useMessagePanel.js

@@ -1,8 +1,11 @@
 import { t } from 'i18next';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 export const useMessagePanel = (messages) => {
     const [sortedMessages, setSortedMessages] = useState(messages);
     const [currentSort, setCurrentSort] = useState(t('forms.sortBy'));
+    useEffect(() => {
+        setSortedMessages(messages);
+    }, [messages]);
     const handleSelectItem = (item) => {
         if (typeof item !== 'string')
             return;