category: packages

ui-select

A component for select and autocomplete behavior.

Components

The ui-select package contains the following:

• Select

Installation

npm install @instructure/ui-select

Usage

import React from 'react'
import { Select } from '@instructure/ui-select'

const MySelect = () => {
  return (
    <Select>
      <Select.Option>Option one</Select.Option>
      <Select.Option>Option two</Select.Option>
    </Select>
  )
}

For detailed usage and documentation, see Select examples.

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

10.22.0 (2025-07-04)

Note: Version bump only for package @instructure/ui-select

10.21.0 (2025-06-27)

Bug Fixes

• ui-select: prevent scrolling when last item is hovered in Chrome (51cd81a)

Features

• ui-simple-select,ui-select: add layout prop to Select and SimpleSelect (94f0a6f)

10.20.1 (2025-06-17)

Note: Version bump only for package @instructure/ui-select

10.20.0 (2025-06-13)

Bug Fixes

• many: update dependencies, browsersdb and moment timezone database (3813636)
• ui-time-select,ui-simple-select,ui-select: add missing keyboard interactions and fix duplicate SR announcements (0f7ffa5)

10.19.1 (2025-06-05)

Bug Fixes

• ui-utils,ui-select: make screenreader annouce disabled Select as dimmed in Chrome (c547c31)

10.19.0 (2025-06-03)

Bug Fixes

• many: fix "not a valid selector" exception when an option ID contains quotes (78e0b96)

10.18.1 (2025-05-29)

Note: Version bump only for package @instructure/ui-select

10.18.0 (2025-05-26)

Note: Version bump only for package @instructure/ui-select

10.17.0 (2025-05-20)

Note: Version bump only for package @instructure/ui-select

10.16.4 (2025-05-09)

Note: Version bump only for package @instructure/ui-select

10.16.3 (2025-04-30)

Bug Fixes

• ui-time-select,ui-simple-select,ui-select: make Select accessible for iOS VoiceOver (b501a7b)

10.16.2 (2025-04-22)

Note: Version bump only for package @instructure/ui-select

10.16.1 (2025-04-22)

Bug Fixes

• ui-select,ui-form-field: fix iOS VoiceOver with Select and SimpleSelect announcing 'readonly' and 'textinput' (d4378e7)

10.16.0 (2025-04-11)

Note: Version bump only for package @instructure/ui-select

10.15.2 (2025-04-07)

Note: Version bump only for package @instructure/ui-select

10.15.1 (2025-04-03)

Note: Version bump only for package @instructure/ui-select

10.15.0 (2025-03-31)

Note: Version bump only for package @instructure/ui-select

10.14.0 (2025-03-17)

Note: Version bump only for package @instructure/ui-select

10.13.0 (2025-03-06)

Bug Fixes

• many: fix form label not read by NVDA in hover mode and other layout issues (ef77281)

10.12.0 (2025-02-24)

Bug Fixes

• ui-select: fix select's dropdown border radius (7427773)

Features

• ui-popover, ui-select: allow overriding Select's dropdown border (90d59d3)
• ui-select,ui-simple-select: add support for rendering selected option's before and after content in Select and SimpleSelect input (87dc52d)

10.11.0 (2025-02-03)

Note: Version bump only for package @instructure/ui-select

10.10.0 (2024-12-18)

Note: Version bump only for package @instructure/ui-select

10.9.0 (2024-12-12)

Features

• many: make meta package export every component and type definition (dee9abb)
• shared-types,ui-options,ui-select: allow to change font weight of selected option item in Select (6818928)

10.8.0 (2024-12-09)

Bug Fixes

• ui-select,ui-text-input: fix long before elements overflowing in TextInput, Select, SimpleSelect (ee9cafd)

10.7.0 (2024-12-03)

Note: Version bump only for package @instructure/ui-select

10.6.1 (2024-11-26)

Note: Version bump only for package @instructure/ui-select

10.6.0 (2024-11-18)

Bug Fixes

• many: fix regression where form elements without label got misaligned (139f7f1)

10.5.0 (2024-11-07)

Features

• many: add new form field error msg style + add asterisk for required fields (9b03683)

10.4.1 (2024-10-28)

Bug Fixes

• update license (1c039d9)

10.4.0 (2024-10-16)

Note: Version bump only for package @instructure/ui-select

