romo 0.18.1 → 0.18.2

checksums.yaml

@@ -1,7 +1,7 @@
 --- 
 SHA512: 
-  data.tar.gz: 50cbf6926495cdfb0d4f37c8de78223765e090f8a8776ce411f6d82d98a7194bbd0ebd2f75a6c50632018e36f31590794844fa24b327056c4a94215f3a9dcd90
-  metadata.gz: 98362f39c7531bce3483f67ee32f6b5cbd5d2891ddff83af346a313b1f2b45a7fda4c097bd22d61fc2b8433f67891f11799f53d403a86130a691b982f0b0f212
+  metadata.gz: 4a6caa77e3b43296bcfeb846f8fd5a184a63fc9ac6143878130a167ea192954c3d07c4d9d536efc43dc82eb85c31b09014678c135d6190b0f449a8be61bbe071
+  data.tar.gz: 76bdce7f44df26dcb66ee60872dae0db2b23ee64a71b902646bfd8167784cfe68da68f18fd21d5dbb99579812911f2481f2f3583e6b640542fa1fd3e58f5555c
 SHA1: 
-  data.tar.gz: cad251f2088b1bee923e9f1309edc208ef893721
-  metadata.gz: 77d4306dc8c5de5e50c12e15c7089f0b78d5380a
+  metadata.gz: ceb86c06548e5fc0c278052eac50ab0bd64cd2a6
+  data.tar.gz: 266215eb1ab03d10d0ae33cf4b925e15141fe0ee

data/assets/css/romo/select.scss

@@ -39,9 +39,10 @@
   width: 100%;
 }
 .romo-select-caret {
+  display: inline-block;
   position: absolute;
-  right: 4px + 1px; /* 4 px for desired spacing + 1 px select styling optical illusion */
   vertical-align: middle;
+  cursor: pointer;
 }
 
 .romo-select-dropdown-option-filter-wrapper {

data/assets/js/romo/select.js

@@ -7,8 +7,9 @@ $.fn.romoSelect = function() {
 var RomoSelect = function(element) {
   this.elem = $(element);
 
-  this.defaultCaretClass   = undefined;
-  this.defaultCaretWidthPx = 0;
+  this.defaultCaretClass     = undefined;
+  this.defaultCaretPaddingPx = 5;
+  this.defaultCaretPosition  = 'right'
 
   this.doInit();
   this.doBindSelectDropdown();
@@ -154,25 +155,52 @@ RomoSelect.prototype._buildSelectDropdownElem = function() {
     Romo.parentChildElems.add(this.elem, [this.elemWrapper]);
   }, this), 1);
 
+  this.caretElem = $();
   var caretClass = this.elem.data('romo-select-caret') || this.defaultCaretClass;
   if (caretClass !== undefined && caretClass !== 'none') {
-    var caret = $('<i class="romo-select-caret '+caretClass+'"></i>');
-    caret.css({'line-height': romoSelectDropdownElem.css('line-height')});
-    caret.on('click', $.proxy(this.onCaretClick, this));
+    this.caretElem = $('<i class="romo-select-caret '+caretClass+'"></i>');
+    this.caretElem.css('line-height', parseInt(Romo.getComputedStyle(romoSelectDropdownElem[0], "line-height"), 10)+'px');
+    this.caretElem.on('click', $.proxy(this.onCaretClick, this));
+    romoSelectDropdownElem.append(this.caretElem);
 
-    var caretWidthPx = this.elem.data('romo-select-caret-width-px') || this.defaultCaretWidthPx;
-    // left-side spacing
+    var caretPaddingPx = this._getCaretPaddingPx();
+    var caretWidthPx   = this._getCaretWidthPx();
+    var caretPosition  = this._getCaretPosition();
+
+    // add a pixel to account for the default input border
+    this.caretElem.css(caretPosition, caretPaddingPx+1);
+
+    // left-side padding
     // + caret width
-    // - 1 px select styling optical illusion
-    // + right-side spacing
-    var caretPaddingPx = 4 + caretWidthPx - 1 + 4;
-    romoSelectDropdownElem.css({'padding-right': caretPaddingPx + 'px'});
-    romoSelectDropdownElem.append(caret);
+    // + right-side padding
+    var dropdownPaddingPx = caretPaddingPx + caretWidthPx + caretPaddingPx;
+    romoSelectDropdownElem.css('padding-'+caretPosition, dropdownPaddingPx+'px');
   }
 
   return romoSelectDropdownElem;
 }
 
+RomoSelect.prototype._getCaretPaddingPx = function() {
+  return (
+    this.elem.data('romo-select-caret-padding-px') ||
+    this.defaultCaretPaddingPx
+  );
+}
+
+RomoSelect.prototype._getCaretWidthPx = function() {
+  return (
+    this.elem.data('romo-select-caret-width-px') ||
+    parseInt(Romo.getComputedStyle(this.caretElem[0], "width"), 10)
+  );
+}
+
+RomoSelect.prototype._getCaretPosition = function() {
+  return (
+    this.elem.data('romo-select-caret-position') ||
+    this.defaultCaretPosition
+  );
+}
+
 Romo.onInitUI(function(e) {
   Romo.initUIElems(e, '[data-romo-select-auto="true"]').romoSelect();
 });

data/assets/js/romo/select_dropdown.js

@@ -379,7 +379,7 @@ RomoSelectDropdown.prototype._buildOptGroupListItem = function(optGroupElem) {
 }
 
 RomoSelectDropdown.prototype._buildOptionFilter = function() {
-  var filter = $('<input type="text" class="romo-select-dropdown-option-filter"></input>');
+  var filter = $('<input type="text" size="1" class="romo-select-dropdown-option-filter"></input>');
 
   if (this.elem.data('romo-select-dropdown-filter-placeholder') !== undefined) {
     filter.attr('placeholder', this.elem.data('romo-select-dropdown-filter-placeholder'));

data/lib/romo/version.rb

@@ -1,3 +1,3 @@
 module Romo
-  VERSION = "0.18.1"
+  VERSION = "0.18.2"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification 
 name: romo
 version: !ruby/object:Gem::Version 
-  version: 0.18.1
+  version: 0.18.2
 platform: ruby
 authors: 
 - Kelly Redding
@@ -10,7 +10,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2017-01-23 00:00:00 Z
+date: 2017-01-24 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: assert