cpr-select - npm Package Compare versions

Comparing version 2.4.0 to 2.4.1

build/cpr-select.js

@@ -6,4 +6,4 @@ /*!
  * license: MIT
- * version: 2.4.0
+ * version: 2.4.1
  */
-!function(e){function t(o){if(n[o])return n[o].exports;var l=n[o]={i:o,l:!1,exports:{}};return e[o].call(l.exports,l,l.exports,t),l.l=!0,l.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){"use strict";function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function l(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function i(e,t){return!!e&&(e===t||i(e.parentElement,t))}Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),s=n(1),c=function(e){return e&&e.__esModule?e:{default:e}}(s),u=n(2),d="",p=void 0,f=function(e){function t(){var e,n,a,r;o(this,t);for(var s=arguments.length,f=Array(s),g=0;g<s;g++)f[g]=arguments[g];return n=a=l(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(f))),a.state={dialogDisplayed:!1,top:0,focused:!1,close:function(e){i(e.target,a.el)||a.setState({dialogDisplayed:!1,focused:!1})}},a.displayDialog=function(e){a.disabled()||a.setState({dialogDisplayed:!0})},a.getIndex=function(e){return(0,u.findIndex)(a.props.options,{key:e})},a.onKeyDown=function(e){if(!a.disabled()){var t=e.which,n=a.state.selectedIndex;9!==t&&e.preventDefault(),13===t?a.selectItem(n):38===t?n<=0?a.setState({dialogDisplayed:!0}):a.setState({dialogDisplayed:!0,selectedIndex:n-1}):40===t?n===a.props.options.length-1?a.setState({dialogDisplayed:!0}):a.setState({dialogDisplayed:!0,selectedIndex:n+1}):27===t?a.setState({dialogDisplayed:!1}):a.highlightByText(e.which)}},a.triggerItemChange=function(){a.props.onChange&&a.props.onChange.call(null,a.props.options[a.state.selectedIndex].key,a.props.options[a.state.selectedIndex],a.state.selectedIndex)},a.selectItem=function(e,t){a.disabled()||setTimeout(function(){a.setState({selectedIndex:e,focused:!0,dialogDisplayed:!1}),setTimeout(a.triggerItemChange)})},a.positionDialogAndGetTop=function(e,t,n){var o=e.length-t,l=Math.floor(n/36),i=Math.floor((l-1)/2);if(t>i&&o<i+1){if(e.length<l)return 36*t*-1-10-2+"px";a.positionDialog(t,n);return n/-2-15-36*(i-o)+"px"}return t>i?(a.positionDialog(t,n),n/-2-.0075*n):36*t*-1-10-1+"px"},a.positionDialog=function(e,t){setTimeout(function(){var n=a.el.querySelector(".cp-select__menu");if(n){var o=t/2-8;n.scrollTop=36*e-o}})},a.focusSelect=function(){a.state.focused||a.setState({focused:!0})},a.onBlur=function(){a.setState({focused:!1})},a.highlightByText=function(e){d+=String.fromCharCode(e);var t=a.getIndexFromString(d);t>-1&&a.selectItem(t),clearTimeout(p),p=setTimeout(function(){d=""},1e3)},a.getIndexFromString=function(e){return e=e.toLowerCase(),(0,u.findIndex)(a.props.options,function(t){return null!==a.getViewValue(t)&&0===a.getViewValue(t).toLowerCase().indexOf(e)})},a.getViewValue=function(e){return null===e.value||void 0===e.value?null:e.value||e},a.getDialog=function(e,t){if(e){var n=a.state.selectedIndex,o=t.map(function(e,t){return e.separator?c.default.createElement("li",{key:"separator"+t,className:"separator"}):c.default.createElement("li",{key:e.key,className:n===t?"+selected":"",onMouseDown:a.selectItem.bind(a,t)},c.default.createElement("a",{style:null!==e.value?{}:{color:"rgba(0,0,0,0)"}},null!==e.value?e.value:"null"))});setTimeout(function(){try{a.el.querySelector(".cp-select__hidden-input").focus()}catch(e){if(-1===e.message.indexOf("Invariant Violation"))throw new Error(e.message)}},100);var l=a.props.maxHeight||400;return c.default.createElement("div",null,c.default.createElement("ul",{className:"cp-select__menu cps-dropdown-menu",style:{top:a.positionDialogAndGetTop(t,n,l),maxHeight:l+"px"}},o))}},a.disabled=function(){return!a.props.options||0===a.props.options.length||a.props.disabled},a.render=function(){var e=a.props,t=e.options,n=void 0===t?[]:t,o=e.selected,l=e.outerClass,i=e.selectClass,r=e.placeholder,s="cp-select",u=n[a.getIndex(o)],d=a;return a.disabled()&&(s+=" +disabled"),a.state.focused&&(s+=" +focus"),c.default.createElement("div",{ref:function(e){e&&(d.el=e)},className:"cp-select-outer "+(l||""),role:"select"},c.default.createElement("input",{className:"cp-select__hidden-input",onFocus:a.focusSelect,onBlur:a.onBlur,onKeyDown:a.onKeyDown}),c.default.createElement("div",{className:s+" "+i,onClick:a.displayDialog},u?c.default.createElement("div",{className:"cp-select__selected"},u.value):c.default.createElement("div",{className:"cp-select__selected",style:{color:"#afafaf"}},r),n.length>0&&c.default.createElement("div",{className:"cp-select__icon"})),a.getDialog(a.state.dialogDisplayed,n))},r=n,l(a,r)}return a(t,e),r(t,[{key:"componentWillMount",value:function(){document.body.addEventListener("click",this.state.close)}},{key:"componentWillUnmount",value:function(){document.body.removeEventListener("click",this.state.close)}},{key:"componentDidMount",value:function(){var e=this.getIndex(this.props.selected);this.setState(function(){return{selectedIndex:-1===e?0:e}})}}]),t}(c.default.Component);t.default=f,"undefined"!=typeof window&&window&&!window.CanopySelect&&(window.CanopySelect=f)},function(e,t){e.exports=React},function(e,t){e.exports=_}]);
+!function(e){function t(o){if(n[o])return n[o].exports;var l=n[o]={i:o,l:!1,exports:{}};return e[o].call(l.exports,l,l.exports,t),l.l=!0,l.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){"use strict";function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function l(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function i(e,t){return!!e&&(e===t||i(e.parentElement,t))}Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),s=n(1),c=function(e){return e&&e.__esModule?e:{default:e}}(s),u=n(2),d="",p=void 0,f=function(e){function t(){var e,n,a,r;o(this,t);for(var s=arguments.length,f=Array(s),g=0;g<s;g++)f[g]=arguments[g];return n=a=l(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(f))),a.state={dialogDisplayed:!1,top:0,focused:!1,close:function(e){i(e.target,a.el)||a.setState({dialogDisplayed:!1,focused:!1})}},a.displayDialog=function(e){a.disabled()||a.setState({dialogDisplayed:!0})},a.getIndex=function(e){return(0,u.findIndex)(a.props.options,{key:e})},a.onKeyDown=function(e){if(!a.disabled()){var t=e.which,n=a.state.selectedIndex;9!==t&&e.preventDefault(),13===t?a.selectItem(n):38===t?n<=0?a.setState({dialogDisplayed:!0}):a.setState({dialogDisplayed:!0,selectedIndex:n-1}):40===t?n===a.props.options.length-1?a.setState({dialogDisplayed:!0}):a.setState({dialogDisplayed:!0,selectedIndex:n+1}):27===t?a.setState({dialogDisplayed:!1}):a.highlightByText(e.which)}},a.triggerItemChange=function(){a.props.onChange&&a.props.onChange.call(null,a.props.options[a.state.selectedIndex].key,a.props.options[a.state.selectedIndex],a.state.selectedIndex)},a.selectItem=function(e,t){a.disabled()||setTimeout(function(){a.setState({selectedIndex:e,focused:!0,dialogDisplayed:!1}),setTimeout(a.triggerItemChange)})},a.positionDialogAndGetTop=function(e,t,n){var o=e.length-t,l=Math.floor(n/36),i=Math.floor((l-1)/2);if(t>i&&o<i+1){if(e.length<l)return 36*t*-1-10-2+"px";a.positionDialog(t,n);return n/-2-15-36*(i-o)+"px"}return t>i?(a.positionDialog(t,n),n/-2-.0075*n):36*t*-1-10-1+"px"},a.positionDialog=function(e,t){setTimeout(function(){var n=a.el.querySelector(".cp-select__menu");if(n){var o=t/2-8;n.scrollTop=36*e-o}})},a.focusSelect=function(){a.state.focused||a.setState({focused:!0})},a.onBlur=function(){a.setState({focused:!1})},a.highlightByText=function(e){d+=String.fromCharCode(e);var t=a.getIndexFromString(d);t>-1&&a.selectItem(t),clearTimeout(p),p=setTimeout(function(){d=""},1e3)},a.getIndexFromString=function(e){return e=e.toLowerCase(),(0,u.findIndex)(a.props.options,function(t){return null!==a.getViewValue(t)&&0===a.getViewValue(t).toLowerCase().indexOf(e)})},a.getViewValue=function(e){return null===e.value||void 0===e.value?null:e.value||e},a.getDialog=function(e,t){if(e){var n=a.state.selectedIndex,o=t.map(function(e,t){return e.separator?c.default.createElement("li",{key:"separator"+t,className:"separator"}):c.default.createElement("li",{key:e.key,className:n===t?"+selected":"",onMouseDown:a.selectItem.bind(a,t)},c.default.createElement("a",{style:null!==e.value?{}:{color:"rgba(0,0,0,0)"}},null!==e.value?e.value:"null"))});setTimeout(function(){try{a.el.querySelector(".cp-select__hidden-input").focus()}catch(e){if(-1===e.message.indexOf("Invariant Violation"))throw new Error(e.message)}},100);var l=a.props.maxHeight||400,i=a.props.zIndex||1e3;return c.default.createElement("div",null,c.default.createElement("ul",{className:"cp-select__menu cps-dropdown-menu",style:{top:a.positionDialogAndGetTop(t,n,l),maxHeight:l+"px",zIndex:i}},o))}},a.disabled=function(){return!a.props.options||0===a.props.options.length||a.props.disabled},a.render=function(){var e=a.props,t=e.options,n=void 0===t?[]:t,o=e.selected,l=e.outerClass,i=e.selectClass,r=e.placeholder,s="cp-select",u=n[a.getIndex(o)],d=a;return a.disabled()&&(s+=" +disabled"),a.state.focused&&(s+=" +focus"),c.default.createElement("div",{ref:function(e){e&&(d.el=e)},className:"cp-select-outer "+(l||""),role:"select"},c.default.createElement("input",{className:"cp-select__hidden-input",onFocus:a.focusSelect,onBlur:a.onBlur,onKeyDown:a.onKeyDown}),c.default.createElement("div",{className:s+" "+(i||""),onClick:a.displayDialog},u?c.default.createElement("div",{className:"cp-select__selected"},u.value):c.default.createElement("div",{className:"cp-select__selected",style:{color:"#afafaf"}},r),n.length>0&&c.default.createElement("div",{className:"cp-select__icon"})),a.getDialog(a.state.dialogDisplayed,n))},r=n,l(a,r)}return a(t,e),r(t,[{key:"componentWillMount",value:function(){document.body.addEventListener("click",this.state.close)}},{key:"componentWillUnmount",value:function(){document.body.removeEventListener("click",this.state.close)}},{key:"componentDidMount",value:function(){var e=this.getIndex(this.props.selected);this.setState(function(){return{selectedIndex:-1===e?0:e}})}}]),t}(c.default.Component);t.default=f,"undefined"!=typeof window&&window&&!window.CanopySelect&&(window.CanopySelect=f)},function(e,t){e.exports=React},function(e,t){e.exports=_}]);