10.3.0 (2024-10-03)

Note: Version bump only for package @instructure/ui-select

10.2.2 (2024-09-13)

Note: Version bump only for package @instructure/ui-select

10.2.1 (2024-08-30)

Note: Version bump only for package @instructure/ui-select

10.2.0 (2024-08-23)

Note: Version bump only for package @instructure/ui-select

10.1.0 (2024-08-23)

Note: Version bump only for package @instructure/ui-select

10.0.0 (2024-07-31)

Features

• many: rewrite color system (1e5809e)

BREAKING CHANGES

• many: Breaks color overrides in certain cases

9.5.1 (2024-07-30)

Note: Version bump only for package @instructure/ui-select

9.5.0 (2024-07-26)

Note: Version bump only for package @instructure/ui-select

9.4.0 (2024-07-26)

Note: Version bump only for package @instructure/ui-select

9.3.0 (2024-07-17)

Note: Version bump only for package @instructure/ui-select

9.2.0 (2024-07-09)

Note: Version bump only for package @instructure/ui-select

9.1.0 (2024-06-14)

Features

• shared-types,ui-calendar,ui-select: add yearpicker functionality to calendar (2c0c6e0)

9.0.1 (2024-05-09)

Note: Version bump only for package @instructure/ui-select

9.0.0 (2024-05-09)

Note: Version bump only for package @instructure/ui-select

8.56.0 (2024-05-06)

Note: Version bump only for package @instructure/ui-select

8.55.1 (2024-04-30)

Note: Version bump only for package @instructure/ui-select

8.55.0 (2024-04-09)

Note: Version bump only for package @instructure/ui-select

8.54.0 (2024-03-21)

Features

• ui-select: expose prop to control auto-scrolling in select component (7cd4c22)

8.53.2 (2024-02-15)

Note: Version bump only for package @instructure/ui-select

8.53.1 (2024-02-09)

Note: Version bump only for package @instructure/ui-select

8.53.0 (2024-02-08)

Note: Version bump only for package @instructure/ui-select

8.52.0 (2024-02-02)

Bug Fixes

• shared-types: extend OtherHTMLAttributes with Element (474fa4d)

8.51.0 (2023-12-14)

Note: Version bump only for package @instructure/ui-select

8.50.0 (2023-12-05)

Note: Version bump only for package @instructure/ui-select

8.49.0 (2023-11-24)

Note: Version bump only for package @instructure/ui-select

8.48.3 (2023-11-23)

Note: Version bump only for package @instructure/ui-select

8.48.2 (2023-11-21)

Note: Version bump only for package @instructure/ui-select

8.48.1 (2023-11-17)

Note: Version bump only for package @instructure/ui-select

8.48.0 (2023-11-10)

Note: Version bump only for package @instructure/ui-select

8.47.1 (2023-11-06)

Note: Version bump only for package @instructure/ui-select

8.47.0 (2023-10-27)

Note: Version bump only for package @instructure/ui-select

8.46.1 (2023-10-13)

Note: Version bump only for package @instructure/ui-select

8.46.0 (2023-10-11)

Note: Version bump only for package @instructure/ui-select

8.45.0 (2023-10-03)

Note: Version bump only for package @instructure/ui-select

8.44.0 (2023-09-21)

Bug Fixes

• ui-select,ui-simple-select: add new tests (e156baa)
• ui-select: add workaround for safari combobox (09987bb)

8.43.1 (2023-09-11)

Note: Version bump only for package @instructure/ui-select

8.43.0 (2023-09-07)

Note: Version bump only for package @instructure/ui-select

8.42.0 (2023-09-07)

Note: Version bump only for package @instructure/ui-select

8.41.1 (2023-08-24)

Note: Version bump only for package @instructure/ui-select

8.41.0 (2023-08-21)

Note: Version bump only for package @instructure/ui-select

8.40.1 (2023-08-18)

Note: Version bump only for package @instructure/ui-select

8.40.0 (2023-08-17)

Note: Version bump only for package @instructure/ui-select

8.39.0 (2023-07-21)

Note: Version bump only for package @instructure/ui-select

8.38.1 (2023-06-13)

Note: Version bump only for package @instructure/ui-select

8.38.0 (2023-05-15)

Note: Version bump only for package @instructure/ui-select

8.37.0 (2023-04-25)

