Variable SmartSuggestConst

SmartSuggest: __VLS_WithTemplateSlots<DefineComponent<__VLS_TypePropsToRuntimeProps<{
    triggers: Trigger[];
}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
    select: ((item) => void);
    open: (() => void);
    close: (() => void);
}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
    triggers: Trigger[];
}>>> & {
    onSelect?: ((item) => any);
    onClose?: (() => any);
    onOpen?: (() => any);
}, {}, {}>, {
    default?(_): any;
    dropdown?(_): any;
    item?(_): any;
    no-result?(_): any;
}>

Component responsible for handling the input and displaying the dropdown. Accepts a list of triggers which are used to determine when to open the dropdown. It should have a single child element which is the input element (@see AcceptedInputType for supported types).

Based on your need, you can customize the dropdown items (SmartSuggestItem) or the full dropdown (slot="dropdown").

When using showNoResult=true, you can also customize the no result message (slot="no-result").

Type declaration

  • default?:function
    • default(_): any

    • Parameters

      • _: {}

        Returns any

    • dropdown?:function
      • dropdown(_): any

      • Parameters

        • _: {
              position: {
                  toTop: boolean;
                  top: number;
                  left: number;
                  width: number;
                  height: number;
              };
              items: {
                  value: string;
                  searchMatch?: string;
                  label?: string;
                  image?: string;
                  [x: string]: unknown;
              }[];
              activeIndex: number;
              trigger: Trigger;
              select: ((item) => void);
          }
          • position: {
                toTop: boolean;
                top: number;
                left: number;
                width: number;
                height: number;
            }
            • toTop: boolean
            • top: number
            • left: number
            • width: number
            • height: number
          • items: {
                value: string;
                searchMatch?: string;
                label?: string;
                image?: string;
                [x: string]: unknown;
            }[]
          • activeIndex: number
          • trigger: Trigger
          • select: ((item) => void)
              • (item): void

              • Parameters

                Returns void

        Returns any

    • item?:function
      • item(_): any

      • Parameters

        • _: {
              item: {
                  value: string;
                  searchMatch?: string;
                  label?: string;
                  image?: string;
                  [x: string]: unknown;
              };
              active: boolean;
              trigger: Trigger;
              select: ((item) => void);
          }
          • item: {
                value: string;
                searchMatch?: string;
                label?: string;
                image?: string;
                [x: string]: unknown;
            }
            • [x: string]: unknown
            • value: string
            • Optional searchMatch?: string
            • Optional label?: string
            • Optional image?: string
          • active: boolean
          • trigger: Trigger
          • select: ((item) => void)
              • (item): void

              • Parameters

                Returns void

        Returns any

    • no-result?:function
      • no-result(_): any

      • Parameters

        • _: {}

          Returns any

      Settings

      Member Visibility

      Theme