From ae1527525281f2f45bea5386672b3626fd4b001f Mon Sep 17 00:00:00 2001
From: Bryan Housel <bryan@mapbox.com>
Date: Fri, 15 Apr 2016 10:39:12 -0400
Subject: [PATCH] Add caseSensitive option to d3.combobox

---
 js/lib/d3.combobox.js        | 23 +++++++++++++++--------
 test/spec/lib/d3.combobox.js | 16 +++++++++++++---
 2 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/js/lib/d3.combobox.js b/js/lib/d3.combobox.js
index 083b1a970..fbe4ca025 100644
--- a/js/lib/d3.combobox.js
+++ b/js/lib/d3.combobox.js
@@ -2,7 +2,8 @@ d3.combobox = function() {
     var event = d3.dispatch('accept'),
         data = [],
         suggestions = [],
-        minItems = 2;
+        minItems = 2,
+        caseSensitive = false;
 
     var fetcher = function(val, cb) {
         cb(data.filter(function(d) {
@@ -179,18 +180,18 @@ d3.combobox = function() {
         }
 
         function autocomplete() {
-            var v = value();
-
+            var v = caseSensitive ? value() : value().toLowerCase();
             idx = -1;
-
             if (!v) return;
 
             for (var i = 0; i < suggestions.length; i++) {
-                if (suggestions[i].value.toLowerCase().indexOf(v.toLowerCase()) === 0) {
-                    var completion = suggestions[i].value;
+                var suggestion = suggestions[i].value,
+                    compare = caseSensitive ? suggestion : suggestion.toLowerCase();
+
+                if (compare.indexOf(v) === 0) {
                     idx = i;
-                    input.property('value', completion);
-                    input.node().setSelectionRange(v.length, completion.length);
+                    input.property('value', suggestion);
+                    input.node().setSelectionRange(v.length, suggestion.length);
                     return;
                 }
             }
@@ -269,6 +270,12 @@ d3.combobox = function() {
         return combobox;
     };
 
+    combobox.caseSensitive = function(_) {
+        if (!arguments.length) return caseSensitive;
+        caseSensitive = _;
+        return combobox;
+    };
+
     return d3.rebind(combobox, event, 'on');
 };
 
diff --git a/test/spec/lib/d3.combobox.js b/test/spec/lib/d3.combobox.js
index 9304f735e..dbf139954 100644
--- a/test/spec/lib/d3.combobox.js
+++ b/test/spec/lib/d3.combobox.js
@@ -4,7 +4,7 @@ describe("d3.combobox", function() {
     var data = [
         {title: 'foo', value: 'foo'},
         {title: 'bar', value: 'bar'},
-        {title: 'baz', value: 'baz'}
+        {title: 'Baz', value: 'Baz'}
     ];
 
     function simulateKeypress(key) {
@@ -86,7 +86,7 @@ describe("d3.combobox", function() {
         input.node().focus();
         expect(body.selectAll('.combobox-option').size()).to.equal(2);
         expect(body.selectAll('.combobox-option')[0][0].text).to.equal('bar');
-        expect(body.selectAll('.combobox-option')[0][1].text).to.equal('baz');
+        expect(body.selectAll('.combobox-option')[0][1].text).to.equal('Baz');
     });
 
     it("shows no menu on focus if it would contain only one item", function() {
@@ -132,7 +132,7 @@ describe("d3.combobox", function() {
         expect(input.property('selectionEnd')).to.equal(3);
     });
 
-    it("does not preserve the case of the input portion of the value", function() {
+    it("does not preserve the case of the input portion of the value by default", function() {
         input.call(combobox.data(data));
         input.node().focus();
         simulateKeypress('B');
@@ -141,6 +141,16 @@ describe("d3.combobox", function() {
         expect(input.property('selectionEnd')).to.equal(3);
     });
 
+    it("does preserve the case of the input portion of the value with caseSensitive option", function() {
+        combobox.caseSensitive(true);
+        input.call(combobox.data(data));
+        input.node().focus();
+        simulateKeypress('B');
+        expect(input.property('value')).to.equal('Baz');
+        expect(input.property('selectionStart')).to.equal(1);
+        expect(input.property('selectionEnd')).to.equal(3);
+    });
+
     it("does not select when value is empty", function() {
         input.call(combobox.data(data));
         input.node().focus();