@mohamed-karawia/library 0.1.20 → 0.1.23

package/dist/stories/Modals/AddVideoModal/AddVideoModal.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _AddVideo = _interopRequireDefault(require("../../Forms/AddVideo/AddVideo"));
+
+var _excluded = ["showModal", "onAddVideo", "closeModal"];
+
+var AddVideoModal = function AddVideoModal(_ref) {
+  var showModal = _ref.showModal,
+      onAddVideo = _ref.onAddVideo,
+      closeModal = _ref.closeModal,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_AddVideo.default, {
+    saveHandler: onAddVideo,
+    cancelHandler: closeModal
+  }));
+};
+
+AddVideoModal.defaultProps = {};
+var _default = AddVideoModal;
+exports.default = _default;

package/dist/stories/Modals/ChatConfigModal/ChatContifgModal.js

@@ -0,0 +1,93 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Chat = _interopRequireDefault(require("../../Spaces/Chat/Chat"));
+
+var _ChatPreview = _interopRequireDefault(require("../../PreviewComponents/ChatPreview/ChatPreview"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _Community = _interopRequireDefault(require("../../Reusable Components/Community/Community"));
+
+var _Tabs = _interopRequireDefault(require("../../Reusable Components/Tabs/Tabs"));
+
+var _excluded = ["showConfigModal", "cancelConfig", "data", "users", "community"];
+
+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 ChatContifgModal = function ChatContifgModal(_ref) {
+  var showConfigModal = _ref.showConfigModal,
+      cancelConfig = _ref.cancelConfig,
+      data = _ref.data,
+      users = _ref.users,
+      community = _ref.community,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(_Chat.default, {
+    preview: true,
+    users: users,
+    data: data
+  })),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      centerContext = _useState2[0],
+      setCenterContext = _useState2[1];
+
+  var formChanged = function formChanged(values) {
+    setCenterContext( /*#__PURE__*/_react.default.createElement(_Chat.default, Object.assign({
+      preview: true,
+      users: users,
+      data: data
+    }, values)));
+  };
+
+  var tabs = [{
+    title: "New",
+    id: "preview"
+  }, {
+    title: "Context",
+    id: "community"
+  }];
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showConfigModal,
+    closeModal: cancelConfig,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    },
+    preview: true
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    title: "Chat Config",
+    tabs: tabs,
+    id: "styling"
+  }, /*#__PURE__*/_react.default.createElement(_ChatPreview.default, {
+    componentProps: {
+      data: data,
+      users: users,
+      title: props.title || "Chat",
+      preview: true
+    },
+    formChanged: formChanged,
+    id: "preview"
+  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
+    center: centerContext,
+    community: community,
+    id: "community"
+  })));
+};
+
+ChatContifgModal.defaultProps = {};
+var _default = ChatContifgModal;
+exports.default = _default;

package/dist/stories/Modals/CreateEventModal/CreateEventModal.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _CreateEvent = _interopRequireDefault(require("../../Forms/CreateEvent/CreateEvent"));
+
+var _excluded = ["showModal", "onAddFolder", "closeModal", "actions"];
+
+var CreateEventModal = function CreateEventModal(_ref) {
+  var showModal = _ref.showModal,
+      onAddFolder = _ref.onAddFolder,
+      closeModal = _ref.closeModal,
+      actions = _ref.actions,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CreateEvent.default, {
+    saveBtnText: props.saveBtnText || 'Create',
+    cancelBtnText: props.cancelBtnText || "Cancel",
+    saveHandler: onAddFolder,
+    cancelHandler: closeModal,
+    actions: actions
+  }));
+};
+
+var _default = CreateEventModal;
+exports.default = _default;

package/dist/stories/Modals/CreateFolderModal/CreateFolderModal.js

@@ -0,0 +1,36 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _CreateFolder = _interopRequireDefault(require("../../Forms/CreateFolder/CreateFolder"));
+
+var CreateFolderModal = function CreateFolderModal(_ref) {
+  var showModal = _ref.showModal,
+      closeModal = _ref.closeModal,
+      onAddFolder = _ref.onAddFolder;
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CreateFolder.default, {
+    saveBtnText: "Create",
+    cancelBtnText: "Cancel",
+    saveHandler: onAddFolder,
+    cancelHandler: closeModal
+  }));
+};
+
+CreateFolderModal.defaultProps = {};
+var _default = CreateFolderModal;
+exports.default = _default;

package/dist/stories/Modals/CreateMusicAlbumModal/CreateMusicAlbumModal.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _CreateMusicAlbum = _interopRequireDefault(require("../../Forms/CreateMusicAlbum/CreateMusicAlbum"));
+
+var _excluded = ["showModal", "onAddAlbum", "closeModal"];
+
+var CreateMusicAlbumModal = function CreateMusicAlbumModal(_ref) {
+  var showModal = _ref.showModal,
+      onAddAlbum = _ref.onAddAlbum,
+      closeModal = _ref.closeModal,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CreateMusicAlbum.default, {
+    saveHandler: onAddAlbum,
+    cancelHandler: closeModal,
+    saveBtnText: props.saveBtnText || "Create",
+    cancelBtnText: props.cancelBtnText || "Cancel"
+  }));
+};
+
+CreateMusicAlbumModal.defaultProps = {};
+var _default = CreateMusicAlbumModal;
+exports.default = _default;

package/dist/stories/Modals/CreateNoteModal/CreateNoteModal.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _CreateFolder = _interopRequireDefault(require("../../Forms/CreateFolder/CreateFolder"));
+
+var _excluded = ["showModal", "closeModal", "onAddFolder", "cancelHandler"];
+
+var CreateNoteModal = function CreateNoteModal(_ref) {
+  var showModal = _ref.showModal,
+      closeModal = _ref.closeModal,
+      onAddFolder = _ref.onAddFolder,
+      cancelHandler = _ref.cancelHandler,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CreateFolder.default, {
+    saveBtnText: props.saveBtnText || "Create",
+    cancelBtnText: props.cancelBtnText || "Cancel",
+    saveHandler: onAddFolder,
+    cancelHandler: cancelHandler
+  }));
+};
+
+CreateNoteModal.defaultProps = {};
+var _default = CreateNoteModal;
+exports.default = _default;

package/dist/stories/Modals/EventConfigModal/EventConfigModal.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Event = _interopRequireDefault(require("../../Spaces/ViewEvent/Event"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _EventPreview = _interopRequireDefault(require("../../PreviewComponents/EventPreview/EventPreview"));
+
+var _Tabs = _interopRequireDefault(require("../../Reusable Components/Tabs/Tabs"));
+
+var _Community = _interopRequireDefault(require("../../Reusable Components/Community/Community"));
+
+var _excluded = ["showConfigModal", "cancelConfig", "cover", "title", "date", "disc", "community"];
+
+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 EventConfigModal = function EventConfigModal(_ref) {
+  var showConfigModal = _ref.showConfigModal,
+      cancelConfig = _ref.cancelConfig,
+      cover = _ref.cover,
+      title = _ref.title,
+      date = _ref.date,
+      disc = _ref.disc,
+      community = _ref.community,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(_Event.default, {
+    preview: true,
+    title: title,
+    cover: cover,
+    date: date,
+    disc: disc
+  })),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      centerContext = _useState2[0],
+      setCenterContext = _useState2[1];
+
+  var formChanged = function formChanged(values) {
+    setCenterContext( /*#__PURE__*/_react.default.createElement(_Event.default, Object.assign({
+      preview: true,
+      title: title,
+      cover: cover,
+      date: date,
+      disc: disc
+    }, values)));
+  };
+
+  var tabs = [{
+    title: 'New',
+    id: 'preview'
+  }, {
+    title: 'Context',
+    id: 'community'
+  }];
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showConfigModal,
+    closeModal: cancelConfig,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    title: "Event Config",
+    tabs: tabs
+  }, /*#__PURE__*/_react.default.createElement(_EventPreview.default, {
+    componentProps: {
+      cover: cover,
+      title: title,
+      date: date,
+      disc: disc,
+      preview: true
+    },
+    formChanged: formChanged,
+    id: "preview"
+  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
+    center: centerContext,
+    community: community,
+    preview: true,
+    id: "community"
+  })));
+};
+
+EventConfigModal.defaultProps = {};
+var _default = EventConfigModal;
+exports.default = _default;

package/dist/stories/Modals/EventsConfigModal/EventsConfigModal.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _EventsPreview = _interopRequireDefault(require("../../PreviewComponents/EventsPreview/EventsPreview"));
+
+var _Tabs = _interopRequireDefault(require("../../Reusable Components/Tabs/Tabs"));
+
+var _EventsList = _interopRequireDefault(require("../../Spaces/EventsList/EventsList"));
+
+var _Community = _interopRequireDefault(require("../../Reusable Components/Community/Community"));
+
+var _excluded = ["events", "showConfigModal", "cancelConfig", "community"];
+
+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 EventsConfigModal = function EventsConfigModal(_ref) {
+  var events = _ref.events,
+      showConfigModal = _ref.showConfigModal,
+      cancelConfig = _ref.cancelConfig,
+      community = _ref.community,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(_EventsList.default, Object.assign({
+    preview: true,
+    events: events
+  }, props))),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      centerContext = _useState2[0],
+      setCenterContext = _useState2[1];
+
+  var formChanged = function formChanged(values) {
+    setCenterContext( /*#__PURE__*/_react.default.createElement(_EventsList.default, Object.assign({
+      preview: true,
+      events: events
+    }, values)));
+  };
+
+  var tabs = [{
+    title: 'New',
+    id: 'preview'
+  }, {
+    title: 'Context',
+    id: 'community'
+  }];
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showConfigModal,
+    closeModal: cancelConfig,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    title: "Events Config",
+    tabs: tabs
+  }, /*#__PURE__*/_react.default.createElement(_EventsPreview.default, {
+    componentProps: {
+      events: events,
+      title: props.title || "My Events",
+      preview: true
+    },
+    formChanged: formChanged,
+    id: "preview"
+  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
+    center: centerContext,
+    community: community,
+    id: "community"
+  })));
+};
+
+EventsConfigModal.defaultProps = {};
+var _default = EventsConfigModal;
+exports.default = _default;

