@homefile/components-v2 2.8.35 → 2.8.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/contacts/sharePanel/ShareContactsContent.js +3 -3
- package/dist/components/forms/dynamicForm/ItemFormPanel/ItemFormPanel.js +2 -2
- package/dist/components/homeAssistant/panel/HomeAssistantPanel.js +3 -3
- package/dist/stories/contacts/ContactsContent.stories.js +2 -1
- package/dist/stories/forms/ItemFormPanel/ItemFormPanel.stories.js +8 -7
- package/dist/stories/homeAssistant/panel/HomeAssistantPanel.stories.js +2 -1
- package/package.json +1 -1
- package/src/components/contacts/sharePanel/ShareContactsContent.tsx +2 -2
- package/src/components/forms/dynamicForm/ItemFormPanel/ItemFormPanel.tsx +2 -2
- package/src/components/homeAssistant/panel/HomeAssistantPanel.tsx +2 -2
- package/src/stories/contacts/ContactsContent.stories.tsx +14 -11
- package/src/stories/forms/ItemFormPanel/ItemFormPanel.stories.tsx +22 -19
- package/src/stories/homeAssistant/panel/HomeAssistantPanel.stories.tsx +11 -8
|
@@ -9,9 +9,9 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
13
13
|
import { t } from 'i18next';
|
|
14
|
-
import {
|
|
14
|
+
import { DrawerHeader, DrawerBody, Stack, DrawerFooter, } from '@chakra-ui/react';
|
|
15
15
|
import { Contacts } from '../../../assets/images';
|
|
16
16
|
import { FooterButtons, FooterDrawer, PanelHeader, SelectedContacts, ShareContactSection, } from '../..';
|
|
17
17
|
import { useShareContactsContent } from '../../../hooks';
|
|
@@ -19,7 +19,7 @@ export const ShareContactsContent = (_a) => {
|
|
|
19
19
|
var { contacts, onClose, onShare } = _a, props = __rest(_a, ["contacts", "onClose", "onShare"]);
|
|
20
20
|
const { contactsSelected, recipientsToSend, handleAddRecipient, handleDeleteSelectedContact, handleShareContacts, } = useShareContactsContent({ contacts, onShare });
|
|
21
21
|
const numberOfContacts = Number(contacts.length);
|
|
22
|
-
return (_jsxs(
|
|
22
|
+
return (_jsxs(_Fragment, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { handleCloseButton: onClose, icon: Contacts, title: `${t('contacts.shareContact')} (${numberOfContacts})` }) }), _jsx(DrawerBody, { p: "0", overflowX: "hidden", overflowY: "scroll", bg: "lightBlue.2", children: _jsxs(Stack, { pb: "120px", spacing: "0", children: [_jsx(SelectedContacts, { contacts: contactsSelected, onDeleteSelected: handleDeleteSelectedContact }), _jsx(ShareContactSection, Object.assign({}, props, { onShare: handleAddRecipient }))] }) }), _jsx(DrawerFooter, { p: "0", children: _jsx(FooterDrawer, { isOpen: true, children: _jsx(FooterButtons, { button1: {
|
|
23
23
|
buttonStyle: 'primaryFooter',
|
|
24
24
|
label: t('buttons.send'),
|
|
25
25
|
isDisabled: Number(recipientsToSend.length) === 0,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
|
-
import { DrawerBody, DrawerHeader,
|
|
3
|
+
import { DrawerBody, DrawerHeader, DrawerFooter, Box, } from '@chakra-ui/react';
|
|
4
4
|
import { PanelHeader, FooterDrawer, ItemFormFooter, Overlay, Loading } from '../../..';
|
|
5
5
|
export const ItemFormPanel = ({ children, onClose, onSubmitForm, panelIcon, panelTitle, showOverlay = false, }) => {
|
|
6
6
|
const { firstChild, otherChildren } = useMemo(() => {
|
|
@@ -15,5 +15,5 @@ export const ItemFormPanel = ({ children, onClose, onSubmitForm, panelIcon, pane
|
|
|
15
15
|
}
|
|
16
16
|
return { firstChild, otherChildren };
|
|
17
17
|
}, [children]);
|
|
18
|
-
return (_jsxs(
|
|
18
|
+
return (_jsxs(_Fragment, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { handleCloseButton: onClose, icon: panelIcon, title: panelTitle }) }), _jsx(DrawerBody, { p: "0", overflowX: "hidden", bg: "lightBlue.1", children: firstChild ? (_jsxs(_Fragment, { children: [firstChild, _jsxs(Box, { position: "relative", mb: "200px", children: [_jsx(Overlay, { showOverlay: showOverlay, position: "absolute", w: "inherit", h: "inherit", zIndex: "9" }), otherChildren] })] })) : (_jsx(Loading, {})) }), _jsx(FooterDrawer, { isOpen: !showOverlay, children: _jsx(DrawerFooter, { w: "100%", py: "0", children: _jsx(ItemFormFooter, { onSave: onSubmitForm, onCancel: onClose }) }) })] }));
|
|
19
19
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { useState, useEffect } from 'react';
|
|
3
3
|
import { FormProvider } from 'react-hook-form';
|
|
4
4
|
import { t } from 'i18next';
|
|
5
|
-
import {
|
|
5
|
+
import { DrawerHeader, DrawerBody, Stack, Text, DrawerFooter, } from '@chakra-ui/react';
|
|
6
6
|
import { IA } from '../../../assets/images';
|
|
7
7
|
import { ApplianceSteps, SimpleDynamicForm, FooterButtons, HomeAssistantPanelStep, PanelHeader, } from '../..';
|
|
8
8
|
import { homeAssistantSteps } from '../../../helpers';
|
|
@@ -26,7 +26,7 @@ export const HomeAssistantPanel = ({ children, currentForm, currentStep, onAppli
|
|
|
26
26
|
const { form, updatedFields } = useSimpleDynamicForm({
|
|
27
27
|
fields: currentForm,
|
|
28
28
|
});
|
|
29
|
-
return (_jsxs(
|
|
29
|
+
return (_jsxs(_Fragment, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { handleCloseButton: onClose, title: t('homeAssistant.title'), icon: IA }) }), _jsxs(DrawerBody, { p: "0", children: [_jsx(HomeAssistantPanelStep, { currentStep: currentStep }), children, isAppliances && (_jsx(ApplianceSteps, { onClick: onApplianceClick, addedAppliances: addedAppliances })), _jsxs(Stack, { spacing: "base", p: "base", children: [_jsx(Text, { fontFamily: "secondary", fontSize: "sm", children: text }), _jsx(FormProvider, Object.assign({}, form, { children: _jsx(SimpleDynamicForm, { fields: currentForm }) }))] })] }), _jsx(DrawerFooter, { px: "0", py: "6", bg: "neutral.white", children: _jsx(FooterButtons, { button1: {
|
|
30
30
|
buttonStyle: 'secondaryFooter',
|
|
31
31
|
label: t('buttons.back'),
|
|
32
32
|
onClick: onBack,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react';
|
|
2
3
|
import { ContactsContent, RightPanel, ShareContactsContent } from '../../components';
|
|
3
4
|
import { ContactsMock, ContactsMockCompleted, menuMock } from '../../mocks';
|
|
4
5
|
import { Fragment, useState } from 'react';
|
|
@@ -44,5 +45,5 @@ export const ContactsContentComponent = (args) => {
|
|
|
44
45
|
const handleOnRemoveContact = (email) => {
|
|
45
46
|
setEmailsToShare(emailsToShare.filter((e) => e !== email));
|
|
46
47
|
};
|
|
47
|
-
return (_jsxs(Fragment, { children: [_jsx(RightPanel, { isOpen: true, onClose: () => null, children: _jsx(ContactsContent, Object.assign({}, args, { onShareContacts: handleSetContacts })) }), _jsx(RightPanel, { isOpen: sharePanel.openSharePanel, onClose: handleToggleSharePanel, children: _jsx(ShareContactsContent, { contacts: sharePanel.contacts, homefileContacts: ContactsMockCompleted, onClose: handleToggleSharePanel, onShare: action('onShare'), isLoading: loading, shareWithList: emailsToShare, onContactSearch: handleSearch, onDropdownSelect: handleShareWithList, onRemoveContact: handleOnRemoveContact }) })] }));
|
|
48
|
+
return (_jsxs(Fragment, { children: [_jsx(RightPanel, { isOpen: true, onClose: () => null, children: _jsx(ContactsContent, Object.assign({}, args, { onShareContacts: handleSetContacts })) }), _jsx(RightPanel, { isOpen: sharePanel.openSharePanel, onClose: handleToggleSharePanel, children: _jsx(DrawerContent, { bg: "lightBlue.1", children: _jsx(ShareContactsContent, { contacts: sharePanel.contacts, homefileContacts: ContactsMockCompleted, onClose: handleToggleSharePanel, onShare: action('onShare'), isLoading: loading, shareWithList: emailsToShare, onContactSearch: handleSearch, onDropdownSelect: handleShareWithList, onRemoveContact: handleOnRemoveContact }) }) })] }));
|
|
48
49
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react';
|
|
2
3
|
import { ItemFormPanel, ItemFormTabs, ItemNameHeader, ItemSubTypeSelect, RightPanel, } from '../../../components';
|
|
3
4
|
import { Paint } from '../../../assets/images/groups';
|
|
4
5
|
import { action } from '@storybook/addon-actions';
|
|
@@ -16,13 +17,13 @@ export default {
|
|
|
16
17
|
},
|
|
17
18
|
};
|
|
18
19
|
export const ItemFormPanelComponent = (args) => {
|
|
19
|
-
return (_jsx(RightPanel, { isOpen: true, onClose: () => null, children: _jsxs(ItemFormPanel, Object.assign({}, args, { children: [_jsx(ItemNameHeader, { id: "item-name-header", onSave: action('onSaveItemName') }), _jsx(ItemSubTypeSelect, { initialSubType: {
|
|
20
|
-
_id: '1',
|
|
21
|
-
name: 'Sub Type',
|
|
22
|
-
}, onSelectSubType: action('onSelectSubType'), label: "Category", subTypes: [
|
|
23
|
-
{
|
|
20
|
+
return (_jsx(RightPanel, { isOpen: true, onClose: () => null, children: _jsx(DrawerContent, { bg: "lightBlue.1", children: _jsxs(ItemFormPanel, Object.assign({}, args, { children: [_jsx(ItemNameHeader, { id: "item-name-header", onSave: action('onSaveItemName') }), _jsx(ItemSubTypeSelect, { initialSubType: {
|
|
24
21
|
_id: '1',
|
|
25
22
|
name: 'Sub Type',
|
|
26
|
-
},
|
|
27
|
-
|
|
23
|
+
}, onSelectSubType: action('onSelectSubType'), label: "Category", subTypes: [
|
|
24
|
+
{
|
|
25
|
+
_id: '1',
|
|
26
|
+
name: 'Sub Type',
|
|
27
|
+
},
|
|
28
|
+
] }), _jsx(ItemFormTabs, { form: contactFieldsMock })] })) }) }));
|
|
28
29
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react';
|
|
2
3
|
import { action } from '@storybook/addon-actions';
|
|
3
4
|
import { HomeAssistantPanel, RightPanel } from '../../../components';
|
|
4
5
|
import { homeAssitantStep1FormMock, homeAssitantStep2FormMock, homeAssitantStep3FormMock, homeAssitantStep4FormMock, homeAssitantStep5FormMock, homeAssitantStep6FormMock, } from '../../../mocks';
|
|
@@ -36,5 +37,5 @@ export const HomeAssistantPanelComponent = (args) => {
|
|
|
36
37
|
return prev - 1;
|
|
37
38
|
});
|
|
38
39
|
const currentForm = forms[currentStep];
|
|
39
|
-
return (_jsx(HomeAssistantPanel, Object.assign({}, args, { currentStep: currentStep, currentForm: currentForm, onNext: handleFormChange, onBack: handleBack, onSave: action('onSave') })));
|
|
40
|
+
return (_jsx(DrawerContent, { bg: "lightBlue.1", children: _jsx(HomeAssistantPanel, Object.assign({}, args, { currentStep: currentStep, currentForm: currentForm, onNext: handleFormChange, onBack: handleBack, onSave: action('onSave') })) }));
|
|
40
41
|
};
|
package/package.json
CHANGED
|
@@ -34,7 +34,7 @@ export const ShareContactsContent = ({
|
|
|
34
34
|
const numberOfContacts = Number(contacts.length)
|
|
35
35
|
|
|
36
36
|
return (
|
|
37
|
-
|
|
37
|
+
<>
|
|
38
38
|
<DrawerHeader p="0">
|
|
39
39
|
<PanelHeader
|
|
40
40
|
handleCloseButton={onClose}
|
|
@@ -63,6 +63,6 @@ export const ShareContactsContent = ({
|
|
|
63
63
|
/>
|
|
64
64
|
</FooterDrawer>
|
|
65
65
|
</DrawerFooter>
|
|
66
|
-
|
|
66
|
+
</>
|
|
67
67
|
)
|
|
68
68
|
}
|
|
@@ -40,7 +40,7 @@ export const ItemFormPanel = ({
|
|
|
40
40
|
}, [children])
|
|
41
41
|
|
|
42
42
|
return (
|
|
43
|
-
|
|
43
|
+
<>
|
|
44
44
|
<DrawerHeader p="0">
|
|
45
45
|
<PanelHeader
|
|
46
46
|
handleCloseButton={onClose}
|
|
@@ -75,6 +75,6 @@ export const ItemFormPanel = ({
|
|
|
75
75
|
<ItemFormFooter onSave={onSubmitForm} onCancel={onClose} />
|
|
76
76
|
</DrawerFooter>
|
|
77
77
|
</FooterDrawer>
|
|
78
|
-
|
|
78
|
+
</>
|
|
79
79
|
)
|
|
80
80
|
}
|
|
@@ -55,7 +55,7 @@ export const HomeAssistantPanel = ({
|
|
|
55
55
|
})
|
|
56
56
|
|
|
57
57
|
return (
|
|
58
|
-
|
|
58
|
+
<>
|
|
59
59
|
<DrawerHeader p="0">
|
|
60
60
|
<PanelHeader
|
|
61
61
|
handleCloseButton={onClose}
|
|
@@ -102,6 +102,6 @@ export const HomeAssistantPanel = ({
|
|
|
102
102
|
}}
|
|
103
103
|
/>
|
|
104
104
|
</DrawerFooter>
|
|
105
|
-
|
|
105
|
+
</>
|
|
106
106
|
)
|
|
107
107
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Meta } from '@storybook/react'
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react'
|
|
2
3
|
import { ContactsContent, RightPanel, ShareContactsContent } from '@/components'
|
|
3
4
|
import { ContactsMock, ContactsMockCompleted, menuMock } from '@/mocks'
|
|
4
5
|
import { Fragment, useState } from 'react'
|
|
@@ -69,17 +70,19 @@ export const ContactsContentComponent = (args: ContactsContentI) => {
|
|
|
69
70
|
isOpen={sharePanel.openSharePanel}
|
|
70
71
|
onClose={handleToggleSharePanel}
|
|
71
72
|
>
|
|
72
|
-
<
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
73
|
+
<DrawerContent bg="lightBlue.1">
|
|
74
|
+
<ShareContactsContent
|
|
75
|
+
contacts={sharePanel.contacts}
|
|
76
|
+
homefileContacts={ContactsMockCompleted}
|
|
77
|
+
onClose={handleToggleSharePanel}
|
|
78
|
+
onShare={action('onShare')}
|
|
79
|
+
isLoading={loading}
|
|
80
|
+
shareWithList={emailsToShare}
|
|
81
|
+
onContactSearch={handleSearch}
|
|
82
|
+
onDropdownSelect={handleShareWithList}
|
|
83
|
+
onRemoveContact={handleOnRemoveContact}
|
|
84
|
+
/>
|
|
85
|
+
</DrawerContent>
|
|
83
86
|
</RightPanel>
|
|
84
87
|
</Fragment>
|
|
85
88
|
)
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Meta } from '@storybook/react'
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react'
|
|
2
3
|
import {
|
|
3
4
|
ItemFormPanel,
|
|
4
5
|
ItemFormTabs,
|
|
@@ -27,27 +28,29 @@ export default {
|
|
|
27
28
|
export const ItemFormPanelComponent = (args: ItemFormPanelI) => {
|
|
28
29
|
return (
|
|
29
30
|
<RightPanel isOpen onClose={() => null}>
|
|
30
|
-
<
|
|
31
|
-
<
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
name: 'Sub Type',
|
|
39
|
-
}}
|
|
40
|
-
onSelectSubType={action('onSelectSubType')}
|
|
41
|
-
label="Category"
|
|
42
|
-
subTypes={[
|
|
43
|
-
{
|
|
31
|
+
<DrawerContent bg="lightBlue.1">
|
|
32
|
+
<ItemFormPanel {...args}>
|
|
33
|
+
<ItemNameHeader
|
|
34
|
+
id="item-name-header"
|
|
35
|
+
onSave={action('onSaveItemName')}
|
|
36
|
+
/>
|
|
37
|
+
<ItemSubTypeSelect
|
|
38
|
+
initialSubType={{
|
|
44
39
|
_id: '1',
|
|
45
40
|
name: 'Sub Type',
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
41
|
+
}}
|
|
42
|
+
onSelectSubType={action('onSelectSubType')}
|
|
43
|
+
label="Category"
|
|
44
|
+
subTypes={[
|
|
45
|
+
{
|
|
46
|
+
_id: '1',
|
|
47
|
+
name: 'Sub Type',
|
|
48
|
+
},
|
|
49
|
+
]}
|
|
50
|
+
/>
|
|
51
|
+
<ItemFormTabs form={contactFieldsMock} />
|
|
52
|
+
</ItemFormPanel>
|
|
53
|
+
</DrawerContent>
|
|
51
54
|
</RightPanel>
|
|
52
55
|
)
|
|
53
56
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Meta } from '@storybook/react'
|
|
2
|
+
import { DrawerContent } from '@chakra-ui/react'
|
|
2
3
|
import { action } from '@storybook/addon-actions'
|
|
3
4
|
import { HomeAssistantPanel, RightPanel } from '@/components'
|
|
4
5
|
import { HomeAssistantPanelI, ReportI } from '@/interfaces'
|
|
@@ -53,13 +54,15 @@ export const HomeAssistantPanelComponent = (args: HomeAssistantPanelI) => {
|
|
|
53
54
|
|
|
54
55
|
const currentForm = forms[currentStep]
|
|
55
56
|
return (
|
|
56
|
-
<
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
57
|
+
<DrawerContent bg="lightBlue.1">
|
|
58
|
+
<HomeAssistantPanel
|
|
59
|
+
{...args}
|
|
60
|
+
currentStep={currentStep}
|
|
61
|
+
currentForm={currentForm}
|
|
62
|
+
onNext={handleFormChange}
|
|
63
|
+
onBack={handleBack}
|
|
64
|
+
onSave={action('onSave')}
|
|
65
|
+
/>
|
|
66
|
+
</DrawerContent>
|
|
64
67
|
)
|
|
65
68
|
}
|