Merge pull request #2289 from JedWatson/v2

React Select v2

.TODO.md

@@ -0,0 +1,98 @@
+# Changes planned from Beta -> RC:
+
+* [ ] Look into package size reduction, extract optional modules, e.g
+  * createFilter could be optional, saving 2.6k gz
+  * vendor simple Menu by default, allow opt-in to advanced usage
+* [ ] Bind getStyles for each component
+
+---
+
+# Order of focus:
+
+* [ ] Review how the `required` state of the `<input>` can be handled
+* [ ] Example of how to implement Separators
+* [ ] Handle Header and Footer elements in the Menu
+* [ ] Keyboard focusing of values in multi select
+
+---
+
+# Review:
+
+### Select Component Props
+
+* [ ] `backspaceToRemoveMessage` _investigate_
+* [x] `className` _investigate_ might need to move the className util into commonProps
+* [x] `openOnClick` / `openOnFocus` needs implementation
+* [ ] `required` _|||_ this has some complex behaviour in v1 which may or may not be needed
+* [x] `tabIndex` needs implementation
+
+#### Done
+
+* [x] `id`
+* [x] `inputId` falls back to `react-select-${props.instanceId}-input`
+* [x] `autoBlur` **REMOVED** can be handled with `onChange`
+* [x] `autosize` **REMOVED** can replace `<Input />` component
+* [x] `onClose` --> `onMenuClose`
+* [x] `onOpen` --> `onMenuOpen`
+* [x] `onBlurResetsInput` / `onCloseResetsInput` / `onSelectResetsInput` **REMOVED** now that `inputValue` can be controlled, these should be unnecessary
+* [x] `onMenuScrollToBottom` implemented
+* [x] `clearable` --> `isClearable`
+* [x] `rtl` --> `isRTL`
+* [x] `pageSize`
+* [x] `menuShouldScrollIntoView`
+* [x] `searchable` --> `isSearchable`
+* [x] `resetValue` **REMOVED** can be handled with `onInputChange`
+* [x] `clearAllText` / `clearValueText` **REMOVED** title no longer applied, can replace `<ClearIndicator />`
+
+### Async Component Props
+
+* [ ] `autoLoad` _investigate_ should be considered in conjunction with `searchPromptText`, may affect `defaultOptions` behaviour
+* [ ] `searchPromptText` _investigate_ how do we know to display it? (https://goo.gl/PLTwV5)
+
+---
+
+# Maybe:
+
+* [ ] Virtualisation
+* [ ] Prevent values from being popped, was `option.clearableValue === false`
+* [ ] Async w/ pagination
+* [ ] Extention point to reorder / change menu options array when it's created
+
+---
+
+# Later:
+
+* [ ] Reordering of Options (drag and drop)
+
+---
+
+# Done:
+
+* [x] Tags mode (Creatable)
+* [x] Handle changing of isDisabled prop
+* [x] Better mobile support and touch handling
+* [x] Better control of flip behaviour
+* [x] Scroll the menu into view when it opens
+* [x] Handle touch outside (see v1 implementation)
+* [x] Review implementation of `isSearchable` prop (creates a "fake" input)
+* [x] Async + Creatable variant
+* [x] Cleanup
+* [x] Documentation - Props, Customisation
+* [x] Upgrade Guide from v1 -> v2
+* [x] Lock scrolling on Menu (enable with prop)
+* [x] Make inputValue a controllable prop
+* [x] Make menuIsOpen a controllable prop
+* [x] Finalise theme and style customisation framework
+* [x] Remove `disabledKey`, clean up similar functionality
+* [x] Pseudo-focus Options
+* [x] Keyboard navigation
+* [x] Make `isDisabled` / `isSelected` etc. props
+* [x] Scroll to focused option
+* [x] Add `autofocus` prop
+* [x] Add HTML Form Input
+* [x] Async with:
+* [x] * promises
+* [x] * better loading state and behaviour
+* [x] Pass more (and consistent?) props and state from Select to Components
+* [x] Fix issue with how the mouse hover interacts with keyboard scrolling
+* [x] Ability to customise built-in strings

.babelrc

@@ -1,9 +1,14 @@
 {
-  "ignore": ["node-modules/**", "src/index.umd.js"],
-  "presets": [ "env", "stage-0", "react"],
+  "plugins": [
+    "emotion",
+    "transform-class-properties",
+    "transform-object-rest-spread"
+  ],
+  "presets": ["env", "react"],
+  "ignore": ["node_modules"],
   "env": {
     "test": {
-      "plugins": ["istanbul"],
-    },
+      "plugins": ["istanbul"]
+    }
   }
 }

.browserslistrc

@@ -0,0 +1,3 @@
+> 0.25%
+ie 11
+not op_mini all

.circleci/config.yml

@@ -0,0 +1,69 @@
+version: 2
+
+docker_defaults: &docker_defaults
+    docker:
+        - image: cypress/base:8
+          environment:
+            TERM: xterm
+    working_directory: ~/project/repo
+
+attach_workspace: &attach_workspace
+    attach_workspace:
+        at: ~/project
+
+install_steps: &install_steps
+    steps:
+        - checkout
+        - restore_cache:
+            name: Restore node_modules cache
+            keys:
+                - dependency-cache-{{ .Branch }}-{{ checksum "package.json" }}
+                - dependency-cache-{{ .Branch }}-
+                - dependency-cache-
+        - run:
+            name: Installing Dependencies
+            command: |
+              yarn install --silent
+        - save_cache:
+            name: Save node_modules cache
+            key: dependency-cache-{{ .Branch }}-{{ checksum "package.json" }}
+            paths:
+                - node_modules/
+        - persist_to_workspace:
+            root: ~/project
+            paths:
+                - repo
+
+workflows:
+    version: 2
+    build_pipeline:
+        jobs:
+            - build
+            - unit_test:
+                requires:
+                    - build
+            - end_to_end:
+                requires:
+                    - build
+jobs:
+    build:
+        <<: *docker_defaults
+        <<: *install_steps
+    unit_test:
+        <<: *docker_defaults
+        steps:
+            - *attach_workspace
+            - run:
+                name: Running unit tests
+                command: |
+                  yarn lint
+                  yarn test:jest
+                  yarn coveralls
+    end_to_end:
+        <<: *docker_defaults
+        steps:
+            - *attach_workspace
+            - run:
+                name: Running E2E tests
+                command: |
+                  yarn e2e

.editorconfig

@@ -7,16 +7,11 @@ end_of_line = lf
 charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
-indent_style = tab
-translate_tabs_to_spaces = false
-
-[*.json]
-indent_style = space
-indent_size = 2
-
-[*.yml]
 indent_style = space
 indent_size = 2
 
 [*.md]
 trim_trailing_whitespace = false
+
+[.circleci/config.yml]
+indent_size = 4

.eslintignore

