@mohamed-karawia/library 0.1.4 → 0.1.8

package/dist/stories/Reusable Components/ReusableForm/ReusableForm.stories.js

@@ -1,207 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.form = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _storybookFormik = _interopRequireDefault(require("storybook-formik"));
-
-var Yup = _interopRequireWildcard(require("yup"));
-
-var _ReusableForm = _interopRequireDefault(require("./ReusableForm"));
-
-var _TextField = _interopRequireDefault(require("../../Common Inputs/TextField/TextField"));
-
-var _CustomDropZone = _interopRequireDefault(require("../../Common Inputs/CustomDropzone/CustomDropZone"));
-
-var _CustomTextarea = _interopRequireDefault(require("../../Common Inputs/CustomTextarea/CustomTextarea"));
-
-var _CheckboxGroup = _interopRequireDefault(require("../../Common Inputs/CheckboxGroup/CheckboxGroup"));
-
-var _CustomAutoComplete = _interopRequireDefault(require("../../Common Inputs/CustomAutoComplete/CustomAutoComplete"));
-
-var _CustomSelect = _interopRequireDefault(require("../../Common Inputs/CustomSelect/CustomSelect"));
-
-var _DatePicker = _interopRequireDefault(require("../../Common Inputs/DatePicker/DatePicker"));
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var submitHandler = function submitHandler(values) {
-  console.log(values);
-};
-
-var cancelHandler = function cancelHandler() {
-  console.log('cancel');
-};
-
-var sections = [{
-  title: "Server Name",
-  body: [/*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Server Name",
-    name: "userName"
-  })]
-}, {
-  title: "User Name",
-  body: [/*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "User Name",
-    name: "firstName"
-  }), /*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Last Name",
-    name: "lastName"
-  })],
-  bodyColumns: 2
-}, {
-  title: 'More inputs',
-  body: [/*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Input one",
-    name: "input1"
-  }), /*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Input two",
-    name: "input2"
-  })],
-  hideTitle: true
-}, {
-  title: "Server history",
-  body: [/*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Age",
-    name: "age"
-  }), /*#__PURE__*/_react.default.createElement(_TextField.default, {
-    label: "Hobby",
-    name: "hobby"
-  }), /*#__PURE__*/_react.default.createElement(_CustomTextarea.default, {
-    label: "Discription",
-    name: "discription"
-  }), /*#__PURE__*/_react.default.createElement(_CheckboxGroup.default, {
-    label: "Checkbox Group",
-    name: "acceptTerms",
-    options: [{
-      label: 'option 1',
-      value: '1'
-    }, {
-      label: 'option 2',
-      value: '2'
-    }, {
-      label: 'option 3',
-      value: '3'
-    }]
-  }), /*#__PURE__*/_react.default.createElement(_CustomAutoComplete.default, {
-    name: "search",
-    label: "Search",
-    items: [{
-      id: 'foo',
-      label: 'foo'
-    }, {
-      id: 'bar',
-      label: 'bar'
-    }, {
-      id: 'baz',
-      label: 'baz'
-    }]
-  }), /*#__PURE__*/_react.default.createElement(_CustomSelect.default, {
-    label: "options",
-    options: [{
-      label: 'select an option',
-      value: ''
-    }, {
-      label: 'option 1',
-      value: '1'
-    }, {
-      label: 'option 2',
-      value: '2'
-    }, {
-      label: 'option 3',
-      value: '3'
-    }],
-    name: "select"
-  })]
-}, {
-  title: "User Media",
-  body: [/*#__PURE__*/_react.default.createElement(_CustomDropZone.default, {
-    label: "User Profile",
-    name: "file"
-  }), /*#__PURE__*/_react.default.createElement(_DatePicker.default, {
-    label: "Date Range",
-    name: "date"
-  })]
-}];
-var initialValues = {
-  userName: '',
-  firstName: '',
-  lastName: '',
-  input1: '',
-  input2: '',
-  age: '',
-  hobby: '',
-  discription: '',
-  acceptTerms: [],
-  search: '',
-  select: '',
-  file: '',
-  date: {
-    startDate: null,
-    endDate: null
-  }
-};
-var formSchema = Yup.object().shape({
-  userName: Yup.string().required("Required"),
-  firstName: Yup.string().required("Required"),
-  lastName: Yup.string().required("Required"),
-  age: Yup.string().required("Required"),
-  hobby: Yup.string().required("Required"),
-  discription: Yup.string().required('Required'),
-  acceptTerms: Yup.array().min(1, 'You must choose at least one element'),
-  search: Yup.string().required("Required"),
-  select: Yup.string().required("Required"),
-  date: Yup.object().shape({
-    startDate: Yup.object().required("Required").typeError('Invalid Start Date'),
-    endDate: Yup.object().required("Required").typeError('Invalid End Date')
-  })
-});
-var _default = {
-  title: 'Reusable Components/Reusable Formik Form',
-  component: _ReusableForm.default // decorators: [withFormik],
-  // parameters: {
-  //     formik: {
-  //         initialValues,
-  //         validationSchema: formSchema,
-  //         onSubmit: submitHandler
-  //     },
-  // }
-
-};
-exports.default = _default;
-
-var form = function form(args) {
-  return /*#__PURE__*/_react.default.createElement(_ReusableForm.default, Object.assign({
-    formTitle: "Reusable form",
-    initialValues: initialValues,
-    formSchema: formSchema,
-    sections: sections,
-    headerStyles: {
-      padding: 10,
-      headerBackground: 'black',
-      titleColor: '#ffff'
-    },
-    sectionHeaderStyles: {
-      padding: 6,
-      headerBackground: '#FE1744',
-      titleColor: '#ffff'
-    },
-    bodyPadding: 10,
-    saveBtnText: "Save",
-    cancelBtnText: "Cancel",
-    saveBtnHandle: submitHandler,
-    cancelHandler: cancelHandler,
-    bodyRowGap: 20,
-    bodyColumnGap: 10
-  }, args));
-};
-
-exports.form = form;

package/dist/stories/Reusable Components/ReusableHeader/ReusableHeader.stories.js

@@ -1,35 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Header = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _ReusableHeader = _interopRequireDefault(require("./ReusableHeader"));
-
-var _fakeData = require("../fakeData");
-
-var _default = {
-  title: 'Reusable Components/Reusable Header',
-  component: _ReusableHeader.default
-};
-exports.default = _default;
-
-var Template = function Template(args) {
-  return /*#__PURE__*/_react.default.createElement(_ReusableHeader.default, args);
-};
-
-var Header = Template.bind({});
-exports.Header = Header;
-Header.args = {
-  title: "Reusable Header",
-  discription: "This is a discription for header",
-  controls: _fakeData.controls,
-  controlsStyles: {
-    iconColor: 'red'
-  }
-};

package/dist/stories/Reusable Components/ReusableList/ReusableList.stories.js

@@ -1,84 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ListSectioned = exports.ListFlat = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _ReusableList = _interopRequireDefault(require("./ReusableList"));
-
-var _fakeData = require("../fakeData");
-
-// Components
-// Data
-var _default = {
-  title: 'Reusable components/List',
-  component: _ReusableList.default
-};
-exports.default = _default;
-
-var Template = function Template(args) {
-  return /*#__PURE__*/_react.default.createElement(_ReusableList.default, Object.assign({
-    listTitle: "Reusable List",
-    cardStyle: "card-style-1"
-  }, args));
-};
-
-var ListFlat = Template.bind({});
-exports.ListFlat = ListFlat;
-ListFlat.args = {
-  data: _fakeData.data,
-  type: "flat",
-  cardControls: _fakeData.cardControls,
-  headerStyles: {
-    padding: 10,
-    headerBackground: '#FE1744',
-    titleColor: '#ffff',
-    controlsStyles: {
-      dropdownBackground: 'black',
-      dropdownFontColor: 'white',
-      dropdownItemHoverColor: '#FE1744'
-    }
-  },
-  listControls: _fakeData.controls,
-  customCardStyles: {
-    controlsStyles: {
-      iconColor: 'black',
-      showOnHover: true
-    }
-  },
-  hideTitle: false
-};
-var ListSectioned = Template.bind({});
-exports.ListSectioned = ListSectioned;
-ListSectioned.args = {
-  data: _fakeData.dataWithSections,
-  type: "sectioned",
-  sectionHeaderStyles: {
-    cardTitleColor: 'white',
-    cardBackgroundColor: 'black',
-    cardPadding: 10
-  },
-  cardControls: _fakeData.cardControls,
-  headerStyles: {
-    padding: 10,
-    headerBackground: '#FE1744',
-    titleColor: '#ffff',
-    controlsStyles: {
-      dropdownBackground: 'black',
-      dropdownFontColor: 'white',
-      dropdownItemHoverColor: '#FE1744'
-    }
-  },
-  listControls: _fakeData.controls,
-  customCardStyles: {
-    controlsStyles: {
-      iconColor: 'black',
-      showOnHover: true
-    }
-  }
-};

