├── .gitignore ├── src ├── index.js ├── index.html └── style.css ├── .hintrc ├── modules ├── toggle.js └── app.js ├── .eslintrc.json ├── .stylelintrc.json ├── webpack.config.js ├── package.json ├── dist ├── index.html └── main.js ├── MIT.md ├── .github └── workflows │ └── linters.yml └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import './style.css'; 2 | import { getData, populateList, addlist } from '../modules/app.js'; 3 | 4 | addlist(); 5 | 6 | window.addEventListener('DOMContentLoaded', () => { 7 | getData(); 8 | populateList(); 9 | }); 10 | -------------------------------------------------------------------------------- /.hintrc: -------------------------------------------------------------------------------- 1 | { 2 | "connector": { 3 | "name": "local", 4 | "options": { 5 | "pattern": ["**", "!.git/**", "!node_modules/**"] 6 | } 7 | }, 8 | "extends": ["development"], 9 | "formatters": ["stylish"], 10 | "hints": [ 11 | "button-type", 12 | "disown-opener", 13 | "html-checker", 14 | "meta-charset-utf-8", 15 | "meta-viewport", 16 | "no-inline-styles:error" 17 | ] 18 | } -------------------------------------------------------------------------------- /modules/toggle.js: -------------------------------------------------------------------------------- 1 | const toggleCheckbox = (todoArray) => { 2 | const chbox = document.querySelectorAll('input[type="checkbox"]'); 3 | chbox.forEach((check, i) => { 4 | check.addEventListener('click', () => { 5 | todoArray[i].completed = !todoArray[i].completed; 6 | localStorage.setItem('todoArray', JSON.stringify(todoArray)); 7 | }); 8 | }); 9 | }; 10 | 11 | export default toggleCheckbox; 12 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true, 5 | "jest": true 6 | }, 7 | "parser": "babel-eslint", 8 | "parserOptions": { 9 | "ecmaVersion": 2018, 10 | "sourceType": "module" 11 | }, 12 | "extends": ["airbnb-base"], 13 | "rules": { 14 | "no-shadow": "off", 15 | "no-param-reassign": "off", 16 | "eol-last": "off", 17 | "import/extensions": [ 1, { 18 | "js": "always", "json": "always" 19 | }] 20 | }, 21 | "ignorePatterns": [ 22 | "dist/", 23 | "build/" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /.stylelintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["stylelint-config-standard"], 3 | "plugins": ["stylelint-scss", "stylelint-csstree-validator"], 4 | "rules": { 5 | "at-rule-no-unknown": [ 6 | true, 7 | { 8 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 9 | } 10 | ], 11 | "scss/at-rule-no-unknown": [ 12 | true, 13 | { 14 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 15 | } 16 | ], 17 | "csstree/validator": true 18 | }, 19 | "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css", "**/*.js", "**/*.jsx"] 20 | } 21 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 3 | 4 | module.exports = { 5 | entry: './src/index.js', 6 | plugins: [ 7 | new HtmlWebpackPlugin({ 8 | template: './src/index.html', 9 | }), 10 | ], 11 | devServer: { 12 | static: './dist', 13 | }, 14 | output: { 15 | filename: 'main.js', 16 | path: path.resolve(__dirname, 'dist'), 17 | clean: true, 18 | }, 19 | module: { 20 | rules: [ 21 | { 22 | test: /\.css$/i, 23 | use: ['style-loader', 'css-loader'], 24 | }, 25 | ], 26 | }, 27 | mode: 'development', 28 | }; 29 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "webpack-demo", 3 | "version": "1.0.0", 4 | "description": "", 5 | "private": true, 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "webpack serve --open", 9 | "build": "webpack" 10 | }, 11 | "keywords": [], 12 | "author": "", 13 | "license": "ISC", 14 | "devDependencies": { 15 | "css-loader": "^6.7.3", 16 | "html-webpack-plugin": "^5.5.0", 17 | "style-loader": "^3.3.1", 18 | "web-vitals": "^3.1.1", 19 | "webpack": "^5.4.0", 20 | "webpack-cli": "^4.2.0", 21 | "webpack-dev-server": "^4.11.1" 22 | }, 23 | "dependencies": { 24 | "lodash": "^4.17.20" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 10 | Todo List 11 | 12 | 13 |
14 |
15 |

Today's To Do

16 | 17 |
18 |
19 |
20 | 25 |
26 |
27 |
28 |

Clear all completed

29 |
30 |
31 | 32 | 33 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 10 | Todo List 11 | 12 | 13 |
14 |
15 |

Today's To Do

16 | 17 |
18 |
19 |
20 | 25 |
26 |
27 |
28 |

Clear all completed

29 |
30 |
31 | 32 | 33 | -------------------------------------------------------------------------------- /MIT.md: -------------------------------------------------------------------------------- 1 | ## Copyright 2023, heldricks adhola 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this webpack template and associated documentation files, to deal in the webpack template without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the webpack template, and to permit persons to whom the webpack template is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the webpack template. 6 | 7 | THE webpack template IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE webpack template OR THE USE OR OTHER DEALINGS IN THE webpack template. 8 | -------------------------------------------------------------------------------- /src/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | h2 { 8 | color: gray; 9 | } 10 | 11 | .todo-form { 12 | width: 70%; 13 | border: 1px solid gray; 14 | margin: 3rem auto; 15 | box-shadow: 3px 3px 5px 6px #ccc; 16 | } 17 | 18 | .todo-header { 19 | display: flex; 20 | align-items: center; 21 | justify-content: space-between; 22 | padding: 1.3rem; 23 | } 24 | 25 | .input-container { 26 | display: flex; 27 | align-items: center; 28 | justify-content: space-between; 29 | padding-right: 1.3rem; 30 | border-bottom: 1px solid gray; 31 | } 32 | 33 | .todo-input { 34 | width: 90%; 35 | font-style: italic; 36 | font-size: 15px; 37 | padding: 1.3rem; 38 | border: 0; 39 | color: gray; 40 | } 41 | 42 | #enter-list { 43 | color: gray; 44 | } 45 | 46 | .list-item { 47 | padding: 1.3rem; 48 | display: flex; 49 | align-items: center; 50 | justify-content: space-between; 51 | font-size: 15px; 52 | border-bottom: 1px solid gray; 53 | } 54 | 55 | .list-item label { 56 | display: flex; 57 | align-items: center; 58 | justify-content: center; 59 | gap: 1rem; 60 | } 61 | 62 | .clear-section { 63 | padding: 1.9rem; 64 | background-color: rgb(239, 236, 236); 65 | cursor: pointer; 66 | } 67 | 68 | .clear-section p { 69 | text-align: center; 70 | font-size: 15px; 71 | } 72 | 73 | .hide { 74 | display: none; 75 | } 76 | 77 | .list-item p[contenteditable='true'] { 78 | outline: none; 79 | } 80 | -------------------------------------------------------------------------------- /.github/workflows/linters.yml: -------------------------------------------------------------------------------- 1 | name: Linters 2 | 3 | on: pull_request 4 | 5 | env: 6 | FORCE_COLOR: 1 7 | 8 | jobs: 9 | lighthouse: 10 | name: Lighthouse 11 | runs-on: ubuntu-22.04 12 | steps: 13 | - uses: actions/checkout@v2 14 | - uses: actions/setup-node@v1 15 | with: 16 | node-version: "12.x" 17 | - name: Setup Lighthouse 18 | run: npm install -g @lhci/cli@0.7.x 19 | - name: Lighthouse Report 20 | run: lhci autorun --upload.target=temporary-public-storage --collect.staticDistDir=. 21 | webhint: 22 | name: Webhint 23 | runs-on: ubuntu-22.04 24 | steps: 25 | - uses: actions/checkout@v2 26 | - uses: actions/setup-node@v1 27 | with: 28 | node-version: "12.x" 29 | - name: Setup Webhint 30 | run: | 31 | npm install --save-dev hint@7.x 32 | [ -f .hintrc ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.hintrc 33 | - name: Webhint Report 34 | run: npx hint . 35 | stylelint: 36 | name: Stylelint 37 | runs-on: ubuntu-22.04 38 | steps: 39 | - uses: actions/checkout@v2 40 | - uses: actions/setup-node@v1 41 | with: 42 | node-version: "12.x" 43 | - name: Setup Stylelint 44 | run: | 45 | npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x 46 | [ -f .stylelintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.stylelintrc.json 47 | - name: Stylelint Report 48 | run: npx stylelint "**/*.{css,scss}" 49 | eslint: 50 | name: ESLint 51 | runs-on: ubuntu-22.04 52 | steps: 53 | - uses: actions/checkout@v2 54 | - uses: actions/setup-node@v1 55 | with: 56 | node-version: "12.x" 57 | - name: Setup ESLint 58 | run: | 59 | npm install html-webpack-plugin 60 | npm i -D esquery@1.4.0 --save-exact 61 | npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x 62 | [ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.eslintrc.json 63 | - name: ESLint Report 64 | run: npx eslint . 65 | nodechecker: 66 | name: node_modules checker 67 | runs-on: ubuntu-22.04 68 | steps: 69 | - uses: actions/checkout@v2 70 | - name: Check node_modules existence 71 | run: | 72 | if [ -d "node_modules/" ]; then echo -e "\e[1;31mThe node_modules/ folder was pushed to the repo. Please remove it from the GitHub repository and try again."; echo -e "\e[1;32mYou can set up a .gitignore file with this folder included on it to prevent this from happening in the future." && exit 1; fi 73 | -------------------------------------------------------------------------------- /modules/app.js: -------------------------------------------------------------------------------- 1 | import toggleCheckbox from './toggle.js'; 2 | 3 | const submit = document.getElementById('enter-list'); 4 | const input = document.querySelector('.todo-input'); 5 | const lists = document.querySelector('.to-do-item'); 6 | 7 | let todoArray = []; 8 | 9 | // Get data from the local storage 10 | const getData = () => { 11 | const data = localStorage.getItem('todoArray'); 12 | if (data) { 13 | todoArray = JSON.parse(data); 14 | } 15 | }; 16 | 17 | // Add data to the local storage 18 | const addData = () => { 19 | localStorage.setItem('todoArray', JSON.stringify(todoArray)); 20 | }; 21 | 22 | // Add item 23 | const addItem = (description) => { 24 | const item = { 25 | description, 26 | completed: false, 27 | index: todoArray.length + 1, 28 | }; 29 | todoArray.push(item); 30 | addData(); 31 | }; 32 | 33 | // display list and content on the page 34 | const populateList = () => { 35 | const displayData = todoArray.map( 36 | (item) => ` 37 |
38 | 44 | 45 | 48 | 49 | 52 |
53 |
54 | `, 55 | ); 56 | lists.innerHTML = displayData.join(' '); 57 | 58 | // toggle checked and unchecked on the list 59 | toggleCheckbox(todoArray); 60 | 61 | // add event listener to detail buttons 62 | const detailbtn = document.querySelectorAll('.detail-btn'); 63 | detailbtn.forEach((btn) => { 64 | btn.addEventListener('click', (e) => { 65 | e.preventDefault(); 66 | const index = parseInt(e.currentTarget.dataset.index, 10); 67 | const deletebtn = document.querySelector( 68 | `.delete-btn[data-index="${index}"]`, 69 | ); 70 | deletebtn.classList.remove('hide'); 71 | btn.classList.add('hide'); 72 | 73 | // make the paragraph editable 74 | const p = e.currentTarget.parentNode.querySelector('p'); 75 | p.contentEditable = true; 76 | p.focus(); 77 | }); 78 | }); 79 | 80 | // add event listener to delete buttons 81 | const deletebtn = document.querySelectorAll('.delete-btn'); 82 | deletebtn.forEach((btn) => { 83 | btn.addEventListener('click', (e) => { 84 | const index = parseInt(e.currentTarget.dataset.index, 10); 85 | todoArray.splice(index - 1, 1); 86 | for (let i = index - 1; i < todoArray.length; i += 1) { 87 | todoArray[i].index = i + 1; 88 | } 89 | addData(); 90 | populateList(); 91 | }); 92 | }); 93 | 94 | // Delete all 95 | const clearBtn = document.getElementById('clear-btn'); 96 | clearBtn.addEventListener('click', (e) => { 97 | // eslint-disable-next-line no-unused-vars 98 | const index = parseInt(e.currentTarget.dataset.index, 10); 99 | todoArray = todoArray.filter((item) => !item.completed); 100 | todoArray.forEach((item, index) => { 101 | item.index = index + 1; 102 | }); 103 | addData(); 104 | populateList(); 105 | }); 106 | 107 | // add event listener to paragraphs for editing 108 | const paragraphs = document.querySelectorAll('.list-item p'); 109 | paragraphs.forEach((p, i) => { 110 | p.addEventListener('keydown', (e) => { 111 | if (e.keyCode === 13) { 112 | e.preventDefault(); 113 | p.blur(); 114 | } 115 | }); 116 | p.addEventListener('blur', () => { 117 | todoArray[i].description = p.textContent.trim; 118 | addData(); 119 | }); 120 | }); 121 | }; 122 | 123 | // add list when form is submitted 124 | const addlist = () => { 125 | submit.addEventListener('click', (e) => { 126 | e.preventDefault(); 127 | const inputData = input.value.trim(); 128 | if (inputData !== '') { 129 | addItem(inputData); 130 | input.value = ''; 131 | populateList(); 132 | } 133 | }); 134 | input.addEventListener('keydown', (e) => { 135 | if (e.keyCode === 13) { 136 | e.preventDefault(); 137 | submit.click(); 138 | } 139 | }); 140 | }; 141 | 142 | export { 143 | getData, populateList, addlist, addData, 144 | }; 145 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 27 | 28 |
29 | 30 | 31 |
32 | 33 | 34 | 35 |
36 | 37 | 38 | 39 | # 📗 Table of Contents 40 | 41 | - [📖 About the Project](#about-project) 42 | - [🛠 Built With](#built-with) 43 | - [Tech Stack](#tech-stack) 44 | - [Key Features](#key-features) 45 | - [🚀 Live Demo](#live-demo) 46 | - [💻 Getting Started](#getting-started) 47 | - [Setup](#setup) 48 | - [Prerequisites](#prerequisites) 49 | - [Install](#install) 50 | - [Usage](#usage) 51 | - [Run tests](#run-tests) 52 | - [Deployment](#triangular_flag_on_post-deployment) 53 | - [👥 Authors](#authors) 54 | - [🔭 Future Features](#future-features) 55 | - [🤝 Contributing](#contributing) 56 | - [⭐️ Show your support](#support) 57 | - [🙏 Acknowledgements](#acknowledgements) 58 | - [❓ FAQ (OPTIONAL)](#faq) 59 | - [📝 License](#license) 60 | 61 | 62 | 63 | # 📖 TODO LiSTS 64 | 65 | 66 | 67 | **Todo List** is a javascript project that behave like a simple to do list application. The application could add item, delete an item, edit an item and also clear items that have been checked by the user. 68 | 69 | ## 🛠 Built With 70 | 71 | - **HTML** 72 | - **CSS** 73 | - **JAVASCRIPT** 74 | 75 | 76 | 77 | ### Key Features 78 | 79 | 80 | 81 | - **Webpack** 82 | - 83 | 84 |

(back to top)

85 | 86 | 87 | 88 | ## 🚀 Live Demo 89 | 90 | 91 | 92 | - [Coming soon](https://adholah96.github.io/to-do-list/dist/) 93 | 94 |

(back to top)

95 | 96 | ## 💻 Getting Started 97 | 98 | ### Prerequisites 99 | 100 | In order to run this project you need: 101 | 102 | - Visual Studio Code 103 | - A Browser 104 | - Node 105 | - Git 106 | 107 | ### Setup 108 | 109 | Clone this repository to your desired folder: 110 | 111 | Example commands: 112 | 113 | ```sh 114 | cd 115 | git clone git@github.com:Adholah96/webpack.git 116 | cd awesom-books 117 | ``` 118 | 119 | ### Install 120 | 121 | Install this project with: 122 | 123 | ```sh 124 | npm install 125 | ``` 126 | 127 | ### Usage 128 | 129 | To run the project, execute the following command: 130 | 131 | - Open the the index.html file in the browser or 132 | - Install Live Server extension when using Visual code and open with Live server extension 133 | 134 |

(back to top)

135 | 136 | 137 | 138 | ## 👥 Authors 139 | 140 | 141 | 142 | 👤 **HELDRICKS ADHOLA** 143 | 144 | - GitHub: [@adholah96](https://github.com/Adholah96) 145 | - Twitter: [@nerdy*me*](https://twitter.com/nerdy_me_) 146 | - LinkedIn: [heldricks-arthur](https://linkedin.com/in/heldricks-arthur-59ab2411a) 147 | 148 |

(back to top)

149 | 150 | 151 | 152 | ## 🔭 Future Features 153 | 154 | 155 | 156 | - **More modules** 157 | 158 |

(back to top)

159 | 160 | 161 | 162 | ## 🤝 Contributing 163 | 164 | Contributions, issues, and feature requests are welcome! 165 | 166 | 167 | 168 |

(back to top)

169 | 170 | 171 | 172 | ## ⭐️ Show your support 173 | 174 | Always leave a ⭐️ if you like this project and any of my other projects. 175 | 176 |

(back to top)

177 | 178 | 179 | 180 | ## 🙏 Acknowledgments 181 | 182 | 183 | 184 | Passing my sincere gratitude to Cynthia from Behance for the design template. 185 | 186 |

(back to top)

187 | 188 | 189 | 190 | 193 | 194 | 203 | 204 | 205 | 206 | ## 📝 License 207 | 208 | This project is [MIT](./MIT.md) licensed. 209 | 210 |

(back to top)

211 | -------------------------------------------------------------------------------- /dist/main.js: -------------------------------------------------------------------------------- 1 | /* 2 | * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development"). 3 | * This devtool is neither made for production nor for readable output files. 4 | * It uses "eval()" calls to create a separate source file in the browser devtools. 5 | * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/) 6 | * or disable the default devtool with "devtool: false". 7 | * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/). 8 | */ 9 | /******/ (() => { // webpackBootstrap 10 | /******/ "use strict"; 11 | /******/ var __webpack_modules__ = ({ 12 | 13 | /***/ "./modules/app.js": 14 | /*!************************!*\ 15 | !*** ./modules/app.js ***! 16 | \************************/ 17 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 18 | 19 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"addData\": () => (/* binding */ addData),\n/* harmony export */ \"addlist\": () => (/* binding */ addlist),\n/* harmony export */ \"getData\": () => (/* binding */ getData),\n/* harmony export */ \"populateList\": () => (/* binding */ populateList)\n/* harmony export */ });\n/* harmony import */ var _toggle_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./toggle.js */ \"./modules/toggle.js\");\n\n\nconst submit = document.getElementById('enter-list');\nconst input = document.querySelector('.todo-input');\nconst lists = document.querySelector('.to-do-item');\n\nlet todoArray = [];\n\n// Get data from the local storage\nconst getData = () => {\n const data = localStorage.getItem('todoArray');\n if (data) {\n todoArray = JSON.parse(data);\n }\n};\n\n// Add data to the local storage\nconst addData = () => {\n localStorage.setItem('todoArray', JSON.stringify(todoArray));\n};\n\n// Add item\nconst addItem = (description) => {\n const item = {\n description,\n completed: false,\n index: todoArray.length + 1,\n };\n todoArray.push(item);\n addData();\n};\n\n// display list and content on the page\nconst populateList = () => {\n const displayData = todoArray.map(\n (item) => `\n
\n \n\n \n\n \n
\n
\n `,\n );\n lists.innerHTML = displayData.join(' ');\n\n // toggle checked and unchecked on the list\n (0,_toggle_js__WEBPACK_IMPORTED_MODULE_0__[\"default\"])(todoArray);\n\n // add event listener to detail buttons\n const detailbtn = document.querySelectorAll('.detail-btn');\n detailbtn.forEach((btn) => {\n btn.addEventListener('click', (e) => {\n e.preventDefault();\n const index = parseInt(e.currentTarget.dataset.index, 10);\n const deletebtn = document.querySelector(\n `.delete-btn[data-index=\"${index}\"]`,\n );\n deletebtn.classList.remove('hide');\n btn.classList.add('hide');\n\n // make the paragraph editable\n const p = e.currentTarget.parentNode.querySelector('p');\n p.contentEditable = true;\n p.focus();\n });\n });\n\n // add event listener to delete buttons\n const deletebtn = document.querySelectorAll('.delete-btn');\n deletebtn.forEach((btn) => {\n btn.addEventListener('click', (e) => {\n const index = parseInt(e.currentTarget.dataset.index, 10);\n todoArray.splice(index - 1, 1);\n for (let i = index - 1; i < todoArray.length; i += 1) {\n todoArray[i].index = i + 1;\n }\n addData();\n populateList();\n });\n });\n\n // Delete all\n const clearBtn = document.getElementById('clear-btn');\n clearBtn.addEventListener('click', (e) => {\n // eslint-disable-next-line no-unused-vars\n const index = parseInt(e.currentTarget.dataset.index, 10);\n todoArray = todoArray.filter((item) => !item.completed);\n todoArray.forEach((item, index) => {\n item.index = index + 1;\n });\n addData();\n populateList();\n });\n\n // add event listener to paragraphs for editing\n const paragraphs = document.querySelectorAll('.list-item p');\n paragraphs.forEach((p, i) => {\n p.addEventListener('keydown', (e) => {\n if (e.keyCode === 13) {\n e.preventDefault();\n p.blur();\n }\n });\n p.addEventListener('blur', () => {\n todoArray[i].description = p.textContent.trim;\n addData();\n });\n });\n};\n\n// add list when form is submitted\nconst addlist = () => {\n submit.addEventListener('click', (e) => {\n e.preventDefault();\n const inputData = input.value.trim();\n if (inputData !== '') {\n addItem(inputData);\n input.value = '';\n populateList();\n }\n });\n input.addEventListener('keydown', (e) => {\n if (e.keyCode === 13) {\n e.preventDefault();\n submit.click();\n }\n });\n};\n\n\n\n\n//# sourceURL=webpack://webpack-demo/./modules/app.js?"); 20 | 21 | /***/ }), 22 | 23 | /***/ "./modules/toggle.js": 24 | /*!***************************!*\ 25 | !*** ./modules/toggle.js ***! 26 | \***************************/ 27 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 28 | 29 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nconst toggleCheckbox = (todoArray) => {\n const chbox = document.querySelectorAll('input[type=\"checkbox\"]')\n chbox.forEach((check, i) => {\n check.addEventListener('click', () => {\n todoArray[i].completed = !todoArray[i].completed\n localStorage.setItem('todoArray', JSON.stringify(todoArray))\n })\n })\n}\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (toggleCheckbox);\n\n\n//# sourceURL=webpack://webpack-demo/./modules/toggle.js?"); 30 | 31 | /***/ }), 32 | 33 | /***/ "./node_modules/css-loader/dist/cjs.js!./src/style.css": 34 | /*!*************************************************************!*\ 35 | !*** ./node_modules/css-loader/dist/cjs.js!./src/style.css ***! 36 | \*************************************************************/ 37 | /***/ ((module, __webpack_exports__, __webpack_require__) => { 38 | 39 | 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 import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"* {\\r\\n margin: 0;\\r\\n padding: 0;\\r\\n box-sizing: border-box;\\r\\n}\\r\\n\\r\\nh2 {\\r\\n color: gray;\\r\\n}\\r\\n\\r\\n.todo-form {\\r\\n width: 70%;\\r\\n border: 1px solid gray;\\r\\n margin: 3rem auto;\\r\\n box-shadow: 3px 3px 5px 6px #ccc;\\r\\n}\\r\\n\\r\\n.todo-header {\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: space-between;\\r\\n padding: 1.3rem;\\r\\n}\\r\\n\\r\\n.input-container {\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: space-between;\\r\\n padding-right: 1.3rem;\\r\\n border-bottom: 1px solid gray;\\r\\n}\\r\\n\\r\\n.todo-input {\\r\\n width: 90%;\\r\\n font-style: italic;\\r\\n font-size: 15px;\\r\\n padding: 1.3rem;\\r\\n border: 0;\\r\\n color: gray;\\r\\n}\\r\\n\\r\\n#enter-list {\\r\\n color: gray;\\r\\n}\\r\\n\\r\\n.list-item {\\r\\n padding: 1.3rem;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: space-between;\\r\\n font-size: 15px;\\r\\n border-bottom: 1px solid gray;\\r\\n}\\r\\n\\r\\n.list-item label {\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n gap: 1rem;\\r\\n}\\r\\n\\r\\n.clear-section {\\r\\n padding: 1.9rem;\\r\\n background-color: rgb(239, 236, 236);\\r\\n cursor: pointer;\\r\\n}\\r\\n\\r\\n.clear-section p {\\r\\n text-align: center;\\r\\n font-size: 15px;\\r\\n}\\r\\n\\r\\n.hide {\\r\\n display: none;\\r\\n}\\r\\n\\r\\n.list-item p[contenteditable='true'] {\\r\\n outline: none;\\r\\n}\\r\\n\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://webpack-demo/./src/style.css?./node_modules/css-loader/dist/cjs.js"); 40 | 41 | /***/ }), 42 | 43 | /***/ "./node_modules/css-loader/dist/runtime/api.js": 44 | /*!*****************************************************!*\ 45 | !*** ./node_modules/css-loader/dist/runtime/api.js ***! 46 | \*****************************************************/ 47 | /***/ ((module) => { 48 | 49 | eval("\n\n/*\n MIT License http://www.opensource.org/licenses/mit-license.php\n Author Tobias Koppers @sokra\n*/\nmodule.exports = function (cssWithMappingToString) {\n var list = [];\n\n // return the list of modules as css string\n list.toString = function toString() {\n return this.map(function (item) {\n var content = \"\";\n var needLayer = typeof item[5] !== \"undefined\";\n if (item[4]) {\n content += \"@supports (\".concat(item[4], \") {\");\n }\n if (item[2]) {\n content += \"@media \".concat(item[2], \" {\");\n }\n if (needLayer) {\n content += \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\");\n }\n content += cssWithMappingToString(item);\n if (needLayer) {\n content += \"}\";\n }\n if (item[2]) {\n content += \"}\";\n }\n if (item[4]) {\n content += \"}\";\n }\n return content;\n }).join(\"\");\n };\n\n // import a list of modules into the list\n list.i = function i(modules, media, dedupe, supports, layer) {\n if (typeof modules === \"string\") {\n modules = [[null, modules, undefined]];\n }\n var alreadyImportedModules = {};\n if (dedupe) {\n for (var k = 0; k < this.length; k++) {\n var id = this[k][0];\n if (id != null) {\n alreadyImportedModules[id] = true;\n }\n }\n }\n for (var _k = 0; _k < modules.length; _k++) {\n var item = [].concat(modules[_k]);\n if (dedupe && alreadyImportedModules[item[0]]) {\n continue;\n }\n if (typeof layer !== \"undefined\") {\n if (typeof item[5] === \"undefined\") {\n item[5] = layer;\n } else {\n item[1] = \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\").concat(item[1], \"}\");\n item[5] = layer;\n }\n }\n if (media) {\n if (!item[2]) {\n item[2] = media;\n } else {\n item[1] = \"@media \".concat(item[2], \" {\").concat(item[1], \"}\");\n item[2] = media;\n }\n }\n if (supports) {\n if (!item[4]) {\n item[4] = \"\".concat(supports);\n } else {\n item[1] = \"@supports (\".concat(item[4], \") {\").concat(item[1], \"}\");\n item[4] = supports;\n }\n }\n list.push(item);\n }\n };\n return list;\n};\n\n//# sourceURL=webpack://webpack-demo/./node_modules/css-loader/dist/runtime/api.js?"); 50 | 51 | /***/ }), 52 | 53 | /***/ "./node_modules/css-loader/dist/runtime/noSourceMaps.js": 54 | /*!**************************************************************!*\ 55 | !*** ./node_modules/css-loader/dist/runtime/noSourceMaps.js ***! 56 | \**************************************************************/ 57 | /***/ ((module) => { 58 | 59 | eval("\n\nmodule.exports = function (i) {\n return i[1];\n};\n\n//# sourceURL=webpack://webpack-demo/./node_modules/css-loader/dist/runtime/noSourceMaps.js?"); 60 | 61 | /***/ }), 62 | 63 | /***/ "./src/style.css": 64 | /*!***********************!*\ 65 | !*** ./src/style.css ***! 66 | \***********************/ 67 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 68 | 69 | 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 import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ \"./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleDomAPI.js */ \"./node_modules/style-loader/dist/runtime/styleDomAPI.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertBySelector.js */ \"./node_modules/style-loader/dist/runtime/insertBySelector.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ \"./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/insertStyleElement.js */ \"./node_modules/style-loader/dist/runtime/insertStyleElement.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../node_modules/style-loader/dist/runtime/styleTagTransform.js */ \"./node_modules/style-loader/dist/runtime/styleTagTransform.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../node_modules/css-loader/dist/cjs.js!./style.css */ \"./node_modules/css-loader/dist/cjs.js!./src/style.css\");\n\n \n \n \n \n \n \n \n \n \n\nvar options = {};\n\noptions.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());\noptions.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());\n\n options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, \"head\");\n \noptions.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());\noptions.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());\n\nvar update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"], options);\n\n\n\n\n /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"] && _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals ? _node_modules_css_loader_dist_cjs_js_style_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals : undefined);\n\n\n//# sourceURL=webpack://webpack-demo/./src/style.css?"); 70 | 71 | /***/ }), 72 | 73 | /***/ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js": 74 | /*!****************************************************************************!*\ 75 | !*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***! 76 | \****************************************************************************/ 77 | /***/ ((module) => { 78 | 79 | eval("\n\nvar stylesInDOM = [];\n\nfunction getIndexByIdentifier(identifier) {\n var result = -1;\n\n for (var i = 0; i < stylesInDOM.length; i++) {\n if (stylesInDOM[i].identifier === identifier) {\n result = i;\n break;\n }\n }\n\n return result;\n}\n\nfunction modulesToDom(list, options) {\n var idCountMap = {};\n var identifiers = [];\n\n for (var i = 0; i < list.length; i++) {\n var item = list[i];\n var id = options.base ? item[0] + options.base : item[0];\n var count = idCountMap[id] || 0;\n var identifier = \"\".concat(id, \" \").concat(count);\n idCountMap[id] = count + 1;\n var indexByIdentifier = getIndexByIdentifier(identifier);\n var obj = {\n css: item[1],\n media: item[2],\n sourceMap: item[3],\n supports: item[4],\n layer: item[5]\n };\n\n if (indexByIdentifier !== -1) {\n stylesInDOM[indexByIdentifier].references++;\n stylesInDOM[indexByIdentifier].updater(obj);\n } else {\n var updater = addElementStyle(obj, options);\n options.byIndex = i;\n stylesInDOM.splice(i, 0, {\n identifier: identifier,\n updater: updater,\n references: 1\n });\n }\n\n identifiers.push(identifier);\n }\n\n return identifiers;\n}\n\nfunction addElementStyle(obj, options) {\n var api = options.domAPI(options);\n api.update(obj);\n\n var updater = function updater(newObj) {\n if (newObj) {\n if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {\n return;\n }\n\n api.update(obj = newObj);\n } else {\n api.remove();\n }\n };\n\n return updater;\n}\n\nmodule.exports = function (list, options) {\n options = options || {};\n list = list || [];\n var lastIdentifiers = modulesToDom(list, options);\n return function update(newList) {\n newList = newList || [];\n\n for (var i = 0; i < lastIdentifiers.length; i++) {\n var identifier = lastIdentifiers[i];\n var index = getIndexByIdentifier(identifier);\n stylesInDOM[index].references--;\n }\n\n var newLastIdentifiers = modulesToDom(newList, options);\n\n for (var _i = 0; _i < lastIdentifiers.length; _i++) {\n var _identifier = lastIdentifiers[_i];\n\n var _index = getIndexByIdentifier(_identifier);\n\n if (stylesInDOM[_index].references === 0) {\n stylesInDOM[_index].updater();\n\n stylesInDOM.splice(_index, 1);\n }\n }\n\n lastIdentifiers = newLastIdentifiers;\n };\n};\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?"); 80 | 81 | /***/ }), 82 | 83 | /***/ "./node_modules/style-loader/dist/runtime/insertBySelector.js": 84 | /*!********************************************************************!*\ 85 | !*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***! 86 | \********************************************************************/ 87 | /***/ ((module) => { 88 | 89 | eval("\n\nvar memo = {};\n/* istanbul ignore next */\n\nfunction getTarget(target) {\n if (typeof memo[target] === \"undefined\") {\n var styleTarget = document.querySelector(target); // Special case to return head of iframe instead of iframe itself\n\n if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {\n try {\n // This will throw an exception if access to iframe is blocked\n // due to cross-origin restrictions\n styleTarget = styleTarget.contentDocument.head;\n } catch (e) {\n // istanbul ignore next\n styleTarget = null;\n }\n }\n\n memo[target] = styleTarget;\n }\n\n return memo[target];\n}\n/* istanbul ignore next */\n\n\nfunction insertBySelector(insert, style) {\n var target = getTarget(insert);\n\n if (!target) {\n throw new Error(\"Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.\");\n }\n\n target.appendChild(style);\n}\n\nmodule.exports = insertBySelector;\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/insertBySelector.js?"); 90 | 91 | /***/ }), 92 | 93 | /***/ "./node_modules/style-loader/dist/runtime/insertStyleElement.js": 94 | /*!**********************************************************************!*\ 95 | !*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***! 96 | \**********************************************************************/ 97 | /***/ ((module) => { 98 | 99 | eval("\n\n/* istanbul ignore next */\nfunction insertStyleElement(options) {\n var element = document.createElement(\"style\");\n options.setAttributes(element, options.attributes);\n options.insert(element, options.options);\n return element;\n}\n\nmodule.exports = insertStyleElement;\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/insertStyleElement.js?"); 100 | 101 | /***/ }), 102 | 103 | /***/ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js": 104 | /*!**********************************************************************************!*\ 105 | !*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***! 106 | \**********************************************************************************/ 107 | /***/ ((module, __unused_webpack_exports, __webpack_require__) => { 108 | 109 | eval("\n\n/* istanbul ignore next */\nfunction setAttributesWithoutAttributes(styleElement) {\n var nonce = true ? __webpack_require__.nc : 0;\n\n if (nonce) {\n styleElement.setAttribute(\"nonce\", nonce);\n }\n}\n\nmodule.exports = setAttributesWithoutAttributes;\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js?"); 110 | 111 | /***/ }), 112 | 113 | /***/ "./node_modules/style-loader/dist/runtime/styleDomAPI.js": 114 | /*!***************************************************************!*\ 115 | !*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***! 116 | \***************************************************************/ 117 | /***/ ((module) => { 118 | 119 | eval("\n\n/* istanbul ignore next */\nfunction apply(styleElement, options, obj) {\n var css = \"\";\n\n if (obj.supports) {\n css += \"@supports (\".concat(obj.supports, \") {\");\n }\n\n if (obj.media) {\n css += \"@media \".concat(obj.media, \" {\");\n }\n\n var needLayer = typeof obj.layer !== \"undefined\";\n\n if (needLayer) {\n css += \"@layer\".concat(obj.layer.length > 0 ? \" \".concat(obj.layer) : \"\", \" {\");\n }\n\n css += obj.css;\n\n if (needLayer) {\n css += \"}\";\n }\n\n if (obj.media) {\n css += \"}\";\n }\n\n if (obj.supports) {\n css += \"}\";\n }\n\n var sourceMap = obj.sourceMap;\n\n if (sourceMap && typeof btoa !== \"undefined\") {\n css += \"\\n/*# sourceMappingURL=data:application/json;base64,\".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), \" */\");\n } // For old IE\n\n /* istanbul ignore if */\n\n\n options.styleTagTransform(css, styleElement, options.options);\n}\n\nfunction removeStyleElement(styleElement) {\n // istanbul ignore if\n if (styleElement.parentNode === null) {\n return false;\n }\n\n styleElement.parentNode.removeChild(styleElement);\n}\n/* istanbul ignore next */\n\n\nfunction domAPI(options) {\n var styleElement = options.insertStyleElement(options);\n return {\n update: function update(obj) {\n apply(styleElement, options, obj);\n },\n remove: function remove() {\n removeStyleElement(styleElement);\n }\n };\n}\n\nmodule.exports = domAPI;\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/styleDomAPI.js?"); 120 | 121 | /***/ }), 122 | 123 | /***/ "./node_modules/style-loader/dist/runtime/styleTagTransform.js": 124 | /*!*********************************************************************!*\ 125 | !*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***! 126 | \*********************************************************************/ 127 | /***/ ((module) => { 128 | 129 | eval("\n\n/* istanbul ignore next */\nfunction styleTagTransform(css, styleElement) {\n if (styleElement.styleSheet) {\n styleElement.styleSheet.cssText = css;\n } else {\n while (styleElement.firstChild) {\n styleElement.removeChild(styleElement.firstChild);\n }\n\n styleElement.appendChild(document.createTextNode(css));\n }\n}\n\nmodule.exports = styleTagTransform;\n\n//# sourceURL=webpack://webpack-demo/./node_modules/style-loader/dist/runtime/styleTagTransform.js?"); 130 | 131 | /***/ }), 132 | 133 | /***/ "./src/index.js": 134 | /*!**********************!*\ 135 | !*** ./src/index.js ***! 136 | \**********************/ 137 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 138 | 139 | eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _style_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./style.css */ \"./src/style.css\");\n/* harmony import */ var _modules_app_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../modules/app.js */ \"./modules/app.js\");\n\n\n\n(0,_modules_app_js__WEBPACK_IMPORTED_MODULE_1__.addlist)();\n\nwindow.addEventListener('DOMContentLoaded', () => {\n (0,_modules_app_js__WEBPACK_IMPORTED_MODULE_1__.getData)();\n (0,_modules_app_js__WEBPACK_IMPORTED_MODULE_1__.populateList)();\n});\n\n\n//# sourceURL=webpack://webpack-demo/./src/index.js?"); 140 | 141 | /***/ }) 142 | 143 | /******/ }); 144 | /************************************************************************/ 145 | /******/ // The module cache 146 | /******/ var __webpack_module_cache__ = {}; 147 | /******/ 148 | /******/ // The require function 149 | /******/ function __webpack_require__(moduleId) { 150 | /******/ // Check if module is in cache 151 | /******/ var cachedModule = __webpack_module_cache__[moduleId]; 152 | /******/ if (cachedModule !== undefined) { 153 | /******/ return cachedModule.exports; 154 | /******/ } 155 | /******/ // Create a new module (and put it into the cache) 156 | /******/ var module = __webpack_module_cache__[moduleId] = { 157 | /******/ id: moduleId, 158 | /******/ // no module.loaded needed 159 | /******/ exports: {} 160 | /******/ }; 161 | /******/ 162 | /******/ // Execute the module function 163 | /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); 164 | /******/ 165 | /******/ // Return the exports of the module 166 | /******/ return module.exports; 167 | /******/ } 168 | /******/ 169 | /************************************************************************/ 170 | /******/ /* webpack/runtime/compat get default export */ 171 | /******/ (() => { 172 | /******/ // getDefaultExport function for compatibility with non-harmony modules 173 | /******/ __webpack_require__.n = (module) => { 174 | /******/ var getter = module && module.__esModule ? 175 | /******/ () => (module['default']) : 176 | /******/ () => (module); 177 | /******/ __webpack_require__.d(getter, { a: getter }); 178 | /******/ return getter; 179 | /******/ }; 180 | /******/ })(); 181 | /******/ 182 | /******/ /* webpack/runtime/define property getters */ 183 | /******/ (() => { 184 | /******/ // define getter functions for harmony exports 185 | /******/ __webpack_require__.d = (exports, definition) => { 186 | /******/ for(var key in definition) { 187 | /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { 188 | /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); 189 | /******/ } 190 | /******/ } 191 | /******/ }; 192 | /******/ })(); 193 | /******/ 194 | /******/ /* webpack/runtime/hasOwnProperty shorthand */ 195 | /******/ (() => { 196 | /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) 197 | /******/ })(); 198 | /******/ 199 | /******/ /* webpack/runtime/make namespace object */ 200 | /******/ (() => { 201 | /******/ // define __esModule on exports 202 | /******/ __webpack_require__.r = (exports) => { 203 | /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 204 | /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 205 | /******/ } 206 | /******/ Object.defineProperty(exports, '__esModule', { value: true }); 207 | /******/ }; 208 | /******/ })(); 209 | /******/ 210 | /******/ /* webpack/runtime/nonce */ 211 | /******/ (() => { 212 | /******/ __webpack_require__.nc = undefined; 213 | /******/ })(); 214 | /******/ 215 | /************************************************************************/ 216 | /******/ 217 | /******/ // startup 218 | /******/ // Load entry module and return exports 219 | /******/ // This entry module can't be inlined because the eval devtool is used. 220 | /******/ var __webpack_exports__ = __webpack_require__("./src/index.js"); 221 | /******/ 222 | /******/ })() 223 | ; --------------------------------------------------------------------------------