@@ -1,6 +1,7 @@
-lib/*
-dist/*
 coverage/*
-examples/dist/*
+cypress/plugins/*
+cypress/support/*
+dist/*
+flow-typed/*
+lib/*
 node_modules/*
-bower_components/*

.eslintrc.js

@@ -1,41 +1,41 @@
 module.exports = {
-	parserOptions: {
-		ecmaVersion: 6,
-		sourceType: 'module',
-		ecmaFeatures: {
-			experimentalObjectRestSpread: true,
-			jsx: true,
-		},
-	},
-	env: {
-		browser: true,
-		es6: true,
-		node: true,
-	},
-	plugins: ['react'],
-	rules: {
-		'curly': [2, 'multi-line'],
-		'jsx-quotes': 1,
-		'no-shadow': 0,
-		'no-trailing-spaces': 0,
-		'no-underscore-dangle': 0,
-		'no-unused-expressions': 0,
-		'object-curly-spacing': [1, 'always'],
-		'quotes': [2, 'single', 'avoid-escape'],
-		'react/jsx-boolean-value': 1,
-		'react/jsx-no-undef': 1,
-		'react/jsx-uses-react': 1,
-		'react/jsx-uses-vars': 1,
-		'react/jsx-wrap-multilines': 1,
-		'react/no-did-mount-set-state': 1,
-		'react/no-did-update-set-state': 1,
-		'react/no-unknown-property': 1,
-		'react/prop-types': 1,
-		'react/react-in-jsx-scope': 1,
-		'react/self-closing-comp': 1,
-		'react/sort-comp': 1,
-		'react/sort-prop-types': 1,
-		'semi': 2,
-		'strict': 0,
-	},
+  parser: 'babel-eslint',
+  env: {
+    browser: true,
+    es6: true,
+    node: true,
+  },
+  plugins: ['react'],
+  rules: {
+    'no-unused-vars': [
+      'error',
+      {
+        args: 'after-used',
+        argsIgnorePattern: '^event$',
+        ignoreRestSiblings: true,
+        vars: 'all',
+      },
+    ],
+    curly: [2, 'multi-line'],
+    'jsx-quotes': 1,
+    'no-shadow': 1,
+    'no-trailing-spaces': 1,
+    'no-underscore-dangle': 1,
+    'no-unused-expressions': 1,
+    'object-curly-spacing': [1, 'always'],
+    quotes: [2, 'single', 'avoid-escape'],
+    'react/jsx-boolean-value': 1,
+    'react/jsx-no-undef': 1,
+    'react/jsx-uses-react': 1,
+    'react/jsx-uses-vars': 1,
+    'react/jsx-wrap-multilines': 1,
+    'react/no-did-mount-set-state': 1,
+    'react/no-did-update-set-state': 1,
+    'react/no-unknown-property': 1,
+    'react/react-in-jsx-scope': 1,
+    'react/self-closing-comp': 1,
+    'react/sort-prop-types': 1,
+    semi: 2,
+    strict: 0,
+  },
 };

.flowconfig

@@ -0,0 +1,18 @@
+[ignore]
+./lib/.*
+./dist/.*
+.*/node_modules/cypress/.*
+.*/node_modules/@atlaskit/tooltip/dist/cjs/components/Marshal.js.flow
+
+[include]
+
+[libs]
+flow-typed
+
+[lints]
+
+[options]
+module.name_mapper='\!\!raw-loader\!.*' -> '<PROJECT_ROOT>/typings/raw-loader.js'
+module.name_mapper='\!\!extract-react-types-loader\!.*' -> '<PROJECT_ROOT>/typings/extract-react-types-loader.js'
+
+[strict]

.github/CONTRIBUTING.md

@@ -0,0 +1,30 @@
+# Contributing
+
+Thanks for your interest in React-Select. All forms of contribution are
+welcome, from issue reports to PRs and documentation / write-ups.
+
+Before you open a PR:
+
+* In development, run `yarn start` to build (+watch) the project source, and run
+the [development server](http://localhost:8000).
+* Please ensure all the examples work correctly after your change. If you're
+adding a major new use-case, add a new example demonstrating its use.
+* Be careful to follow the code style of the project. Run `yarn lint` after
+your changes and ensure you do not introduce any new errors or warnings.
+* This repository uses `flow`, please run `yarn flow` after your changes to ensure
+that you do not introduce any new type errors.
+
+* Ensure that your effort is aligned with the project's roadmap by talking to
+the maintainers, especially if you are going to spend a lot of time on it.
+* Make sure there's an issue open for any work you take on and intend to submit
+as a pull request - it helps core members review your concept and direction
+early and is a good way to discuss what you're planning to do.
+* If you open an issue and are interested in working on a fix, please let us
+know. We'll help you get started, rather than adding it to the queue.
+* Make sure you do not add regressions by running `yarn test`.
+* Where possible, include tests with your changes, either that demonstrates the
+bug, or tests the new functionality. If you're not sure how to test your
+changes, feel free to ping @gwyneplaine or @JedWatson
+* Run `yarn coveralls` to check that the coverage hasn't dropped, and look at the
+report (under the generated `coverage` directory) to check that your changes are
+covered

ISSUE_TEMPLATE.md → .github/ISSUE_TEMPLATE.md

@@ -10,8 +10,11 @@ Please don't file GitHub issues to ask questions. Use Stack Overflow with a [#re
 Please include a test case that demonstrates the issue you're reporting!
 This is very helpful to maintainers in order to help us see the issue you're seeing.
 
-Here is a Plunker you can fork that has react-select loaded and supports JSX syntax:
-https://plnkr.co/edit/dHygFMWWqVwaRAfpEmbn?p=preview
+To report bugs against react-select v2 please fork the following code-sandbox:
+https://codesandbox.io/s/k5rvn9z3lv
+
+To report bugs against react-select v1 please fork the following code-sandbox:
+https://codesandbox.io/s/n34mq0743j
 
 You may also find the [online Babel tool](https://babeljs.io/repl/) quite helpful if you wish to use ES6/ES7 syntax not yet supported by the browser you are using.