Performance Improvements

• ui-select: improve perf for large amount of items (396a13b)

8.36.0 (2023-03-23)

Note: Version bump only for package @instructure/ui-select

8.35.1 (2023-03-10)

Note: Version bump only for package @instructure/ui-select

8.35.0 (2023-02-17)

Note: Version bump only for package @instructure/ui-select

8.34.0 (2023-02-10)

Note: Version bump only for package @instructure/ui-select

8.33.2 (2023-01-25)

Note: Version bump only for package @instructure/ui-select

8.33.1 (2023-01-06)

Note: Version bump only for package @instructure/ui-select

8.33.0 (2023-01-04)

Note: Version bump only for package @instructure/ui-select

8.32.1 (2022-12-01)

Note: Version bump only for package @instructure/ui-select

8.32.0 (2022-11-23)

Note: Version bump only for package @instructure/ui-select

8.31.0 (2022-11-21)

Note: Version bump only for package @instructure/ui-select

8.30.0 (2022-10-26)

Note: Version bump only for package @instructure/ui-select

8.29.0 (2022-09-29)

Note: Version bump only for package @instructure/ui-select

8.28.2 (2022-09-16)

Note: Version bump only for package @instructure/ui-select

8.28.1 (2022-09-12)

Note: Version bump only for package @instructure/ui-select

8.28.0 (2022-09-02)

Note: Version bump only for package @instructure/ui-select

8.27.0 (2022-07-25)

Features

• support React 18 (0a2bf0c)

8.26.3 (2022-07-14)

Bug Fixes

• ui-color-picker,ui-date-input,ui-date-time-input,ui-select,ui-simple-select,ui-text-input,ui-time-select: before/after elements should inherit input color (7daf257)

8.26.2 (2022-07-11)

Note: Version bump only for package @instructure/ui-select

8.26.1 (2022-07-06)

Note: Version bump only for package @instructure/ui-select

8.26.0 (2022-06-30)

Note: Version bump only for package @instructure/ui-select

8.25.0 (2022-06-03)

Note: Version bump only for package @instructure/ui-select

8.24.5 (2022-05-31)

Note: Version bump only for package @instructure/ui-select

8.24.4 (2022-05-27)

Note: Version bump only for package @instructure/ui-select

8.24.3 (2022-05-25)

Note: Version bump only for package @instructure/ui-select

8.24.2 (2022-05-02)

Note: Version bump only for package @instructure/ui-select

8.24.1 (2022-04-29)

Note: Version bump only for package @instructure/ui-select

8.24.0 (2022-04-26)

Note: Version bump only for package @instructure/ui-select

8.23.0 (2022-04-07)

Note: Version bump only for package @instructure/ui-select

8.22.0 (2022-03-31)

Note: Version bump only for package @instructure/ui-select

8.21.0 (2022-03-30)

Note: Version bump only for package @instructure/ui-select

8.20.0 (2022-03-22)

Note: Version bump only for package @instructure/ui-select

8.19.0 (2022-03-16)

Note: Version bump only for package @instructure/ui-select

8.18.0 (2022-02-23)

Note: Version bump only for package @instructure/ui-select

8.17.0 (2022-02-07)

Bug Fixes

• remove type:"commonjs" from package.json files (0b243be)

8.16.0 (2022-02-03)

Features

• ui-select: add optionsMaxHeight prop to Select (cf361bf)

8.15.0 (2022-01-26)

Note: Version bump only for package @instructure/ui-select

8.14.0 (2021-12-16)

Note: Version bump only for package @instructure/ui-select

8.13.0 (2021-12-01)

Features

• canvas-theme,ui-theme-tokens,ui-themes: update canvas theme colors (a72237d)
• ui-form-field: make FormField messages accept ReactNode text, not just string (4d36973)

8.12.0 (2021-11-17)

Note: Version bump only for package @instructure/ui-select

8.11.1 (2021-10-19)

Bug Fixes

• ui-options,ui-select,ui-simple-select: fix icon positioning (8536a1c)

8.11.0 (2021-10-15)

Note: Version bump only for package @instructure/ui-select

8.10.2 (2021-10-01)

Note: Version bump only for package @instructure/ui-select

8.10.1 (2021-10-01)

Note: Version bump only for package @instructure/ui-select

8.10.0 (2021-09-28)