package/dist/stories/Reusable Components/SearchCard/SearchCard.stories.js

@@ -1,24 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Default = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _SearchCard = _interopRequireDefault(require("./SearchCard"));
-
-var _default = {
-  title: 'Components/SearchCard/Item',
-  component: _SearchCard.default
-};
-exports.default = _default;
-
-var Default = function Default(args) {
-  return /*#__PURE__*/_react.default.createElement(_SearchCard.default, args);
-};
-
-exports.Default = Default;

package/dist/stories/Reusable Components/SpaceContainer/SpaceContainer.stories.js

@@ -1,80 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EditorSpace = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _SpaceContainer = _interopRequireDefault(require("./SpaceContainer"));
-
-var _EditorComponent = _interopRequireDefault(require("../../Common Inputs/EditorComponent/EditorComponent"));
-
-var _fakeData = require("../fakeData");
-
-var 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$"]]
-    }
-  }]
-};
-var _default = {
-  title: 'Reusable Components/Space Container',
-  component: _SpaceContainer.default
-};
-exports.default = _default;
-
-var Template = function Template(args) {
-  return /*#__PURE__*/_react.default.createElement(_SpaceContainer.default, args, /*#__PURE__*/_react.default.createElement(_EditorComponent.default, {
-    data: data
-  }));
-};
-
-var EditorSpace = Template.bind({});
-exports.EditorSpace = EditorSpace;
-EditorSpace.args = {
-  title: "Space Title",
-  discription: "Lorem ipsum dolor sit amet consectetur.",
-  controls: _fakeData.cardControls,
-  headerStyles: {
-    padding: 10,
-    headerBackground: '#FE1744',
-    titleColor: '#ffff',
-    controlsStyles: {
-      iconsGap: 5
-    }
-  }
-};

package/dist/stories/Reusable Components/Spinner/Spinner.stories.js

@@ -1,22 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.spinner = exports.default = void 0;
-
-var _Spinner = _interopRequireDefault(require("./Spinner"));
-
-var _default = {
-  title: 'Reusable Components/Spinner/Spinner',
-  component: _Spinner.default
-};
-exports.default = _default;
-
-var spinner = function spinner(args) {
-  return /*#__PURE__*/React.createElement(_Spinner.default, args);
-};
-
-exports.spinner = spinner;

package/dist/stories/Reusable Components/WidgetContainer/WidgetContainer.stories.js

@@ -1,80 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MusicWidget = exports.ListWidget = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _WidgetContainer = _interopRequireDefault(require("./WidgetContainer"));
-
-var _fakeData = require("../fakeData");
-
-var Songs = [{
-  name: 'Music 1',
-  musicSrc: 'https://www.pacdv.com/sounds/free-music/kickstarter.mp3',
-  cover: 'https://images.unsplash.com/photo-1505740420928-5e560c06d30e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8NHx8fGVufDB8fHx8&w=1000&q=80'
-}, {
-  name: 'Music 2',
-  musicSrc: 'https://www.pacdv.com/sounds/free-music/gentle-thoughts-1.mp3',
-  cover: 'https://c4.wallpaperflare.com/wallpaper/729/961/256/black-minimalistic-music-piano-black-background-1680x1050-entertainment-music-hd-art-wallpaper-preview.jpg'
-}, {
-  name: 'Music 3',
-  musicSrc: 'https://www.pacdv.com/sounds/free-music/glow-in-the-dark.mp3',
-  cover: 'https://images.unsplash.com/photo-1505740420928-5e560c06d30e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8NHx8fGVufDB8fHx8&w=1000&q=80'
-}];
-var _default = {
-  title: 'Reusable components/Widget Container',
-  component: _WidgetContainer.default
-};
-exports.default = _default;
-
-var Template = function Template(args) {
-  return /*#__PURE__*/_react.default.createElement(_WidgetContainer.default, args);
-};
-
-var ListWidget = Template.bind({});
-exports.ListWidget = ListWidget;
-ListWidget.args = {
-  widgetType: "list",
-  widgetTitle: "test",
-  widgetControls: _fakeData.controls,
-  widgetProps: {
-    data: _fakeData.data,
-    cardStyle: "card-style-2",
-    type: "flat"
-  },
-  headerStyles: {
-    padding: 5,
-    headerBackground: '#FE1744',
-    titleColor: '#ffff',
-    controlsStyles: {
-      dropdownBackground: 'black',
-      dropdownFontColor: 'white',
-      dropdownItemHoverColor: '#FE1744'
-    }
-  }
-};
-var MusicWidget = Template.bind({});
-exports.MusicWidget = MusicWidget;
-MusicWidget.args = {
-  widgetType: "music player",
-  widgetTitle: "Music Player",
-  widgetControls: _fakeData.controls,
-  widgetProps: {
-    playlist: Songs
-  },
-  headerStyles: {
-    padding: 5,
-    headerBackground: '#FE1744',
-    titleColor: '#ffff',
-    controlsStyles: {
-      dropdownBackground: 'black',
-      dropdownFontColor: 'white',
-      dropdownItemHoverColor: '#FE1744'
-    }
-  }
-};

