@mohamed-karawia/library 0.1.4 → 0.1.8

package/src/stories/Chat/Chat.stories.jsx

@@ -1,59 +0,0 @@
-import Chat from './Chat';
-
-export default {
-    title: 'Chat/Chat Space',
-    component: Chat
-}
-
-const data = [
-    {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 '},
-    {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"/>)},
-    {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 '},
-    {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 '},
-]
-
-const users = [
-    {
-      id: 'walter',
-      display: 'Walter White',
-    },
-    {
-      id: 'jesse',
-      display: 'Jesse Pinkman',
-    },
-    {
-      id: 'gus',
-      display: 'Gustavo "Gus" Fring',
-    },
-    {
-      id: 'saul',
-      display: 'Saul Goodman',
-    },
-    {
-      id: 'hank',
-      display: 'Hank Schrader',
-    },
-    {
-      id: 'skyler',
-      display: 'Skyler White',
-    },
-    {
-      id: 'mike',
-      display: 'Mike Ehrmantraut',
-    },
-    {
-      id: 'lydia',
-      display: 'Lydìã Rôdarté-Qüayle',
-    },
-  ]
-
-const Template = (args) => (
-    <Chat
-        {...args} />
-);
-
-export const ChatSpace = Template.bind({});
-ChatSpace.args = {
-    data,
-    users
-};

package/src/stories/Common Inputs/CheckboxGroup/CheckboxGroup.stories.jsx

@@ -1,32 +0,0 @@
-import React from 'react';
-import withFormik from "storybook-formik";
-import * as Yup from 'yup';
-
-import CheckboxGroup from './CheckboxGroup';
-
-const formSchema = Yup.object().shape({
-    acceptTerms: Yup.array()
-        .min(1, 'You must choose at least one element'),
-});
-
-const options = [
-    {label: 'option 1', value: '1'},
-    {label: 'option 2', value: '2'},
-    {label: 'option 3', value: '3'},
-]
-
-export default {
-    title: 'Common Inputs/Checkbox Group',
-    component: CheckboxGroup,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                acceptTerms: []
-            },
-            validationSchema: formSchema,
-        },
-    }
-};
-
-export const CheckBoxGroup = args =>  <CheckboxGroup label="Checkbox Group" name="acceptTerms" options={options} {...args} />

package/src/stories/Common Inputs/CustomAutoComplete/CustomAutoComplete.stories.jsx

@@ -1,35 +0,0 @@
-import React, { useState } from 'react';
-// import withFormik from "storybook-formik";
-// import * as Yup from 'yup';
-
-import CustomAutoComplete from './CustomAutoComplete';
-
-// const formSchema = Yup.object().shape({
-//     search: Yup.string()
-//         .required("Required"),
-// });
-
-
-export default {
-    title: 'Common Inputs/Custom AutoComplete',
-    component: CustomAutoComplete,
-    // decorators: [withFormik],
-    // parameters: {
-    //     formik: {
-    //         initialValues: {
-    //             search: ''
-    //         },
-    //         validationSchema: formSchema,
-    //     },
-    // }
-};
-
-export const AutoComplete = args =>
-(<CustomAutoComplete 
-    label="themes"
-    items={[
-    { id: 'foo', label: 'foo' },
-    { id: 'bar', label: 'bar' },
-    { id: 'baz', label: 'baz' },
-]} name="search" {...args} 
-/>)

package/src/stories/Common Inputs/CustomDropzone/CustomDropzone.stories.jsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import withFormik from "storybook-formik";
-import * as Yup from 'yup';
-
-import CustomDropZone from './CustomDropZone';
-
-const formSchema = Yup.object().shape({
-    file: Yup.object()
-        .required("Required"),
-});
-
-export default {
-    title: 'Common Inputs/Custom Dropzone',
-    component: CustomDropZone,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                file: ''
-            },
-            validationSchema: formSchema,
-        },
-    }
-};
-
-export const Dropzone = args =>  <CustomDropZone label="Image" name="file" {...args} />

package/src/stories/Common Inputs/CustomSelect/CustomSelect.stories.jsx

