@mohamed-karawia/library 0.1.3 → 0.1.7

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;

package/dist/stories/VideoAlbum/Comments/Comments.stories.js

@@ -1,45 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.videoComments = exports.default = void 0;
-
-var _Comments = _interopRequireDefault(require("./Comments"));
-
-var _default = {
-  title: 'Video Album/Comments',
-  component: _Comments.default
-};
-exports.default = _default;
-var comments = [{
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}];
-
-var videoComments = function videoComments(args) {
-  return /*#__PURE__*/React.createElement(_Comments.default, Object.assign({
-    comments: comments
-  }, args));
-};
-
-exports.videoComments = videoComments;

package/dist/stories/VideoAlbum/VideoPlayer/VideoPlayer.stories.js

@@ -1,149 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Video = exports.default = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _VideoPlayer = _interopRequireDefault(require("./VideoPlayer"));
-
-var _util = require("../../helpers/util");
-
-var _music = _interopRequireDefault(require("../../assets/images/music1.jpg"));
-
-var _music2 = _interopRequireDefault(require("../../assets/images/music2.jpg"));
-
-var _music3 = _interopRequireDefault(require("../../assets/images/music3.jpg"));
-
-var _music4 = _interopRequireDefault(require("../../assets/images/music4.jpg"));
-
-var _music5 = _interopRequireDefault(require("../../assets/images/music5.jpg"));
-
-var _music6 = _interopRequireDefault(require("../../assets/images/music6.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/Video Player',
-  component: _VideoPlayer.default
-};
-exports.default = _default;
-
-var Video = function Video(args) {
-  var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      currentVideo = _useState2[0],
-      setCurrentVideo = _useState2[1];
-
-  var _useState3 = (0, _react.useState)([{
-    index: 0,
-    img: _music4.default,
-    src: 'https://www.youtube.com/watch?v=hl5Kt0BxTa8',
-    title: 'Plans We Made',
-    description: 'Son Lux',
-    time: '5:20'
-  }, {
-    index: 2,
-    img: _music6.default,
-    src: 'https://www.youtube.com/watch?v=EYyarcp5LtU',
-    title: 'Still Loving You',
-    description: 'Scorpions',
-    time: '4:20'
-  }, {
-    index: 1,
-    img: _music5.default,
-    src: 'https://www.youtube.com/watch?v=vlaQu_rmIQo',
-    title: 'Night',
-    description: 'Frank Ocean',
-    time: '5:20'
-  }, {
-    index: 3,
-    img: _music.default,
-    src: 'https://www.youtube.com/watch?v=VNsd8Yo5zvc',
-    title: 'Somebody Else',
-    description: '1975',
-    time: '5:20'
-  }, {
-    index: 4,
-    img: _music3.default,
-    src: 'https://www.youtube.com/watch?v=CD-E-LDc384',
-    title: 'Enter Sandman',
-    description: 'Metallica',
-    time: '5:20'
-  }, {
-    index: 5,
-    img: _music2.default,
-    src: 'https://www.youtube.com/watch?v=8SbUC-UaAxE',
-    title: 'November Rain',
-    description: "Guns N' Roses",
-    time: '5:20'
-  }]),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      album = _useState4[0],
-      setAlbum = _useState4[1];
-
-  var cardIconClicked = function cardIconClicked(action, index) {
-    switch (action) {
-      case 'play':
-        onPlayVideo(index);
-        break;
-
-      case 'delete':
-        deleteSonngFromAlbum(index);
-        break;
-
-      default:
-        break;
-    }
-  };
-
-  var nextVideo = function nextVideo() {
-    if (currentVideo < album.length - 1) {
-      setCurrentVideo(currentVideo + 1);
-    } else {
-      setCurrentVideo(0);
-    }
-  };
-
-  var prevVideo = function prevVideo() {
-    if (currentVideo !== 0) {
-      setCurrentVideo(currentVideo - 1);
-    }
-  };
-
-  var onPlayVideo = function onPlayVideo(index) {
-    setCurrentVideo(index);
-  };
-
-  var onAddSong = function onAddSong(song) {
-    var newSong = {
-      song: song.song.file,
-      img: song.cover.meta.previewUrl,
-      title: song.title,
-      description: song.artist,
-      time: new Date(song.song.meta.duration * 1000).toISOString().substr(14, 5)
-    };
-    setAlbum((0, _util.addObjectToArray)(album, newSong));
-  };
-
-  var deleteSonngFromAlbum = function deleteSonngFromAlbum(index) {
-    setAlbum((0, _util.deleteFromArrayByIndex)(album, index));
-  };
-
-  return /*#__PURE__*/_react.default.createElement(_VideoPlayer.default, Object.assign({
-    iconsColor: "white",
-    src: album[currentVideo].src,
-    nextVideo: nextVideo,
-    prevVideo: prevVideo
-  }, args));
-};
-
-exports.Video = Video;

package/dist/stories/VideoAlbum/VideoSpace/VideoSpace.stories.js

@@ -1,49 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Space = exports.default = void 0;
-
-var _VideoSpace = _interopRequireDefault(require("./VideoSpace"));
-
-var _default = {
-  title: 'Video Album/Video Space',
-  component: _VideoSpace.default
-};
-exports.default = _default;
-var comments = [{
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}, {
-  img: 'https://www.kindpng.com/picc/m/163-1636340_user-avatar-icon-avatar-transparent-user-icon-png.png',
-  title: 'User Name',
-  description: 'This is A test for comments on videos.'
-}];
-
-var Space = function Space(args) {
-  return /*#__PURE__*/React.createElement(_VideoSpace.default, Object.assign({
-    backgroundColor: "white",
-    title: "Video Title",
-    discription: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesentium placeat nostrum tempora suscipit laborum quibusdam.",
-    date: "10/11/2022",
-    comments: comments
-  }, args));
-};
-
-exports.Space = Space;

package/dist/stories/VideoAlbum/ViewAlbum/ViewAlbum.stories.js

@@ -1,113 +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 _ViewAlbum = _interopRequireDefault(require("./ViewAlbum"));
-
-var _util = require("../../helpers/util");
-
-var _music = _interopRequireDefault(require("../../assets/images/music1.jpg"));
-
-var _music2 = _interopRequireDefault(require("../../assets/images/music2.jpg"));
-
-var _music3 = _interopRequireDefault(require("../../assets/images/music3.jpg"));
-
-var _music4 = _interopRequireDefault(require("../../assets/images/music4.jpg"));
-
-var _music5 = _interopRequireDefault(require("../../assets/images/music5.jpg"));
-
-var _music6 = _interopRequireDefault(require("../../assets/images/music6.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/Album Gallery',
-  component: _ViewAlbum.default
-};
-exports.default = _default;
-
-var Gallery = function Gallery(args) {
-  var _useState = (0, _react.useState)([{
-    index: 0,
-    img: _music4.default,
-    title: 'Plans We Made',
-    description: 'Son Lux',
-    time: '5:20'
-  }, {
-    index: 2,
-    img: _music6.default,
-    title: 'Still Loving You',
-    description: 'Scorpions',
-    time: '4:20'
-  }, {
-    index: 1,
-    img: _music5.default,
-    title: 'Night',
-    description: 'Frank Ocean',
-    time: '5:20'
-  }, {
-    index: 3,
-    img: _music.default,
-    title: 'Somebody Else',
-    description: '1975',
-    time: '5:20'
-  }, {
-    index: 4,
-    img: _music3.default,
-    title: 'Enter Sandman',
-    description: 'Metallica',
-    time: '5:20'
-  }, {
-    index: 5,
-    img: _music2.default,
-    title: 'November Rain',
-    description: "Guns N' Roses",
-    time: '5:20'
-  }]),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      album = _useState2[0],
-      setAlbum = _useState2[1];
-
-  var cardIconClicked = function cardIconClicked(action, index) {
-    switch (action) {
-      case 'delete':
-        deleteFromAlbums(index);
-        break;
-
-      default:
-        break;
-    }
-  };
-
-  var onAddAlbum = function onAddAlbum(album) {
-    var newAlbum = {
-      img: album.cover.preview,
-      title: album.title,
-      description: album.artist
-    };
-    setAlbum((0, _util.addObjectToArray)(album, newAlbum));
-  };
-
-  var deleteFromAlbums = function deleteFromAlbums(index) {
-    setAlbum((0, _util.deleteFromArrayByIndex)(album, index));
-  };
-
-  return /*#__PURE__*/_react.default.createElement(_ViewAlbum.default, Object.assign({
-    album: album,
-    cardIconClicked: cardIconClicked,
-    onAddAlbum: onAddAlbum
-  }, args));
-};
-
-exports.Gallery = Gallery;