Note: Version bump only for package @instructure/ui-select

8.9.1 (2021-09-16)

Note: Version bump only for package @instructure/ui-select

8.9.0 (2021-09-15)

Bug Fixes

• fix shared-types TS errors (7b83164)

8.8.0 (2021-08-27)

Note: Version bump only for package @instructure/ui-select

8.7.0 (2021-07-16)

Features

• add support for React 17 (f647826)

8.6.0 (2021-06-18)

Features

• ui-select,ui-simple-select: pass option props to the label before/after render prop (d548752)

8.5.0 (2021-06-09)

Bug Fixes

• emotion: add componentId to match with componenet name in docs (cc255eb)

8.4.0 (2021-05-11)

Bug Fixes

• fix all inter-package dependencies using fix version (75cd898)

8.3.0 (2021-05-04)

Note: Version bump only for package @instructure/ui-select

8.2.1 (2021-04-22)

Note: Version bump only for package @instructure/ui-select

8.2.0 (2021-04-22)

Note: Version bump only for package @instructure/ui-select

8.1.0 (2021-04-15)

Bug Fixes

• ui-select: fix null pointer exception in Select (04ae3a4)

8.0.0 (2021-03-29)

Code Refactoring

• Migrated the package and it's component(s) from using ui-themeable to using the new theming solution based on emotion.js.
• emotion,ui-themeable: move ThemeablePropValues and ThemeablePropTypes util to emotion pack (2d0ac1d)

BREAKING CHANGES

• emotion,ui-themeable: Moved ThemeablePropValues and ThemeablePropTypes utils from ui-themeableto emotion package.

7.5.0 (2021-03-22)

Note: Version bump only for package @instructure/ui-select

7.4.4 (2021-03-12)

Note: Version bump only for package @instructure/ui-select

7.4.3 (2021-03-11)

Note: Version bump only for package @instructure/ui-select

7.4.2 (2021-03-11)

Note: Version bump only for package @instructure/ui-select

7.4.1 (2021-03-04)

Bug Fixes

• all: Fix package imports, now everything can be imported; fix test:all in main package.json (2f11024)

7.4.0 (2021-02-01)

Note: Version bump only for package @instructure/ui-select

7.3.5 (2021-01-21)

Bug Fixes

• esm: specify "exports" in package manifests (6007684)

7.3.4 (2021-01-14)

Bug Fixes

• esm: specify "exports" in package manifests (6007684)

7.3.3 (2021-01-13)

Bug Fixes

• esm: specify "exports" in package manifests (6007684)

7.3.2 (2020-12-10)

Note: Version bump only for package @instructure/ui-select

7.3.1 (2020-11-30)

Note: Version bump only for package @instructure/ui-select

7.3.0 (2020-10-26)

Note: Version bump only for package @instructure/ui-select

7.2.4 (2020-10-09)

Note: Version bump only for package @instructure/ui-select

7.2.3 (2020-10-08)

Note: Version bump only for package @instructure/ui-select

7.2.2 (2020-10-08)

Note: Version bump only for package @instructure/ui-select

7.2.1 (2020-10-07)

Note: Version bump only for package @instructure/ui-select

7.2.0 (2020-09-23)

Note: Version bump only for package @instructure/ui-select

7.1.4 (2020-09-09)

Note: Version bump only for package @instructure/ui-select

7.1.3 (2020-08-10)

Note: Version bump only for package @instructure/ui-select

7.1.2 (2020-07-17)

Note: Version bump only for package @instructure/ui-select

7.1.1 (2020-07-01)

Note: Version bump only for package @instructure/ui-select

7.1.0 (2020-06-25)

Note: Version bump only for package @instructure/ui-select

7.0.0 (2020-05-27)

chore

• bump minimum react version to 16.8.0 (7a96f00)
• remove references to React 15 (4bb2426)

Features

• remove 'experimental' tag along with '__dangerouslyIgnore...' (92bf753)
• ui-docs-client: Docs/homepage refresh (ee4957b)

BREAKING CHANGES

• • Minimum react and react-dom version raised to 16.8.0

TEST PLAN:

• no regressions in docs app
• homepage should note the react version change
• automated tests should pass

