]> source.dussan.org Git - sonarqube.git/commitdiff
SONARCLOUD-96 Hide quality widget by default in Bitbucket cloud app
authorGrégoire Aubert <gregoire.aubert@sonarsource.com>
Thu, 12 Jul 2018 11:46:53 +0000 (13:46 +0200)
committerSonarTech <sonartech@sonarsource.com>
Wed, 18 Jul 2018 18:21:20 +0000 (20:21 +0200)
server/sonar-bitbucketcloud/package.json
server/sonar-bitbucketcloud/src/main/ts/api.ts
server/sonar-bitbucketcloud/src/main/ts/components/Config.tsx
server/sonar-bitbucketcloud/src/main/ts/components/__tests__/Config-test.tsx
server/sonar-bitbucketcloud/src/main/ts/components/__tests__/__snapshots__/Config-test.tsx.snap
server/sonar-bitbucketcloud/src/main/ts/style.css
server/sonar-bitbucketcloud/src/main/ts/typings/@atlaskit.d.ts
server/sonar-bitbucketcloud/src/main/ts/utils.ts
server/sonar-bitbucketcloud/yarn.lock

index be4894705c245fb32c6862c0fdb780492f9b824c..829e718e5a6669ab2e2b9b8db48add9f6f570757 100644 (file)
@@ -12,7 +12,7 @@
     "@atlaskit/icon": "12.8.0",
     "@atlaskit/logo": "8.1.3",
     "@atlaskit/reduced-ui-pack": "8.19.0",
-    "@atlaskit/single-select": "5.2.5",
+    "@atlaskit/select": "4.5.2",
     "@atlaskit/spinner": "8.0.0",
     "@atlaskit/tooltip": "10.3.1",
     "babel-polyfill": "6.26.0",
