@mohamed-karawia/library 0.1.6 → 0.1.10
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/stories/helpers/util.js +16 -14
- package/mohamed-karawia-library-0.1.9.tgz +0 -0
- package/package.json +6 -4
- package/src/stories/helpers/util.js +1 -0
- package/.github/workflows/chromatic.yml +0 -26
- package/.storybook/main.js +0 -21
- package/.storybook/middleware.js +0 -28
- package/.storybook/preview.js +0 -9
- package/build-storybook.log +0 -2704
- package/dist/stories/API/API.stories.js +0 -24
- package/dist/stories/Agora/Chat/Chat.stories.js +0 -24
- package/dist/stories/Agora/Room/Room.stories.js +0 -24
- package/dist/stories/Buttons/Buttons/Buttons.stories.js +0 -39
- package/dist/stories/Buttons/ReactModal/ReactModal.stories.js +0 -30
- package/dist/stories/Chat/Chat.stories.js +0 -76
- package/dist/stories/Common Inputs/CheckboxGroup/CheckboxGroup.stories.js +0 -58
- package/dist/stories/Common Inputs/CustomAutoComplete/CustomAutoComplete.stories.js +0 -56
- package/dist/stories/Common Inputs/CustomDropzone/CustomDropzone.stories.js +0 -47
- package/dist/stories/Common Inputs/CustomSelect/CustomSelect.stories.js +0 -61
- package/dist/stories/Common Inputs/CustomTextarea/CustomTextarea.stories.js +0 -48
- package/dist/stories/Common Inputs/DatePicker/DatePicker.stories.js +0 -60
- package/dist/stories/Common Inputs/EditorComponent/EditorComponent.stories.js +0 -62
- package/dist/stories/Common Inputs/Formik/InputField/InputField.stories.js +0 -43
- package/dist/stories/Common Inputs/Formik/RadioField/RadioField.stories.js +0 -60
- package/dist/stories/Common Inputs/RadioInput/RadioInput.stories.js +0 -50
- package/dist/stories/Common Inputs/RichTextInput/RichTextInput.stories.js +0 -51
- package/dist/stories/Common Inputs/TextField/TextField.stories.js +0 -48
- package/dist/stories/Containers/BaseMaterial.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetBody.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetExample.stories.js +0 -24
- package/dist/stories/Containers/WidgetExample/WidgetHead.stories.js +0 -24
- package/dist/stories/Enrollment/Admin/CreateForm/CreateForm.stories.js +0 -22
- package/dist/stories/Enrollment/Admin/DetailedForm/DetailedForm.stories.js +0 -42
- package/dist/stories/Enrollment/Admin/ViewForms/ViewForms.stories.js +0 -65
- package/dist/stories/Enrollment/Guest/FillForm/FillForm.stories.js +0 -48
- package/dist/stories/Events/CreateEvent/CreateEvent.stories.js +0 -30
- package/dist/stories/Events/Event/Event.stories.js +0 -33
- package/dist/stories/Events/EventsList/EventsList.stories.js +0 -44
- package/dist/stories/Forms/AddPhoto/AddPhoto.stories.js +0 -47
- package/dist/stories/Forms/AddSong/AddSong.stories.js +0 -37
- package/dist/stories/Forms/AddVideo/AddVideo.stories.js +0 -33
- package/dist/stories/Forms/Create-Profile/CreateProfile.stories.js +0 -49
- package/dist/stories/Forms/Create-Profile/subcomponents/LogoUploader.stories.js +0 -42
- package/dist/stories/Forms/Create-Profile/subcomponents/ProfilePhoto.stories.js +0 -41
- package/dist/stories/Forms/Create-Profile/subcomponents/ResetBtn.stories.js +0 -32
- package/dist/stories/Forms/CreateAlbum/CreateAlbum.stories.js +0 -47
- package/dist/stories/Forms/CreateAnnouncementForm/CreateAnnouncementForm.stories.js +0 -58
- package/dist/stories/Forms/CreateMusicAlbum/CreateMusicAlbum.stories.js +0 -47
- package/dist/stories/Forms/CreateProfile/CreateProfile.stories.js +0 -24
- package/dist/stories/Forms/CreateProfile-3/CreateProfile.stories.js +0 -24
- package/dist/stories/Forms/CreateUser/CreateUser.stories.js +0 -26
- package/dist/stories/Forms/CreateVideoAlbum/CreateVideoAlbum.stories.js +0 -37
- package/dist/stories/Forms/Form/Form.stories.js +0 -24
- package/dist/stories/Forms/NewProfile/NewProfile.stories.js +0 -24
- package/dist/stories/Layout/Body/Body.stories.js +0 -30
- package/dist/stories/Layout/Center/Center.stories.js +0 -24
- package/dist/stories/Layout/Head/Head.stories.js +0 -24
- package/dist/stories/Layout/Left/Left.stories.js +0 -24
- package/dist/stories/Layout/Right/Right.stories.js +0 -24
- package/dist/stories/Library/CreateFolder/CreateFolder.stories.js +0 -45
- package/dist/stories/Library/Folders/Folders.stories.js +0 -55
- package/dist/stories/Library/Notes/Notes.stories.js +0 -42
- package/dist/stories/Library/ViewNote/ViewNote.stories.js +0 -24
- package/dist/stories/Music Album/ViewAlbum/ViewAlbum.stories.js +0 -115
- package/dist/stories/Music Album/ViewAlbums/ViewAlbums.stories.js +0 -107
- package/dist/stories/Navbar/Navbar.stories.js +0 -41
- package/dist/stories/Pages/Blank/Blank.stories.js +0 -24
- package/dist/stories/Pages/Centered/Centered.stories.js +0 -24
- package/dist/stories/Pages/Chat/Chat.stories.js +0 -74
- package/dist/stories/Pages/Enrollment/DetailedForm/DetailedForm.stories.js +0 -22
- package/dist/stories/Pages/Enrollment/FillForm/FillForm.stories.js +0 -22
- package/dist/stories/Pages/Enrollment/Forms/Forms.stories.js +0 -22
- package/dist/stories/Pages/Events/Event/Event.stories.js +0 -22
- package/dist/stories/Pages/Events/Events/Events.stories.js +0 -22
- package/dist/stories/Pages/Library/Folders/Library.stories.js +0 -22
- package/dist/stories/Pages/Library/Notes/Notes.stories.js +0 -22
- package/dist/stories/Pages/Music/MusicAlbum/Music.stories.js +0 -22
- package/dist/stories/Pages/Music/MusicAlbums/MusicAlbums.stories.js +0 -22
- package/dist/stories/Pages/Photos/Album/Album.stories.js +0 -22
- package/dist/stories/Pages/Photos/Albums/Albums.stories.js +0 -22
- package/dist/stories/Pages/Video/DetailedVideo/DetailedVideo.stories.js +0 -22
- package/dist/stories/Pages/Video/VideoAlbum/Video.stories.js +0 -22
- package/dist/stories/Pages/ViewWorld/ViewWorld.stories.js +0 -264
- package/dist/stories/Photo Album/DetailedPhoto/DetailedPhoto.stories.js +0 -32
- package/dist/stories/Photo Album/ViewAlbum/ViewAlbum.stories.js +0 -115
- package/dist/stories/Photo Album/ViewAlbums/ViewAlbums.stories.js +0 -102
- package/dist/stories/Reusable Components/Cards/Card-style-1/CardStyle1.stories.js +0 -35
- package/dist/stories/Reusable Components/Cards/Card-style-10/CardStyle10.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-11/CardStyle11.stories.js +0 -40
- package/dist/stories/Reusable Components/Cards/Card-style-2/CardStyle2.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-3/CardStyle3.stories.js +0 -34
- package/dist/stories/Reusable Components/Cards/Card-style-4/CardStyle4.stories.js +0 -39
- package/dist/stories/Reusable Components/Cards/Card-style-6/CardStyle6.stories.js +0 -27
- package/dist/stories/Reusable Components/Cards/Card-style-7/CardStyle7.stories.js +0 -37
- package/dist/stories/Reusable Components/Cards/Card-style-8/CardStyle8.stories.js +0 -44
- package/dist/stories/Reusable Components/Cards/Card-style-9/CardStyle9.stories.js +0 -27
- package/dist/stories/Reusable Components/Cards/Card.stories.js +0 -132
- package/dist/stories/Reusable Components/Controls/Controls.stories.js +0 -49
- package/dist/stories/Reusable Components/Gallery/Gallery.stories.js +0 -56
- package/dist/stories/Reusable Components/Lists/Cards/ListCard-1.stories.js +0 -1
- package/dist/stories/Reusable Components/Lists/List.stories.js +0 -1
- package/dist/stories/Reusable Components/Mention/Mention.stories.js +0 -66
- package/dist/stories/Reusable Components/ReusableForm/ReusableForm.stories.js +0 -207
- package/dist/stories/Reusable Components/ReusableHeader/ReusableHeader.stories.js +0 -35
- package/dist/stories/Reusable Components/ReusableList/ReusableList.stories.js +0 -84
- package/dist/stories/Reusable Components/SearchCard/SearchCard.stories.js +0 -24
- package/dist/stories/Reusable Components/SpaceContainer/SpaceContainer.stories.js +0 -80
- package/dist/stories/Reusable Components/Spinner/Spinner.stories.js +0 -22
- package/dist/stories/Reusable Components/WidgetContainer/WidgetContainer.stories.js +0 -80
- package/dist/stories/Spaces/WelcomeSpace/WelcomeSpace.stories.js +0 -24
- package/dist/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.stories.js +0 -101
- package/dist/stories/VideoAlbum/Comments/Comments.stories.js +0 -45
- package/dist/stories/VideoAlbum/VideoPlayer/VideoPlayer.stories.js +0 -149
- package/dist/stories/VideoAlbum/VideoSpace/VideoSpace.stories.js +0 -49
- package/dist/stories/VideoAlbum/ViewAlbum/ViewAlbum.stories.js +0 -113
- package/dist/stories/Widgets/LogoWidget/LogoWidget.stories.js +0 -26
- package/dist/stories/Widgets/MusicPlayer/MusicPlayer.stories.js +0 -44
- package/dist/stories/Widgets/MusicPlayerWidget/MusicPlayerWidget.stories.js +0 -52
- package/dist/stories/Widgets/SpacesList/SpacesList.stories.js +0 -52
- package/dist/stories/Widgets/SpacesList/SpacesListItem.stories.js +0 -24
- package/public/logo192.png +0 -0
- package/public/logo512.png +0 -0
- package/src/stories/API/API.stories.js +0 -10
- package/src/stories/Agora/Chat/Chat.stories.jsx +0 -10
- package/src/stories/Agora/Room/Room.stories.jsx +0 -10
- package/src/stories/Buttons/Buttons/Buttons.stories.jsx +0 -24
- package/src/stories/Buttons/ReactModal/ReactModal.stories.jsx +0 -18
- package/src/stories/Chat/Chat.stories.jsx +0 -59
- package/src/stories/Common Inputs/CheckboxGroup/CheckboxGroup.stories.jsx +0 -32
- package/src/stories/Common Inputs/CustomAutoComplete/CustomAutoComplete.stories.jsx +0 -35
- package/src/stories/Common Inputs/CustomDropzone/CustomDropzone.stories.jsx +0 -26
- package/src/stories/Common Inputs/CustomSelect/CustomSelect.stories.jsx +0 -36
- package/src/stories/Common Inputs/CustomTextarea/CustomTextarea.stories.jsx +0 -31
- package/src/stories/Common Inputs/DatePicker/DatePicker.stories.jsx +0 -47
- package/src/stories/Common Inputs/EditorComponent/EditorComponent.stories.jsx +0 -60
- package/src/stories/Common Inputs/Formik/InputField/InputField.stories.jsx +0 -27
- package/src/stories/Common Inputs/Formik/RadioField/RadioField.stories.jsx +0 -41
- package/src/stories/Common Inputs/RadioInput/RadioInput.stories.js +0 -30
- package/src/stories/Common Inputs/RichTextInput/RichTextInput.stories.js +0 -45
- package/src/stories/Common Inputs/TextField/TextField.stories.jsx +0 -31
- package/src/stories/Containers/BaseMaterial.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetBody.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetExample.stories.js +0 -10
- package/src/stories/Containers/WidgetExample/WidgetHead.stories.js +0 -10
- package/src/stories/Enrollment/Admin/CreateForm/CreateForm.stories.jsx +0 -8
- package/src/stories/Enrollment/Admin/DetailedForm/DetailedForm.stories.jsx +0 -36
- package/src/stories/Enrollment/Admin/ViewForms/ViewForms.stories.jsx +0 -66
- package/src/stories/Enrollment/Guest/FillForm/FillForm.stories.jsx +0 -27
- package/src/stories/Events/CreateEvent/CreateEvent.stories.jsx +0 -19
- package/src/stories/Events/Event/Event.stories.jsx +0 -21
- package/src/stories/Events/EventsList/EventsList.stories.jsx +0 -25
- package/src/stories/Forms/AddPhoto/AddPhoto.stories.jsx +0 -37
- package/src/stories/Forms/AddSong/AddSong.stories.jsx +0 -26
- package/src/stories/Forms/AddVideo/AddVideo.stories.jsx +0 -20
- package/src/stories/Forms/Create-Profile/CreateProfile.stories.jsx +0 -36
- package/src/stories/Forms/Create-Profile/subcomponents/LogoUploader.stories.jsx +0 -27
- package/src/stories/Forms/Create-Profile/subcomponents/ProfilePhoto.stories.jsx +0 -26
- package/src/stories/Forms/Create-Profile/subcomponents/ResetBtn.stories.jsx +0 -18
- package/src/stories/Forms/CreateAlbum/CreateAlbum.stories.jsx +0 -37
- package/src/stories/Forms/CreateAnnouncementForm/CreateAnnouncementForm.stories.jsx +0 -44
- package/src/stories/Forms/CreateMusicAlbum/CreateMusicAlbum.stories.jsx +0 -38
- package/src/stories/Forms/CreateProfile/CreateProfile.stories.js +0 -10
- package/src/stories/Forms/CreateProfile-3/CreateProfile.stories.js +0 -10
- package/src/stories/Forms/CreateUser/CreateUser.stories.js +0 -10
- package/src/stories/Forms/CreateVideoAlbum/CreateVideoAlbum.stories.jsx +0 -23
- package/src/stories/Forms/Form/Form.stories.js +0 -10
- package/src/stories/Forms/NewProfile/NewProfile.stories.jsx +0 -10
- package/src/stories/Layout/Body/Body.stories.js +0 -26
- package/src/stories/Layout/Center/Center.stories.js +0 -14
- package/src/stories/Layout/Head/Head.stories.js +0 -10
- package/src/stories/Layout/Left/Left.stories.js +0 -14
- package/src/stories/Layout/Right/Right.stories.js +0 -14
- package/src/stories/Library/CreateFolder/CreateFolder.stories.jsx +0 -32
- package/src/stories/Library/Folders/Folders.stories.jsx +0 -34
- package/src/stories/Library/Notes/Notes.stories.jsx +0 -24
- package/src/stories/Library/ViewNote/ViewNote.stories.jsx +0 -16
- package/src/stories/Music Album/ViewAlbum/ViewAlbum.stories.jsx +0 -60
- package/src/stories/Music Album/ViewAlbums/ViewAlbums.stories.jsx +0 -57
- package/src/stories/Navbar/Navbar.stories.js +0 -25
- package/src/stories/Pages/Blank/Blank.stories.js +0 -10
- package/src/stories/Pages/Centered/Centered.stories.js +0 -14
- package/src/stories/Pages/Chat/Chat.stories.jsx +0 -53
- package/src/stories/Pages/Enrollment/DetailedForm/DetailedForm.stories.jsx +0 -8
- package/src/stories/Pages/Enrollment/FillForm/FillForm.stories.jsx +0 -8
- package/src/stories/Pages/Enrollment/Forms/Forms.stories.jsx +0 -8
- package/src/stories/Pages/Events/Event/Event.stories.jsx +0 -8
- package/src/stories/Pages/Events/Events/Events.stories.jsx +0 -8
- package/src/stories/Pages/Library/Folders/Library.stories.jsx +0 -8
- package/src/stories/Pages/Library/Notes/Notes.stories.jsx +0 -8
- package/src/stories/Pages/Music/MusicAlbum/Music.stories.jsx +0 -8
- package/src/stories/Pages/Music/MusicAlbums/MusicAlbums.stories.jsx +0 -8
- package/src/stories/Pages/Photos/Album/Album.stories.jsx +0 -8
- package/src/stories/Pages/Photos/Albums/Albums.stories.jsx +0 -8
- package/src/stories/Pages/Video/DetailedVideo/DetailedVideo.stories.jsx +0 -8
- package/src/stories/Pages/Video/VideoAlbum/Video.stories.jsx +0 -8
- package/src/stories/Pages/ViewWorld/ViewWorld.stories.js +0 -270
- package/src/stories/Photo Album/DetailedPhoto/DetailedPhoto.stories.jsx +0 -20
- package/src/stories/Photo Album/ViewAlbum/ViewAlbum.stories.jsx +0 -60
- package/src/stories/Photo Album/ViewAlbums/ViewAlbums.stories.jsx +0 -59
- package/src/stories/Reusable Components/Cards/Card-style-1/CardStyle1.stories.jsx +0 -22
- package/src/stories/Reusable Components/Cards/Card-style-10/CardStyle10.stories.jsx +0 -21
- package/src/stories/Reusable Components/Cards/Card-style-11/CardStyle11.stories.jsx +0 -21
- package/src/stories/Reusable Components/Cards/Card-style-2/CardStyle2.stories.jsx +0 -24
- package/src/stories/Reusable Components/Cards/Card-style-3/CardStyle3.stories.jsx +0 -22
- package/src/stories/Reusable Components/Cards/Card-style-4/CardStyle4.stories.jsx +0 -25
- package/src/stories/Reusable Components/Cards/Card-style-6/CardStyle6.stories.jsx +0 -9
- package/src/stories/Reusable Components/Cards/Card-style-7/CardStyle7.stories.jsx +0 -23
- package/src/stories/Reusable Components/Cards/Card-style-8/CardStyle8.stories.jsx +0 -29
- package/src/stories/Reusable Components/Cards/Card-style-9/CardStyle9.stories.jsx +0 -14
- package/src/stories/Reusable Components/Cards/Card.stories.jsx +0 -118
- package/src/stories/Reusable Components/Controls/Controls.stories.jsx +0 -24
- package/src/stories/Reusable Components/Gallery/Gallery.stories.jsx +0 -43
- package/src/stories/Reusable Components/Lists/Cards/ListCard-1.stories.js +0 -0
- package/src/stories/Reusable Components/Lists/List.stories.js +0 -0
- package/src/stories/Reusable Components/Mention/Mention.stories.jsx +0 -55
- package/src/stories/Reusable Components/ReusableForm/ReusableForm.stories.jsx +0 -167
- package/src/stories/Reusable Components/ReusableHeader/ReusableHeader.stories.jsx +0 -22
- package/src/stories/Reusable Components/ReusableList/ReusableList.stories.jsx +0 -70
- package/src/stories/Reusable Components/SearchCard/SearchCard.stories.js +0 -10
- package/src/stories/Reusable Components/SpaceContainer/SpaceContainer.stories.jsx +0 -78
- package/src/stories/Reusable Components/Spinner/Spinner.stories.jsx +0 -8
- package/src/stories/Reusable Components/WidgetContainer/WidgetContainer.stories.jsx +0 -61
- package/src/stories/Spaces/WelcomeSpace/WelcomeSpace.stories.js +0 -10
- package/src/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.stories.jsx +0 -59
- package/src/stories/VideoAlbum/Comments/Comments.stories.jsx +0 -18
- package/src/stories/VideoAlbum/VideoPlayer/VideoPlayer.stories.jsx +0 -82
- package/src/stories/VideoAlbum/VideoSpace/VideoSpace.stories.jsx +0 -23
- package/src/stories/VideoAlbum/ViewAlbum/ViewAlbum.stories.jsx +0 -57
- package/src/stories/Widgets/LogoWidget/LogoWidget.stories.js +0 -12
- package/src/stories/Widgets/MusicPlayer/MusicPlayer.stories.jsx +0 -23
- package/src/stories/Widgets/MusicPlayerWidget/MusicPlayerWidget.stories.jsx +0 -33
- package/src/stories/Widgets/SpacesList/SpacesList.stories.jsx +0 -27
- package/src/stories/Widgets/SpacesList/SpacesListItem.stories.jsx +0 -10
- package/src/stories/assets/images/album1.jpg +0 -0
- package/src/stories/assets/images/album2.jpg +0 -0
- package/src/stories/assets/images/album3.jpg +0 -0
- package/src/stories/assets/images/album4.jpg +0 -0
- package/src/stories/assets/images/album5.jpg +0 -0
- package/src/stories/assets/images/album6.jpg +0 -0
- package/src/stories/assets/images/art.jpg +0 -0
- package/src/stories/assets/images/dance.jpg +0 -0
- package/src/stories/assets/images/football.jpg +0 -0
- package/src/stories/assets/images/music.jpg +0 -0
- package/src/stories/assets/images/music1.jpg +0 -0
- package/src/stories/assets/images/music2.jpg +0 -0
- package/src/stories/assets/images/music3.jpg +0 -0
- package/src/stories/assets/images/music4.jpg +0 -0
- package/src/stories/assets/images/music5.jpg +0 -0
- package/src/stories/assets/images/music6.jpg +0 -0
- package/src/stories/assets/images/reset.png +0 -0
- package/src/stories/assets/images/robotics.jpg +0 -0
- package/src/stories/assets/images/tennis.jpg +0 -0
@@ -1,59 +0,0 @@
|
|
1
|
-
import Chat from './Chat';
|
2
|
-
|
3
|
-
export default {
|
4
|
-
title: 'Chat/Chat Space',
|
5
|
-
component: Chat
|
6
|
-
}
|
7
|
-
|
8
|
-
const data = [
|
9
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
10
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test ', media:(<img src="https://arabhardware.net/wp-content/uploads/2020/03/valorant-2020-4k-0f-scaled.jpg"/>)},
|
11
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
12
|
-
{username: 'Test User', img:"https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png", date:'5/11/2021', text: 'This is fake chat test This is fake chat test This is fake chat test This is fake chat test This is fake chat test '},
|
13
|
-
]
|
14
|
-
|
15
|
-
const users = [
|
16
|
-
{
|
17
|
-
id: 'walter',
|
18
|
-
display: 'Walter White',
|
19
|
-
},
|
20
|
-
{
|
21
|
-
id: 'jesse',
|
22
|
-
display: 'Jesse Pinkman',
|
23
|
-
},
|
24
|
-
{
|
25
|
-
id: 'gus',
|
26
|
-
display: 'Gustavo "Gus" Fring',
|
27
|
-
},
|
28
|
-
{
|
29
|
-
id: 'saul',
|
30
|
-
display: 'Saul Goodman',
|
31
|
-
},
|
32
|
-
{
|
33
|
-
id: 'hank',
|
34
|
-
display: 'Hank Schrader',
|
35
|
-
},
|
36
|
-
{
|
37
|
-
id: 'skyler',
|
38
|
-
display: 'Skyler White',
|
39
|
-
},
|
40
|
-
{
|
41
|
-
id: 'mike',
|
42
|
-
display: 'Mike Ehrmantraut',
|
43
|
-
},
|
44
|
-
{
|
45
|
-
id: 'lydia',
|
46
|
-
display: 'Lydìã Rôdarté-Qüayle',
|
47
|
-
},
|
48
|
-
]
|
49
|
-
|
50
|
-
const Template = (args) => (
|
51
|
-
<Chat
|
52
|
-
{...args} />
|
53
|
-
);
|
54
|
-
|
55
|
-
export const ChatSpace = Template.bind({});
|
56
|
-
ChatSpace.args = {
|
57
|
-
data,
|
58
|
-
users
|
59
|
-
};
|
@@ -1,32 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import withFormik from "storybook-formik";
|
3
|
-
import * as Yup from 'yup';
|
4
|
-
|
5
|
-
import CheckboxGroup from './CheckboxGroup';
|
6
|
-
|
7
|
-
const formSchema = Yup.object().shape({
|
8
|
-
acceptTerms: Yup.array()
|
9
|
-
.min(1, 'You must choose at least one element'),
|
10
|
-
});
|
11
|
-
|
12
|
-
const options = [
|
13
|
-
{label: 'option 1', value: '1'},
|
14
|
-
{label: 'option 2', value: '2'},
|
15
|
-
{label: 'option 3', value: '3'},
|
16
|
-
]
|
17
|
-
|
18
|
-
export default {
|
19
|
-
title: 'Common Inputs/Checkbox Group',
|
20
|
-
component: CheckboxGroup,
|
21
|
-
decorators: [withFormik],
|
22
|
-
parameters: {
|
23
|
-
formik: {
|
24
|
-
initialValues: {
|
25
|
-
acceptTerms: []
|
26
|
-
},
|
27
|
-
validationSchema: formSchema,
|
28
|
-
},
|
29
|
-
}
|
30
|
-
};
|
31
|
-
|
32
|
-
export const CheckBoxGroup = args => <CheckboxGroup label="Checkbox Group" name="acceptTerms" options={options} {...args} />
|
@@ -1,35 +0,0 @@
|
|
1
|
-
import React, { useState } from 'react';
|
2
|
-
// import withFormik from "storybook-formik";
|
3
|
-
// import * as Yup from 'yup';
|
4
|
-
|
5
|
-
import CustomAutoComplete from './CustomAutoComplete';
|
6
|
-
|
7
|
-
// const formSchema = Yup.object().shape({
|
8
|
-
// search: Yup.string()
|
9
|
-
// .required("Required"),
|
10
|
-
// });
|
11
|
-
|
12
|
-
|
13
|
-
export default {
|
14
|
-
title: 'Common Inputs/Custom AutoComplete',
|
15
|
-
component: CustomAutoComplete,
|
16
|
-
// decorators: [withFormik],
|
17
|
-
// parameters: {
|
18
|
-
// formik: {
|
19
|
-
// initialValues: {
|
20
|
-
// search: ''
|
21
|
-
// },
|
22
|
-
// validationSchema: formSchema,
|
23
|
-
// },
|
24
|
-
// }
|
25
|
-
};
|
26
|
-
|
27
|
-
export const AutoComplete = args =>
|
28
|
-
(<CustomAutoComplete
|
29
|
-
label="themes"
|
30
|
-
items={[
|
31
|
-
{ id: 'foo', label: 'foo' },
|
32
|
-
{ id: 'bar', label: 'bar' },
|
33
|
-
{ id: 'baz', label: 'baz' },
|
34
|
-
]} name="search" {...args}
|
35
|
-
/>)
|
@@ -1,26 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import withFormik from "storybook-formik";
|
3
|
-
import * as Yup from 'yup';
|
4
|
-
|
5
|
-
import CustomDropZone from './CustomDropZone';
|
6
|
-
|
7
|
-
const formSchema = Yup.object().shape({
|
8
|
-
file: Yup.object()
|
9
|
-
.required("Required"),
|
10
|
-
});
|
11
|
-
|
12
|
-
export default {
|
13
|
-
title: 'Common Inputs/Custom Dropzone',
|
14
|
-
component: CustomDropZone,
|
15
|
-
decorators: [withFormik],
|
16
|
-
parameters: {
|
17
|
-
formik: {
|
18
|
-
initialValues: {
|
19
|
-
file: ''
|
20
|
-
},
|
21
|
-
validationSchema: formSchema,
|
22
|
-
},
|
23
|
-
}
|
24
|
-
};
|
25
|
-
|
26
|
-
export const Dropzone = args => <CustomDropZone label="Image" name="file" {...args} />
|
@@ -1,36 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import withFormik from "storybook-formik";
|
3
|
-
import * as Yup from 'yup';
|
4
|
-
|
5
|
-
import CustomSelect from './CustomSelect';
|
6
|
-
|
7
|
-
const formSchema = Yup.object().shape({
|
8
|
-
name: Yup.string()
|
9
|
-
.required("Required"),
|
10
|
-
});
|
11
|
-
|
12
|
-
const options = [
|
13
|
-
{label: 'select an option', value: ''},
|
14
|
-
{label: 'option 1', value: '1'},
|
15
|
-
{label: 'option 2', value: '2'},
|
16
|
-
{label: 'option 3', value: '3'},
|
17
|
-
]
|
18
|
-
|
19
|
-
export default {
|
20
|
-
title: 'Common Inputs/Custom Select',
|
21
|
-
component: CustomSelect,
|
22
|
-
decorators: [withFormik],
|
23
|
-
parameters: {
|
24
|
-
formik: {
|
25
|
-
initialValues: {
|
26
|
-
name: '',
|
27
|
-
},
|
28
|
-
validationSchema: formSchema,
|
29
|
-
},
|
30
|
-
}
|
31
|
-
};
|
32
|
-
|
33
|
-
export const Select = args => {
|
34
|
-
|
35
|
-
return <CustomSelect label="options" options={options} name="name" {...args} />
|
36
|
-
}
|
@@ -1,31 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import withFormik from "storybook-formik";
|
4
|
-
import * as Yup from 'yup';
|
5
|
-
|
6
|
-
import CustomTextarea from './CustomTextarea';
|
7
|
-
|
8
|
-
const formSchema = Yup.object().shape({
|
9
|
-
text: Yup.string()
|
10
|
-
.required("Required"),
|
11
|
-
});
|
12
|
-
|
13
|
-
export default {
|
14
|
-
title: 'Common Inputs/Custom Textarea',
|
15
|
-
component: CustomTextarea,
|
16
|
-
decorators: [withFormik],
|
17
|
-
parameters: {
|
18
|
-
formik: {
|
19
|
-
initialValues: {
|
20
|
-
text: '',
|
21
|
-
validationSchema: formSchema
|
22
|
-
},
|
23
|
-
validationSchema: formSchema,
|
24
|
-
},
|
25
|
-
}
|
26
|
-
}
|
27
|
-
|
28
|
-
export const TextArea = (args) => {
|
29
|
-
|
30
|
-
return <CustomTextarea name="text" label="text" {...args} />
|
31
|
-
}
|
@@ -1,47 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
|
3
|
-
import withFormik from "storybook-formik";
|
4
|
-
|
5
|
-
import DatePicker from './DatePicker';
|
6
|
-
import SingleDatePicker from './SingleDatePicker';
|
7
|
-
|
8
|
-
import * as Yup from 'yup';
|
9
|
-
|
10
|
-
const datePickerSchema = Yup.object().shape({
|
11
|
-
date: Yup.object().shape({
|
12
|
-
startDate: Yup.object()
|
13
|
-
.required("Required")
|
14
|
-
.typeError('Invalid Start Date'),
|
15
|
-
endDate: Yup.object()
|
16
|
-
.required("Required")
|
17
|
-
.typeError('Invalid End Date')
|
18
|
-
}),
|
19
|
-
singleDate: Yup.object()
|
20
|
-
.required("Required")
|
21
|
-
.typeError('Invalid Date'),
|
22
|
-
});
|
23
|
-
|
24
|
-
|
25
|
-
export default {
|
26
|
-
title: 'Common Inputs/Date Picker',
|
27
|
-
component: DatePicker,
|
28
|
-
decorators: [withFormik],
|
29
|
-
parameters: {
|
30
|
-
formik: {
|
31
|
-
initialValues: {
|
32
|
-
date: {
|
33
|
-
startDate: null,
|
34
|
-
endDate: null
|
35
|
-
},
|
36
|
-
singleDate: null
|
37
|
-
},
|
38
|
-
validationSchema: datePickerSchema
|
39
|
-
},
|
40
|
-
}
|
41
|
-
}
|
42
|
-
|
43
|
-
|
44
|
-
export const date = args => <>
|
45
|
-
<DatePicker label="Double Date Picker" name='date' {...args} />
|
46
|
-
<SingleDatePicker label="Single Date Picker" name='singleDate' {...args} />
|
47
|
-
</>
|
@@ -1,60 +0,0 @@
|
|
1
|
-
import EditorComponent from "./EditorComponent";
|
2
|
-
import BaseMaterial from "../../Containers/BaseMaterial";
|
3
|
-
|
4
|
-
export default {
|
5
|
-
title: 'Common Inputs/EditorComponent',
|
6
|
-
component: EditorComponent
|
7
|
-
}
|
8
|
-
|
9
|
-
const data = {
|
10
|
-
blocks: [
|
11
|
-
{
|
12
|
-
type: "header",
|
13
|
-
data: {
|
14
|
-
text: "Editor.js",
|
15
|
-
level: 1
|
16
|
-
}
|
17
|
-
},
|
18
|
-
{
|
19
|
-
type: "paragraph",
|
20
|
-
data: {
|
21
|
-
text:
|
22
|
-
"Hey. Meet the new Editor. On this page you can see it in action — try to edit this text."
|
23
|
-
}
|
24
|
-
},
|
25
|
-
{
|
26
|
-
type: 'image',
|
27
|
-
"data" : {
|
28
|
-
"file": {
|
29
|
-
"url" : "https://i.ytimg.com/vi/MPV2METPeJU/maxresdefault.jpg"
|
30
|
-
},
|
31
|
-
"caption" : "Caption Example",
|
32
|
-
"withBorder" : false,
|
33
|
-
"withBackground" : false,
|
34
|
-
"stretched" : false
|
35
|
-
}
|
36
|
-
},
|
37
|
-
{
|
38
|
-
"type" : "paragraph",
|
39
|
-
"data" : {
|
40
|
-
"text" : "Create a directory for your module, enter it and run <mark class=\"cdx-marker\">npm init</mark> command."
|
41
|
-
}
|
42
|
-
},
|
43
|
-
{
|
44
|
-
"type" : "table",
|
45
|
-
"data" : {
|
46
|
-
"withHeadings": true,
|
47
|
-
"content" : [ [ "Kine", "Pigs", "Chicken" ], [ "1 pcs", "3 pcs", "12 pcs" ], [ "100$", "200$", "150$" ] ]
|
48
|
-
}
|
49
|
-
}
|
50
|
-
|
51
|
-
]
|
52
|
-
};
|
53
|
-
|
54
|
-
export const Editor = args => {
|
55
|
-
return (
|
56
|
-
<BaseMaterial>
|
57
|
-
<EditorComponent data={data} {...args} />
|
58
|
-
</BaseMaterial>
|
59
|
-
)
|
60
|
-
}
|
@@ -1,27 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import InputField from './InputField'
|
3
|
-
|
4
|
-
import withFormik from 'storybook-formik'
|
5
|
-
|
6
|
-
export default {
|
7
|
-
component: InputField,
|
8
|
-
title: 'Common Inputs/Formik/InputField',
|
9
|
-
decorators: [withFormik]
|
10
|
-
}
|
11
|
-
|
12
|
-
const Template = args => <InputField {...args} />
|
13
|
-
|
14
|
-
export const TextInput = Template.bind({})
|
15
|
-
TextInput.args = {
|
16
|
-
name: 'username',
|
17
|
-
type: 'text',
|
18
|
-
placeholder: 'username'
|
19
|
-
}
|
20
|
-
TextInput.parameters = {
|
21
|
-
formik: {
|
22
|
-
initialValues: {
|
23
|
-
username: ''
|
24
|
-
}
|
25
|
-
},
|
26
|
-
onSubmit: v => console.log(v)
|
27
|
-
}
|
@@ -1,41 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import RadioField from './RadioField'
|
3
|
-
|
4
|
-
import withFormik from 'storybook-formik'
|
5
|
-
|
6
|
-
export default {
|
7
|
-
component: RadioField,
|
8
|
-
title: 'Common Inputs/Formik/RadioField',
|
9
|
-
decorators: [withFormik]
|
10
|
-
}
|
11
|
-
|
12
|
-
const Template = args => <RadioField {...args} />
|
13
|
-
|
14
|
-
export const Preset = Template.bind({})
|
15
|
-
Preset.args = {
|
16
|
-
name: 'preset',
|
17
|
-
value: 'Preset 1',
|
18
|
-
children: 'Preset 1'
|
19
|
-
}
|
20
|
-
Preset.parameters = {
|
21
|
-
formik: {
|
22
|
-
initialValues: {
|
23
|
-
preset: ''
|
24
|
-
}
|
25
|
-
},
|
26
|
-
onSubmit: v => console.log(v)
|
27
|
-
}
|
28
|
-
export const Theme = Template.bind({})
|
29
|
-
Theme.args = {
|
30
|
-
name: 'themeSelected',
|
31
|
-
value: 'Theme 1',
|
32
|
-
children: 'Theme 1',
|
33
|
-
}
|
34
|
-
Theme.parameters = {
|
35
|
-
formik: {
|
36
|
-
initialValues: {
|
37
|
-
theme: ''
|
38
|
-
}
|
39
|
-
},
|
40
|
-
onSubmit: v => console.log(v)
|
41
|
-
}
|
@@ -1,30 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
|
3
|
-
import RadioInput from './RadioInput';
|
4
|
-
|
5
|
-
export default {
|
6
|
-
title: 'Common Inputs/RadioInput/Item',
|
7
|
-
component: RadioInput,
|
8
|
-
argTypes: {
|
9
|
-
list: {
|
10
|
-
control: { type: 'object' },
|
11
|
-
},
|
12
|
-
title: {
|
13
|
-
control: { type: 'text' },
|
14
|
-
},
|
15
|
-
margin: {
|
16
|
-
control: { type: 'number' },
|
17
|
-
},
|
18
|
-
borderColor: {
|
19
|
-
control: 'color',
|
20
|
-
},
|
21
|
-
titleFontSize: {
|
22
|
-
control: 'number',
|
23
|
-
},
|
24
|
-
descriptionFontSize: {
|
25
|
-
control: 'number',
|
26
|
-
},
|
27
|
-
},
|
28
|
-
};
|
29
|
-
|
30
|
-
export const Default = (args) => <RadioInput {...args} />;
|
@@ -1,45 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
|
3
|
-
import RichTextInput from './RichTextInput';
|
4
|
-
|
5
|
-
export default {
|
6
|
-
title: 'Common Inputs/RichTextInput',
|
7
|
-
component: RichTextInput,
|
8
|
-
};
|
9
|
-
|
10
|
-
const users = [
|
11
|
-
{
|
12
|
-
id: 'walter',
|
13
|
-
display: 'Walter White',
|
14
|
-
},
|
15
|
-
{
|
16
|
-
id: 'jesse',
|
17
|
-
display: 'Jesse Pinkman',
|
18
|
-
},
|
19
|
-
{
|
20
|
-
id: 'gus',
|
21
|
-
display: 'Gustavo "Gus" Fring',
|
22
|
-
},
|
23
|
-
{
|
24
|
-
id: 'saul',
|
25
|
-
display: 'Saul Goodman',
|
26
|
-
},
|
27
|
-
{
|
28
|
-
id: 'hank',
|
29
|
-
display: 'Hank Schrader',
|
30
|
-
},
|
31
|
-
{
|
32
|
-
id: 'skyler',
|
33
|
-
display: 'Skyler White',
|
34
|
-
},
|
35
|
-
{
|
36
|
-
id: 'mike',
|
37
|
-
display: 'Mike Ehrmantraut',
|
38
|
-
},
|
39
|
-
{
|
40
|
-
id: 'lydia',
|
41
|
-
display: 'Lydìã Rôdarté-Qüayle',
|
42
|
-
},
|
43
|
-
]
|
44
|
-
|
45
|
-
export const Default = (args) => <RichTextInput users={users} {...args} />
|
@@ -1,31 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import withFormik from "storybook-formik";
|
4
|
-
import * as Yup from 'yup';
|
5
|
-
|
6
|
-
import CustomTextField from './TextField';
|
7
|
-
|
8
|
-
const formSchema = Yup.object().shape({
|
9
|
-
userName: Yup.string()
|
10
|
-
.required("Required"),
|
11
|
-
});
|
12
|
-
|
13
|
-
export default {
|
14
|
-
title: 'Common Inputs/TextField',
|
15
|
-
component: CustomTextField,
|
16
|
-
decorators: [withFormik],
|
17
|
-
parameters: {
|
18
|
-
formik: {
|
19
|
-
initialValues: {
|
20
|
-
userName: '',
|
21
|
-
validationSchema: formSchema
|
22
|
-
},
|
23
|
-
validationSchema: formSchema,
|
24
|
-
},
|
25
|
-
}
|
26
|
-
}
|
27
|
-
|
28
|
-
export const TextInput = (args) => {
|
29
|
-
|
30
|
-
return <CustomTextField name="userName" label="User Name" {...args} />
|
31
|
-
}
|
@@ -1,36 +0,0 @@
|
|
1
|
-
import DetailedForm from "./DetailedForm";
|
2
|
-
|
3
|
-
export default {
|
4
|
-
title: 'Enrollment/Admin/Detailed Form',
|
5
|
-
component: DetailedForm
|
6
|
-
}
|
7
|
-
|
8
|
-
const questions = [
|
9
|
-
{
|
10
|
-
title: 'Question 1 ?',
|
11
|
-
description: 'Answer for question one'
|
12
|
-
},
|
13
|
-
{
|
14
|
-
title: 'Question 2 ?',
|
15
|
-
description: 'Answer for question two'
|
16
|
-
},
|
17
|
-
{
|
18
|
-
title: 'Question 3 ?',
|
19
|
-
description: 'Answer for question three'
|
20
|
-
},
|
21
|
-
{
|
22
|
-
title: 'Question 4 ?',
|
23
|
-
description: 'Answer for question four'
|
24
|
-
},
|
25
|
-
{
|
26
|
-
title: 'Question 5 ?',
|
27
|
-
description: 'Answer for question five'
|
28
|
-
},
|
29
|
-
]
|
30
|
-
|
31
|
-
export const Form = args =>
|
32
|
-
<DetailedForm
|
33
|
-
userName="User Name"
|
34
|
-
userImg="https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png"
|
35
|
-
questions={questions}
|
36
|
-
{...args} />
|
@@ -1,66 +0,0 @@
|
|
1
|
-
import ViewForms from './ViewForms';
|
2
|
-
|
3
|
-
export default {
|
4
|
-
title: 'Enrollment/Admin/Submitted Forms',
|
5
|
-
component: ViewForms
|
6
|
-
}
|
7
|
-
|
8
|
-
const data = [
|
9
|
-
{
|
10
|
-
title: 'Pending',
|
11
|
-
data: [
|
12
|
-
{
|
13
|
-
username: 'User one',
|
14
|
-
answered: '3/5',
|
15
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
16
|
-
status: 'pending'
|
17
|
-
},
|
18
|
-
{
|
19
|
-
username: 'User Two',
|
20
|
-
answered: '5/5',
|
21
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
22
|
-
status: 'pending'
|
23
|
-
},
|
24
|
-
{
|
25
|
-
username: 'User Three',
|
26
|
-
answered: '5/5',
|
27
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
28
|
-
status: 'pending'
|
29
|
-
},
|
30
|
-
],
|
31
|
-
priority: 1
|
32
|
-
},
|
33
|
-
{
|
34
|
-
title: 'In Review',
|
35
|
-
data: [
|
36
|
-
{
|
37
|
-
username: 'User Four',
|
38
|
-
answered: '2/5',
|
39
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
40
|
-
status: 'inReview'
|
41
|
-
},
|
42
|
-
{
|
43
|
-
username: 'User Five',
|
44
|
-
answered: '1/5',
|
45
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
46
|
-
status: 'inReview'
|
47
|
-
},
|
48
|
-
{
|
49
|
-
username: 'User Six',
|
50
|
-
answered: '3/5',
|
51
|
-
img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
|
52
|
-
status: 'inReview'
|
53
|
-
},
|
54
|
-
],
|
55
|
-
priority: 2
|
56
|
-
},
|
57
|
-
]
|
58
|
-
|
59
|
-
const Template = (args) => (<ViewForms
|
60
|
-
{...args} />
|
61
|
-
);
|
62
|
-
|
63
|
-
export const forms = Template.bind({});
|
64
|
-
forms.args = {
|
65
|
-
data: data,
|
66
|
-
}
|