Socket
Socket
Sign inDemoInstall

react-datalist-input

Package Overview
Dependencies
Maintainers
1
Versions
100
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-datalist-input - npm Package Compare versions

Comparing version 1.2.5 to 1.2.6

2

lib/DataListInput.js

@@ -1,2 +0,2 @@

module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=u(n(1)),a=u(n(4));function u(e){return e&&e.__esModule?e:{default:e}}n(7);var l=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var n=function(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}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));s.call(n);var r=n.props.initialValue;return n.state={lastValidItem:void 0,currentInput:r,matchingItems:[],visible:!1,focusIndex:0,interactionHappened:!1},window.addEventListener("click",n.onClickCloseMenu,!1),n}return function(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)}(t,i.default.Component),o(t,[{key:"render",value:function(){var e=this.state,t=e.currentInput,n=e.matchingItems,r=e.focusIndex,o=e.visible,a=this.props,u=a.placeholder,l=a.inputClassName,s=a.activeItemClassName,c=a.itemClassName,f=a.requiredInputLength,p=a.dropdownClassName,d=t.length>=f;return i.default.createElement("div",{className:"datalist-input"},this.renderInputField(u,t,l),d&&o&&this.renderItems(t,n,r,s,c,p))}}]),t}(),s=function(){var e=this;this.componentDidUpdate=function(){var t=e.state,n=t.currentInput,r=t.visible,o=e.props.initialValue;n||!o||r||e.setState({currentInput:o})},this.componentWillUnmount=function(){window.removeEventListener("click",e.onClickCloseMenu)},this.onClickCloseMenu=function(){e.state.visible&&e.setState({visible:!1,focusIndex:-1})},this.onClickInput=function(){var t=e.state,n=t.visible,o=t.lastValidItem,i=e.state.currentInput,a=e.props,u=a.requiredInputLength,l=a.dropDownLength,s=a.items,c=a.match,f=a.clearInputOnSelect,p=a.initialValue,d=i.length>=u;if(p&&i===p&&(e.setState({currentInput:""}),i=""),d&&!n){var m=s.filter(function(t){return(void 0===c?"undefined":r(c))===("undefined"==typeof Function?"undefined":r(Function))?c(i,t):e.match(i,t)}),h=!f&&o&&o.label===i,y=m.length&&!h?m.slice(0,l):s.slice(0,l),v=o&&!f?e.indexOfItem(o,y):0;v=v>0?v:0,e.setState({visible:!0,matchingItems:y,focusIndex:v})}},this.onHandleInput=function(t){var n=t.target.value,o=e.props,i=o.items,a=o.match,u=o.dropDownLength,l=i.filter(function(t){return(void 0===a?"undefined":r(a))===("undefined"==typeof Function?"undefined":r(Function))?a(n,t):e.match(n,t)}),s=l.slice(0,u);l.length>0?e.setState({currentInput:n,matchingItems:s,focusIndex:0,visible:!0}):e.setState({currentInput:n,matchingItems:s,visible:!1,focusIndex:-1})},this.match=function(e,t){return t.label.substr(0,e.length).toUpperCase()===e.toUpperCase()},this.indexOfMatch=function(e,t){return t.label.toUpperCase().indexOf(e.toUpperCase())},this.indexOfItem=function(e,t){return t.indexOf(t.find(function(t){return t.key===e.key}))},this.onHandleKeydown=function(t){var n=e.state,r=n.visible,o=n.focusIndex,i=n.matchingItems;if(r){var a=o;if(40===t.keyCode||9===t.keyCode)(a+=1)>=i.length&&(a=0),e.setState({focusIndex:a}),t.preventDefault();else if(38===t.keyCode)(a-=1)<=-1&&(a=i.length-1),e.setState({focusIndex:a});else if(13===t.keyCode&&o>-1){var u=i[a];e.onSelect(u)}}},this.onClickItem=function(t){for(var n=e.state.matchingItems,r=t.currentTarget.children,o=void 0,i=0;i<r.length;i+=1)if("INPUT"===r[i].tagName){o=r[i].value;break}var a=n.find(function(e){return e.key===o});e.onSelect(a)},this.onSelect=function(t){var n=e.props,r=n.suppressReselect,o=n.clearInputOnSelect,i=e.state.lastValidItem;r&&i&&t.key===i.key?e.setState({currentInput:o?"":t.label,visible:!1,focusIndex:-1,interactionHappened:!0}):(e.setState({currentInput:o?"":t.label,lastValidItem:t,visible:!1,focusIndex:-1,interactionHappened:!0}),(0,e.props.onSelect)(t))},this.renderMatchingLabel=function(e,t,n){return i.default.createElement(i.default.Fragment,null,t.label.substr(0,n),i.default.createElement("strong",null,t.label.substr(n,e.length)),t.label.substr(e.length,t.label.length))},this.renderItemLabel=function(t,n,r){return i.default.createElement(i.default.Fragment,null,r>=0&&t.length?e.renderMatchingLabel(t,n,r):n.label)},this.renderItems=function(t,n,r,o,a,u){return i.default.createElement("div",{className:"datalist-items "+(u||"default-datalist-items"),onClick:function(e){return e.stopPropagation()},role:"presentation"},n.map(function(n,u){var l=a+" "+(r===u?"datalist-active-item "+(o||"datalist-active-item-default"):"");return i.default.createElement("div",{onClick:e.onClickItem,className:l,key:n.key,tabIndex:0,role:"button",onKeyUp:function(e){return e.preventDefault()}},e.renderItemLabel(t,n,e.indexOfMatch(t,n)),i.default.createElement("input",{type:"hidden",value:n.key,readOnly:!0}))}))},this.renderInputField=function(t,n,r){return i.default.createElement("input",{onChange:e.onHandleInput,onClick:e.onClickInput,onKeyDown:e.onHandleKeydown,type:"text",className:"autocomplete-input "+r,placeholder:t,value:n})}};l.propTypes={items:a.default.arrayOf(a.default.shape({label:a.default.string.isRequired,key:a.default.oneOfType([a.default.string,a.default.number]).isRequired})).isRequired,placeholder:a.default.string,onSelect:a.default.func.isRequired,match:a.default.func,inputClassName:a.default.string,dropdownClassName:a.default.string,itemClassName:a.default.string,activeItemClassName:a.default.string,requiredInputLength:a.default.number,clearInputOnSelect:a.default.bool,suppressReselect:a.default.bool,dropDownLength:a.default.number,initialValue:a.default.string},l.defaultProps={placeholder:"",match:void 0,inputClassName:"",dropdownClassName:"",itemClassName:"",activeItemClassName:"",requiredInputLength:0,clearInputOnSelect:!1,suppressReselect:!0,dropDownLength:1/0,initialValue:""},t.default=l},function(e,t,n){"use strict";e.exports=n(2)},function(e,t,n){"use strict";
module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=u(n(1)),a=u(n(4));function u(e){return e&&e.__esModule?e:{default:e}}n(7);var l=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var n=function(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}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));s.call(n);var r=n.props.initialValue;return n.state={lastValidItem:void 0,currentInput:r,matchingItems:[],visible:!1,focusIndex:0,interactionHappened:!1},window.addEventListener("click",n.onClickCloseMenu,!1),n}return function(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)}(t,i.default.Component),o(t,[{key:"render",value:function(){var e=this.state,t=e.currentInput,n=e.matchingItems,r=e.focusIndex,o=e.visible,a=this.props,u=a.placeholder,l=a.inputClassName,s=a.activeItemClassName,c=a.itemClassName,f=a.requiredInputLength,p=a.dropdownClassName,d=t.length>=f;return i.default.createElement("div",{className:"datalist-input"},this.renderInputField(u,t,l),d&&o&&this.renderItems(t,n,r,s,c,p))}}]),t}(),s=function(){var e=this;this.componentDidUpdate=function(){var t=e.state,n=t.currentInput,r=t.visible,o=e.props.initialValue;n||!o||r||e.setState({currentInput:o})},this.componentWillUnmount=function(){window.removeEventListener("click",e.onClickCloseMenu)},this.onClickCloseMenu=function(){e.state.visible&&e.setState({visible:!1,focusIndex:-1})},this.onClickInput=function(t){t.stopPropagation();var n=e.state,o=n.visible,i=n.lastValidItem,a=e.state.currentInput,u=e.props,l=u.requiredInputLength,s=u.dropDownLength,c=u.items,f=u.match,p=u.clearInputOnSelect,d=u.initialValue,m=a.length>=l;if(d&&a===d&&(e.setState({currentInput:""}),a=""),m&&!o){var h=c.filter(function(t){return(void 0===f?"undefined":r(f))===("undefined"==typeof Function?"undefined":r(Function))?f(a,t):e.match(a,t)}),y=!p&&i&&i.label===a,v=h.length&&!y?h.slice(0,s):c.slice(0,s),b=i&&!p?e.indexOfItem(i,v):0;b=b>0?b:0,e.setState({visible:!0,matchingItems:v,focusIndex:b})}},this.onHandleInput=function(t){var n=t.target.value,o=e.props,i=o.items,a=o.match,u=o.dropDownLength,l=i.filter(function(t){return(void 0===a?"undefined":r(a))===("undefined"==typeof Function?"undefined":r(Function))?a(n,t):e.match(n,t)}),s=l.slice(0,u);l.length>0?e.setState({currentInput:n,matchingItems:s,focusIndex:0,visible:!0}):e.setState({currentInput:n,matchingItems:s,visible:!1,focusIndex:-1})},this.match=function(e,t){return t.label.substr(0,e.length).toUpperCase()===e.toUpperCase()},this.indexOfMatch=function(e,t){return t.label.toUpperCase().indexOf(e.toUpperCase())},this.indexOfItem=function(e,t){return t.indexOf(t.find(function(t){return t.key===e.key}))},this.onHandleKeydown=function(t){var n=e.state,r=n.visible,o=n.focusIndex,i=n.matchingItems;if(r){var a=o;if(40===t.keyCode||9===t.keyCode)(a+=1)>=i.length&&(a=0),e.setState({focusIndex:a}),t.preventDefault();else if(38===t.keyCode)(a-=1)<=-1&&(a=i.length-1),e.setState({focusIndex:a});else if(13===t.keyCode&&o>-1){var u=i[a];e.onSelect(u)}}},this.onClickItem=function(t){for(var n=e.state.matchingItems,r=t.currentTarget.children,o=void 0,i=0;i<r.length;i+=1)if("INPUT"===r[i].tagName){o=r[i].value;break}var a=n.find(function(e){return e.key===o});e.onSelect(a)},this.onSelect=function(t){var n=e.props,r=n.suppressReselect,o=n.clearInputOnSelect,i=e.state.lastValidItem;r&&i&&t.key===i.key?e.setState({currentInput:o?"":t.label,visible:!1,focusIndex:-1,interactionHappened:!0}):(e.setState({currentInput:o?"":t.label,lastValidItem:t,visible:!1,focusIndex:-1,interactionHappened:!0}),(0,e.props.onSelect)(t))},this.renderMatchingLabel=function(e,t,n){return i.default.createElement(i.default.Fragment,null,t.label.substr(0,n),i.default.createElement("strong",null,t.label.substr(n,e.length)),t.label.substr(e.length,t.label.length))},this.renderItemLabel=function(t,n,r){return i.default.createElement(i.default.Fragment,null,r>=0&&t.length?e.renderMatchingLabel(t,n,r):n.label)},this.renderItems=function(t,n,r,o,a,u){return i.default.createElement("div",{className:"datalist-items "+(u||"default-datalist-items"),onClick:function(e){return e.stopPropagation()},role:"presentation"},n.map(function(n,u){var l=a+" "+(r===u?"datalist-active-item "+(o||"datalist-active-item-default"):"");return i.default.createElement("div",{onClick:e.onClickItem,className:l,key:n.key,tabIndex:0,role:"button",onKeyUp:function(e){return e.preventDefault()}},e.renderItemLabel(t,n,e.indexOfMatch(t,n)),i.default.createElement("input",{type:"hidden",value:n.key,readOnly:!0}))}))},this.renderInputField=function(t,n,r){return i.default.createElement("input",{onChange:e.onHandleInput,onClick:e.onClickInput,onKeyDown:e.onHandleKeydown,type:"text",className:"autocomplete-input "+r,placeholder:t,value:n})}};l.propTypes={items:a.default.arrayOf(a.default.shape({label:a.default.string.isRequired,key:a.default.oneOfType([a.default.string,a.default.number]).isRequired})).isRequired,placeholder:a.default.string,onSelect:a.default.func.isRequired,match:a.default.func,inputClassName:a.default.string,dropdownClassName:a.default.string,itemClassName:a.default.string,activeItemClassName:a.default.string,requiredInputLength:a.default.number,clearInputOnSelect:a.default.bool,suppressReselect:a.default.bool,dropDownLength:a.default.number,initialValue:a.default.string},l.defaultProps={placeholder:"",match:void 0,inputClassName:"",dropdownClassName:"",itemClassName:"",activeItemClassName:"",requiredInputLength:0,clearInputOnSelect:!1,suppressReselect:!0,dropDownLength:1/0,initialValue:""},t.default=l},function(e,t,n){"use strict";e.exports=n(2)},function(e,t,n){"use strict";
/** @license React v16.8.6

@@ -3,0 +3,0 @@ * react.production.min.js

{
"name": "react-datalist-input",
"version": "1.2.5",
"version": "1.2.6",
"description": "This package provides a react component as follows: an input field with a drop down menu to pick a possible option based on the current input.",

@@ -5,0 +5,0 @@ "main": "./lib/DataListInput.js",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc