v8.2.3 => Release Notes for details

README.md

@@ -54,13 +54,13 @@ git clone https://github.com/TarekRaafat/autoComplete.js.git
 `CSS`
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/css/autoComplete.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/css/autoComplete.min.css">
 ```
 
 `JS`
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/js/autoComplete.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/js/autoComplete.min.js"></script>
 ```
 
 -   <a href="https://www.npmjs.com/package/@tarekraafat/autocomplete.js">npm</a> install `(Node Package Manager)`

dist/js/autoComplete.js

@@ -173,7 +173,7 @@
 
   var createItem = (function (item, index, config) {
     var result = document.createElement(config.resultItem.element);
-    result.setAttribute("id", "".concat(config.resultItem.className, "_").concat(index));
+    result.setAttribute("id", "".concat(config.resultItem.idName, "_").concat(index));
     result.setAttribute("class", config.resultItem.className);
     result.setAttribute("role", "option");
     result.innerHTML = item.match;

docs/README.md

@@ -69,41 +69,41 @@ npm run build
 `CSS`
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/css/autoComplete.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/css/autoComplete.min.css">
 ```
 
 `JS`
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/js/autoComplete.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/js/autoComplete.min.js"></script>
 ```
 
 -   <a href="https://cdnjs.com/libraries/tarekraafat-autocomplete.js"><img src="./img/logos/cdnjs_logo.png" alt="cdnjs Logo" width="100px"></a> CDN
 
 `CSS`
 
 ```html
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.2.2/css/autoComplete.min.css">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.2.3/css/autoComplete.min.css">
 ```
 
 `JS`
 
 ```html
-<script src="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.2.2/js/autoComplete.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.2.3/js/autoComplete.min.js"></script>
 ```
 
--   <a href="https://unpkg.com/browse/@tarekraafat/[email protected].2/"><img src="./img/logos/unpkg_logo.png" alt="unpkg Logo" width="100px"></a> CDN
+-   <a href="https://unpkg.com/browse/@tarekraafat/[email protected].3/"><img src="./img/logos/unpkg_logo.png" alt="unpkg Logo" width="100px"></a> CDN
 
 `CSS`
 
 ```html
-<link rel="stylesheet" href="https://unpkg.com/@tarekraafat/[email protected].2/dist/css/autoComplete.css">
+<link rel="stylesheet" href="https://unpkg.com/@tarekraafat/[email protected].3/dist/css/autoComplete.css">
 ```
 
 `JS`
 
 ```html
-<script src="https://unpkg.com/@tarekraafat/[email protected].2/dist/js/autoComplete.min.js"></script>
+<script src="https://unpkg.com/@tarekraafat/[email protected].3/dist/js/autoComplete.min.js"></script>
 ```
 
 -   <img src="./img/logos/html_logo.png" alt="HTML Logo" width="40px"> HTML Local load
@@ -151,7 +151,7 @@ const autoComplete = require("@tarekraafat/autocomplete.js/dist/js/autoComplete"
 ```html
 <link rel="stylesheet" href="./css/autoComplete.css">
 OR
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/css/autoComplete.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/css/autoComplete.min.css">
 ```
 
 2.  Assign the default `id` value `"autoComplete"` to the desired input field or use any custom `id/class` and configure the API selector accordingly in `Step 4`
@@ -166,7 +166,7 @@ OR
 <script src="./js/autoComplete.min.js"></script>
 <script src="./js/index.js"></script>
 OR
-<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/js/autoComplete.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/js/autoComplete.min.js"></script>
 <script src="./js/index.js"></script>
 ```
 

docs/demo/index.html

@@ -72,7 +72,7 @@
 	<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
 	<meta name="theme-color" content="#ffffff">
 	<link rel="stylesheet" type="text/css" media="screen"
-		href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/css/autoComplete.min.css">
+		href="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/css/autoComplete.min.css">
 	<link rel="stylesheet" type="text/css" media="screen" href="./css/main.css">
 	<link href="https://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet">
 </head>
@@ -151,7 +151,7 @@ <h4>mode</h4>
 			</div>
 		</footer>
 	</div>
-	<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].2/dist/js/autoComplete.min.js"></script>
+	<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/[email protected].3/dist/js/autoComplete.min.js"></script>
 	<script src="./js/index.js"></script>
 </body>
 

docs/releases.md

@@ -26,7 +26,10 @@ Release flags:
 
 ## Release Notes
 
-- v8.2.2 ✨
+- v8.2.3 ✨
+  - 🔧 Fix: `resultItem` ID `setAttribute` to be `idName` instead of `className` (Thanks 👍 @marsimeau) #173
+
+- v8.2.2
   - 🔧 Fix: `diacritics` composite characters do not match (Thanks 👍 @ikemo3 @Michin0suke @bravik) #169 #171
 
 - v8.2.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tarekraafat/autocomplete.js",
-  "version": "8.2.2",
+  "version": "8.2.3",
   "description": "Simple autocomplete pure vanilla Javascript library.",
   "keywords": [
     "simple",