Skip to content

ControlBar TypeScript error: No overload matches this call #3523

@PhaedrusTheGreek

Description

@PhaedrusTheGreek

ControlBar demos don't work when pasted into a new tsx file

EUI: 24.0.0

TypeScript error in /path/to/control-bar.tsx(94,22):
No overload matches this call.
  Overload 1 of 2, '(props: Readonly<EuiControlBarProps>): EuiControlBar', gave the following error.
    Type '({ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; } | ... 5 more ... | { ...; })[]' is not assignable to type '((DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<ButtonControlProps, (DisambiguateSet<BreadcrumbControl, TabControl> & ButtonHTMLAttributes<...> & { ...; }) | (DisambiguateSet<...> & BreadcrumbControl)> & DisambiguateSet<...> & ButtonHTMLAttributes<...> & { ...; }) | (Disambiguat...'.
      Type '{ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; } | ... 5 more ... | { ...; }' is not assignable to type '(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<ButtonControlProps, (DisambiguateSet<BreadcrumbControl, TabControl> & ButtonHTMLAttributes<...> & { ...; }) | (DisambiguateSet<...> & BreadcrumbControl)> & DisambiguateSet<...> & ButtonHTMLAttributes<...> & { ...; }) | (Disambiguate...'.
        Type '{ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; }' is not assignable to type '(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<ButtonControlProps, (DisambiguateSet<BreadcrumbControl, TabControl> & ButtonHTMLAttributes<...> & { ...; }) | (DisambiguateSet<...> & BreadcrumbControl)> & DisambiguateSet<...> & ButtonHTMLAttributes<...> & { ...; }) | (Disambiguate...'.
          Type '{ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; }' is not assignable to type 'DisambiguateSet<SpacerControl, (DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<ButtonControlProps, (DisambiguateSet<BreadcrumbControl, TabControl> & ButtonHTMLAttributes<...> & { ...; }) | (DisambiguateSet<...> & BreadcrumbControl)> & DisambiguateSet<...> & ButtonHTMLAttributes<...> & { ...; }) |...'.
            Type '{ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; }' is not assignable to type 'ButtonControl'.
              Property 'label' is optional in type '{ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; }' but required in type 'ButtonControl'.
  Overload 2 of 2, '(props: EuiControlBarProps, context?: any): EuiControlBar', gave the following error.
    Type '({ controlType: string; id: string; iconType: string; 'aria-label': string; responsive?: undefined; breadcrumbs?: undefined; color?: undefined; text?: undefined; onClick?: undefined; title?: undefined; label?: undefined; } | ... 5 more ... | { ...; })[]' is not assignable to type '((DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<(DisambiguateSet<ButtonControlProps, (DisambiguateSet<BreadcrumbControl, TabControl> & ButtonHTMLAttributes<...> & { ...; }) | (DisambiguateSet<...> & BreadcrumbControl)> & DisambiguateSet<...> & ButtonHTMLAttributes<...> & { ...; }) | (Disambiguat...'.  TS2769

    92 |   if (isDisplaying) {
    93 |     display = (
  > 94 |       <EuiControlBar controls={codeControls} showContent={contentIsVisible}>
       |                      ^
    95 |         <div style={{ padding: '2rem', maxWidth: '60rem', margin: '0 auto' }}>
    96 |           <EuiPanel>
    97 |             <EuiText> 

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions