@homefile/components-v2 2.24.26 → 2.25.1

package/dist/components/forms/Collapsible.d.ts

@@ -1,3 +1,3 @@
 import { PropsWithChildren } from 'react';
 import { CollapsibleI } from '../../interfaces';
-export declare const Collapsible: ({ children, icon, title, }: PropsWithChildren<CollapsibleI>) => import("react/jsx-runtime").JSX.Element;
+export declare const Collapsible: ({ children, icon, title, showShadow, }: PropsWithChildren<CollapsibleI>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/Collapsible.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Accordion, AccordionButton, AccordionItem, AccordionPanel, Box, Flex, } from '@chakra-ui/react';
 import { ChevronRight, CollapsibleHeader } from '..';
-export const Collapsible = ({ children, icon, title, }) => {
-    return (_jsx(Accordion, { flex: "1", allowMultiple: true, boxShadow: "md", children: _jsx(AccordionItem, { border: "none", children: ({ isExpanded }) => (_jsxs(_Fragment, { children: [_jsx(AccordionButton, { w: "100%", p: "base", bg: "neutral.white", transition: "all .2s ease-in-out", borderBottom: "1px solid", borderColor: isExpanded ? 'lightBlue.2' : 'transparent', _hover: {
-                            boxShadow: 'lg',
+export const Collapsible = ({ children, icon, title, showShadow = true, }) => {
+    return (_jsx(Accordion, { flex: "1", allowMultiple: true, boxShadow: showShadow ? 'md' : 'none', children: _jsx(AccordionItem, { border: "none", children: ({ isExpanded }) => (_jsxs(_Fragment, { children: [_jsx(AccordionButton, { w: "100%", p: "base", bg: "neutral.white", transition: "all .2s ease-in-out", borderBottom: "1px solid", borderColor: isExpanded ? 'lightBlue.2' : 'transparent', _hover: {
+                            boxShadow: showShadow ? 'lg' : 'none',
                         }, _focus: {
                             outline: 'none',
                         }, children: _jsxs(Flex, { align: "center", justify: "space-between", flex: "1", children: [_jsx(CollapsibleHeader, { icon: icon, title: title }), _jsx(Box, { rounded: "full", border: "1px solid", padding: "1", borderColor: "blue.3", transition: "all .2s ease-in-out", transform: isExpanded ? 'rotate(-90deg)' : 'rotate(0)', children: _jsx(ChevronRight, {}) })] }) }), _jsx(AccordionPanel, { p: "base", bg: "neutral.white", children: children })] })) }) }));

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

@@ -14,5 +14,5 @@ import { Box, Stack } from '@chakra-ui/react';
 import { PartnerFooter, TileBodyFields, TileFooterFields, TileHeaderFields, } from '../../../..';
 export const TileBody = (_a) => {
     var { callback, fields, websiteUrl = '', menuItems } = _a, props = __rest(_a, ["callback", "fields", "websiteUrl", "menuItems"]);
-    return (_jsx(Box, { display: "flex", flexGrow: 1, flexDir: "column", bg: "neutral.white", boxShadow: "lg", children: _jsxs(Stack, { spacing: "0", flex: "1", justify: "space-between", children: [_jsx(Box, { children: _jsx(TileHeaderFields, { fields: fields, menuItems: menuItems }) }), _jsx(TileBodyFields, { fields: fields }), _jsxs(Stack, { spacing: "0", bg: "lightBlue.1", pt: "base", children: [_jsx(TileFooterFields, { callback: callback, fields: fields }), _jsx(PartnerFooter, Object.assign({}, props, { websiteUrl: websiteUrl }))] })] }) }));
+    return (_jsx(Box, { display: "flex", flexGrow: 1, flexDir: "column", bg: "neutral.white", boxShadow: "lg", children: _jsxs(Stack, { spacing: "0", flex: "1", justify: "space-between", children: [_jsx(Box, { children: _jsx(TileHeaderFields, { fields: fields, menuItems: menuItems }) }), _jsx(TileBodyFields, { fields: fields }), _jsxs(Stack, { spacing: "0", bg: "lightBlue.1", children: [_jsx(TileFooterFields, { callback: callback, fields: fields }), _jsx(PartnerFooter, Object.assign({}, props, { websiteUrl: websiteUrl }))] })] }) }));
 };

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

@@ -27,7 +27,7 @@ export const TileBody = ({
           <TileHeaderFields fields={fields} menuItems={menuItems} />
         </Box>
         <TileBodyFields fields={fields} />
-        <Stack spacing="0" bg="lightBlue.1" pt="base">
+        <Stack spacing="0" bg="lightBlue.1">
           <TileFooterFields callback={callback} fields={fields} />
           <PartnerFooter {...props} websiteUrl={websiteUrl} />
         </Stack>

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Text } from '@chakra-ui/react';
 export const TileBodyHeader = ({ value = '' }) => {
-    return (_jsx(Box, { p: "base", children: _jsx(Text, { fontWeight: "semibold", children: value }) }));
+    return (_jsx(Box, { p: "base", children: _jsx(Text, { fontWeight: "semibold", textAlign: "center", children: value }) }));
 };

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

@@ -3,7 +3,9 @@ import { Box, Text } from '@chakra-ui/react'
 export const TileBodyHeader = ({ value = '' }) => {
   return (
     <Box p="base">
-      <Text fontWeight="semibold">{value}</Text>
+      <Text fontWeight="semibold" textAlign="center">
+        {value}
+      </Text>
     </Box>
   )
 }

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' ? 'primary' : 'secondary', fontSize: "sm", textTransform: "capitalize", px: "none", bg: type === 'primary-cta' ? '' : 'neutral.white', children: value }));
+    return (_jsx(Button, { onClick: () => callback === null || callback === void 0 ? void 0 : callback(Object.assign({}, props)), variant: type === 'primary-cta' ? 'primary' : 'secondary', textTransform: "capitalize", fontWeight: type === 'primary-cta' ? 'semibold' : 'regular', px: "none", bg: type === 'primary-cta' ? '' : 'neutral.white', children: value }));
 };

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

@@ -7,8 +7,8 @@ export const TileCta = ({ callback, ...props }: TileCtaI) => {
     <Button
       onClick={() => callback?.({ ...props })}
       variant={type === 'primary-cta' ? 'primary' : 'secondary'}
-      fontSize="sm"
       textTransform="capitalize"
+      fontWeight={type === 'primary-cta' ? 'semibold' : 'regular'}
       px="none"
       bg={type === 'primary-cta' ? '' : 'neutral.white'}
     >

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Center, Image, Text } from '@chakra-ui/react';
 export const VerticalIcon = ({ icon, value }) => {
-    return (_jsxs(Box, { bg: "neutral.white", borderRadius: "md", border: "1px solid", borderColor: "lightBlue.6", display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", minH: "110px", children: [_jsx(Box, { h: "46px", display: "flex", alignItems: "center", children: _jsx(Image, { src: icon, alt: value, w: "auto", h: "80%" }) }), _jsx(Center, { pb: "2", children: _jsx(Text, { fontWeight: "semibold", textAlign: "center", fontSize: "13px", lineHeight: "14px", w: "85%", children: value }) })] }));
+    return (_jsxs(Box, { bg: "neutral.white", borderRadius: "md", border: "1px solid", borderColor: "lightBlue.6", display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", minH: "110px", children: [_jsx(Box, { h: "46px", w: "46px", display: "flex", alignItems: "center", justifyContent: "center", children: _jsx(Image, { src: icon, alt: value, w: "34px", h: "34px", objectFit: "contain" }) }), _jsx(Center, { pb: "2", children: _jsx(Text, { fontWeight: "semibold", textAlign: "center", fontSize: "13px", lineHeight: "14px", w: "85%", children: value }) })] }));
 };

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

@@ -14,8 +14,14 @@ export const VerticalIcon = ({ icon, value }: VerticalIconI) => {
       justifyContent="center"
       minH="110px"
     >
-      <Box h="46px" display="flex" alignItems="center">
-        <Image src={icon} alt={value} w="auto" h="80%" />
+      <Box
+        h="46px"
+        w="46px"
+        display="flex"
+        alignItems="center"
+        justifyContent="center"
+      >
+        <Image src={icon} alt={value} w="34px" h="34px" objectFit="contain" />
       </Box>
       <Center pb="2">
         <Text

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

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
 import { Box } from '@chakra-ui/react';
-import { ReadOnlyAppliances, ReadOnlyDate, ReadOnlyGrid, ReadOnlyGroup, ReadOnlyInput, ReadOnlyNotes, ReadOnlyRating, ReadOnlyTextArea, } from '../..';
+import { ReadOnlyAppliances, ReadOnlyCollapsible, ReadOnlyDate, ReadOnlyGrid, ReadOnlyGroup, ReadOnlyInput, ReadOnlyNotes, ReadOnlyRating, ReadOnlyTextArea, } from '../..';
 import { fieldIcons } from '../../../helpers';
-export const ReadOnlyDynamicForm = ({ form: fields, onClick, onEdit = () => { }, }) => {
+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 = {
@@ -33,6 +33,8 @@ export const ReadOnlyDynamicForm = ({ form: fields, onClick, onEdit = () => { },
                     return _jsx(ReadOnlyGroup, { children: children }, id);
                 case 'appliances':
                     return _createElement(ReadOnlyAppliances, Object.assign({}, field, { key: id, onEdit: onEdit }));
+                case 'collapsible':
+                    return _createElement(ReadOnlyCollapsible, Object.assign({}, field, { key: id }));
                 case 'notes':
                     return _createElement(ReadOnlyNotes, Object.assign({}, field, { key: id }));
                 default:

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

@@ -5,19 +5,20 @@ 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", 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,
-                                        value,
-                                        type,
-                                        name,
-                                    };
-                                    switch (type) {
-                                        case 'text':
-                                            return _jsx(ReadOnlyHomeItemText, Object.assign({}, baseProps));
-                                        default:
-                                            return null;
-                                    }
-                                }) })] })] })] }));
+    return (_jsxs(Stack, { spacing: "base", p: "base", bg: "neutral.white", mt: "2px", children: [name ||
+                (onEdit && (_jsxs(Flex, { justify: "space-between", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), onEdit && (_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(Box, { children: children === null || children === void 0 ? void 0 : children.map(({ id, name, value, type }) => {
+                                            const baseProps = {
+                                                key: `${id}-${name}-${value}-${type}`,
+                                                id,
+                                                value,
+                                                type,
+                                                name,
+                                            };
+                                            switch (type) {
+                                                case 'text':
+                                                    return _jsx(ReadOnlyHomeItemText, Object.assign({}, baseProps));
+                                                default:
+                                                    return null;
+                                            }
+                                        }) }), _jsx(Box, { flex: "1", borderBottom: "1px dashed", borderColor: "lightBlue.6", h: "1px" }), _jsx(Text, { fontFamily: "secondary", fontSize: "sm", children: description })] })] })] })] }));
 };

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

@@ -20,18 +20,23 @@ export const ReadOnlyAppliances = ({
   const images = children?.find(({ type }) => type === 'images')
   return (
     <Stack spacing="base" p="base" bg="neutral.white" mt="2px">
-      <Flex justify="space-between">
-        <Text fontSize="xs" textTransform="uppercase">
-          {name}
-        </Text>
-        <IconButton
-          aria-label="Edit appliance"
-          variant="ghost"
-          w="fit-content"
-          icon={<Edit size={18} stroke={colors.blue[3]} />}
-          onClick={() => onEdit(id)}
-        />
-      </Flex>
+      {name ||
+        (onEdit && (
+          <Flex justify="space-between">
+            <Text fontSize="xs" textTransform="uppercase">
+              {name}
+            </Text>
+            {onEdit && (
+              <IconButton
+                aria-label="Edit appliance"
+                variant="ghost"
+                w="fit-content"
+                icon={<Edit size={18} stroke={colors.blue[3]} />}
+                onClick={() => onEdit(id)}
+              />
+            )}
+          </Flex>
+        ))}
       <Flex gap="base">
         <ReadOnlyHomeItemImages {...images} />
         <Stack spacing="4" flex="1">
@@ -40,33 +45,33 @@ export const ReadOnlyAppliances = ({
             <Text fontSize="22px" fontWeight="semibold">
               {value}
             </Text>
+            <Box>
+              {children?.map(({ id, name, value, type }) => {
+                const baseProps = {
+                  key: `${id}-${name}-${value}-${type}`,
+                  id,
+                  value,
+                  type,
+                  name,
+                }
+                switch (type) {
+                  case 'text':
+                    return <ReadOnlyHomeItemText {...baseProps} />
+                  default:
+                    return null
+                }
+              })}
+            </Box>
+            <Box
+              flex="1"
+              borderBottom="1px dashed"
+              borderColor="lightBlue.6"
+              h="1px"
+            />
             <Text fontFamily="secondary" fontSize="sm">
               {description}
             </Text>
           </Stack>
-          <Box
-            flex="1"
-            borderBottom="1px dashed"
-            borderColor="lightBlue.6"
-            h="1px"
-          />
-          <Box>
-            {children?.map(({ id, name, value, type }) => {
-              const baseProps = {
-                key: `${id}-${name}-${value}-${type}`,
-                id,
-                value,
-                type,
-                name,
-              }
-              switch (type) {
-                case 'text':
-                  return <ReadOnlyHomeItemText {...baseProps} />
-                default:
-                  return null
-              }
-            })}
-          </Box>
         </Stack>
       </Flex>
     </Stack>

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

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

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

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Stack } from '@chakra-ui/react';
+import { Collapsible, ReadOnlyTextArea } from '../../../..';
+export const ReadOnlyCollapsible = ({ children, }) => {
+    return (_jsx(Stack, { bg: "lightBlue.2", spacing: "2px", children: children === null || children === void 0 ? void 0 : children.map(({ id, name = '', value, type }) => {
+            const baseProps = {
+                id,
+                value,
+                type,
+                name,
+            };
+            switch (type) {
+                case 'text':
+                    return (_jsx(Collapsible, { title: name, showShadow: false, children: _jsx(ReadOnlyTextArea, Object.assign({}, baseProps)) }, `${id}-${name}-${value}-${type}`));
+                default:
+                    return null;
+            }
+        }) }));
+};

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

@@ -0,0 +1,34 @@
+import { Stack } from '@chakra-ui/react'
+import { Collapsible, ReadOnlyTextArea } from '@/components'
+import { ReportI } from '@/interfaces'
+
+export const ReadOnlyCollapsible = ({
+  children,
+}: Pick<ReportI, 'children'>) => {
+  return (
+    <Stack bg="lightBlue.2" spacing="2px">
+      {children?.map(({ id, name = '', value, type }) => {
+        const baseProps = {
+          id,
+          value,
+          type,
+          name,
+        }
+        switch (type) {
+          case 'text':
+            return (
+              <Collapsible
+                title={name}
+                showShadow={false}
+                key={`${id}-${name}-${value}-${type}`}
+              >
+                <ReadOnlyTextArea {...baseProps} />
+              </Collapsible>
+            )
+          default:
+            return null
+        }
+      })}
+    </Stack>
+  )
+}

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

@@ -3,7 +3,7 @@ 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) => {
+    return (_jsxs(Stack, { spacing: "base", flex: "1", width: "100%", children: [_jsx(Text, { fontSize: "xs", textTransform: "uppercase", children: name }), _jsx(Grid, { templateColumns: "repeat(auto-fit, minmax(0, 75px))", 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

@@ -9,11 +9,11 @@ export const ReadOnlyGuidelines = ({
   onClick,
 }: ReadOnlyGuidelinesI) => {
   return (
-    <Stack spacing="base">
+    <Stack spacing="base" flex="1" width="100%">
       <Text fontSize="xs" textTransform="uppercase">
         {name}
       </Text>
-      <Grid templateColumns="repeat(2, minmax(80px, 1fr))" gap="base">
+      <Grid templateColumns="repeat(auto-fit, minmax(0, 75px))" gap="base">
         {children?.map((child) => {
           const { id, icon, value } = child
           const btnIcon = icon ? fieldIcons[icon] : ''

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

@@ -3,7 +3,7 @@ import { Box, Flex, Text } from '@chakra-ui/react';
 export const ReadOnlyHomeItemText = ({ name, value }) => {
     if (!name)
         return null;
-    return (_jsxs(Flex, { gap: "base", children: [_jsx(Box, { w: "20%", children: _jsx(CustomText, { children: `${name}:` }) }), _jsx(CustomText, { children: String(value) })] }));
+    return (_jsxs(Flex, { gap: "base", children: [_jsx(Box, { w: "30%", children: _jsx(CustomText, { children: `${name}:` }) }), _jsx(CustomText, { children: String(value) })] }));
 };
 const CustomText = ({ children = '' }) => {
     return (_jsx(Text, { fontSize: "sm", fontFamily: "secondary", children: children }));

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

@@ -5,7 +5,7 @@ export const ReadOnlyHomeItemText = ({ name, value }: Partial<ReportI>) => {
   if (!name) return null
   return (
     <Flex gap="base">
-      <Box w="20%">
+      <Box w="30%">
         <CustomText>{`${name}:`}</CustomText>
       </Box>
       <CustomText>{String(value)}</CustomText>

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

@@ -1,4 +1,5 @@
 export * from './ReadOnlyAppliances';
+export * from './ReadOnlyCollapsible';
 export * from './ReadOnlyGuidelines';
 export * from './ReadOnlyHomeItemImages';
 export * from './ReadOnlyHomeItemRating';

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

@@ -1,4 +1,5 @@
 export * from './ReadOnlyAppliances';
+export * from './ReadOnlyCollapsible';
 export * from './ReadOnlyGuidelines';
 export * from './ReadOnlyHomeItemImages';
 export * from './ReadOnlyHomeItemRating';

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

@@ -1,4 +1,5 @@
 export * from './ReadOnlyAppliances'
+export * from './ReadOnlyCollapsible'
 export * from './ReadOnlyGuidelines'
 export * from './ReadOnlyHomeItemImages'
 export * from './ReadOnlyHomeItemRating'

package/dist/components/headers/CollapsibleHeader.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Flex, Image, Text } from '@chakra-ui/react';
 export const CollapsibleHeader = ({ icon, title, }) => {
-    return (_jsxs(Flex, { align: "center", gap: "base", children: [_jsx(Image, { h: "auto", w: "icon.md", src: icon }), _jsx(Text, { fontSize: "sm", textTransform: "uppercase", children: title })] }));
+    return (_jsxs(Flex, { align: "center", gap: "base", children: [icon && _jsx(Image, { h: "auto", w: "icon.md", src: icon }), _jsx(Text, { fontSize: "sm", textTransform: "uppercase", children: title })] }));
 };

package/dist/components/partner/PartnerFooter.js

@@ -10,5 +10,5 @@ export const PartnerFooter = ({ socialLinks = [], websiteUrl, urlText, }) => {
             return;
         window.open(url, '_blank');
     };
-    return (_jsxs(Flex, { align: "center", justify: "space-between", p: "base", children: [_jsx(Link, { href: websiteUrl, isExternal: true, children: _jsx(Text, { fontSize: "xs", color: "blue.3", children: urlText !== null && urlText !== void 0 ? urlText : cleanedWebsiteUrl }) }), hasSocialLinks && (_jsx(Flex, { align: "center", gap: "1", children: socialLinks === null || socialLinks === void 0 ? void 0 : socialLinks.map(({ name, link }) => (_jsx(IconButton, { variant: "unstyled", w: "fit-content", "aria-label": "Instagram", icon: SocialIcons({ size: 20, name }), onClick: () => handleSocialClick(link) }, name))) }))] }));
+    return (_jsxs(Flex, { align: "center", justify: "space-between", px: "base", minH: "46px", children: [_jsx(Link, { href: websiteUrl, isExternal: true, children: _jsx(Text, { fontSize: "xs", color: "blue.3", fontFamily: "primary", children: urlText !== null && urlText !== void 0 ? urlText : cleanedWebsiteUrl }) }), hasSocialLinks && (_jsx(Flex, { align: "center", gap: "1", children: socialLinks === null || socialLinks === void 0 ? void 0 : socialLinks.map(({ name, link }) => (_jsx(IconButton, { variant: "unstyled", w: "fit-content", "aria-label": "Instagram", icon: SocialIcons({ size: 20, name }), onClick: () => handleSocialClick(link) }, name))) }))] }));
 };

package/dist/components/partner/PartnerImage.js

@@ -3,6 +3,6 @@ import { t } from 'i18next';
 import { Center, Image, Text } from '@chakra-ui/react';
 export const PartnerImage = ({ imageUrl, partnerName }) => {
     if (imageUrl)
-        return (_jsx(Image, { src: imageUrl, minH: "154px", h: "full", w: "full", objectFit: "cover", alt: partnerName }));
-    return (_jsx(Center, { bg: "gray.3", minH: "154px", h: "full", children: _jsx(Text, { color: "neutral.white", fontSize: "xxs", children: t('partner.needImage') }) }));
+        return (_jsx(Image, { src: imageUrl, minH: "154px", maxH: "300px", h: "full", w: "full", objectFit: "cover", alt: partnerName }));
+    return (_jsx(Center, { bg: "gray.3", w: "full", minH: "154px", children: _jsx(Text, { color: "neutral.white", fontSize: "xxs", children: t('partner.needImage') }) }));
 };

package/dist/components/partner/ShortPartnerTile.d.ts

@@ -1,2 +1,2 @@
 import { ShortPartnerTileI } from '../../interfaces';
-export declare const ShortPartnerTile: ({ buttonText, description, imageUrl, logo, menuItems, minimized, onClick, socialLinks, partnerName, websiteUrl, urlText }: ShortPartnerTileI) => import("react/jsx-runtime").JSX.Element;
+export declare const ShortPartnerTile: ({ buttonText, description, imageUrl, logo, menuItems, minimized, onClick, socialLinks, partnerName, websiteUrl, urlText, }: ShortPartnerTileI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/partner/ShortPartnerTile.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Flex } from '@chakra-ui/react';
-import { Fader, PartnerCallToAction, PartnerFooter, PartnerHeader, PartnerImage, PartnerTileWrapper, } from '..';
-export const ShortPartnerTile = ({ buttonText, description, imageUrl, logo, menuItems, minimized, onClick, socialLinks, partnerName, websiteUrl, urlText }) => {
-    const callToAction = { description, buttonText, onClick };
+import { Box, Flex, Stack } from '@chakra-ui/react';
+import { PartnerFooter, PartnerHeader, PartnerImage, PartnerTileWrapper, TileCta, } from '..';
+export const ShortPartnerTile = ({ buttonText, description, imageUrl, logo, menuItems, minimized, onClick, socialLinks, partnerName, websiteUrl, urlText, }) => {
     const header = { logo, menuItems, partnerName };
     const image = { imageUrl, partnerName };
     const footer = { socialLinks, websiteUrl, urlText };
-    return (_jsxs(PartnerTileWrapper, { children: [_jsx(PartnerHeader, Object.assign({}, header)), !minimized && (_jsx(Fader, { children: _jsxs(Flex, { flexDir: "column", h: "400px", justifyContent: "space-between", children: [_jsx(PartnerImage, Object.assign({}, image)), _jsxs(Box, { children: [_jsx(PartnerCallToAction, Object.assign({}, callToAction)), _jsx(PartnerFooter, Object.assign({}, footer))] })] }) }))] }));
+    return (_jsxs(PartnerTileWrapper, { children: [_jsx(PartnerHeader, Object.assign({}, header)), !minimized && (_jsxs(Stack, { spacing: "0", justify: "space-between", h: "full", children: [_jsx(Flex, { w: "full", h: "full", children: _jsx(PartnerImage, Object.assign({}, image)) }), _jsxs(Box, { children: [_jsx(Box, { p: "base", children: _jsx(TileCta, { id: `tile-cta-${partnerName}`, callback: onClick, description: description, type: "primary-cta", value: buttonText }) }), _jsx(PartnerFooter, Object.assign({}, footer))] })] }))] }));
 };

package/dist/interfaces/forms/Collapsible.interface.d.ts

@@ -1,4 +1,5 @@
 export interface CollapsibleI {
-    icon: string;
+    icon?: string;
     title: string;
+    showShadow?: boolean;
 }

package/dist/interfaces/forms/dynamicForm/DynamicForm.interface.d.ts

@@ -1,5 +1,5 @@
 import { AIGridFieldI, AlertFieldType, AlertTabType, FolderFileI, MenuItemI, PartnerFooterI, TileCtaI } from '../..';
-export type KindTypes = 'ai-image' | 'ai-grid' | 'checkbox' | 'checkbox-agreement' | 'checkbox-group' | 'currency' | 'date' | 'email' | 'file' | 'grid' | 'group' | 'hidden' | 'notes' | 'number' | 'radio' | 'rating' | 'select' | 'string' | 'switch' | 'telephone' | 'text' | 'textarea' | 'default' | 'video' | UIKindTypes | HomeItemTypes | AlertTabType | AlertFieldType;
+export type KindTypes = 'ai-image' | 'ai-grid' | 'checkbox' | 'checkbox-agreement' | 'checkbox-group' | 'collapsible' | 'currency' | 'date' | 'email' | 'file' | 'grid' | 'group' | 'hidden' | 'notes' | 'number' | 'radio' | 'rating' | 'select' | 'string' | 'switch' | 'telephone' | 'text' | 'textarea' | 'default' | 'video' | UIKindTypes | HomeItemTypes | AlertTabType | AlertFieldType;
 export type UIKindTypes = 'tile-body' | 'tile-body-logo' | 'tile-body-header' | 'tile-body-section' | 'tile-body-section-grid' | 'tile-body-partner-image' | 'tile-body-description' | 'tile-form' | 'tile-body-action' | 'vertical-icon' | 'primary-cta' | 'secondary-cta';
 export type HomeItemTypes = 'appliances' | 'images' | 'guidelines' | 'item-related' | 'item-icon-btn';
 export type IconTypes = 'barcode' | 'battery' | 'billing' | 'book' | 'book-opened' | 'calc' | 'calendar' | 'check' | 'co2' | 'contact' | 'date' | 'default' | 'detector' | 'electricity' | 'fire' | 'goldbars' | 'heart' | 'image' | 'life-preserver' | 'notes' | 'palette' | 'plant' | 'people' | 'price' | 'rating' | 'receipt' | 'registry' | 'sprinkler' | 'tools' | 'wind' | '68' | 'calendar2' | 'water' | 'calendar-drop' | 'umbrella' | 'heater' | 'roof' | 'foundation' | 'solar-panel' | 'pool' | 'drop' | 'mobile-drop' | 'light' | 'plate' | 'pressure-washer' | 'house' | 'target' | 'title' | 'company' | 'wallet' | UIIconTypes;

package/dist/interfaces/forms/readOnly/homeItem/ReadOnlyAppliances.interface.d.ts

@@ -1,4 +1,4 @@
 import { ReportI } from '../../..';
 export interface ReadOnlyAppliancesI extends ReportI {
-    onEdit: (id: string) => void;
+    onEdit?: (id: string) => void;
 }

package/dist/mocks/forms/dynamicForm.mock.js

@@ -673,7 +673,7 @@ export const tileUIMock = [
 export const viewingHomeItemMock = [
     {
         id: faker.database.mongodbObjectId(),
-        name: 'Appliances',
+        name: '',
         description: 'KitchenAid Counter-depth 20-cu ft French Door Refrigerator with Ice Maker and Water dispenser (Stainless Steel) ENERGY STAR',
         comments: faker.lorem.sentence(),
         value: 'Refrigerator',
@@ -687,21 +687,13 @@ export const viewingHomeItemMock = [
                 description: '',
                 comments: '',
                 value: [
-                    faker.image.urlLoremFlickr(),
-                    faker.image.urlLoremFlickr(),
-                    faker.image.urlLoremFlickr(),
-                    faker.image.urlLoremFlickr(),
+                    faker.image.urlPicsumPhotos(),
+                    faker.image.urlPicsumPhotos(),
+                    faker.image.urlPicsumPhotos(),
+                    faker.image.urlPicsumPhotos(),
                 ],
                 type: 'images',
             },
-            {
-                id: faker.database.mongodbObjectId(),
-                name: '',
-                description: '',
-                comments: '',
-                value: 4,
-                type: 'rating',
-            },
             {
                 id: faker.database.mongodbObjectId(),
                 name: 'Brand',
@@ -772,13 +764,41 @@ export const viewingHomeItemMock = [
     },
     {
         id: faker.database.mongodbObjectId(),
-        name: 'Notes',
+        name: 'Collapsible',
         description: '',
         comments: faker.lorem.sentence(),
         value: faker.lorem.paragraphs(),
-        type: 'notes',
+        type: 'collapsible',
         visible: true,
-        options: [],
+        children: [
+            {
+                id: faker.database.mongodbObjectId(),
+                name: 'Care Instructions',
+                description: faker.lorem.sentence(),
+                comments: faker.lorem.sentence(),
+                value: faker.lorem.paragraphs(),
+                type: 'text',
+                visible: true,
+            },
+            {
+                id: faker.database.mongodbObjectId(),
+                name: 'OVERVIEW',
+                description: faker.lorem.sentence(),
+                comments: faker.lorem.sentence(),
+                value: faker.lorem.paragraphs(),
+                type: 'text',
+                visible: true,
+            },
+            {
+                id: faker.database.mongodbObjectId(),
+                name: 'Dimensions',
+                description: faker.lorem.sentence(),
+                comments: faker.lorem.sentence(),
+                value: faker.lorem.paragraphs(),
+                type: 'text',
+                visible: true,
+            },
+        ],
     },
 ];
 export const unknownFormMock = {