luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Allow ValueSelector to clear

Browse source
This commit is contained in:
Chen-I Lim 2021-02-01 13:42:21 -08:00
parent 8c95e59b48
commit 12846ccc38
1 changed files with 7 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
webapp/src/widgets/valueSelector.tsx
View file

@ -32,18 +32,18 @@ type State = {
} }
class ValueSelector extends React.Component<Props, State> { class ValueSelector extends React.Component<Props, State> {
public constructor(props: Props) { constructor(props: Props) {
super(props) super(props)
this.state = { this.state = {
activated: false, activated: false,
} }
} }
public shouldComponentUpdate(): boolean { shouldComponentUpdate(): boolean {
return true return true
} }
renderLabel = (option: IPropertyOption, meta: FormatOptionLabelMeta<IPropertyOption>): React.ReactNode => { private renderLabel = (option: IPropertyOption, meta: FormatOptionLabelMeta<IPropertyOption>): React.ReactNode => {
if (meta.context === 'value') { if (meta.context === 'value') {
return <span className={`octo-label ${option.color}`} >{option.value}</span> return <span className={`octo-label ${option.color}`} >{option.value}</span>
} }
@ -76,7 +76,7 @@ class ValueSelector extends React.Component<Props, State> {
) )
} }
public render(): JSX.Element { render(): JSX.Element {
if (!this.state.activated) { if (!this.state.activated) {
return ( return (
<div <div
@ -91,6 +91,7 @@ class ValueSelector extends React.Component<Props, State> {
} }
return ( return (
<CreatableSelect <CreatableSelect
isClearable={true}
styles={{ styles={{
indicatorsContainer: (provided: CSSProperties): CSSProperties => ({ indicatorsContainer: (provided: CSSProperties): CSSProperties => ({
...provided, ...provided,
@ -138,6 +139,8 @@ class ValueSelector extends React.Component<Props, State> {
onChange={(value: ValueType<IPropertyOption>, action: ActionMeta<IPropertyOption>): void => { onChange={(value: ValueType<IPropertyOption>, action: ActionMeta<IPropertyOption>): void => {
if (action.action === 'select-option') { if (action.action === 'select-option') {
this.props.onChange((value as IPropertyOption).id) this.props.onChange((value as IPropertyOption).id)
} else if (action.action === 'clear') {
this.props.onChange('')
} }
}} }}
onCreateOption={this.props.onCreate} onCreateOption={this.props.onCreate}