Change-Id: I7cd9dd6423fb9524e0a1a0dd490caeee3a2c2c17 Reviewed-on: https://gerrit.instructure.com/c/instructure-ui/+/237727 Tested-by: Service Cloud Jenkins svc.cloudjenkins@instructure.com Reviewed-by: Chris Guerrero cguerrero@instructure.com Product-Review: Steve Jensen sejensen@instructure.com QA-Review: Daniel Sasaki dsasaki@instructure.com Visual-Regression-Test: Ken Meleta kmeleta@instructure.com

• Dropping support for React 15.

TEST PLAN:

• yarn dev/yarn start should work
• yarn test/test:watch should work
• there should be no mention of react 15 in code
• there should be nothing depending on react 15 or reactDOM 15

Change-Id: I2c054c986421014ffe15f0402e14bd2725cbc267 Reviewed-on: https://gerrit.instructure.com/c/instructure-ui/+/229009 Tested-by: Service Cloud Jenkins svc.cloudjenkins@instructure.com QA-Review: Daniel Sasaki dsasaki@instructure.com Visual-Regression-Test: Ken Meleta kmeleta@instructure.com Reviewed-by: Steve Jensen sejensen@instructure.com Product-Review: Steve Jensen sejensen@instructure.com

6.26.0 (2020-04-30)

Note: Version bump only for package @instructure/ui-select

6.25.0 (2020-04-27)

Note: Version bump only for package @instructure/ui-select

6.24.0 (2020-04-14)

Note: Version bump only for package @instructure/ui-select

6.23.0 (2020-04-02)

Features

• ui-docs-client: update deprecated components still in use (4543717)
• ui-select,ui-text-input: allow size attr on Select/TextInput (025a564)

6.22.0 (2020-03-16)

Features

• ui-select: allow override of autocomplete attr in Select (41e09ac)
• ui-select,ui-simple-select: add mountNode prop to Select (a8b60a6)

6.21.0 (2020-02-26)

Features

• ui-select: Add a SimpleSelect component (a7ed234)

6.20.0 (2020-02-13)

Note: Version bump only for package @instructure/ui-select

6.19.0 (2020-02-11)

Bug Fixes

• ui-select: ensure Select.Group imports .Option (8dc609f)

Features

• undeprecate disabled and readOnly in inputs (79cf68f)

6.18.0 (2020-02-04)

Note: Version bump only for package @instructure/ui-select

6.17.0 (2020-01-22)

Bug Fixes

• Update Package READMEs and align deprecation statements (8f892e4)

6.16.0 (2019-12-13)

Note: Version bump only for package @instructure/ui-select

6.15.0 (2019-11-18)

Bug Fixes

• ui-select: prevent cursor for uneditable selects (2e2540a)

Features

• Move React to a peer dependency (9648ca3)
• ui-popover: make ui-popover backwards compatible (d9437ae)
• ui-view: Make ui-view backwards-compatible (7dd2a2f)

6.14.0 (2019-10-14)

Features

• ui-position: add ui-position package (5511a88)

6.13.0 (2019-09-24)

Note: Version bump only for package @instructure/ui-select

6.12.0 (2019-09-17)

Note: Version bump only for package @instructure/ui-select

6.11.0 (2019-09-16)

Features

• ui-popover: Add ui-popover package (62c1165)
• ui-react-utils: add flag to suppress experimental warnings (d30e678)
• ui-view: add ui-view Package for View Component (7799577)
• ui-view: mark ui-view as experimental (6b805fa)

6.10.0 (2019-08-27)

Note: Version bump only for package @instructure/ui-select

6.9.0 (2019-08-07)

Note: Version bump only for package @instructure/ui-select

6.8.1 (2019-08-02)

Note: Version bump only for package @instructure/ui-select

6.8.0 (2019-07-31)

Bug Fixes

• ui-select,ui-selectable: stop event propagation from selectable (fc75997)

6.7.0 (2019-07-15)

Note: Version bump only for package @instructure/ui-select

6.6.0 (2019-07-03)

Note: Version bump only for package @instructure/ui-select

6.5.0 (2019-07-01)

Bug Fixes

• ui-select: scroll logic and example updates (fd91714)
• ui-text-input: update TextInput prop names (3aedab8)

6.4.0 (2019-06-13)

Features

• ui-forms,ui-selectable: deprecate ui-forms select (1f7b53d)
• ui-select: add controlled select (634ab1a)

See the instructure-ui mono-repo change log for past changes.