diff --git a/examples/src/components/Cities.js b/examples/src/components/Cities.js index 5d075835..c77a6a82 100644 --- a/examples/src/components/Cities.js +++ b/examples/src/components/Cities.js @@ -1,5 +1,7 @@ import React from 'react'; import Select from 'react-select-plus'; +import createClass from 'create-react-class'; +import PropTypes from 'prop-types'; import { AutoSizer, VirtualScroll } from 'react-virtualized'; const DATA = require('../data/cities'); @@ -7,11 +9,11 @@ const DATA = require('../data/cities'); const OPTION_HEIGHT = 35; const MAX_OPTIONS_HEIGHT = 200; -var CitiesField = React.createClass({ +var CitiesField = createClass({ displayName: 'CitiesField', propTypes: { - label: React.PropTypes.string, - searchable: React.PropTypes.bool, + label: PropTypes.string, + searchable: PropTypes.bool, }, getDefaultProps () { return { diff --git a/examples/src/components/GroupedOptionsField.js b/examples/src/components/GroupedOptionsField.js index 4ff1ef9f..151b1d3b 100644 --- a/examples/src/components/GroupedOptionsField.js +++ b/examples/src/components/GroupedOptionsField.js @@ -1,4 +1,6 @@ import React from 'react'; +import createClass from 'create-react-class'; +import PropTypes from 'prop-types'; import Select from 'react-select-plus'; var ops = [{ @@ -42,12 +44,12 @@ var ops = [{ value: 'white', }]; -var GroupedOptionsField = React.createClass({ +var GroupedOptionsField = createClass({ displayName: 'GroupedOptionsField', propTypes: { - delimiter: React.PropTypes.string, - label: React.PropTypes.string, - multi: React.PropTypes.bool, + delimiter: PropTypes.string, + label: PropTypes.string, + multi: PropTypes.bool, }, getInitialState () { diff --git a/package.json b/package.json index 5adcdb15..dad12f4e 100644 --- a/package.json +++ b/package.json @@ -30,17 +30,17 @@ "mocha": "^3.0.2", "react": "^15.0", "react-addons-shallow-compare": "^15.0", - "react-addons-test-utils": "^15.0", "react-component-gulp-tasks": "^0.7.7", "react-dom": "^15.0", "react-gravatar": "^2.4.5", "react-highlight-words": "^0.3.0", + "react-test-renderer": "^15.5.4", "react-virtualized": "^7.23.0", "react-virtualized-select": "^1.4.0", "sinon": "^1.17.5", "unexpected": "^10.17.0", "unexpected-dom": "^3.1.0", - "unexpected-react": "^3.2.4", + "unexpected-react": "^4.0.1", "unexpected-sinon": "^10.4.0" }, "peerDependencies": { diff --git a/src/Dropdown.js b/src/Dropdown.js index 89bba3cf..509939aa 100644 --- a/src/Dropdown.js +++ b/src/Dropdown.js @@ -1,8 +1,10 @@ import React from 'react'; +import createClass from 'create-react-class'; +import PropTypes from 'prop-types'; -const Dropdown = React.createClass({ +const Dropdown = createClass({ propTypes: { - children: React.PropTypes.node, + children: PropTypes.node, }, render () { // This component adds no markup diff --git a/src/OptionGroup.js b/src/OptionGroup.js index baa9f534..3e8a591b 100644 --- a/src/OptionGroup.js +++ b/src/OptionGroup.js @@ -1,12 +1,14 @@ import React from 'react'; +import createClass from 'create-react-class'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; -const OptionGroup = React.createClass({ +const OptionGroup = createClass({ propTypes: { - children: React.PropTypes.any, - className: React.PropTypes.string, // className (based on mouse position) - label: React.PropTypes.node, // the heading to show above the child options - option: React.PropTypes.object.isRequired, // object that is base for that option group + children: PropTypes.any, + className: PropTypes.string, // className (based on mouse position) + label: PropTypes.node, // the heading to show above the child options + option: PropTypes.object.isRequired, // object that is base for that option group }, blockEvent (event) { diff --git a/src/Select.js b/src/Select.js index 841cce4e..a844483a 100644 --- a/src/Select.js +++ b/src/Select.js @@ -79,66 +79,66 @@ const Select = createClass({ clearAllText: stringOrNode, // title for the "clear" control when multi: true clearRenderer: PropTypes.func, // create clearable x element clearValueText: stringOrNode, // title for the "clear" control - clearable: React.PropTypes.bool, // should it be possible to reset value - deleteRemoves: React.PropTypes.bool, // whether backspace removes an item if there is no text input - delimiter: React.PropTypes.string, // delimiter to use to join multiple values for the hidden field value - disabled: React.PropTypes.bool, // whether the Select is disabled or not - dropdownComponent: React.PropTypes.func, // dropdown component to render the menu in - escapeClearsValue: React.PropTypes.bool, // whether escape clears the value when the menu is closed - filterOption: React.PropTypes.func, // method to filter a single option (option, filterString) - filterOptions: React.PropTypes.any, // boolean to enable default filtering or function to filter the options array ([options], filterString, [values]) - ignoreAccents: React.PropTypes.bool, // whether to strip diacritics when filtering - ignoreCase: React.PropTypes.bool, // whether to perform case-insensitive filtering - inputProps: React.PropTypes.object, // custom attributes for the Input - inputRenderer: React.PropTypes.func, // returns a custom input component - instanceId: React.PropTypes.string, // set the components instanceId - isLoading: React.PropTypes.bool, // whether the Select is loading externally or not (such as options being loaded) - isOpen: React.PropTypes.bool, // whether the Select dropdown menu is open or not - joinValues: React.PropTypes.bool, // joins multiple values into a single form field with the delimiter (legacy mode) - labelKey: React.PropTypes.string, // path of the label value in option objects - matchPos: React.PropTypes.string, // (any|start) match the start or entire string when filtering - matchProp: React.PropTypes.string, // (any|label|value) which option property to filter on - menuBuffer: React.PropTypes.number, // optional buffer (in px) between the bottom of the viewport and the bottom of the menu - menuContainerStyle: React.PropTypes.object, // optional style to apply to the menu container - menuRenderer: React.PropTypes.func, // renders a custom menu with options - menuStyle: React.PropTypes.object, // optional style to apply to the menu - multi: React.PropTypes.bool, // multi-value input - name: React.PropTypes.string, // generates a hidden tag with this field name for html forms + clearable: PropTypes.bool, // should it be possible to reset value + deleteRemoves: PropTypes.bool, // whether backspace removes an item if there is no text input + delimiter: PropTypes.string, // delimiter to use to join multiple values for the hidden field value + disabled: PropTypes.bool, // whether the Select is disabled or not + dropdownComponent: PropTypes.func, // dropdown component to render the menu in + escapeClearsValue: PropTypes.bool, // whether escape clears the value when the menu is closed + filterOption: PropTypes.func, // method to filter a single option (option, filterString) + filterOptions: PropTypes.any, // boolean to enable default filtering or function to filter the options array ([options], filterString, [values]) + ignoreAccents: PropTypes.bool, // whether to strip diacritics when filtering + ignoreCase: PropTypes.bool, // whether to perform case-insensitive filtering + inputProps: PropTypes.object, // custom attributes for the Input + inputRenderer: PropTypes.func, // returns a custom input component + instanceId: PropTypes.string, // set the components instanceId + isLoading: PropTypes.bool, // whether the Select is loading externally or not (such as options being loaded) + isOpen: PropTypes.bool, // whether the Select dropdown menu is open or not + joinValues: PropTypes.bool, // joins multiple values into a single form field with the delimiter (legacy mode) + labelKey: PropTypes.string, // path of the label value in option objects + matchPos: PropTypes.string, // (any|start) match the start or entire string when filtering + matchProp: PropTypes.string, // (any|label|value) which option property to filter on + menuBuffer: PropTypes.number, // optional buffer (in px) between the bottom of the viewport and the bottom of the menu + menuContainerStyle: PropTypes.object, // optional style to apply to the menu container + menuRenderer: PropTypes.func, // renders a custom menu with options + menuStyle: PropTypes.object, // optional style to apply to the menu + multi: PropTypes.bool, // multi-value input + name: PropTypes.string, // generates a hidden tag with this field name for html forms noResultsText: stringOrNode, // placeholder displayed when there are no matching search results - onBlur: React.PropTypes.func, // onBlur handler: function (event) {} - onBlurResetsInput: React.PropTypes.bool, // whether input is cleared on blur - onChange: React.PropTypes.func, // onChange handler: function (newValue) {} - onClose: React.PropTypes.func, // fires when the menu is closed - onCloseResetsInput: React.PropTypes.bool, // whether input is cleared when menu is closed through the arrow - onFocus: React.PropTypes.func, // onFocus handler: function (event) {} - onInputChange: React.PropTypes.func, // onInputChange handler: function (inputValue) {} - onInputKeyDown: React.PropTypes.func, // input keyDown handler: function (event) {} - onMenuScrollToBottom: React.PropTypes.func, // fires when the menu is scrolled to the bottom; can be used to paginate options - onOpen: React.PropTypes.func, // fires when the menu is opened - onValueClick: React.PropTypes.func, // onClick handler for value labels: function (value, event) {} - openAfterFocus: React.PropTypes.bool, // boolean to enable opening dropdown when focused - openOnFocus: React.PropTypes.bool, // always open options menu on focus - optionClassName: React.PropTypes.string, // additional class(es) to apply to the