package/dist/stories/Modals/FoldersConfigModal/FoldersConfigModal.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ViewFolders = _interopRequireDefault(require("../../Spaces/ViewFolders/ViewFolders"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _Tabs = _interopRequireDefault(require("../../Reusable Components/Tabs/Tabs"));
+
+var _FoldersPreview = _interopRequireDefault(require("../../PreviewComponents/FoldersPreview/FoldersPreview"));
+
+var _Community = _interopRequireDefault(require("../../Reusable Components/Community/Community"));
+
+var _excluded = ["showConfigModal", "cancelConfig", "folders", "community"];
+
+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 FoldersConfigModal = function FoldersConfigModal(_ref) {
+  var showConfigModal = _ref.showConfigModal,
+      cancelConfig = _ref.cancelConfig,
+      folders = _ref.folders,
+      community = _ref.community,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(_ViewFolders.default, {
+    preview: true,
+    folders: folders
+  })),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      centerContext = _useState2[0],
+      setCenterContext = _useState2[1];
+
+  var formChanged = function formChanged(values) {
+    setCenterContext( /*#__PURE__*/_react.default.createElement(_ViewFolders.default, Object.assign({
+      preview: true,
+      folders: folders
+    }, values)));
+  };
+
+  var tabs = [{
+    title: 'New',
+    id: 'preview'
+  }, {
+    title: 'Context',
+    id: 'community'
+  }];
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showConfigModal,
+    closeModal: cancelConfig,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    title: "Folders Config",
+    tabs: tabs
+  }, /*#__PURE__*/_react.default.createElement(_FoldersPreview.default, {
+    componentProps: {
+      folders: folders,
+      title: props.title || "Your Folders",
+      preview: true
+    },
+    formChanged: formChanged,
+    id: "preview"
+  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
+    center: centerContext,
+    community: community,
+    id: "community"
+  })));
+};
+
+FoldersConfigModal.defaultProps = {};
+var _default = FoldersConfigModal;
+exports.default = _default;

package/dist/stories/Modals/MusicAlbumConfigModal/MusicAlbumConfigModal.js

@@ -0,0 +1,88 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ViewMusicAlbumList = _interopRequireDefault(require("../../Spaces/ViewMusicAlbumList/ViewMusicAlbumList"));
+
+var _ReactModal = _interopRequireDefault(require("../../Reusable Components/ReactModal/ReactModal"));
+
+var _Tabs = _interopRequireDefault(require("../../Reusable Components/Tabs/Tabs"));
+
+var _MusicAlbumPreview = _interopRequireDefault(require("../../PreviewComponents/MusicAlbumPreview/MusicAlbumPreview"));
+
+var _Community = _interopRequireDefault(require("../../Reusable Components/Community/Community"));
+
+var _excluded = ["showConfigModal", "closeModal", "album", "community"];
+
+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 MusicAlbumConfigModal = function MusicAlbumConfigModal(_ref) {
+  var showConfigModal = _ref.showConfigModal,
+      closeModal = _ref.closeModal,
+      album = _ref.album,
+      community = _ref.community,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)( /*#__PURE__*/_react.default.createElement(_ViewMusicAlbumList.default, {
+    preview: true,
+    album: album
+  })),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      centerContext = _useState2[0],
+      setCenterContext = _useState2[1];
+
+  var formChanged = function formChanged(values) {
+    console.log('context changed');
+    setCenterContext( /*#__PURE__*/_react.default.createElement(_ViewMusicAlbumList.default, Object.assign({
+      preview: true,
+      album: album
+    }, values)));
+  };
+
+  var tabs = [{
+    title: 'New',
+    id: 'preview'
+  }, {
+    title: 'Context',
+    id: 'community'
+  }];
+  return /*#__PURE__*/_react.default.createElement(_ReactModal.default, {
+    modalIsOpen: showConfigModal,
+    closeModal: closeModal,
+    exitModalButton: function exitModalButton(e) {
+      return /*#__PURE__*/_react.default.createElement("div", null);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    title: "Album Config",
+    tabs: tabs
+  }, /*#__PURE__*/_react.default.createElement(_MusicAlbumPreview.default, {
+    componentProps: {
+      album: album,
+      title: props.title || "My Album",
+      preview: true
+    },
+    formChanged: formChanged,
+    id: "preview"
+  }), /*#__PURE__*/_react.default.createElement(_Community.default, {
+    center: centerContext,
+    community: community,
+    id: "community"
+  })));
+};
+
+MusicAlbumConfigModal.defaultProps = {};
+var _default = MusicAlbumConfigModal;
+exports.default = _default;