package/dist/stories/Spaces/WelcomeSpace/WelcomeSpace.stories.js

@@ -1,24 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Default = exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _WelcomeSpace = _interopRequireDefault(require("./WelcomeSpace"));
-
-var _default = {
-  title: 'Spaces/Welcome',
-  component: _WelcomeSpace.default
-};
-exports.default = _default;
-
-var Default = function Default(args) {
-  return /*#__PURE__*/_react.default.createElement(_WelcomeSpace.default, args);
-};
-
-exports.Default = Default;

package/dist/stories/VideoAlbum/AlbumsGallery/AlbumsGallery.stories.js

@@ -1,101 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Gallery = exports.default = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _AlbumsGallery = _interopRequireDefault(require("./AlbumsGallery"));
-
-var _util = require("../../helpers/util");
-
-var _album = _interopRequireDefault(require("../../assets/images/album1.jpg"));
-
-var _album2 = _interopRequireDefault(require("../../assets/images/album2.jpg"));
-
-var _album3 = _interopRequireDefault(require("../../assets/images/album3.jpg"));
-
-var _album4 = _interopRequireDefault(require("../../assets/images/album4.jpg"));
-
-var _album5 = _interopRequireDefault(require("../../assets/images/album5.jpg"));
-
-var _album6 = _interopRequireDefault(require("../../assets/images/album6.jpg"));
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var _default = {
-  title: 'Video Album/Albums Gallery',
-  component: _AlbumsGallery.default
-};
-exports.default = _default;
-
-var Gallery = function Gallery(args) {
-  var _useState = (0, _react.useState)([{
-    img: _album.default,
-    title: 'Album 1',
-    count: '24'
-  }, {
-    img: _album2.default,
-    title: 'Album 2',
-    count: '24'
-  }, {
-    img: _album3.default,
-    title: 'Album 3',
-    count: '24'
-  }, {
-    img: _album4.default,
-    title: 'Album 4',
-    count: '24'
-  }, {
-    img: _album5.default,
-    title: 'Album 5',
-    count: '24'
-  }, {
-    img: _album6.default,
-    title: 'Album 6',
-    count: '24'
-  }]),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      albums = _useState2[0],
-      setAlbums = _useState2[1];
-
-  var cardIconClicked = function cardIconClicked(action, index) {
-    switch (action) {
-      case 'delete':
-        onDeleteAlbum(index);
-        break;
-
-      default:
-        break;
-    }
-  };
-
-  var onAddAlbum = function onAddAlbum(album) {
-    var newAlbum = {
-      img: album.cover.meta.previewUrl,
-      title: album.title,
-      count: '55'
-    };
-    setAlbums((0, _util.addObjectToArray)(albums, newAlbum));
-  };
-
-  var onDeleteAlbum = function onDeleteAlbum(index) {
-    setAlbums((0, _util.deleteFromArrayByIndex)(albums, index));
-  };
-
-  return /*#__PURE__*/_react.default.createElement(_AlbumsGallery.default, Object.assign({
-    videoAlbums: albums,
-    onAddAlbum: onAddAlbum,
-    cardIconClicked: cardIconClicked
-  }, args));
-};
-
-exports.Gallery = Gallery;