From e56ed8648c354b912030b6b73de8e3bc0dc984e0 Mon Sep 17 00:00:00 2001
From: Matt Mo <matt@montoyatech.com>
Date: Mon, 6 Dec 2021 23:06:00 -0800
Subject: [PATCH] Added ability to use objects within array options. Added
 better documentation.

---
 ignite-html-select.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/ignite-html-select.js b/ignite-html-select.js
index 9852f6e..aedb41c 100644
--- a/ignite-html-select.js
+++ b/ignite-html-select.js
@@ -150,10 +150,12 @@ import { IgniteTemplate } from "../ignite-html/ignite-template.js";
 }
 
 /**
- * Generates a series of options based on key value pairs.
+ * Generates a series of options from an array of values, or an object of key values pairs.
  * @param {Array|Object} options An array of strings or list of key value pairs to create options from.
  * @param {*} placeholder The placeholder option, it's value will be 0, if set this text will be shown.
  * @returns {IgniteTemplate} This ignite template.
+ * @example IgniteTemplate.prototype.options([{"Custom value": "Display value"}, "value2", "value3"]);
+ * @example IgniteTemplate.prototype.options({"value1": "A", "value2": "B"});
  */
  IgniteTemplate.prototype.options = function(options, placeholder = null) {
     //Generate html and populate the template with it.
@@ -165,7 +167,12 @@ import { IgniteTemplate } from "../ignite-html/ignite-template.js";
 
     if (Array.isArray(options)) {
         for (var i = 0; i < options.length; i++) {
-            html += `<option value='${options[i]}'>${options[i]}</option>`;
+            if (options[i] instanceof Object) {
+                var keys = Object.keys(options[i]);
+                html += `<option value='${keys[0]}'>${options[i][keys[0]]}</option>`;
+            } else {
+                html += `<option value='${options[i]}'>${options[i]}</option>`;
+            }
         }
     } else {
         var keys = Object.keys(options);