cpr-select - npm Package Compare versions

Comparing version 2.2.3 to 2.2.4

build/cpr-select.js

@@ -8,2 +8,2 @@ /*!
  */
-!function(e){function t(i){if(s[i])return s[i].exports;var o=s[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var s={};return t.m=e,t.c=s,t.p="",t(0)}([function(e,t,s){"use strict";function i(e,t){for(var s,i=!0;i;){i=!1;var o=e,n=t;if(!o)return!1;if(s=o===n)return s;e=o.parentElement,t=n,i=!0}}var o=function(e){return e&&e.__esModule?e["default"]:e},n=o(s(1)),l=s(2).findIndex,a="",r=void 0,c=n.createClass({displayName:"CanopySelect",componentWillMount:function(){document.body.addEventListener("click",this.state.close)},componentWillUnmount:function(){document.body.removeEventListener("click",this.state.close)},getInitialState:function(){var e=this;return{dialogDisplayed:!1,top:0,focused:!1,close:function(t){i(t.target,e.el)||e.setState({dialogDisplayed:!1,focused:!1})}}},displayDialog:function(e){this.props.disabled||this.setState({dialogDisplayed:!0})},getIndex:function(e){return l(this.props.options,{key:e})},onKeyDown:function(e){if(!this.props.disabled){var t=e.which,s=this.state.selectedIndex;9!==t&&e.preventDefault(),13===t?this.selectItem(s):38===t?0>=s?this.setState({dialogDisplayed:!0}):this.setState({dialogDisplayed:!0,selectedIndex:void 0===s?0:s-1}):40===t?s===this.props.options.length-1?this.setState({dialogDisplayed:!0}):this.setState({dialogDisplayed:!0,selectedIndex:s?s+1:0}):27===t?this.setState({dialogDisplayed:!1}):this.highlightByText(e.which)}},triggerItemChange:function(){this.props.onChange&&this.props.onChange.call(null,this.props.options[this.state.selectedIndex].key,this.props.options[this.state.selectedIndex],this.state.selectedIndex)},selectItem:function(e,t){var s=this;this.props.disabled||setTimeout(function(){s.setState({selectedIndex:e,focused:!0,dialogDisplayed:!1}),setTimeout(s.triggerItemChange)})},positionDialogAndGetTop:function(e,t,s){var i=e.length-t,o=Math.floor(s/36),n=Math.floor((o-1)/2);if(t>n&&n+1>i){if(e.length<o)return-2+(36*t*-1-10)+"px";this.positionDialog(t,s);var l=s/-2-15;return l-36*(n-i)+"px"}return t>n?(this.positionDialog(t,s),s/-2-.0075*s):-1+(36*t*-1-10)+"px"},positionDialog:function(e,t){var s=this;setTimeout(function(){var i=s.el.querySelector(".cp-select__menu");if(i){var o=t/2-8;i.scrollTop=36*e-o}})},focusSelect:function(){this.state.focused||this.setState({focused:!0})},onBlur:function(){this.setState({focused:!1})},highlightByText:function(e){a+=String.fromCharCode(e);var t=this.getIndexFromString(a);t>-1&&this.selectItem(t),clearTimeout(r),r=setTimeout(function(){a=""},1e3)},getIndexFromString:function(e){var t=this;return e=e.toLowerCase(),l(this.props.options,function(s){return null!==t.getViewValue(s)?0===t.getViewValue(s).toLowerCase().indexOf(e):!1})},getViewValue:function(e){return null===e.value||void 0===e.value?null:e.value||e},getDialog:function(e,t){var s=this;if(e){var i=function(){var e=s.state.selectedIndex,i=t.map(function(t,i){return t.separator?n.createElement("li",{key:"separator"+i,className:"separator"}):n.createElement("li",{key:t.key,className:e===i?"+selected":"",onMouseDown:s.selectItem.bind(s,i)},n.createElement("a",{style:null!==t.value?{}:{color:"rgba(0,0,0,0)"}},null!==t.value?t.value:"null"))});setTimeout(function(){try{s.el.querySelector(".cp-select__hidden-input").focus()}catch(e){if(-1===e.message.indexOf("Invariant Violation"))throw new Error(e.message)}},100);var o=s.props.maxHeight||400;return{v:n.createElement("div",null,n.createElement("ul",{className:"cp-select__menu cps-dropdown-menu",style:{top:s.positionDialogAndGetTop(t,e,o),maxHeight:o+"px"}},i))}}();if("object"==typeof i)return i.v}},render:function(){var e="cp-select",t=this.props.options[this.getIndex(this.props.selected)],s=this;return this.props.disabled&&(e+=" +disabled"),this.state.focused&&!this.props.disabled&&(e+=" +focus"),n.createElement("div",{ref:function(e){e&&(s.el=e)},className:"cp-select-outer",role:"select"},n.createElement("input",{className:"cp-select__hidden-input",onFocus:this.focusSelect,onBlur:this.onBlur,onKeyDown:this.onKeyDown}),n.createElement("div",{className:e,onClick:this.displayDialog},t?n.createElement("div",{className:"cp-select__selected"},t.value):n.createElement("div",{className:"cp-select__selected",style:{color:"#afafaf"}},this.props.placeholder),n.createElement("div",{className:"cp-select__icon"})),this.getDialog(this.state.dialogDisplayed,this.props.options))}});"undefined"!=typeof window&&window&&!window.CanopySelect&&(window.CanopySelect=c),e.exports=c},function(e,t,s){e.exports=React},function(e,t,s){e.exports=_}]);
+!function(e){function t(i){if(s[i])return s[i].exports;var o=s[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var s={};return t.m=e,t.c=s,t.p="",t(0)}([function(e,t,s){"use strict";function i(e,t){for(var s,i=!0;i;){i=!1;var o=e,n=t;if(!o)return!1;if(s=o===n)return s;e=o.parentElement,t=n,i=!0}}var o=function(e){return e&&e.__esModule?e["default"]:e},n=o(s(1)),l=s(2).findIndex,a="",r=void 0,c=n.createClass({displayName:"CanopySelect",componentWillMount:function(){document.body.addEventListener("click",this.state.close)},componentWillUnmount:function(){document.body.removeEventListener("click",this.state.close)},getInitialState:function(){var e=this;return{dialogDisplayed:!1,top:0,focused:!1,close:function(t){i(t.target,e.el)||e.setState({dialogDisplayed:!1,focused:!1})}}},displayDialog:function(e){this.props.disabled||this.setState({dialogDisplayed:!0})},getIndex:function(e){return l(this.props.options,{key:e})},onKeyDown:function(e){if(!this.props.disabled){var t=e.which,s=this.state.selectedIndex;9!==t&&e.preventDefault(),13===t?this.selectItem(s):38===t?0>=s?this.setState({dialogDisplayed:!0}):this.setState({dialogDisplayed:!0,selectedIndex:void 0===s?0:s-1}):40===t?s===this.props.options.length-1?this.setState({dialogDisplayed:!0}):this.setState({dialogDisplayed:!0,selectedIndex:s?s+1:0}):27===t?this.setState({dialogDisplayed:!1}):this.highlightByText(e.which)}},triggerItemChange:function(){this.props.onChange&&this.props.onChange.call(null,this.props.options[this.state.selectedIndex].key,this.props.options[this.state.selectedIndex],this.state.selectedIndex)},selectItem:function(e,t){var s=this;this.props.disabled||setTimeout(function(){s.setState({selectedIndex:e,focused:!0,dialogDisplayed:!1}),setTimeout(s.triggerItemChange)})},positionDialogAndGetTop:function(e,t,s){var i=e.length-t,o=Math.floor(s/36),n=Math.floor((o-1)/2);if(t>n&&n+1>i){if(e.length<o)return-2+(36*t*-1-10)+"px";this.positionDialog(t,s);var l=s/-2-15;return l-36*(n-i)+"px"}return t>n?(this.positionDialog(t,s),s/-2-.0075*s):-1+(36*t*-1-10)+"px"},positionDialog:function(e,t){var s=this;setTimeout(function(){var i=s.el.querySelector(".cp-select__menu");if(i){var o=t/2-8;i.scrollTop=36*e-o}})},focusSelect:function(){this.state.focused||this.setState({focused:!0})},onBlur:function(){this.setState({focused:!1})},highlightByText:function(e){a+=String.fromCharCode(e);var t=this.getIndexFromString(a);t>-1&&this.selectItem(t),clearTimeout(r),r=setTimeout(function(){a=""},1e3)},getIndexFromString:function(e){var t=this;return e=e.toLowerCase(),l(this.props.options,function(s){return null!==t.getViewValue(s)?0===t.getViewValue(s).toLowerCase().indexOf(e):!1})},getViewValue:function(e){return null===e.value||void 0===e.value?null:e.value||e},getDialog:function(e,t){var s=this;if(e){var i=function(){var e=s.state.selectedIndex,i=t.map(function(t,i){return t.separator?n.createElement("li",{key:"separator"+i,className:"separator"}):n.createElement("li",{key:t.key,className:e===i?"+selected":"",onMouseDown:s.selectItem.bind(s,i)},n.createElement("a",{style:null!==t.value?{}:{color:"rgba(0,0,0,0)"}},null!==t.value?t.value:"null"))});setTimeout(function(){try{s.el.querySelector(".cp-select__hidden-input").focus()}catch(e){if(-1===e.message.indexOf("Invariant Violation"))throw new Error(e.message)}},100);var o=s.props.maxHeight||400;return{v:n.createElement("div",null,n.createElement("ul",{className:"cp-select__menu cps-dropdown-menu",style:{top:s.positionDialogAndGetTop(t,e,o),maxHeight:o+"px"}},i))}}();if("object"==typeof i)return i.v}},render:function(){var e="cp-select",t=this.props.options[this.getIndex(this.props.selected)],s=this;return this.props.disabled&&(e+=" +disabled"),this.state.focused&&!this.props.disabled&&(e+=" +focus"),n.createElement("div",{ref:function(e){e&&(s.el=e)},className:"cp-select-outer "+this.props.outerClass,role:"select"},n.createElement("input",{className:"cp-select__hidden-input",onFocus:this.focusSelect,onBlur:this.onBlur,onKeyDown:this.onKeyDown}),n.createElement("div",{className:""+e+" "+this.props.selectClass,onClick:this.displayDialog},t?n.createElement("div",{className:"cp-select__selected"},t.value):n.createElement("div",{className:"cp-select__selected",style:{color:"#afafaf"}},this.props.placeholder),n.createElement("div",{className:"cp-select__icon"})),this.getDialog(this.state.dialogDisplayed,this.props.options))}});"undefined"!=typeof window&&window&&!window.CanopySelect&&(window.CanopySelect=c),e.exports=c},function(e,t,s){e.exports=React},function(e,t,s){e.exports=_}]);

lib/select.js

@@ -305,7 +305,7 @@ 'use strict';
 					if (el) that.el = el;
-				}, className: 'cp-select-outer', role: 'select' },
+				}, className: 'cp-select-outer ' + this.props.outerClass, role: 'select' },
 			_react2['default'].createElement('input', { className: 'cp-select__hidden-input', onFocus: this.focusSelect, onBlur: this.onBlur, onKeyDown: this.onKeyDown }),
 			_react2['default'].createElement(
 				'div',
-				{ className: cpSelectClasses, onClick: this.displayDialog },
+				{ className: cpSelectClasses + ' ' + this.props.selectClass, onClick: this.displayDialog },
 				selectedItem ? _react2['default'].createElement(
@@ -312,0 +312,0 @@ 'div',

package.json

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

src/select.js

@@ -249,5 +249,5 @@ import React from 'react';
 		return (
-			<div ref={function(el) { if (el) that.el = el; }} className='cp-select-outer' role='select'>
+			<div ref={function(el) { if (el) that.el = el; }} className={`cp-select-outer ${this.props.outerClass}`} role='select'>
 				<input className="cp-select__hidden-input" onFocus={this.focusSelect} onBlur={this.onBlur} onKeyDown={this.onKeyDown}/>
-				<div className={cpSelectClasses} onClick={this.displayDialog}>
+				<div className={`${cpSelectClasses} ${this.props.selectClass}`} onClick={this.displayDialog}>
 					{selectedItem
@@ -254,0 +254,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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

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

36244

increased by0.46%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes