diff --git a/packages/orbit-components/src/InputSelect/InputSelect.ct-story.tsx b/packages/orbit-components/src/InputSelect/InputSelect.ct-story.tsx index e1c00e17f4..a1ee5b7496 100644 --- a/packages/orbit-components/src/InputSelect/InputSelect.ct-story.tsx +++ b/packages/orbit-components/src/InputSelect/InputSelect.ct-story.tsx @@ -60,23 +60,35 @@ const advancedOptions = [ export function InputSelectStory() { return (
- - + + - - + + - - + +
); } @@ -84,7 +96,7 @@ export function InputSelectStory() { export function InputSelectDropdownStory() { return (
- +
); } @@ -92,7 +104,13 @@ export function InputSelectDropdownStory() { export function InputSelectDropdownSizesStory() { return (
- +
); } @@ -100,7 +118,7 @@ export function InputSelectDropdownSizesStory() { export function InputSelectDropdownEmptyStory() { return (
- +
); } @@ -108,7 +126,7 @@ export function InputSelectDropdownEmptyStory() { export function InputSelectDropdownGroupsStory() { return (
- +
); } diff --git a/packages/orbit-components/src/InputSelect/InputSelect.stories.tsx b/packages/orbit-components/src/InputSelect/InputSelect.stories.tsx index 6a7713a760..60f3e54378 100644 --- a/packages/orbit-components/src/InputSelect/InputSelect.stories.tsx +++ b/packages/orbit-components/src/InputSelect/InputSelect.stories.tsx @@ -58,6 +58,7 @@ export const Grouped = () => { onChange={action("onChange")} onOptionSelect={action("onOptionSelect")} showAll={showAll} + readOnly /> ); @@ -116,6 +117,7 @@ export const PreviouslySelected = () => { prevSelected={currencyOptions[2]} prevSelectedLabel={prevSelectedLabel} defaultSelected={currencyOptions[2]} + readOnly /> ); @@ -236,6 +238,7 @@ export const Playground = () => { emptyState={emptyStateMessage} showAll={showAll} showAllLabel={showAllLabel} + readOnly /> ); diff --git a/packages/orbit-components/src/InputSelect/__tests__/index.test.tsx b/packages/orbit-components/src/InputSelect/__tests__/index.test.tsx index 3a25e5183a..cf8afa9820 100644 --- a/packages/orbit-components/src/InputSelect/__tests__/index.test.tsx +++ b/packages/orbit-components/src/InputSelect/__tests__/index.test.tsx @@ -62,6 +62,7 @@ describe("InputSelect", () => { onOptionSelect={onOptionSelect} onChange={onChange} onClose={onClose} + readOnly />, ); @@ -148,6 +149,7 @@ describe("InputSelect", () => { defaultSelected={jetLiOption} onClose={onClose} onOptionSelect={onOptionSelect} + readOnly />, ); @@ -182,6 +184,7 @@ describe("InputSelect", () => { defaultSelected={jetLiOption} onClose={onClose} onOptionSelect={onOptionSelect} + readOnly />, ); @@ -206,6 +209,7 @@ describe("InputSelect", () => { name={name} prevSelected={jetLiOption} prevSelectedLabel={prevSelectedLabel} + readOnly />, ); @@ -219,7 +223,9 @@ describe("InputSelect", () => { describe("when showAll is false", () => { it("should not render repeated options", async () => { const showAllLabel = "Those without a group"; - render(); + render( + , + ); await user.tab(); // after focus dropdown should have all options grouped and then show only the ones without a group