index 8af5957ec6cb679790de2e339b5b38826069d91f..8e364b490c5a2507399dbb5fa482b6de8ddb8ff3 100644 (file)
@@ -80,7 +80,7 @@ export function putStoredProperty(property: string, value: Object | string | boo
   return apiRequest({
     cache: false,
     contentType: 'application/json',
-    data: value,
+    data: JSON.stringify(value),
     type: 'PUT',
     url: `/2.0/repositories/{}/${getRepoUuid()}/properties/${getAppKey()}/${property}`
   });
index 9bf235fb9fa8a02ae94d9aa578302cbe8b0938d0..9983088ea7367644a5f588de2d0652f0778058d3 100644 (file)
@@ -20,7 +20,7 @@
 import * as React from 'react';
 import Button from '@atlaskit/button';
 import { CheckboxStateless } from '@atlaskit/checkbox';
-import SingleSelect from '@atlaskit/single-select';
+import Select, { createFilter } from '@atlaskit/select';
 import Spinner from '@atlaskit/spinner';
 import { getBaseUrl } from '@sqcore/helpers/urls';
 import HelpLink from './HelpLink';
@@ -31,8 +31,7 @@ import { bindProject, displayWSError, getMyProjects, putStoredProperty } from '.
 import { displayMessage } from '../utils';
 
 interface ProjectOption {
-  content: string;
-  filterValues: string[];
+  label: string;
   value: string;
 }
 
@@ -55,6 +54,14 @@ interface State {
 }
 
 export default class Config extends React.PureComponent<Props, State> {
+  filterOption = createFilter({
+    ignoreCase: true,
+    ignoreAccents: true,
+    stringify: (option: ProjectOption) => `${option.label} ${option.value}`,
+    trim: true,
+    matchFrom: 'any'
+  });
+
   mounted = false;
 
   constructor(props: Props) {
@@ -73,34 +80,25 @@ export default class Config extends React.PureComponent<Props, State> {
     this.fetchMyProjects();
   }
 
-  componentWillReceiveProps({ projectKey }: Props) {
-    const currentProjectKey = this.state.selectedProject && this.state.selectedProject.value;
-
-    if (currentProjectKey !== projectKey) {
-      this.setState((state: State) => ({
-        selectedProject: state.projects.find(p => p.value === projectKey)
-      }));
-    }
-  }
-
   componentWillUnmount() {
     this.mounted = false;
   }
 
+  get selectedProject() {
+    return (
+      this.state.selectedProject || this.state.projects.find(p => p.value === this.props.projectKey)
+    );
+  }
+
   fetchMyProjects = () => {
     getMyProjects({ ps: 500 }).then(
       ({ projects }) => {
         if (this.mounted) {
-          const projectOptions = projects.map(p => ({
-            content: p.name,
-            filterValues: [p.name, p.key],
-            value: p.key
-          }));
+          const projectOptions = projects.map(p => ({ label: p.name, value: p.key }));
           this.setState({
             authenticated: true,
             loading: false,
-            projects: projectOptions,
-            selectedProject: projectOptions.find(p => p.value === this.props.projectKey)
+            projects: projectOptions
           });
         }
       },
@@ -118,25 +116,19 @@ export default class Config extends React.PureComponent<Props, State> {
     this.setState(state => ({ disabled: !state.disabled }));
   };
 
-  handleFilterChange = (filter: string) => {
-    this.setState(({ projects }: State) => ({
-      selectedProject: projects.find(p =>
-        p.filterValues.some(value => value.toLowerCase() === filter.toLowerCase())
-      )
-    }));
-  };
-
   handleReload = () => {
     window.location.reload();
   };
 
-  handleSelect = ({ item }: { item: ProjectOption }) => {
-    this.setState({ selectedProject: item });
+  handleChange = (selectedProject?: ProjectOption) => {
+    if (selectedProject && !Array.isArray(selectedProject)) {
+      this.setState({ selectedProject });
+    }
   };
 
   handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
-    const { disabled, selectedProject } = this.state;
+    const { disabled } = this.state;
 
     let updateBinding = false;
     const promises: Promise<any>[] = [];
@@ -147,6 +139,8 @@ export default class Config extends React.PureComponent<Props, State> {
         })
       );
     }
+
+    const { selectedProject } = this;
     if (selectedProject && selectedProject.value !== this.props.projectKey) {
       updateBinding = true;
       promises.push(
@@ -199,7 +193,7 @@ export default class Config extends React.PureComponent<Props, State> {
   };
 
   renderProjectsSelect = () => {
-    const { projects, selectedProject } = this.state;
+    const { projects } = this.state;
 
     if (!projects || projects.length <= 0) {
       return (
@@ -216,17 +210,19 @@ export default class Config extends React.PureComponent<Props, State> {
 
     return (
       <div className="settings-projects">
-        <SingleSelect
-          defaultSelected={selectedProject}
-          hasAutocomplete={true}
-          items={[{ items: projects }]}
-          label="Project to link to"
-          maxHeight={300}
-          onFilterChange={this.handleFilterChange}
-          onSelected={this.handleSelect}
+        <label htmlFor="projects-select">Project to link to</label>
+        <Select
+          autoFocus={true}
+          className="settings-projects-select"
+          filterOption={this.filterOption}
+          id="projects-select"
+          isClearable={false}
+          isSearchable={true}
+          maxMenuHeight={300}
+          onChange={this.handleChange}
+          options={projects}
           placeholder="Select a project"
-          shouldFlip={false}
-          shouldFocus={true}
+          value={this.selectedProject}
         />
         <small>You see only the projects you administer.</small>
       </div>
@@ -234,7 +230,7 @@ export default class Config extends React.PureComponent<Props, State> {
   };
 
   render() {
-    const { authenticated, disabled, loading, selectedProject } = this.state;
+    const { authenticated, disabled, loading } = this.state;
 
     if (loading) {
       return this.renderContainer(
@@ -244,6 +240,7 @@ export default class Config extends React.PureComponent<Props, State> {
       );
     }
 
+    const { selectedProject } = this;
     const hasChanged =
       (selectedProject && selectedProject.value !== this.props.projectKey) ||
       this.props.disabled !== disabled;
@@ -253,13 +250,13 @@ export default class Config extends React.PureComponent<Props, State> {
         {!authenticated && <LoginForm onReload={this.handleReload} />}
         <form className="settings-form" onSubmit={this.handleSubmit}>
           {authenticated && this.renderProjectsSelect()}
-          <div className="ak-field-group display-flex-justify-center">
+          <div className="display-flex-justify-center">
             <CheckboxStateless
-              isChecked={disabled}
-              label="Hide repository overview widget"
-              name="hide-widget"
+              isChecked={!disabled}
+              label="Show repository overview widget"
+              name="show-widget"
               onChange={this.handleDisabledChange}
-              value="hide-widget"
+              value="show-widget"
             />
           </div>
           <div className="ak-field-group">
index caca56932b5e0e0c23fb2db913a94aa69e8bce87..e3f8cd28b594566e7241e4d10bd722345c400682 100644 (file)
@@ -76,34 +76,12 @@ it('should correctly handle select interactions', async () => {
   expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeTruthy();
 
   // Check the select event
-  const SelectWrapper = wrapper.find('AkSingleSelect');
-  const projectOption = { content: 'Bar', filterValues: ['Bar', 'bar'], value: 'bar' };
-  (SelectWrapper.prop('onSelected') as Function)({ item: projectOption });
+  const SelectWrapper = wrapper.find('AtlaskitSelect');
+  const projectOption = { label: 'Bar', value: 'bar' };
+  (SelectWrapper.prop('onChange') as Function)(projectOption);
   wrapper.update();
   expect(wrapper.state('selectedProject')).toEqual(projectOption);
   expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeFalsy();
-
-  // Check the filter event
-  (SelectWrapper.prop('onFilterChange') as Function)('baz');
-  expect(wrapper.state('selectedProject')).toMatchObject({
-    content: 'FooBar',
-    filterValues: ['FooBar', 'baz'],
-    value: 'baz'
-  });
-  (SelectWrapper.prop('onFilterChange') as Function)('FooBar');
-  expect(wrapper.state('selectedProject')).toMatchObject({
-    content: 'FooBar',
-    filterValues: ['FooBar', 'baz'],
-    value: 'baz'
-  });
-  wrapper.update();
-  expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeFalsy();
-
-  // Check the filter event with no match
-  (SelectWrapper.prop('onFilterChange') as Function)('test');
-  expect(wrapper.state('selectedProject')).toBeUndefined();
-  wrapper.update();
-  expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeTruthy();
 });
 
 it('should correctly bind a project', async () => {
@@ -114,7 +92,7 @@ it('should correctly bind a project', async () => {
   expect(wrapper).toMatchSnapshot();
   expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeTruthy();
 
-  (wrapper.find('AkSingleSelect').prop('onFilterChange') as Function)('FooBar');
+  (wrapper.find('AtlaskitSelect').prop('onChange') as Function)({ label: 'Baz', value: 'baz' });
   wrapper.update();
   expect(wrapper.find('WithAnalyticsContext').prop('isDisabled')).toBeFalsy();
   wrapper.find('form').simulate('submit', { preventDefault: () => {} });
index f7379d6c8f9f9cd1c9b09ba8bb640061728606bb..4d8d3d87ed3c9afcecf44b03fea9704500fc850e 100644 (file)
@@ -28,66 +28,54 @@ exports[`should correctly bind a project 1`] = `
         <div
           className="settings-projects"
         >
-          <AkSingleSelect
-            appearance="default"
-            droplistShouldFitContainer={true}
-            hasAutocomplete={true}
-            isRequired={false}
-            items={
+          <label
+            htmlFor="projects-select"
+          >
+            Project to link to
+          </label>
+          <AtlaskitSelect
+            autoFocus={true}
+            className="settings-projects-select"
+            filterOption={[Function]}
+            id="projects-select"
+            isClearable={false}
+            isSearchable={true}
+            maxMenuHeight={300}
+            onChange={[Function]}
+            onClickPreventDefault={true}
+            options={
               Array [
                 Object {
-                  "items": Array [
-                    Object {
-                      "content": "Foo",
-                      "filterValues": Array [
-                        "Foo",
-                        "foo",
-                      ],
-                      "value": "foo",
-                    },
-                    Object {
-                      "content": "Bar",
-                      "filterValues": Array [
-                        "Bar",
-                        "bar",
-                      ],
-                      "value": "bar",
-                    },
-                    Object {
-                      "content": "FooBar",
-                      "filterValues": Array [
-                        "FooBar",
-                        "baz",
-                      ],
-                      "value": "baz",
-                    },
-                  ],
+                  "label": "Foo",
+                  "value": "foo",
+                },
+                Object {
+                  "label": "Bar",
+                  "value": "bar",
+                },
+                Object {
+                  "label": "FooBar",
+                  "value": "baz",
                 },
               ]
             }
-            label="Project to link to"
-            maxHeight={300}
-            onFilterChange={[Function]}
-            onOpenChange={[Function]}
-            onSelected={[Function]}
             placeholder="Select a project"
-            position="bottom left"
-            shouldFlip={false}
-            shouldFocus={true}
+            spacing="default"
+            validationState="default"
           />
           <small>
             You see only the projects you administer.
           </small>
         </div>
         <div
-          className="ak-field-group display-flex-justify-center"
+          className="display-flex-justify-center"
         >
           <CheckboxStateless
-            isChecked={false}
-            label="Hide repository overview widget"
-            name="hide-widget"
+            isChecked={true}
+            label="Show repository overview widget"
+            name="show-widget"
             onChange={[Function]}
-            value="hide-widget"
+            value="show-widget"
           />
         </div>
         <div
@@ -172,76 +160,60 @@ exports[`should display correctly 2`] = `
         <div
           className="settings-projects"
         >
-          <AkSingleSelect
-            appearance="default"
-            defaultSelected={
-              Object {
-                "content": "Foo",
-                "filterValues": Array [
-                  "Foo",
-                  "foo",
-                ],
-                "value": "foo",
-              }
-            }
-            droplistShouldFitContainer={true}
-            hasAutocomplete={true}
-            isRequired={false}
-            items={
+          <label
+            htmlFor="projects-select"
+          >
+            Project to link to
+          </label>
+          <AtlaskitSelect
+            autoFocus={true}
+            className="settings-projects-select"
+            filterOption={[Function]}
+            id="projects-select"
+            isClearable={false}
+            isSearchable={true}
+            maxMenuHeight={300}
+            onChange={[Function]}
+            onClickPreventDefault={true}
+            options={
               Array [
                 Object {
-                  "items": Array [
-                    Object {
-                      "content": "Foo",
-                      "filterValues": Array [
-                        "Foo",
-                        "foo",
-                      ],
-                      "value": "foo",
-                    },
-                    Object {
-                      "content": "Bar",
-                      "filterValues": Array [
-                        "Bar",
-                        "bar",
-                      ],
-                      "value": "bar",
-                    },
-                    Object {
-                      "content": "FooBar",
-                      "filterValues": Array [
-                        "FooBar",
-                        "baz",
-                      ],
-                      "value": "baz",
-                    },
-                  ],
+                  "label": "Foo",
+                  "value": "foo",
+                },
+                Object {
+                  "label": "Bar",
+                  "value": "bar",
+                },
+                Object {
+                  "label": "FooBar",
+                  "value": "baz",
                 },
               ]
             }
-            label="Project to link to"
-            maxHeight={300}
-            onFilterChange={[Function]}
-            onOpenChange={[Function]}
-            onSelected={[Function]}
             placeholder="Select a project"
-            position="bottom left"
-            shouldFlip={false}
-            shouldFocus={true}
+            spacing="default"
+            validationState="default"
+            value={
+              Object {
+                "label": "Foo",
+                "value": "foo",
+              }
+            }
           />
           <small>
             You see only the projects you administer.
           </small>
         </div>
         <div
-          className="ak-field-group display-flex-justify-center"
+          className="display-flex-justify-center"
         >
           <CheckboxStateless
-            isChecked={false}
-            label="Hide repository overview widget"
-            name="hide-widget"
+            isChecked={true}
+            label="Show repository overview widget"
+            name="show-widget"
             onChange={[Function]}
-            value="hide-widget"
+            value="show-widget"
           />
         </div>
         <div
@@ -269,14 +241,14 @@ exports[`should display the authentication component and the display checkbox 1`
   onSubmit={[Function]}
 >
   <div
-    className="ak-field-group display-flex-justify-center"
+    className="display-flex-justify-center"
   >
     <CheckboxStateless
-      isChecked={false}
-      label="Hide repository overview widget"
-      name="hide-widget"
+      isChecked={true}
+      label="Show repository overview widget"
+      name="show-widget"
       onChange={[Function]}
-      value="hide-widget"
+      value="show-widget"
     />
   </div>
   <div
index 3e7bb95d14829d3f86ef8440a59c568bb43c5228..7d6f886920f3f883ce5573d92729852ba465a6bc 100644 (file)
   margin-top: 8px;
 }
 
+.settings-form label {
+  color: #6b778c;
+  display: block;
+  font-size: 12px;
+  font-weight: 600;
+  line-height: 1.3;
+  padding: 20px 0px 4px;
+}
+
 .settings-form .settings-projects > div {
   width: 300px;
 }
 
+.settings-projects-select {
+  text-align: left;
+}
+
 .settings-help {
   position: absolute;
   bottom: 20px;
index 931f002a72af5d7d484f50b24bf37d7eb55ccd45..3faee1df162625b5895bf124f2f82c83c38f9980 100644 (file)
@@ -84,43 +84,39 @@ declare module '@atlaskit/logo' {
   export class BitbucketIcon extends React.Component<LogoProps> {}
 }
 
-declare module '@atlaskit/single-select' {
-  export interface GroupType {
-    heading?: string;
-    items: ItemType[];
-  }
-
-  export interface ItemType {
-    content?: React.ReactNode;
-    description?: string;
-    label?: string;
-    tooltipDescription?: string;
-    tooltipPosition?: 'top' | 'bottom' | 'left';
-    value?: string | number;
-    filterValues?: string[];
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    elemBefore?: React.ReactNode;
-  }
-
-  export default class SingleSelect extends React.Component<{
-    defaultSelected?: ItemType;
-    droplistShouldFitContainer?: boolean;
-    hasAutocomplete?: boolean;
-    invalidMessage?: React.ReactNode;
+declare module '@atlaskit/select' {
+  type ValidationState = 'default' | 'error' | 'success';
+  type OptionType = { [k: string]: any };
+  type OptionsType = OptionType[];
+  type ValueType = OptionType | OptionsType | null | void;
+
+  export function createFilter(options: {
+    ignoreCase?: boolean;
+    ignoreAccents?: boolean;
+    stringify?: (option: OptionType) => string;
+    trim?: boolean;
+    matchFrom?: 'any' | 'start';
+  }): (option: OptionType, inputValue: string) => boolean;
+
+  export default class Select extends React.Component<{
+    autoFocus?: boolean;
+    className?: string;
+    defaultValue?: OptionType;
+    filterOption?: (option: OptionType, inputValue: string) => boolean;
+    id?: string;
+    isClearable?: boolean;
     isDisabled?: boolean;
-    isRequired?: boolean;
-    isInvalid?: boolean;
-    items?: GroupType[];
-    label?: string;
-    noMatchesFound?: string;
-    onFilterChange?: Function;
-    onSelected?: Function;
+    isLoading?: boolean;
+    isSearchable?: boolean;
+    loadingMessage?: (param: { inputValue: string }) => string;
+    maxMenuHeight?: number;
+    maxValueHeight?: number;
+    noOptionsMessage?: (param: { inputValue: string }) => string;
+    onChange?: (value: ValueType) => void;
+    onInputChange?: (k: string) => string | void;
+    options: OptionsType;
     placeholder?: string;
-    shouldFitContainer?: boolean;
-    shouldFlip?: boolean;
-    shouldFocus?: boolean;
-    maxHeight?: number;
+    value?: ValueType;
   }> {}
 }
 
index 434ef59011901e47d48ce140d58b2640759d22a0..237f4a260f4a9054930b4870d4efc3f39fe29ce0 100644 (file)
@@ -38,7 +38,7 @@ export function getAppKey(): string {
 }
 
 export function getDisabled(): boolean {
-  return query.disabled === 'true';
+  return query.disabled !== 'false';
 }
 
 export function getWidgetKey(): WidgetType {
index a328a49204b7ca74eabc91a151ce10d051fe5303..4fe8ae3df93062ef7f8a8ab1b735066d016a8ae5 100644 (file)
   dependencies:
     "@atlaskit/util-shared-styles" "^2.10.3"
 
-"@atlaskit/droplist@^6.2.1":
-  version "6.2.2"
-  resolved "https://registry.yarnpkg.com/@atlaskit/droplist/-/droplist-6.2.2.tgz#ed05ec073e7fe185679712b39b1b9a7a926c16ec"
-  dependencies:
-    "@atlaskit/icon" "^12.6.1"
-    "@atlaskit/item" "^7.0.5"
-    "@atlaskit/layer" "^4.2.0"
-    "@atlaskit/spinner" "^8.0.0"
-    "@atlaskit/theme" "^4.0.4"
-    "@atlaskit/tooltip" "^10.2.1"
-    babel-runtime "^6.26.0"
-    classnames "^2.2.5"
-    keycode "^2.1.7"
-    prop-types "^15.5.10"
-
-"@atlaskit/field-base@^10.1.3":
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/@atlaskit/field-base/-/field-base-10.2.0.tgz#270346967d6a28a814bec64dbfda672da28d2157"
-  dependencies:
-    "@atlaskit/icon" "^12.1.2"
-    "@atlaskit/inline-dialog" "^7.1.2"
-    "@atlaskit/spinner" "^8.0.0"
-    "@atlaskit/theme" "^4.0.4"
-    babel-runtime "^6.26.0"
-
-"@atlaskit/icon@12.8.0", "@atlaskit/icon@^12.1.2", "@atlaskit/icon@^12.3.1", "@atlaskit/icon@^12.6.1":
+"@atlaskit/icon@12.8.0", "@atlaskit/icon@^12.3.1", "@atlaskit/icon@^12.6.2":
   version "12.8.0"
   resolved "https://registry.yarnpkg.com/@atlaskit/icon/-/icon-12.8.0.tgz#44095171300c664834937593b32b3b8515745eaa"
   dependencies:
     babel-runtime "^6.26.0"
     uuid "^3.1.0"
 
-"@atlaskit/inline-dialog@^7.1.2":
-  version "7.1.3"
-  resolved "https://registry.yarnpkg.com/@atlaskit/inline-dialog/-/inline-dialog-7.1.3.tgz#6eb75f830a4a0ec97e7292673ccc1e1abc175132"
-  dependencies:
-    "@atlaskit/layer" "^4.0.3"
-    "@atlaskit/theme" "^4.0.4"
-
-"@atlaskit/item@^7.0.5":
-  version "7.0.8"
-  resolved "https://registry.yarnpkg.com/@atlaskit/item/-/item-7.0.8.tgz#324dfb81ce5f7e17955b5044e5c461c6e5ced030"
-  dependencies:
-    "@atlaskit/theme" "^4.0.4"
-    prop-types "^15.5.10"
-    react-addons-text-content "^0.0.4"
-    uuid "^3.1.0"
-
 "@atlaskit/layer-manager@^4.2.1":
   version "4.3.1"
   resolved "https://registry.yarnpkg.com/@atlaskit/layer-manager/-/layer-manager-4.3.1.tgz#08fe6af287731ce12dd96991882b6d6eef06da27"
     react-scrolllock "^3.0.1"
     react-transition-group "^2.2.1"
 
-"@atlaskit/layer@^4.0.3", "@atlaskit/layer@^4.2.0":
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/@atlaskit/layer/-/layer-4.2.0.tgz#66dcffb7b826159a7affaa763e566cd91c32b91c"
-  dependencies:
-    react-scrolllock "^3.0.1"
-
 "@atlaskit/logo@8.1.3":
   version "8.1.3"
   resolved "https://registry.yarnpkg.com/@atlaskit/logo/-/logo-8.1.3.tgz#093cdf1c0a8f6c10ef440544a2c46b6b97376aef"
   dependencies:
     "@atlaskit/util-shared-styles" "^2.10.3"
 
-"@atlaskit/single-select@5.2.5":
-  version "5.2.5"
-  resolved "https://registry.yarnpkg.com/@atlaskit/single-select/-/single-select-5.2.5.tgz#b71fb0f40080bd4ef473bdb0d48eb564e7984e9a"
+"@atlaskit/select@4.5.2":
+  version "4.5.2"
+  resolved "https://registry.yarnpkg.com/@atlaskit/select/-/select-4.5.2.tgz#e924ba60c00348cd3b8e25d3bc124c980e0267d2"
   dependencies:
-    "@atlaskit/droplist" "^6.2.1"
-    "@atlaskit/field-base" "^10.1.3"
-    "@atlaskit/icon" "^12.3.1"
+    "@atlaskit/icon" "^12.6.2"
     "@atlaskit/spinner" "^8.0.0"
     "@atlaskit/theme" "^4.0.4"
-    classnames "^2.2.5"
+    focus-trap "^2.4.5"
+    memoize-one "^3.0.1"
+    react-fast-compare "^2.0.1"
+    react-node-resolver "^1.0.1"
+    react-popper "^1.0.0"
+    react-select "^2.0.0-beta.7"
+    react-transition-group "^2.2.1"
 
 "@atlaskit/spinner@8.0.0", "@atlaskit/spinner@^8.0.0":
   version "8.0.0"
   dependencies:
     prop-types "^15.5.10"
 
-"@atlaskit/tooltip@10.3.1", "@atlaskit/tooltip@^10.2.1":
+"@atlaskit/tooltip@10.3.1":
   version "10.3.1"
   resolved "https://registry.yarnpkg.com/@atlaskit/tooltip/-/tooltip-10.3.1.tgz#9d305b850929fca49e42f345df03b1e958692287"
   dependencies:
   dependencies:
     "@babel/highlight" "7.0.0-beta.42"
 
+"@babel/helper-module-imports@7.0.0-beta.51":
+  version "7.0.0-beta.51"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.51.tgz#ce00428045fbb7d5ebc0ea7bf835789f15366ab2"
+  dependencies:
+    "@babel/types" "7.0.0-beta.51"
+    lodash "^4.17.5"
+
 "@babel/helper-module-imports@^7.0.0-beta.49":
   version "7.0.0-beta.53"
   resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.53.tgz#e735e6aa30a504b0f9d85c38a6d470a9f4aa81d9"
     esutils "^2.0.2"
     js-tokens "^3.0.0"
 
+"@babel/types@7.0.0-beta.51":
+  version "7.0.0-beta.51"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.0.0-beta.51.tgz#d802b7b543b5836c778aa691797abf00f3d97ea9"
+  dependencies:
+    esutils "^2.0.2"
+    lodash "^4.17.5"
+    to-fast-properties "^2.0.0"
+
 "@babel/types@7.0.0-beta.53", "@babel/types@^7.0.0-beta.49":
   version "7.0.0-beta.53"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.0.0-beta.53.tgz#19a461c0da515595dfb6740b4b45dc7bb0e6b375"
     lodash "^4.17.5"
     to-fast-properties "^2.0.0"
 
+"@emotion/babel-utils@^0.6.4":
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/@emotion/babel-utils/-/babel-utils-0.6.5.tgz#34d7844eb532d1175c8fc70175beb74d071bfbeb"
+  dependencies:
+    "@emotion/hash" "^0.6.3"
+    "@emotion/memoize" "^0.6.3"
+    "@emotion/serialize" "^0.8.3"
+    convert-source-map "^1.5.1"
+    find-root "^1.1.0"
+    source-map "^0.7.2"
+
+"@emotion/hash@^0.6.2", "@emotion/hash@^0.6.3":
+  version "0.6.3"
+  resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.6.3.tgz#0e7a5604626fc6c6d4ac4061a2f5ac80d50262a4"
+
+"@emotion/memoize@^0.6.1", "@emotion/memoize@^0.6.3":
+  version "0.6.3"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.6.3.tgz#64379a1d6af6f8d4fe8bd6efe9d9e824ea4b22d8"
+
+"@emotion/serialize@^0.8.3":
+  version "0.8.3"
+  resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.8.3.tgz#0fad55b9a97f9523e6b1fd6fb6f74b6cb41c7f8b"
+  dependencies:
+    "@emotion/hash" "^0.6.3"
+    "@emotion/memoize" "^0.6.3"
+    "@emotion/unitless" "^0.6.3"
+    "@emotion/utils" "^0.7.1"
+
+"@emotion/stylis@^0.6.10":
+  version "0.6.10"
+  resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.6.10.tgz#7d321e639ebc8ba23ace5990c20e94dcebb8f3dd"
+
+"@emotion/unitless@^0.6.2", "@emotion/unitless@^0.6.3":
+  version "0.6.3"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.6.3.tgz#65682e68a82701c70eefb38d7f941a2c0bfa90de"
+
+"@emotion/utils@^0.7.1":
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.7.1.tgz#e44e596d03c9f16ba3b127ad333a8a072bcb5a0a"
+
 "@types/cheerio@*":
   version "0.22.7"
   resolved "https://registry.yarnpkg.com/@types/cheerio/-/cheerio-0.22.7.tgz#4a92eafedfb2b9f4437d3a4410006d81114c66ce"
@@ -942,6 +954,23 @@ babel-plugin-dynamic-import-node@1.2.0:
   dependencies:
     babel-plugin-syntax-dynamic-import "^6.18.0"
 
+babel-plugin-emotion@^9.2.5:
+  version "9.2.5"
+  resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-9.2.5.tgz#0046e03be5c16276f85380476f88c9fcbf7c9536"
+  dependencies:
+    "@babel/helper-module-imports" "7.0.0-beta.51"
+    "@emotion/babel-utils" "^0.6.4"
+    "@emotion/hash" "^0.6.2"
+    "@emotion/memoize" "^0.6.1"
+    "@emotion/stylis" "^0.6.10"
+    babel-plugin-macros "^2.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    convert-source-map "^1.5.0"
+    find-root "^1.1.0"
+    mkdirp "^0.5.1"
+    source-map "^0.5.7"
+    touch "^1.0.0"
+
 babel-plugin-istanbul@^4.1.6:
   version "4.1.6"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz#36c59b2192efce81c5b378321b74175add1c9a45"
@@ -965,6 +994,12 @@ babel-plugin-lodash@3.3.4:
     lodash "^4.17.10"
     require-package-name "^2.0.1"
 
+babel-plugin-macros@^2.0.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.2.2.tgz#049c93f4b934453688a6ec38bba529c55bf0fa1f"
+  dependencies:
+    cosmiconfig "^4.0.0"
+
 babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
@@ -985,7 +1020,7 @@ babel-plugin-syntax-flow@^6.18.0, babel-plugin-syntax-flow@^6.3.13:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz#4c3ab20a2af26aa20cd25995c398c4eb70310c8d"
 
-babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
+babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
 
@@ -1332,7 +1367,7 @@ babel-runtime@6.23.0:
     core-js "^2.4.0"
     regenerator-runtime "^0.10.0"
 
-babel-runtime@^6.11.6, babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0, babel-runtime@^6.9.2:
+babel-runtime@6.x.x, babel-runtime@^6.11.6, babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0, babel-runtime@^6.9.2:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
   dependencies:
@@ -2157,6 +2192,18 @@ create-ecdh@^4.0.0:
     bn.js "^4.1.0"
     elliptic "^6.0.0"
 
+create-emotion@^9.2.5:
+  version "9.2.5"
+  resolved "https://registry.yarnpkg.com/create-emotion/-/create-emotion-9.2.5.tgz#5db4f06d936025e43bd312453a3ee946e4d5e5db"
+  dependencies:
+    "@emotion/hash" "^0.6.2"
+    "@emotion/memoize" "^0.6.1"
+    "@emotion/stylis" "^0.6.10"
+    "@emotion/unitless" "^0.6.2"
+    csstype "^2.5.2"
+    stylis "^3.5.0"
+    stylis-rule-sheet "^0.0.10"
+
 create-hash@^1.1.0, create-hash@^1.1.2:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/create-hash/-/create-hash-1.1.3.tgz#606042ac8b9262750f483caddab0f5819172d8fd"
@@ -2177,6 +2224,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+create-react-context@^0.2.1:
+  version "0.2.2"
+  resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
+  dependencies:
+    fbjs "^0.8.0"
+    gud "^1.0.0"
+
 cross-spawn@5.1.0, cross-spawn@^5.0.1, cross-spawn@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@@ -2331,6 +2385,10 @@ cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0":
   dependencies:
     cssom "0.3.x"
 
+csstype@^2.5.2:
+  version "2.5.5"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.5.tgz#4125484a3d42189a863943f23b9e4b80fedfa106"
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -2682,6 +2740,13 @@ emojis-list@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
 
+emotion@^9.1.2:
+  version "9.2.5"
+  resolved "https://registry.yarnpkg.com/emotion/-/emotion-9.2.5.tgz#666fb151a69c25c7582ff3de06f60f8d848f74aa"
+  dependencies:
+    babel-plugin-emotion "^9.2.5"
+    create-emotion "^9.2.5"
+
 encodeurl@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -3188,9 +3253,9 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.16:
-  version "0.8.16"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
+fbjs@^0.8.0, fbjs@^0.8.5:
+  version "0.8.17"
+  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
   dependencies:
     core-js "^1.0.0"
     isomorphic-fetch "^2.1.1"
@@ -3198,11 +3263,11 @@ fbjs@^0.8.16:
     object-assign "^4.1.0"
     promise "^7.1.1"
     setimmediate "^1.0.5"
-    ua-parser-js "^0.7.9"
+    ua-parser-js "^0.7.18"
 
-fbjs@^0.8.5:
-  version "0.8.17"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
+fbjs@^0.8.16:
+  version "0.8.16"
+  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
   dependencies:
     core-js "^1.0.0"
     isomorphic-fetch "^2.1.1"
@@ -3210,7 +3275,7 @@ fbjs@^0.8.5:
     object-assign "^4.1.0"
     promise "^7.1.1"
     setimmediate "^1.0.5"
-    ua-parser-js "^0.7.18"
+    ua-parser-js "^0.7.9"
 
 figures@^2.0.0:
   version "2.0.0"
@@ -3291,6 +3356,10 @@ find-index@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/find-index/-/find-index-0.1.1.tgz#675d358b2ca3892d795a1ab47232f8b6e2e0dde4"
 
+find-root@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"
+
 find-up@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"
@@ -3334,6 +3403,12 @@ focus-lock@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.3.0.tgz#cd9f9ecb279cb0f09b306b5ae713e6dd58fd15ed"
 
+focus-trap@^2.4.5:
+  version "2.4.6"
+  resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-2.4.6.tgz#332b475b317cec6a4a129f5307ce7ebc0da90b40"
+  dependencies:
+    tabbable "^1.0.3"
+
 for-in@^1.0.1, for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
@@ -3588,6 +3663,10 @@ growly@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
 
+gud@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/gud/-/gud-1.0.0.tgz#a489581b17e6a70beca9abe3ae57de7a499852c0"
+
 gzip-size@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-3.0.0.tgz#546188e9bdc337f673772f81660464b389dce520"
@@ -4850,10 +4929,6 @@ jsx-ast-utils@^2.0.1:
   dependencies:
     array-includes "^3.0.3"
 
-keycode@^2.1.7:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/keycode/-/keycode-2.2.0.tgz#3d0af56dc7b8b8e5cba8d0a97f107204eec22b04"
-
 killable@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/killable/-/killable-1.0.0.tgz#da8b84bd47de5395878f95d64d02f2449fe05e6b"
@@ -5094,6 +5169,10 @@ mem@^1.1.0:
   dependencies:
     mimic-fn "^1.0.0"
 
+memoize-one@^3.0.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-3.1.1.tgz#ef609811e3bc28970eac2884eece64d167830d17"
+
 memory-fs@^0.4.0, memory-fs@~0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
@@ -5425,6 +5504,12 @@ nopt@^4.0.1:
     abbrev "1"
     osenv "^0.1.4"
 
+nopt@~1.0.10:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/nopt/-/nopt-1.0.10.tgz#6ddd21bd2a31417b92727dd585f8a6f37608ebee"
+  dependencies:
+    abbrev "1"
+
 normalize-package-data@^2.3.2, normalize-package-data@^2.3.4:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.4.0.tgz#12f95a307d58352075a04907b84ac8be98ac012f"
@@ -5898,6 +5983,10 @@ pn@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/pn/-/pn-1.1.0.tgz#e2f4cef0e219f463c179ab37463e4e1ecdccbafb"
 
+popper.js@^1.14.1:
+  version "1.14.3"
+  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.3.tgz#1438f98d046acf7b4d78cd502bf418ac64d4f095"
+
 portfinder@^1.0.9:
   version "1.0.13"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.13.tgz#bb32ecd87c27104ae6ee44b5a3ccbf0ebb1aede9"
@@ -6251,7 +6340,7 @@ prompts@^0.1.9:
     clorox "^1.0.3"
     sisteransi "^0.1.1"
 
-prop-types@^15.0.0, prop-types@^15.5.4:
+prop-types@^15.0.0, prop-types@^15.5.4, prop-types@^15.6.1:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
   dependencies:
@@ -6412,10 +6501,6 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-react-addons-text-content@^0.0.4:
-  version "0.0.4"
-  resolved "https://registry.yarnpkg.com/react-addons-text-content/-/react-addons-text-content-0.0.4.tgz#d2e259fdc951d1d8906c08902002108dce8792e5"
-
 react-deprecate@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/react-deprecate/-/react-deprecate-0.1.0.tgz#817bdf22b8275fb767e9f49a8053f642600435c3"
@@ -6491,6 +6576,10 @@ react-error-overlay@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-4.0.0.tgz#d198408a85b4070937a98667f500c832f86bd5d4"
 
+react-fast-compare@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.1.tgz#92c91ac4814aa8cfcfb04780ad1bfff2bbe3a3c6"
+
 react-focus-lock@^1.11.1:
   version "1.11.1"
   resolved "https://registry.yarnpkg.com/react-focus-lock/-/react-focus-lock-1.11.1.tgz#6e8a1bdef14f0f04673a26e27b415e3d671f2762"
@@ -6499,6 +6588,12 @@ react-focus-lock@^1.11.1:
     prop-types "^15.0.0"
     react-side-effect "^1.1.3"
 
+react-input-autosize@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/react-input-autosize/-/react-input-autosize-2.2.1.tgz#ec428fa15b1592994fb5f9aa15bb1eb6baf420f8"
+  dependencies:
+    prop-types "^15.5.8"
+
 react-intl@2.4.0:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/react-intl/-/react-intl-2.4.0.tgz#66c14dc9df9a73b2fbbfbd6021726e80a613eb15"
@@ -6512,6 +6607,21 @@ react-is@^16.3.1:
   version "16.4.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.4.1.tgz#d624c4650d2c65dbd52c72622bbf389435d9776e"
 
+react-node-resolver@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/react-node-resolver/-/react-node-resolver-1.0.1.tgz#1798a729c0e218bf2f0e8ddf79c550d4af61d83a"
+
+react-popper@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.0.0.tgz#b99452144e8fe4acc77fa3d959a8c79e07a65084"
+  dependencies:
+    babel-runtime "6.x.x"
+    create-react-context "^0.2.1"
+    popper.js "^1.14.1"
+    prop-types "^15.6.1"
+    typed-styles "^0.0.5"
+    warning "^3.0.0"
+
 react-reconciler@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/react-reconciler/-/react-reconciler-0.7.0.tgz#9614894103e5f138deeeb5eabaf3ee80eb1d026d"
@@ -6527,6 +6637,17 @@ react-scrolllock@^3.0.1:
   dependencies:
     exenv "^1.2.2"
 
+react-select@^2.0.0-beta.7:
+  version "2.0.0-beta.7"
+  resolved "https://registry.yarnpkg.com/react-select/-/react-select-2.0.0-beta.7.tgz#db1183d359136d26fe56399c86d37a7f96fea33a"
+  dependencies:
+    classnames "^2.2.5"
+    emotion "^9.1.2"
+    prop-types "^15.6.0"
+    raf "^3.4.0"
+    react-input-autosize "^2.2.1"
+    react-transition-group "^2.2.1"
+
 react-side-effect@^1.1.3:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-1.1.5.tgz#f26059e50ed9c626d91d661b9f3c8bb38cd0ff2d"
@@ -7271,6 +7392,10 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
 
+source-map@^0.7.2:
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
+
 spdx-correct@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.0.0.tgz#05a5b4d7153a195bc92c3c425b69f3b2a9524c82"
@@ -7543,6 +7668,10 @@ symbol-tree@^3.2.2:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.2.tgz#ae27db38f660a7ae2e1c3b7d1bc290819b8519e6"
 
+tabbable@^1.0.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-1.1.3.tgz#0e4ee376f3631e42d7977a074dbd2b3827843081"
+
 table@^4.0.1:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/table/-/table-4.0.3.tgz#00b5e2b602f1794b9acaf9ca908a76386a7813bc"
@@ -7666,6 +7795,12 @@ toposort@^1.0.0:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/toposort/-/toposort-1.0.6.tgz#c31748e55d210effc00fdcdc7d6e68d7d7bb9cec"
 
+touch@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/touch/-/touch-1.0.0.tgz#449cbe2dbae5a8c8038e30d71fa0ff464947c4de"
+  dependencies:
+    nopt "~1.0.10"
+
 tough-cookie@>=2.3.3, tough-cookie@^2.3.3, tough-cookie@~2.3.0, tough-cookie@~2.3.3:
   version "2.3.4"
   resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.3.4.tgz#ec60cee38ac675063ffc97a5c18970578ee83655"
@@ -7744,6 +7879,10 @@ type-is@~1.6.15, type-is@~1.6.16:
     media-typer "0.3.0"
     mime-types "~2.1.18"
 
+typed-styles@^0.0.5:
+  version "0.0.5"
+  resolved "https://registry.yarnpkg.com/typed-styles/-/typed-styles-0.0.5.tgz#a60df245d482a9b1adf9c06c078d0f06085ed1cf"
+
 typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"