Type Alias SelectProps<V>Unreviewed

Type Declaration

• {
      selection?: "single";
      value?: V | null;
      defaultValue?: V | null;
      onValueChange?: (value: V | null, attrs: SelectChangeAttrs<V>) => void;
  }

  • Optional Unreviewedselection?: "single"

    Selection mode. 'single' (the default) keeps value a single value and closes the menu on pick. Switch to 'multiple' for checkboxes + an array value.

    Default Value

    single
    Copy

  • Optional Unreviewedvalue?: V | null

    Controlled option value. Use null for an empty selection; clearing to null keeps the Select controlled. Omit or pass undefined for uncontrolled use; release retains the latest selection. Empty strings, 0, and false remain option values.

  • Optional UnrevieweddefaultValue?: V | null

    Initial option value for uncontrolled use. null starts empty.

  • Optional UnreviewedonValueChange?: (value: V | null, attrs: SelectChangeAttrs<V>) => void

    Reports the new value and a { value, option } snapshot after a pick. Clear reports null with { all: true, selected: false }. Narrow on 'all' in attrs before reading option. Update value to accept a controlled change. There is no cancelable onStateChange; see the Input event-model note.

• {
      selection: "multiple";
      value?: V[];
      defaultValue?: V[];
      onValueChange?: (value: V[], attrs: SelectChangeAttrs<V>) => void;
  }

  • Unreviewedselection: "multiple"

    Multi-select: checkboxes on every row, the menu stays open while toggling, the field shows an "N selected" count, and value is an array.

  • Optional Unreviewedvalue?: V[]

    Controlled option values. Use [] for an empty selection. Omit or pass undefined for uncontrolled use; release retains the latest array. Inline arrays work correctly. For a derived array, useMemo can avoid an extra component render when the parent renders with unchanged inputs. Pass arrays held in state directly. Update memo dependencies immutably.

    Example: Memoize a derived selection

     import { useMemo } from 'react'
     import { Select } from '@antadesign/anta'
    
     function TeamFilter({ teamIds, onChange }: {
       teamIds: ReadonlySet<string>
       onChange: (ids: string[]) => void
     }) {
       const value = useMemo(() => [...teamIds], [teamIds])
       return <Select<string> label="Teams" selection="multiple"
         options={['design', 'engineering']} value={value}
         onValueChange={onChange} />
     }
    Copy

  • Optional UnrevieweddefaultValue?: V[]

    Initial values (option values) for the uncontrolled case.

  • Optional UnreviewedonValueChange?: (value: V[], attrs: SelectChangeAttrs<V>) => void

    Reports the new value array and a { value, option, selected } snapshot after a row toggle. Select all and Clear report { all: true, selected } without a single option. Narrow on 'all' in attrs before reading option. Update value to accept a controlled change.