diff --git a/packages/grafana-ui/src/components/Cascader/Cascader.tsx b/packages/grafana-ui/src/components/Cascader/Cascader.tsx index a475bf66be4..15eefa07151 100644 --- a/packages/grafana-ui/src/components/Cascader/Cascader.tsx +++ b/packages/grafana-ui/src/components/Cascader/Cascader.tsx @@ -13,6 +13,8 @@ interface CascaderProps { separator?: string; placeholder?: string; options: CascaderOption[]; + /** Changes the value for every selection, including branch nodes. Defaults to true. */ + changeOnSelect?: boolean; onSelect(val: string): void; /** Sets the width to a multiple of 8px. Should only be used with inline forms. Setting width of the container is preferred in other cases.*/ width?: number; @@ -69,6 +71,8 @@ export class Cascader extends React.PureComponent }; } + static defaultProps = { changeOnSelect: true }; + flattenOptions = (options: CascaderOption[], optionPath: CascaderOption[] = []) => { let selectOptions: Array> = []; for (const option of options) { @@ -174,7 +178,7 @@ export class Cascader extends React.PureComponent }; render() { - const { allowCustomValue, placeholder, width } = this.props; + const { allowCustomValue, placeholder, width, changeOnSelect } = this.props; const { focusCascade, isSearching, searchableOptions, rcValue, activeLabel } = this.state; return ( @@ -195,7 +199,7 @@ export class Cascader extends React.PureComponent { width={width} initialValue={current && current.label} allowCustomValue + changeOnSelect={false} formatCreateLabel={formatCreateLabel} options={groupOptions as CascaderOption[]} placeholder="Choose"