diff --git a/.changeset/lazy-lobsters-fix.md b/.changeset/lazy-lobsters-fix.md new file mode 100644 index 000000000..727fa6f34 --- /dev/null +++ b/.changeset/lazy-lobsters-fix.md @@ -0,0 +1,5 @@ +--- +'@orchestrator-ui/orchestrator-ui-components': patch +--- + +Adjust start task combobox size, so it doesn't hide list items diff --git a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartButtonComboBox.tsx b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartButtonComboBox.tsx index 187ea96c2..cffe54da8 100644 --- a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartButtonComboBox.tsx +++ b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartButtonComboBox.tsx @@ -13,6 +13,7 @@ export type WfoStartButtonComboBoxProps = { options: StartComboBoxOption[]; onOptionChange: (selectedOption: StartComboBoxOption) => void; isProcess: boolean; + className?: string; }; export const WfoStartButtonComboBox = ({ @@ -20,6 +21,7 @@ export const WfoStartButtonComboBox = ({ options, onOptionChange, isProcess, + className, }: WfoStartButtonComboBoxProps) => { const [isPopoverOpen, setPopoverOpen] = useState(false); const { theme, isDarkThemeActive } = useOrchestratorTheme(); @@ -48,12 +50,14 @@ export const WfoStartButtonComboBox = ({ closePopover={() => setPopoverOpen(false)} > + className={className} css={selectableStyle} searchable options={options} onChange={(_, __, changedOption) => onOptionChange(changedOption) } + height={200} > {(list, search) => ( <> diff --git a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartTaskComboBox.tsx b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartTaskComboBox.tsx index 8bc71a905..18a5bf4e6 100644 --- a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartTaskComboBox.tsx +++ b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartTaskComboBox.tsx @@ -42,6 +42,7 @@ export const WfoStartTaskButtonComboBox = () => { options={comboBoxOptions} onOptionChange={handleOptionChange} isProcess={false} + css={{ width: '600px' }} /> ); }; diff --git a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartWorkflowComboBox.tsx b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartWorkflowComboBox.tsx index 709b57787..bf1c7bf22 100644 --- a/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartWorkflowComboBox.tsx +++ b/packages/orchestrator-ui-components/src/components/WfoStartButton/WfoStartWorkflowComboBox.tsx @@ -44,6 +44,7 @@ export const WfoStartWorkflowButtonComboBox = () => { options={comboBoxOptions} onOptionChange={handleOptionChange} isProcess + css={{ width: '300px' }} /> ); }; diff --git a/packages/orchestrator-ui-components/src/components/WfoStartButton/styles.ts b/packages/orchestrator-ui-components/src/components/WfoStartButton/styles.ts index 50843b5f2..d5f406e8d 100644 --- a/packages/orchestrator-ui-components/src/components/WfoStartButton/styles.ts +++ b/packages/orchestrator-ui-components/src/components/WfoStartButton/styles.ts @@ -3,11 +3,7 @@ import { css } from '@emotion/react'; import { WfoTheme } from '@/hooks'; export const getStyles = ({ theme }: WfoTheme) => { - const comboBoxWidth = '300px'; - const selectableStyle = css({ - width: comboBoxWidth, - '.euiFieldSearch': { backgroundColor: theme.colors.body, color: theme.colors.text, diff --git a/packages/orchestrator-ui-components/src/configuration/version.ts b/packages/orchestrator-ui-components/src/configuration/version.ts index 4272bd09e..18613a50d 100644 --- a/packages/orchestrator-ui-components/src/configuration/version.ts +++ b/packages/orchestrator-ui-components/src/configuration/version.ts @@ -1 +1 @@ -export const ORCHESTRATOR_UI_LIBRARY_VERSION = '1.38.0'; +export const ORCHESTRATOR_UI_LIBRARY_VERSION = '1.38.1';