lib/select.js

@@ -226,2 +226,3 @@ 'use strict';
 				var maxHeight = _this.props.maxHeight || 400;
+				var zIndex = _this.props.zIndex || 1000;
 				return _react2.default.createElement(
@@ -232,3 +233,3 @@ 'div',
 						'ul',
-						{ className: 'cp-select__menu cps-dropdown-menu', style: { top: _this.positionDialogAndGetTop(options, selectedIndex, maxHeight), maxHeight: maxHeight + 'px' } },
+						{ className: 'cp-select__menu cps-dropdown-menu', style: { top: _this.positionDialogAndGetTop(options, selectedIndex, maxHeight), maxHeight: maxHeight + 'px', zIndex: zIndex } },
 						optionElements
@@ -264,3 +265,3 @@ )
 					'div',
-					{ className: cpSelectClasses + ' ' + selectClass, onClick: _this.displayDialog },
+					{ className: cpSelectClasses + ' ' + (selectClass ? selectClass : ''), onClick: _this.displayDialog },
 					selectedItem ? _react2.default.createElement(
@@ -267,0 +268,0 @@ 'div',

package.json

 {
   "name": "cpr-select",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "description": "A consistently styled cross-browser and keyboard friendly select component",
@@ -5,0 +5,0 @@ "main": "lib/select.js",

README.md

@@ -25,2 +25,3 @@ cpr-select [![Build Status](https://travis-ci.org/CanopyTax/cpr-select.png?branch=master)](https://travis-ci.org/CanopyTax/cpr-select)
 + `outerClass`: (optional) custom class to be added to the outer containing element
++ `zIndex`: (optional) override the default z-index of 1000
 
@@ -27,0 +28,0 @@ ### Basic

src/select.js

@@ -226,6 +226,7 @@ import React from 'react';
 
-			const maxHeight = this.props.maxHeight || 400;
+      const maxHeight = this.props.maxHeight || 400;
+      const zIndex = this.props.zIndex || 1000
 			return (
 				<div>
-					<ul className="cp-select__menu cps-dropdown-menu" style={{top: this.positionDialogAndGetTop(options, selectedIndex, maxHeight), maxHeight: maxHeight + 'px'}}>
+					<ul className="cp-select__menu cps-dropdown-menu" style={{top: this.positionDialogAndGetTop(options, selectedIndex, maxHeight), maxHeight: maxHeight + 'px', zIndex}}>
 						{optionElements}
@@ -256,3 +257,3 @@ </ul>
 				<input className="cp-select__hidden-input" onFocus={this.focusSelect} onBlur={this.onBlur} onKeyDown={this.onKeyDown}/>
-				<div className={`${cpSelectClasses} ${selectClass}`} onClick={this.displayDialog}>
+				<div className={`${cpSelectClasses} ${selectClass ? selectClass : ''}`} onClick={this.displayDialog}>
 					{selectedItem
@@ -259,0 +260,0 @@ ? <div className="cp-select__selected">{selectedItem.value}</div>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39754

increased by0.65%

Lines of code

885

increased by0.23%

Number of lines in readme file

56

increased by1.82%

No dependency changes