@@ -1,36 +0,0 @@
-import React from 'react';
-import withFormik from "storybook-formik";
-import * as Yup from 'yup';
-
-import CustomSelect from './CustomSelect';
-
-const formSchema = Yup.object().shape({
-    name: Yup.string()
-        .required("Required"),
-});
-
-const options = [
-    {label: 'select an option', value: ''},
-    {label: 'option 1', value: '1'},
-    {label: 'option 2', value: '2'},
-    {label: 'option 3', value: '3'},
-]
-
-export default {
-    title: 'Common Inputs/Custom Select',
-    component: CustomSelect,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                name: '',
-            },
-            validationSchema: formSchema,
-        },
-    }
-};
-
-export const Select = args => {
-
-    return <CustomSelect label="options" options={options} name="name" {...args} />
-}

package/src/stories/Common Inputs/CustomTextarea/CustomTextarea.stories.jsx

@@ -1,31 +0,0 @@
-import React from 'react'
-
-import withFormik from "storybook-formik";
-import * as Yup from 'yup';
-
-import CustomTextarea from './CustomTextarea';
-
-const formSchema = Yup.object().shape({
-    text: Yup.string()
-        .required("Required"),
-});
-
-export default {
-    title: 'Common Inputs/Custom Textarea',
-    component: CustomTextarea,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                text: '',
-                validationSchema: formSchema
-            },
-            validationSchema: formSchema,
-        },
-    }
-}
-
-export const TextArea = (args) => {
-
-    return <CustomTextarea name="text" label="text" {...args} />
-}

package/src/stories/Common Inputs/DatePicker/DatePicker.stories.jsx

@@ -1,47 +0,0 @@
-import React from 'react';
-
-import withFormik from "storybook-formik";
-
-import DatePicker from './DatePicker';
-import SingleDatePicker from './SingleDatePicker';
-
-import * as Yup from 'yup';
-
-const datePickerSchema = Yup.object().shape({
-    date: Yup.object().shape({
-        startDate: Yup.object()
-            .required("Required")
-            .typeError('Invalid Start Date'),
-        endDate: Yup.object()
-            .required("Required")
-            .typeError('Invalid End Date')
-    }),
-    singleDate: Yup.object()
-    .required("Required")
-    .typeError('Invalid Date'),
-});
-
-
-export default {
-    title: 'Common Inputs/Date Picker',
-    component: DatePicker,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                date: {
-                    startDate: null,
-                    endDate: null
-                },
-                singleDate: null
-            },
-            validationSchema: datePickerSchema
-        },
-    }
-}
-
-
-export const date = args => <>
-    <DatePicker label="Double Date Picker" name='date' {...args} />
-    <SingleDatePicker label="Single Date Picker" name='singleDate' {...args} />
-</>

package/src/stories/Common Inputs/EditorComponent/EditorComponent.stories.jsx

@@ -1,60 +0,0 @@
-import EditorComponent from "./EditorComponent";
-import BaseMaterial from "../../Containers/BaseMaterial";
-
-export default {
-    title: 'Common Inputs/EditorComponent',
-    component: EditorComponent
-}
-
-const data = {
-    blocks: [
-      {
-        type: "header",
-        data: {
-          text: "Editor.js",
-          level: 1
-        }
-      },
-      {
-        type: "paragraph",
-        data: {
-          text:
-            "Hey. Meet the new Editor. On this page you can see it in action — try to edit this text."
-        }
-      },
-      {
-          type: 'image',
-          "data" : {
-            "file": {
-                "url" : "https://i.ytimg.com/vi/MPV2METPeJU/maxresdefault.jpg"
-            },
-            "caption" : "Caption Example",
-            "withBorder" : false,
-            "withBackground" : false,
-            "stretched" : false
-        }
-      },
-      {
-        "type" : "paragraph",
-        "data" : {
-            "text" : "Create a directory for your module, enter it and run <mark class=\"cdx-marker\">npm init</mark> command."
-        }
-    },
-    {
-        "type" : "table",
-        "data" : {
-          "withHeadings": true,
-          "content" : [ [ "Kine", "Pigs", "Chicken" ], [ "1 pcs", "3 pcs", "12 pcs" ], [ "100$", "200$", "150$" ] ]
-        }
-      }
-    
-    ]
-  };
-
-export const Editor = args => {
-    return (
-        <BaseMaterial>
-            <EditorComponent data={data} {...args} />
-        </BaseMaterial>
-    )
-}

