text: /*! For license information please see main.js.LICENSE.txt */
  (()=>{"use strict";var __webpack_modules__={"./src/images/logo_02.svg":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval('__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   "default": () => __WEBPACK_DEFAULT_EXPORT__\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (__webpack_require__.p + "3101e102980aa335648b9657b1b3a7ab.svg");\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/images/logo_02.svg?')},"./src/components/add-todo-button/button.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/add-todo-button/button.style.scss?")},"./src/components/aside/aside.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/aside/aside.style.scss?")},"./src/components/nav-bar/nav.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/nav-bar/nav.style.scss?")},"./src/components/project/project.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/project/project.style.scss?")},"./src/components/todo-form/form.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/todo-form/form.style.scss?")},"./src/components/todo/todo.style.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/todo/todo.style.scss?")},"./src/styles/general.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/styles/general.scss?")},"./src/styles/reset.scss":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/styles/reset.scss?")},"./node_modules/nanoid/index.dev.js":(__unused_webpack___webpack_module__,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"nanoid\": () => /* binding */ nanoid,\n/* harmony export */   \"customAlphabet\": () => /* binding */ customAlphabet,\n/* harmony export */   \"customRandom\": () => /* binding */ customRandom,\n/* harmony export */   \"urlAlphabet\": () => /* reexport safe */ _url_alphabet_index_js__WEBPACK_IMPORTED_MODULE_0__.urlAlphabet,\n/* harmony export */   \"random\": () => /* binding */ random\n/* harmony export */ });\n/* harmony import */ var _url_alphabet_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./url-alphabet/index.js */ \"./node_modules/nanoid/url-alphabet/index.js\");\n// This file replaces `index.js` in bundlers like webpack or Rollup,\n// according to `browser` config in `package.json`.\n\n\n\nif (true) {\n  // All bundlers will remove this block in the production bundle.\n  if (\n    typeof navigator !== 'undefined' &&\n    navigator.product === 'ReactNative' &&\n    typeof crypto === 'undefined'\n  ) {\n    throw new Error(\n      'React Native does not have a built-in secure random generator. ' +\n        'If you don’t need unpredictable IDs use `nanoid/non-secure`. ' +\n        'For secure IDs, import `react-native-get-random-values` ' +\n        'before Nano ID. If you use Expo, install `expo-random` ' +\n        'and use `nanoid/async`.'\n    )\n  }\n  if (typeof msCrypto !== 'undefined' && typeof crypto === 'undefined') {\n    throw new Error(\n      'Import file with `if (!window.crypto) window.crypto = window.msCrypto`' +\n        ' before importing Nano ID to fix IE 11 support'\n    )\n  }\n  if (typeof crypto === 'undefined') {\n    throw new Error(\n      'Your browser does not have secure random generator. ' +\n        'If you don’t need unpredictable IDs, you can use nanoid/non-secure.'\n    )\n  }\n}\n\nlet random = bytes => crypto.getRandomValues(new Uint8Array(bytes))\n\nlet customRandom = (alphabet, size, getRandom) => {\n  // First, a bitmask is necessary to generate the ID. The bitmask makes bytes\n  // values closer to the alphabet size. The bitmask calculates the closest\n  // `2^31 - 1` number, which exceeds the alphabet size.\n  // For example, the bitmask for the alphabet size 30 is 31 (00011111).\n  // `Math.clz32` is not used, because it is not available in browsers.\n  let mask = (2 << (Math.log(alphabet.length - 1) / Math.LN2)) - 1\n  // Though, the bitmask solution is not perfect since the bytes exceeding\n  // the alphabet size are refused. Therefore, to reliably generate the ID,\n  // the random bytes redundancy has to be satisfied.\n\n  // Note: every hardware random generator call is performance expensive,\n  // because the system call for entropy collection takes a lot of time.\n  // So, to avoid additional system calls, extra bytes are requested in advance.\n\n  // Next, a step determines how many random bytes to generate.\n  // The number of random bytes gets decided upon the ID size, mask,\n  // alphabet size, and magic number 1.6 (using 1.6 peaks at performance\n  // according to benchmarks).\n\n  // `-~f => Math.ceil(f)` if f is a float\n  // `-~i => i + 1` if i is an integer\n  let step = -~((1.6 * mask * size) / alphabet.length)\n\n  return () => {\n    let id = ''\n    while (true) {\n      let bytes = getRandom(step)\n      // A compact alternative for `for (var i = 0; i < step; i++)`.\n      let j = step\n      while (j--) {\n        // Adding `|| ''` refuses a random byte that exceeds the alphabet size.\n        id += alphabet[bytes[j] & mask] || ''\n        if (id.length === size) return id\n      }\n    }\n  }\n}\n\nlet customAlphabet = (alphabet, size) => customRandom(alphabet, size, random)\n\nlet nanoid = (size = 21) => {\n  let id = ''\n  let bytes = crypto.getRandomValues(new Uint8Array(size))\n\n  // A compact alternative for `for (var i = 0; i < step; i++)`.\n  while (size--) {\n    // It is incorrect to use bytes exceeding the alphabet size.\n    // The following mask reduces the random byte in the 0-255 value\n    // range to the 0-63 value range. Therefore, adding hacks, such\n    // as empty string fallback or magic numbers, is unneccessary because\n    // the bitmask trims bytes down to the alphabet size.\n    let byte = bytes[size] & 63\n    if (byte < 36) {\n      // `0-9a-z`\n      id += byte.toString(36)\n    } else if (byte < 62) {\n      // `A-Z`\n      id += (byte - 26).toString(36).toUpperCase()\n    } else if (byte < 63) {\n      id += '_'\n    } else {\n      id += '-'\n    }\n  }\n  return id\n}\n\n\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./node_modules/nanoid/index.dev.js?")},"./node_modules/nanoid/url-alphabet/index.js":(__unused_webpack___webpack_module__,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"urlAlphabet\": () => /* binding */ urlAlphabet\n/* harmony export */ });\n// This alphabet uses `A-Za-z0-9_-` symbols. The genetic algorithm helped\n// optimize the gzip compression for this alphabet.\nlet urlAlphabet =\n  'ModuleSymbhasOwnPr-0123456789ABCDEFGHNRVfgctiUvz_KqYTJkLxpZXIjQW'\n\n\n\n\n//# sourceURL=webpack://TODO-LIST-JS/./node_modules/nanoid/url-alphabet/index.js?")},"./src/components/add-todo-button/button.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ Button\n/* harmony export */ });\n/* harmony import */ var _button_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button.style.scss */ \"./src/components/add-todo-button/button.style.scss\");\n\n\nclass Button {\n  constructor() {\n    this.openBtn = document.getElementById('add-todo-btn');\n    this.formContainer = document.getElementById('todo-form-container');\n  }\n\n  activateButton() {\n    this.openBtn.addEventListener('click', () => {\n      this.formContainer.classList.toggle('d-none');\n      return true;\n    });\n    return this.openBtn.id;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/add-todo-button/button.component.js?")},"./src/components/aside/aside.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ Aside\n/* harmony export */ });\n/* harmony import */ var _aside_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./aside.style.scss */ \"./src/components/aside/aside.style.scss\");\n/* harmony import */ var _images_logo_02_svg__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../images/logo_02.svg */ \"./src/images/logo_02.svg\");\n\n\n\nclass Aside {\n  constructor(name, aisdeContainer) {\n    this.logo = _images_logo_02_svg__WEBPACK_IMPORTED_MODULE_1__.default;\n    this.name = name;\n    this.asideContainer = aisdeContainer;\n  }\n\n  putLogo() {\n    return this.logo;\n  }\n\n  activateClose() {\n    this.asideContainer.addEventListener('click', (e) => {\n      if (e.target.id === 'aside-container' || e.target.id === 'arrow') {\n        this.asideContainer.classList.add('d-none');\n      }\n      return true;\n    });\n    return this.asideContainer.id;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/aside/aside.component.js?")},"./src/components/nav-bar/nav.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ Navbar\n/* harmony export */ });\n/* harmony import */ var _nav_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./nav.style.scss */ \"./src/components/nav-bar/nav.style.scss\");\n\n\nclass Navbar {\n  constructor(element, openElement) {\n    this.element = element;\n    this.openElement = openElement;\n  }\n\n  activateOpenMemu() {\n    this.element.addEventListener('click', () => {\n      this.openElement.classList.toggle('d-none');\n    });\n    return this.element.id;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/nav-bar/nav.component.js?")},"./src/components/project/project.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ Project\n/* harmony export */ });\n/* harmony import */ var _project_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./project.style.scss */ \"./src/components/project/project.style.scss\");\n\n\nclass Project {\n  constructor(title = 'default', color = '#d01de0', todoArray = []) {\n    this.title = title;\n    this.color = color;\n    this.todoArray = todoArray;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/project/project.component.js?")},"./src/components/todo-form/form.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ Form\n/* harmony export */ });\n/* harmony import */ var _form_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./form.style.scss */ \"./src/components/todo-form/form.style.scss\");\n/* harmony import */ var nanoid__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! nanoid */ \"./node_modules/nanoid/index.dev.js\");\n/* harmony import */ var _todo_todo_component__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../todo/todo.component */ \"./src/components/todo/todo.component.js\");\n/* harmony import */ var _project_project_component__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../project/project.component */ \"./src/components/project/project.component.js\");\n/* harmony import */ var _render__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../render */ \"./src/render.js\");\n\n\n\n\n\n\nclass Form {\n  constructor(container, btn) {\n    const containerArray = container.children[1];\n    this.form = containerArray;\n    this.btn = btn;\n  }\n\n  static renderErrorValidation() {\n    const errorContainer = document.getElementById('errors');\n    errorContainer.innerHTML = '';\n    errorContainer.innerHTML = 'To create a new to-do requires all filed';\n    return false;\n  }\n\n  static formValidation(data) {\n    if (!data.title || !data.date || !data.description) {\n      return Form.renderErrorValidation();\n    }\n    return true;\n  }\n\n  static validateProjectForm(title) {\n    if (!title) {\n      Form.renderErrorValidation();\n      return true;\n    }\n    return false;\n  }\n\n  static validateProjectUniquenes(title, errorContainer) {\n    const projectListselect = document.getElementById('project-list');\n    if (projectListselect.querySelector(`#${title}`)) {\n      errorContainer.innerHTML = `The project ${title} already exists.`;\n      return false;\n    }\n    return true;\n  }\n\n  static getProjectTitleAndColor(projectForm) {\n    const errorContainer = document.getElementById('errors');\n    const title = projectForm.elements.projectTitle.value;\n    errorContainer.innerHTML = '';\n    if (Form.validateProjectForm(title)) return false;\n    const color = projectForm.elements.color.value;\n    if (!Form.validateProjectUniquenes(title, errorContainer)) return false;\n    const project = new _project_project_component__WEBPACK_IMPORTED_MODULE_2__.default(title, color);\n    return project;\n  }\n\n  static closeForm(container) {\n    container.classList.toggle('d-none');\n  }\n\n  static saveDataToTheLocalStorage(key, value) {\n    window.localStorage.setItem(key, JSON.stringify(value));\n  }\n\n  static getDataforTheLocalStorage(key) {\n    const starage = JSON.parse(window.localStorage.getItem(key));\n    if (starage === null || starage === 'null') {\n      return [];\n    }\n    return starage;\n  }\n\n  static addNewProjectToForm(project) {\n    if (!project) return false;\n    const projectFormContainer = document.getElementById('project-form-container');\n    const projectListselect = document.getElementById('project-list');\n    const option = document.createElement('option');\n    option.value = project.title;\n    option.selected = 'selected';\n    option.id = project.title;\n    option.innerHTML = project.title;\n    projectListselect.append(option);\n    Form.saveDataToTheLocalStorage(`${project.title}Color`, { color: project.color });\n    Form.closeForm(projectFormContainer);\n    return project;\n  }\n\n  static getProjectFormInfo() {\n    const projectForm = document.getElementById('project-form');\n    const projectFormContainer = document.getElementById('project-form-container');\n    projectForm.addEventListener('click', (e) => {\n      if (e.target.id === 'btn-create-project') {\n        const project = Form.getProjectTitleAndColor(projectForm);\n        return Form.addNewProjectToForm(project);\n      }\n\n      if (e.target.id === 'cancel-project-button') {\n        Form.closeForm(projectFormContainer);\n        return false;\n      }\n      return false;\n    });\n  }\n\n  static lookExistenceProject(formData) {\n    const storageData = Form.getDataforTheLocalStorage('todoApp');\n    if (storageData) {\n      // eslint-disable-next-line no-restricted-syntax\n      for (const storageElement of storageData) {\n        if (storageElement.name === formData.name) {\n          storageElement.todos.push(formData.todos[0]);\n          return storageData;\n        }\n      }\n    }\n    storageData.push(formData);\n    return storageData;\n  }\n\n  static saveData(form) {\n    const id = (0,nanoid__WEBPACK_IMPORTED_MODULE_4__.nanoid)(10);\n    const project = form.elements.project.value;\n    const projectStorageData = window.localStorage.getItem(`${project}Color`);\n    const title = form.elements.title.value;\n    const date = form.elements.date.value;\n    const description = form.elements.description.value;\n    const priority = form.elements.priority.value;\n    if (projectStorageData === null) Form.saveDataToTheLocalStorage(`${project}Color`, { color: '#d01de0' });\n    const color = Form.getDataforTheLocalStorage(`${project}Color`);\n    const todo = new _todo_todo_component__WEBPACK_IMPORTED_MODULE_1__.default(\n      id,\n      project,\n      title,\n      date,\n      description,\n      priority,\n    );\n    if (!Form.formValidation(todo)) return false;\n\n    const formData = { name: project, color: color.color, todos: [todo] };\n    const storageProject = Form.lookExistenceProject(formData);\n    Form.saveDataToTheLocalStorage('todoApp', storageProject);\n    return true;\n  }\n\n  static addOptionsFromStorage() {\n    const projectList = document.getElementById('project-list');\n    const storageProjects = Form.getDataforTheLocalStorage('todoApp');\n    if (storageProjects) {\n      storageProjects.forEach(project => {\n        if (project.name !== 'default') {\n          const opinionTag = document.createElement('option');\n          opinionTag.value = project.name;\n          opinionTag.id = project.name;\n          opinionTag.innerHTML = project.name;\n          projectList.append(opinionTag);\n        }\n      });\n      return storageProjects;\n    }\n    return false;\n  }\n\n  getFromData() {\n    Form.addOptionsFromStorage();\n    Form.getProjectFormInfo();\n    this.form.addEventListener('click', (e) => {\n      if (e.target.id === 'create-button') {\n        const createTodoContainer = document.getElementById('todo-form-container');\n        if (Form.saveData(this.form)) {\n          const reloadDom = new _render__WEBPACK_IMPORTED_MODULE_3__.default();\n          reloadDom.renderProjects();\n          reloadDom.renderAllTodos();\n          this.form.reset();\n          Form.closeForm(createTodoContainer);\n        }\n      }\n\n      if (e.target.id === 'create-project') {\n        const createProjectContainer = document.getElementById('project-form-container');\n        Form.closeForm(createProjectContainer);\n      }\n\n      if (e.target.id === 'cancel-button') {\n        const createTodoContainer = document.getElementById('todo-form-container');\n        Form.closeForm(createTodoContainer);\n      }\n    });\n    return Form.saveData;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/todo-form/form.component.js?")},"./src/components/todo/todo.component.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval('__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   "default": () => /* binding */ Todo\n/* harmony export */ });\n/* harmony import */ var _todo_style_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./todo.style.scss */ "./src/components/todo/todo.style.scss");\n\n\nclass Todo {\n  constructor(id, project, title, date, description, priority, check = false) {\n    this.id = id;\n    this.project = project;\n    this.title = title;\n    this.date = date;\n    this.description = description;\n    this.priority = priority;\n    this.check = check;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/components/todo/todo.component.js?')},"./src/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval('__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _styles_reset_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./styles/reset.scss */ "./src/styles/reset.scss");\n/* harmony import */ var _styles_general_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./styles/general.scss */ "./src/styles/general.scss");\n/* harmony import */ var _components_add_todo_button_button_component__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/add-todo-button/button.component */ "./src/components/add-todo-button/button.component.js");\n/* harmony import */ var _components_aside_aside_component__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/aside/aside.component */ "./src/components/aside/aside.component.js");\n/* harmony import */ var _components_nav_bar_nav_component__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/nav-bar/nav.component */ "./src/components/nav-bar/nav.component.js");\n/* harmony import */ var _components_todo_form_form_component__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/todo-form/form.component */ "./src/components/todo-form/form.component.js");\n/* harmony import */ var _render__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./render */ "./src/render.js");\n\n\n\n\n\n\n\n\n\n\nconst photoImage = document.getElementById(\'photo\');\nconst menuBtn = document.getElementById(\'menu-li\');\nconst aisdeContainer = document.getElementById(\'aside-container\');\nconst createTodoFormBtn = document.getElementById(\'add-todo-btn\');\nconst formContainer = document.getElementById(\'todo-form-container\');\n\nconst render = new _render__WEBPACK_IMPORTED_MODULE_6__.default();\nrender.renderProjects();\nrender.renderAllTodos();\n\nconst form = new _components_todo_form_form_component__WEBPACK_IMPORTED_MODULE_5__.default(formContainer, createTodoFormBtn);\nform.getFromData();\n\nconst aside = new _components_aside_aside_component__WEBPACK_IMPORTED_MODULE_3__.default(\'kender\', aisdeContainer);\nphotoImage.src = aside.putLogo();\naside.activateClose();\n\nconst navBar = new _components_nav_bar_nav_component__WEBPACK_IMPORTED_MODULE_4__.default(menuBtn, aisdeContainer);\nnavBar.activateOpenMemu();\n\n\nconst button = new _components_add_todo_button_button_component__WEBPACK_IMPORTED_MODULE_2__.default();\nbutton.activateButton();\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/index.js?')},"./src/localStorage.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => /* binding */ LocalStorage\n/* harmony export */ });\n\nclass LocalStorage {\n  constructor(key) {\n    this.data = JSON.parse(window.localStorage.getItem(key));\n    this.key = key;\n  }\n\n  saveDataToTheLocalStorage(data) {\n    window.localStorage.setItem(this.key, JSON.stringify(data));\n    return JSON.parse(window.localStorage.getItem(this.key));\n  }\n\n  getDatafromTheLocalStorage() {\n    if (this.data === null || this.data === 'null') {\n      return [];\n    }\n    return this.data;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/localStorage.js?")},"./src/render.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{eval('__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   "default": () => /* binding */ Render\n/* harmony export */ });\n/* harmony import */ var _localStorage__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./localStorage */ "./src/localStorage.js");\n\n\nclass Render {\n  constructor() {\n    this.projectContainer = document.getElementById(\'projects\');\n    this.todoContainer = document.getElementById(\'all-todos-container\');\n  }\n\n  static eventForClick(todo, todoDiv, project, data) {\n    todoDiv.addEventListener(\'click\', (e) => {\n      if (e.target.id === `title-${todo.id}`\n          || e.target.id === `date-${todo.id}`\n          || e.target.id === `container-${todo.id}`) {\n        const detailsContainer = document.getElementById(`details-${todo.id}`);\n        detailsContainer.classList.toggle(\'d-none\');\n      }\n\n      if (e.target.id === `delete-${todo.id}`) {\n        const currentTodo = document.getElementById(`container-${todo.id}`);\n        const currentDetail = document.getElementById(`details-${todo.id}`);\n        const indexOfItem = (project.todos).indexOf(todo);\n        if (indexOfItem > -1) {\n          (project.todos).splice(indexOfItem, 1);\n          const storage = new _localStorage__WEBPACK_IMPORTED_MODULE_0__.default(\'todoApp\');\n          currentTodo.remove();\n          currentDetail.remove();\n          storage.saveDataToTheLocalStorage(data);\n          window.location.reload();\n        }\n      }\n      if (e.target.id === `checkbox-${todo.id}`) {\n        const storage = new _localStorage__WEBPACK_IMPORTED_MODULE_0__.default(\'todoApp\');\n        const checkMark = document.getElementById(`check-mark-${todo.id}`);\n        const todoTitle = document.getElementById(`title-${todo.id}`);\n        const checkBox = document.getElementById(`checkbox-${todo.id}`);\n        todoTitle.classList.toggle(\'cross-line\');\n        checkMark.classList.toggle(\'d-none\');\n        todo.check = checkBox.checked;\n        storage.saveDataToTheLocalStorage(data);\n        window.location.reload();\n      }\n    });\n  }\n\n  static eventForFocusOut(todoDiv, todo, data) {\n    todoDiv.addEventListener(\'focusout\', (e) => {\n      const storage = new _localStorage__WEBPACK_IMPORTED_MODULE_0__.default(\'todoApp\');\n      if (e.target.id === `description-${todo.id}`) {\n        todo.description = e.target.innerHTML;\n        storage.saveDataToTheLocalStorage(data);\n      }\n\n      if (e.target.id === `editable-title-${todo.id}`) {\n        const titleTag = document.getElementById(`title-${todo.id}`);\n        titleTag.innerHTML = e.target.innerHTML;\n        todo.title = e.target.innerHTML;\n        storage.saveDataToTheLocalStorage(data);\n      }\n\n      if (e.target.id === `priority-${todo.id}`) {\n        todo.priority = e.target.value;\n        storage.saveDataToTheLocalStorage(data);\n        window.location.reload();\n      }\n\n      if (e.target.id === `edit-date-${todo.id}`) {\n        const dateTag = document.getElementById(`date-${todo.id}`);\n        dateTag.innerHTML = `Due date: ${e.target.value}`;\n        todo.date = e.target.value;\n        storage.saveDataToTheLocalStorage(data);\n      }\n    });\n  }\n\n  static renderCheckCard(todo) {\n    if (todo.check) {\n      return `<div class="checkbox-container"id="check-${todo.id}">\n        <input type="checkbox" name="checkbox-${todo.id}" id="checkbox-${todo.id}" class="checkbox" checked>\n        <label for="checkbox-${todo.id}" class="checkbox-circle" id="label-${todo.id}"></label>\n        <label for="checkbox-${todo.id}" id="check-mark-${todo.id}" class="checkbox-checker">\n        <ion-icon name="checkmark-outline"></ion-icon>\n        </label>\n      </div>\n      <p class="todo-title cross-line" id="title-${todo.id}">\n        ${todo.title}\n      </p>`;\n    }\n    return `<div class="checkbox-container"id="check-${todo.id}">\n      <input type="checkbox" name="checkbox-${todo.id}" id="checkbox-${todo.id}" class="checkbox">\n      <label for="checkbox-${todo.id}" class="checkbox-circle" id="label-${todo.id}"></label>\n      <label for="checkbox-${todo.id}" id="check-mark-${todo.id}" class="checkbox-checker d-none">\n      <ion-icon name="checkmark-outline"></ion-icon>\n      </label>\n    </div>\n    <p class="todo-title" id="title-${todo.id}">\n      ${todo.title}\n    </p>`;\n  }\n\n  static renderTodoCard(todo) {\n    const todoCard = `\n      <div class="todo d-flex" id="container-${todo.id}">\n        ${Render.renderCheckCard(todo)}\n        <div class="todo-date ml-auto gray-color" id="date-${todo.id}"> Due date: ${todo.date}</div>\n        <ion-icon name="trash-outline" class="delete-todo-icon" id="delete-${todo.id}"></ion-icon>\n        <div class="priority-color-container priority-color-${todo.priority}" id="color-${todo.id}"></div>\n      </div>\n      <div class="todo-details d-none" id="details-${todo.id}">\n        <div class="edit-container">\n          <p class="gray-color">Title</p>\n          <p contenteditable="true" id="editable-title-${todo.id}" class="editable-content">${todo.title}</p>\n        </div>\n        <div class="edit-container">\n          <p class="gray-color">Due date:</p>\n          <input type="date" value="${todo.date}" id="edit-date-${todo.id}" class="editable-content">\n        </div>\n        <div class="edit-container">\n          <p class="gray-color">Description: </p>\n          <p class="editable-content" id="description-${todo.id}">\n              ${todo.description}\n          </p>\n        </div>\n        <div class="edit-container">\n          <p class="gray-color">Priority: </p>\n          <select id="priority-${todo.id}" class="editable-content">\n            <option value="1">1</option>\n            <option value="2">2</option>\n            <option value="3">3</option>\n          </select>\n        </div>\n      </div>\n    `;\n    return todoCard;\n  }\n\n  static construcCard(todoContainer, project, todo, data) {\n    const todoDiv = document.createElement(\'div\');\n    const deleteTitleSpaces = (todo.title).replace(/\\s/g, \'\');\n    todoDiv.id = `todo-${deleteTitleSpaces}`;\n    todoDiv.innerHTML = Render.renderTodoCard(todo);\n    Render.eventForClick(todo, todoDiv, project, data);\n    Render.eventForFocusOut(todoDiv, todo, data);\n    todoContainer.append(todoDiv);\n    const getCircle = document.getElementById(`label-${todo.id}`);\n    const editableDescription = document.getElementById(`description-${todo.id}`);\n    editableDescription.contentEditable = true;\n    getCircle.style.border = `${project.color} 1px solid`;\n  }\n\n  static renderProjectCard(project, projectContainer, data) {\n    const projectDiv = document.createElement(\'div\');\n    projectDiv.className = \'project\';\n    projectDiv.innerHTML = `\n    <p class="gray-color project-number">\n      <span id="project-number">${(project.todos).length}</span>  Todos\n    </p>\n    <b>${project.name} </b>\n    <div class="project-color-default" id="${project.name}-color">\n    </div>`;\n    projectContainer.append(projectDiv);\n    const colorContainer = document.getElementById(`${project.name}-color`);\n    colorContainer.style.backgroundColor = project.color;\n    projectDiv.addEventListener(\'click\', () => {\n      const todoContainer = document.getElementById(\'all-todos-container\');\n      todoContainer.innerHTML = \'\';\n      if (project.todos) {\n        (project.todos).forEach(todo => {\n          Render.construcCard(todoContainer, project, todo, data);\n        });\n      }\n    });\n  }\n\n  renderProjects() {\n    const storage = new _localStorage__WEBPACK_IMPORTED_MODULE_0__.default(\'todoApp\');\n    const data = storage.getDatafromTheLocalStorage();\n\n    this.projectContainer.innerHTML = \'\';\n    if (data) {\n      data.forEach(project => {\n        Render.renderProjectCard(project, this.projectContainer, data);\n      });\n      return data;\n    }\n    return data;\n  }\n\n  renderAllTodos() {\n    const storage = new _localStorage__WEBPACK_IMPORTED_MODULE_0__.default(\'todoApp\');\n    const data = storage.getDatafromTheLocalStorage();\n    this.todoContainer.innerHTML = \'\';\n    if (data) {\n      data.forEach(project => {\n        (project.todos).forEach(todo => {\n          Render.construcCard(this.todoContainer, project, todo, data);\n        });\n      });\n      return data;\n    }\n    return data;\n  }\n}\n\n//# sourceURL=webpack://TODO-LIST-JS/./src/render.js?')}},__webpack_module_cache__={};function __webpack_require__(e){if(__webpack_module_cache__[e])return __webpack_module_cache__[e].exports;var n=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e](n,n.exports,__webpack_require__),n.exports}__webpack_require__.d=(e,n)=>{for(var t in n)__webpack_require__.o(n,t)&&!__webpack_require__.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:n[t]})},__webpack_require__.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},__webpack_require__.p="",__webpack_require__("./src/index.js")})();