package/src/stories/Common Inputs/Formik/InputField/InputField.stories.jsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import InputField from './InputField'
-
-import withFormik from 'storybook-formik'
-
-export default {
-    component: InputField,
-    title: 'Common Inputs/Formik/InputField',
-    decorators: [withFormik]
-}
-
-const Template = args => <InputField {...args} />
-
-export const TextInput = Template.bind({})
-TextInput.args = {
-    name: 'username',
-    type: 'text',
-    placeholder: 'username'
-}
-TextInput.parameters = {
-    formik: {
-        initialValues: {
-            username: ''
-        }
-    },
-    onSubmit: v => console.log(v)
-}

package/src/stories/Common Inputs/Formik/RadioField/RadioField.stories.jsx

@@ -1,41 +0,0 @@
-import React from 'react'
-import RadioField from './RadioField'
-
-import withFormik from 'storybook-formik'
-
-export default {
-    component: RadioField,
-    title: 'Common Inputs/Formik/RadioField',
-    decorators: [withFormik]
-}
-
-const Template = args => <RadioField {...args} />
-
-export const Preset = Template.bind({})
-Preset.args = {
-    name: 'preset',
-    value: 'Preset 1',
-    children: 'Preset 1'
-}
-Preset.parameters = {
-    formik: {
-        initialValues: {
-            preset: ''
-        }
-    },
-    onSubmit: v => console.log(v)
-}
-export const Theme = Template.bind({})
-Theme.args = {
-    name: 'themeSelected',
-    value: 'Theme 1',
-    children: 'Theme 1',
-}
-Theme.parameters = {
-    formik: {
-        initialValues: {
-            theme: ''
-        }
-    },
-    onSubmit: v => console.log(v)
-}

package/src/stories/Common Inputs/RadioInput/RadioInput.stories.js

@@ -1,30 +0,0 @@
-import React from 'react';
-
-import RadioInput from './RadioInput';
-
-export default {
-  title: 'Common Inputs/RadioInput/Item',
-  component: RadioInput,
-  argTypes: {
-    list: {
-      control: { type: 'object' },
-    },
-    title: {
-      control: { type: 'text' },
-    },
-    margin: {
-      control: { type: 'number' },
-    },
-    borderColor: {
-      control: 'color',
-    },
-    titleFontSize: {
-      control: 'number',
-    },
-    descriptionFontSize: {
-      control: 'number',
-    },
-  },
-};
-
-export const Default = (args) => <RadioInput {...args} />;

package/src/stories/Common Inputs/RichTextInput/RichTextInput.stories.js

@@ -1,45 +0,0 @@
-import React from 'react';
-
-import RichTextInput from './RichTextInput';
-
-export default {
-  title: 'Common Inputs/RichTextInput',
-  component: RichTextInput,
-};
-
-const users = [
-  {
-    id: 'walter',
-    display: 'Walter White',
-  },
-  {
-    id: 'jesse',
-    display: 'Jesse Pinkman',
-  },
-  {
-    id: 'gus',
-    display: 'Gustavo "Gus" Fring',
-  },
-  {
-    id: 'saul',
-    display: 'Saul Goodman',
-  },
-  {
-    id: 'hank',
-    display: 'Hank Schrader',
-  },
-  {
-    id: 'skyler',
-    display: 'Skyler White',
-  },
-  {
-    id: 'mike',
-    display: 'Mike Ehrmantraut',
-  },
-  {
-    id: 'lydia',
-    display: 'Lydìã Rôdarté-Qüayle',
-  },
-]
-
-export const Default = (args) => <RichTextInput users={users} {...args} />

package/src/stories/Common Inputs/TextField/TextField.stories.jsx

@@ -1,31 +0,0 @@
-import React from 'react'
-
-import withFormik from "storybook-formik";
-import * as Yup from 'yup';
-
-import CustomTextField from './TextField';
-
-const formSchema = Yup.object().shape({
-    userName: Yup.string()
-        .required("Required"),
-});
-
-export default {
-    title: 'Common Inputs/TextField',
-    component: CustomTextField,
-    decorators: [withFormik],
-    parameters: {
-        formik: {
-            initialValues: {
-                userName: '',
-                validationSchema: formSchema
-            },
-            validationSchema: formSchema,
-        },
-    }
-}
-
-export const TextInput = (args) => {
-
-    return <CustomTextField name="userName" label="User Name" {...args} />
-}

package/src/stories/Containers/BaseMaterial.stories.js

@@ -1,10 +0,0 @@
-import React from "react"
-
-import BaseMaterial from "./BaseMaterial"
-
-export default {
-    title: 'Containers/BaseMaterial',
-    component: BaseMaterial
-}
-
-export const Default = (args) => <BaseMaterial {...args} />

package/src/stories/Containers/WidgetExample/WidgetBody.stories.js

@@ -1,10 +0,0 @@
-import React from "react"
-
-import WidgetBody from "./WidgetBody"
-
-export default {
-    title: 'Containers/WidgetBody',
-    component: WidgetBody
-}
-
-export const Default = (args) => <WidgetBody {...args} />

package/src/stories/Containers/WidgetExample/WidgetExample.stories.js

@@ -1,10 +0,0 @@
-import React from "react"
-
-import WidgetExample from "./WidgetExample"
-
-export default {
-    title: 'Containers/WidgetExample',
-    component: WidgetExample
-}
-
-export const Default = (args) => <WidgetExample {...args} />

package/src/stories/Containers/WidgetExample/WidgetHead.stories.js

@@ -1,10 +0,0 @@
-import React from "react"
-
-import WidgetHead from "./WidgetHead"
-
-export default {
-    title: 'Containers/WidgetHead',
-    component: WidgetHead
-}
-
-export const Default = (args) => <WidgetHead {...args} />

package/src/stories/Enrollment/Admin/CreateForm/CreateForm.stories.jsx

@@ -1,8 +0,0 @@
-import CreateForm from "./CreateForm";
-
-export default {
-    title: 'Enrollment/Admin/Create Form',
-    component: CreateForm
-}
-
-export const Question = args => <CreateForm {...args} />

package/src/stories/Enrollment/Admin/DetailedForm/DetailedForm.stories.jsx

@@ -1,36 +0,0 @@
-import DetailedForm from "./DetailedForm";
-
-export default {
-    title: 'Enrollment/Admin/Detailed Form',
-    component: DetailedForm
-}
-
-const questions = [
-        {
-            title: 'Question 1 ?',
-            description: 'Answer for question one'
-        },
-        {
-            title: 'Question 2 ?',
-            description: 'Answer for question two'
-        },
-        {
-            title: 'Question 3 ?',
-            description: 'Answer for question three'
-        },
-        {
-            title: 'Question 4 ?',
-            description: 'Answer for question four'
-        },
-        {
-            title: 'Question 5 ?',
-            description: 'Answer for question five'
-        },
-]
-
-export const Form = args =>
-    <DetailedForm
-        userName="User Name"
-        userImg="https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png"
-        questions={questions}
-        {...args} />

package/src/stories/Enrollment/Admin/ViewForms/ViewForms.stories.jsx

@@ -1,66 +0,0 @@
-import ViewForms from './ViewForms';
-
-export default {
-    title: 'Enrollment/Admin/Submitted Forms',
-    component: ViewForms
-}
-
-const data = [
-    {
-        title: 'Pending',
-        data: [
-            {
-                username: 'User one',
-                answered: '3/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'pending'
-            },
-            {
-                username: 'User Two',
-                answered: '5/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'pending'
-            },
-            {
-                username: 'User Three',
-                answered: '5/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'pending'
-            },
-        ],
-        priority: 1
-    },
-    {
-        title: 'In Review',
-        data: [
-            {
-                username: 'User Four',
-                answered: '2/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'inReview'
-            },
-            {
-                username: 'User Five',
-                answered: '1/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'inReview'
-            },
-            {
-                username: 'User Six',
-                answered: '3/5',
-                img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-                status: 'inReview'
-            },
-        ],
-        priority: 2
-    },
-]
-
-const Template = (args) => (<ViewForms
-    {...args} />
-);
-
-export const forms = Template.bind({});
-forms.args = {
-    data: data,
-}