@heartlandone/vega 2.74.0 → 2.75.0

package/dist/types/components/vega-date-picker/assets/icons.d.ts

@@ -1,4 +1,4 @@
 import { IconPayload } from '../../../helpers/icon/interface';
 export declare const Icons: Record<IconType, IconPayload>;
-declare type IconType = 'chevron-left' | 'chevron-right' | 'calendar' | 'caret-down';
+declare type IconType = 'chevron-left' | 'chevron-right' | 'calendar' | 'caret-down' | 'bulls-eye';
 export {};

package/dist/types/components/vega-date-picker/vega-date-picker-calendar/slimmers/renderers/vega-date-picker-calendar-header-render.d.ts

@@ -0,0 +1,20 @@
+import { VegaSlimmer } from '../../../../../vega-slimmer/vega-slimmer-core';
+export declare class VegaDatePickerCalendarHeaderRenderer extends VegaSlimmer {
+  private currentPeriod;
+  private today;
+  private translationSlimmer;
+  private yearMonthSwitcherRender;
+  private mode;
+  private currentPeriodController;
+  private maxCalendarDate;
+  private minCalendarDate;
+  private size;
+  private timezone;
+  private isMobileDevice;
+  render(): HTMLElement;
+  private renderSwitcher;
+  private renderPrevIcon;
+  private renderNextIcon;
+  private renderToday;
+  private getNavigationIconSize;
+}

package/dist/types/components/vega-date-picker/vega-date-picker-calendar/slimmers/renderers/vega-date-picker-calendar-renderer.d.ts

@@ -9,6 +9,7 @@ export declare class VegaDatePickerCalendarRenderer extends VegaSlimmer {
   mode: VegaDatePickerCalendar['mode'];
   clearEventEmitter: VegaDatePickerCalendar['clearEventEmitter'];
   isMobileDevice: VegaDatePickerCalendar['isMobileDevice'];
+  headerRenderer: VegaDatePickerCalendar['headerRenderer'];
   render(): HTMLElement;
   private renderContainer;
   private renderRangeMonth;

package/dist/types/components/vega-date-picker/vega-date-picker-calendar/slimmers/renderers/vega-date-picker-calendar-year-month-switcher-renderer.d.ts

@@ -1,7 +1,5 @@
 import { VegaSlimmer } from '../../../../../vega-slimmer/vega-slimmer-core';
 import { VegaDatePickerCalendar } from '../../vega-date-picker-calendar';
-import { MonthPeriod } from '../../../../../helpers/calendar';
-import { DatePickerCalendarMonthRenderType } from '../../../types';
 export declare class VegaDatePickerCalendarYearMonthSwitcherRenderer extends VegaSlimmer {
   private static readonly DEFAULT_MINIMUM_DROPDOWN_YEAR_BEFORE_CURRENT_YEAR;
   private static readonly DEFAULT_MINIMUM_DROPDOWN_YEAR_AFTER_CURRENT_YEAR;
@@ -12,9 +10,10 @@ export declare class VegaDatePickerCalendarYearMonthSwitcherRenderer extends Veg
   maxCalendarDate: VegaDatePickerCalendar['maxCalendarDate'];
   yearMonthDropdownProps: VegaDatePickerCalendar['yearMonthDropdownProps'];
   currentPeriod: VegaDatePickerCalendar['currentPeriod'];
-  private startDropdownRef;
-  private endDropdownRef;
-  render(period: MonthPeriod, type: DatePickerCalendarMonthRenderType): HTMLElement;
+  size: VegaDatePickerCalendar['size'];
+  mode: VegaDatePickerCalendar['mode'];
+  private isMobileDevice;
+  render(): HTMLElement;
   private getMonthDropdownOptions;
   private isDisabledMonth;
   private getYearDropdownOptions;
@@ -31,10 +30,4 @@ export declare class VegaDatePickerCalendarYearMonthSwitcherRenderer extends Veg
   private renderDropdownSwitchIcon;
   private setDateBasedOnSelectedMonth;
   private setDateBasedOnSelectedYear;
-  /**
-   * Close any open vega-dropdown and ignore currently clicked one
-   *
-   * * @param {HTMLVegaDropdownElement} dropdownToIgnore - Dropdown to ignore
-   */
-  private closeOpenDropdowns;
 }

package/dist/types/components/vega-date-picker/vega-date-picker-calendar/slimmers/renderers/vega-date-picker-month-item-renderer.d.ts

@@ -5,28 +5,23 @@ export declare class VegaDatePickerMonthItemRenderer extends VegaSlimmer {
   currentPeriod: VegaDatePickerCalendar['currentPeriod'];
   today: VegaDatePickerCalendar['today'];
   translationSlimmer: VegaDatePickerCalendar['translationSlimmer'];
-  yearMonthSwitcherRender: VegaDatePickerCalendar['yearMonthSwitcherRender'];
-  mode: VegaDatePickerCalendar['mode'];
-  currentPeriodController: VegaDatePickerCalendar['currentPeriodController'];
   hoverDate: VegaDatePickerCalendar['hoverDate'];
   maxCalendarDate: VegaDatePickerCalendar['maxCalendarDate'];
   minCalendarDate: VegaDatePickerCalendar['minCalendarDate'];
   selectionController: VegaDatePickerCalendar['selectionController'];
   calendarSelection: VegaDatePickerCalendar['calendarSelection'];
-  size: VegaDatePickerCalendar['size'];
   staticHeight: VegaDatePickerCalendar['staticHeight'];
+  mode: VegaDatePickerCalendar['mode'];
+  size: VegaDatePickerCalendar['size'];
   isDateDisabled: VegaDatePickerCalendar['isDateDisabled'];
-  isMobileDevice: VegaDatePickerCalendar['isMobileDevice'];
+  private isMobileDevice;
   private monthViewGenerator;
   render(type: DatePickerCalendarMonthRenderType): HTMLElement;
-  private renderMonthHeader;
-  private renderPrevIcon;
-  private renderNextIcon;
+  private renderCurrentYearMonth;
   private renderWeek;
   private renderDays;
   private renderDay;
   private getCurrentRangeDates;
   private isBeforeMinDate;
   private isAfterMaxDate;
-  private getNavigationIconSize;
 }

package/dist/types/components/vega-date-picker/vega-date-picker-calendar/vega-date-picker-calendar.d.ts

@@ -16,6 +16,7 @@ import { VegaDatePickerCalendarMinMaxDateController } from './slimmers/controlle
 import { VegaDatePickerCalendarAllowRepickController } from './slimmers/controllers/vega-date-picker-calendar-allow-repick-controller';
 import { DisabledDate } from '../../vega-calendar/types';
 import { CalendarSelection } from './dto/calendar-selection';
+import { VegaDatePickerCalendarHeaderRenderer } from './slimmers/renderers/vega-date-picker-calendar-header-render';
 /**
  * @vegaVersion 2.0.0
  */
@@ -23,6 +24,7 @@ export declare class VegaDatePickerCalendar {
   protected readonly globalSlimmers: GlobalSlimmers;
   protected renderer: VegaDatePickerCalendarRenderer;
   protected monthItemRenderer: VegaDatePickerMonthItemRenderer;
+  protected headerRenderer: VegaDatePickerCalendarHeaderRenderer;
   protected translationSlimmer: TranslationSlimmer<HTMLVegaDatePickerCalendarElement>;
   protected todayController: VegaDatePickerCalendarTodayController;
   protected selectionController: VegaDatePickerCalendarSelectionController;

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-source-controller.d.ts

@@ -17,6 +17,8 @@ export declare class VegaDropdownSourceController extends VegaSlimmer {
    * The function "watchSource" calls the function "handleSource".
    */
   watchSource(): void;
+  /** watchCaseSensitive */
+  watchCaseSensitive(): void;
   /**
    * The function sets the source for rendering by searching for a formatted source.
    */

package/dist/types/components/vega-dropdown/vega-dropdown.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import { ElementAppenderAlignmentType, ElementAppenderPlacementType, ResponsiveType, SizeType, TranslocationType } from '../../types/ui.type';
+import { ElementAppenderAlignmentType, ElementAppenderPlacementType, ResponsiveType, SizeType, TranslocationType, VegaEATriggerType } from '../../types/ui.type';
 import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
 import { VegaDropdownRenderer } from './slimmers/renderers/vega-dropdown-renderer';
 import { VegaDropdownSourceController } from './slimmers/controllers/vega-dropdown-source-controller';
@@ -79,10 +79,14 @@ export declare class VegaDropdown {
   size: ResponsiveType<SizeType>;
   /**
    * Specifies the trigger mode for the dropdown.
+   *   hover: The dropdown is shown/hidden on hover, and listens for global area clicks.
+   *   click: The dropdown is shown/hidden on click, and listens for global area clicks.
+   *   none: The dropdown does not listen for any events; you must control its visibility within the component.
+   *   custom: Custom trigger strategy, more information can refer to https://gethired.atlassian.net/wiki/spaces/VKB/pages/657031171/Trigger+strategy.
    *
    * @vegaVersion 1.3.0
    */
-  trigger: 'hover' | 'click' | 'none';
+  trigger: VegaEATriggerType;
   /**
    * Specifies the position adjustment for the dropdown
    *    relative to the target element.
@@ -207,6 +211,7 @@ export declare class VegaDropdown {
    * @vegaVersion 1.4.0
    */
   caseSensitive: boolean;
+  watchCaseSensitive(): void;
   /**
    * Controls whether the dropdown can add a new item when
    *    no proper item is available. It becomes active only when

package/dist/types/components/vega-input/slimmers/controllers/vega-input-render-mode-controller.d.ts

@@ -0,0 +1,27 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInput } from '../../vega-input';
+/** Controller class for managing the render mode of the VegaInput component. */
+export declare class VegaInputRenderModeController extends VegaSlimmer {
+  host: VegaInput['host'];
+  suggestionsDropdownSource: VegaInput['suggestionsDropdownSource'];
+  private hasItemsSlot;
+  private hasDropdownSource;
+  /** Sets the render mode based on the presence of the items slot. */
+  connectedCallback(): void;
+  /**
+   * Checks if the render mode is source mode.
+   *
+   * @returns {boolean} True if in source render mode, false otherwise.
+   */
+  isSource(): boolean;
+  /**
+   * Checks if the render mode is template mode.
+   *
+   * @returns {boolean} True if in template render mode, false otherwise.
+   */
+  isTemplate(): boolean;
+  /**
+   * Sets the render mode based on the presence of the items slot.
+   */
+  private setRenderMode;
+}

package/dist/types/components/vega-input/slimmers/renderers/vega-input-input-renderer.d.ts

@@ -18,6 +18,7 @@ export declare class VegaInputInputRenderer extends VegaSlimmer {
   private blurEventEmitter;
   private pasteEventEmitter;
   private copyPasteController;
+  private nativeInputChangeEventEmitter;
   private inputRef;
   connectedCallback(): void;
   disconnectedCallback(): void;

package/dist/types/components/vega-input/slimmers/renderers/vega-input-input-suggestions-renderer.d.ts

@@ -0,0 +1,40 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputSuggestionsDropdownConfig } from '../../types';
+/**
+ * Renderer class for the Vega App Header Button Dropdown.
+ * This class extends the VegaSlimmer and is responsible for rendering the dropdown component and managing its state and events.
+ */
+export declare class VegaInputInputSuggestionsRenderer extends VegaSlimmer {
+  private host;
+  private value;
+  private suggestionsDropdownConfig;
+  private suggestionsDropdownSource;
+  private renderModeController;
+  private suggestionItemClickEventEmitter;
+  private dropdownRef;
+  private itemsSlotRef;
+  private templateItems;
+  appendHostItemsToDropdown(): void;
+  showSuggestionsDropdown(dropdownConfig?: VegaInputSuggestionsDropdownConfig): Promise<void>;
+  hideSuggestionsDropdown(): Promise<void>;
+  watchValue(): Promise<void>;
+  watchSuggestionsDropdownSource(): Promise<void>;
+  /**
+   * Renders the dropdown component with the provided children.
+   *
+   * @param {HTMLElement} children HTML element children to be rendered inside the dropdown.
+   * @returns {HTMLElement} The rendered dropdown component.
+   */
+  render(children: HTMLElement): HTMLElement;
+  private renderItemsSlot;
+  private addDropdownObserver;
+  /**
+   * emit dropdown click event when component get dropdown item click
+   *
+   * @param {NotifyObserverPayload<string>} input the click detail
+   */
+  private onDropdownItemClick;
+  private findItem;
+  private showSuggestions;
+  private searchSuggestions;
+}

package/dist/types/components/vega-input/slimmers/renderers/vega-input-renderer.d.ts

@@ -10,7 +10,10 @@ export declare class VegaInputRenderer extends VegaSlimmer {
   private labelSuffixButtonConfig;
   private labelButtonClickEventEmitter;
   private inputContainerRenderer;
+  private inputSuggestionsRenderer;
+  private renderModeController;
   render(): Nullable<HTMLElement>;
+  private renderInputContainer;
   private renderLabelDom;
   private renderHintDom;
   private handleLabelButtonClick;

package/dist/types/components/vega-input/types.d.ts

@@ -79,3 +79,7 @@ export type InputAutocompleteTypes =
 	| 'impp'
 	| 'url'
 	| 'photo';
+
+export type VegaInputSuggestionsDropdownConfig = Partial<
+	Pick<HTMLVegaDropdownElement, 'caseSensitive' | 'itemDisplayRule' | 'isLoading' | 'searchNoResultsText'>
+>;

package/dist/types/components/vega-input/vega-input.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { FormFieldValidationRule } from '../../helpers/validator/rules/form-field-validation-rule';
-import { DataTransferType, InputAutocompleteTypes, InputType, InputValueUpdateTriggeredBy, MaskConfigType } from './types';
+import { DataTransferType, InputAutocompleteTypes, InputType, InputValueUpdateTriggeredBy, MaskConfigType, VegaInputSuggestionsDropdownConfig } from './types';
 import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
 import { FormFieldControllerSlimmer } from '../../helpers/slimmers/form-field-controller-slimmer';
 import { EventEmitSlimmerBase } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
@@ -18,6 +18,9 @@ import { VegaInputInputContainerRenderer } from './slimmers/renderers/vega-input
 import { VegaInputInputRenderer } from './slimmers/renderers/vega-input-input-renderer';
 import { VegaInputRenderer } from './slimmers/renderers/vega-input-renderer';
 import { VegaInputValueController } from './slimmers/controllers/vega-input-value-controller';
+import { VegaInputInputSuggestionsRenderer } from './slimmers/renderers/vega-input-input-suggestions-renderer';
+import { VegaDropdownSourceItem } from '../vega-dropdown/types';
+import { VegaInputRenderModeController } from './slimmers/controllers/vega-input-render-mode-controller';
 /**
  * @vegaVersion 1.0.5
  */
@@ -25,6 +28,7 @@ export declare class VegaInput {
   protected readonly globalSlimmers: GlobalSlimmers;
   protected readonly formFieldController: FormFieldControllerSlimmer<string>;
   protected readonly pageResizeObserverSlimmer: PageResizeObserverSlimmer;
+  protected renderModeController: VegaInputRenderModeController;
   protected copyPasteController: VegaInputCopyPasteController;
   protected compactWidthController: VegaInputCompactWidthController;
   protected stateController: VegaInputStateController;
@@ -34,10 +38,13 @@ export declare class VegaInput {
   protected renderer: VegaInputRenderer;
   protected inputContainerRenderer: VegaInputInputContainerRenderer;
   protected inputRenderer: VegaInputInputRenderer;
+  protected inputSuggestionsRenderer: VegaInputInputSuggestionsRenderer;
   protected changeEventEmitter: EventEmitSlimmerBase;
+  protected nativeInputChangeEventEmitter: EventEmitSlimmerBase;
   protected focusEventEmitter: EventEmitSlimmerBase;
   protected blurEventEmitter: EventEmitSlimmerBase;
   protected labelButtonClickEventEmitter: EventEmitSlimmerBase;
+  protected suggestionItemClickEventEmitter: EventEmitSlimmerBase;
   protected pasteEventEmitter: EventEmitSlimmerBase;
   protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaInputElement>;
   protected readonly passwordEyeRenderer: VegaInputPasswordEyeRenderer;
@@ -47,6 +54,7 @@ export declare class VegaInput {
   watchSuffixText(): void;
   isCompactInputWidth: boolean;
   isPasswordDisplay: boolean;
+  suggestionsDropdownConfig: VegaInputSuggestionsDropdownConfig;
   /**
    * Specifies the label or title for the input field.
    *
@@ -271,6 +279,14 @@ export declare class VegaInput {
    * @vegaVersion 2.1.0
    */
   disableCopyPaste: boolean;
+  /**
+   * Sets the source array of items for the suggestion dropdown.
+   *    You should set this property at least a empty array if you want enable the source mode suggestion dropdown feature.
+   *
+   * @vegaVersion 2.75.0
+   */
+  suggestionsDropdownSource: VegaDropdownSourceItem[];
+  watchSuggestionsDropdownSource(): void;
   /**
    * An event emitter notifying a value change.
    *
@@ -284,6 +300,19 @@ export declare class VegaInput {
    * @vegaVersion 2.0.0
    */
   change: EventEmitter<string>;
+  /**
+   * An event emitter notifying a value change by input action of native input dom.
+   *
+   * @vegaVersion 2.75.0
+   */
+  vegaNativeInputChange: EventEmitter<string>;
+  /**
+   * An event emitter notifying a value change by input action of native input dom.
+   *
+   * @eventSemantics namespace:native
+   * @vegaVersion 2.75.0
+   */
+  nativeInputChange: EventEmitter<string>;
   /**
    * An event emitter notifying the blur of the inner input element.
    *
@@ -336,6 +365,19 @@ export declare class VegaInput {
    * @vegaVersion 2.66.0
    */
   paste: EventEmitter<DataTransferType>;
+  /**
+   * An event emitter notifying the click of a suggestion item.
+   *
+   * @vegaVersion 2.75.0
+   */
+  vegaSuggestionItemClick: EventEmitter<VegaDropdownSourceItem>;
+  /**
+   * An event emitter notifying the click of a suggestion item.
+   *
+   * @eventSemantics namespace:native
+   * @vegaVersion 2.75.0
+   */
+  suggestionItemClick: EventEmitter<VegaDropdownSourceItem>;
   /**
    * Invoke this method to focus the current input.
    *
@@ -348,5 +390,17 @@ export declare class VegaInput {
    * @vegaVersion 1.12.0
    */
   doBlur(): Promise<void>;
+  /**
+   * Invoke this method to show the suggestions dropdown.
+   *
+   * @vegaVersion 2.75.0
+   */
+  showSuggestionsDropdown(dropdownConfig?: VegaInputSuggestionsDropdownConfig): Promise<void>;
+  /**
+   * Invoke this method to hide the suggestions dropdown.
+   *
+   * @vegaVersion 2.75.0
+   */
+  hideSuggestionsDropdown(): Promise<void>;
   render(): VegaInput;
 }

package/dist/types/components.d.ts

@@ -5,7 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { BorderStyleType, BoxDisplayType, CornersType, CssStatesType, ElementAppenderAlignmentType, ElementAppenderPlacementType, FlexAlignItemType, FlexDirectionType, FlexJustifyContentType, FlexWrapType, GapType, GridColumnsType, GridRowsType, HeightType, IconAlignType, MarginType, MaxHeightType, MinHeightType, PaddingType, PlacementType, PositionAlignmentType, ResponsiveType, SizeType, StateVariantType, TextAlignType, TranslocationType, VegaComponentInterface, VegaFlexProps, WidthType } from "./types/ui.type";
+import { BorderStyleType, BoxDisplayType, CornersType, CssStatesType, ElementAppenderAlignmentType, ElementAppenderPlacementType, FlexAlignItemType, FlexDirectionType, FlexJustifyContentType, FlexWrapType, GapType, GridColumnsType, GridRowsType, HeightType, IconAlignType, MarginType, MaxHeightType, MinHeightType, PaddingType, PlacementType, PositionAlignmentType, ResponsiveType, SizeType, StateVariantType, TextAlignType, TranslocationType, VegaComponentInterface, VegaEATriggerType, VegaFlexProps, WidthType } from "./types/ui.type";
 import { LinkTargetType, VegaAppFooterLink } from "./components/vega-app-footer/types";
 import { VegaAppHeaderAvatarConfig, VegaAppHeaderButtonDropdownConfig, VegaAppHeaderButtonSize } from "./components/vega-app-header-button/types";
 import { VegaBannerActionButtonType, VegaBannerPropType } from "./components/vega-banner/types";
@@ -35,7 +35,7 @@ import { VegaCountryCode } from "./types/flag.type";
 import { VegaFontAs } from "./components/vega-font/types";
 import { FormControlOption, FormValidateResult, VegaFormFieldValidationState } from "./components/vega-form/types";
 import { VegaFile, VegaFileOptional, VegaImageUploaderStatus } from "./components/vega-image-uploader/types";
-import { DataTransferType, InputAutocompleteTypes, InputType, InputValueUpdateTriggeredBy, MaskConfigType } from "./components/vega-input/types";
+import { DataTransferType, InputAutocompleteTypes, InputType, InputValueUpdateTriggeredBy, MaskConfigType, VegaInputSuggestionsDropdownConfig } from "./components/vega-input/types";
 import { FormFieldValidationRule as FormFieldValidationRule1 } from "./types/components.type";
 import { VegaCountryType } from "./components/vega-input-phone-number/types";
 import { InputRangeStackType, InputRangeValueType } from "./components/vega-input-range/types";
@@ -1559,10 +1559,10 @@ export namespace Components {
          */
         "translocation": ResponsiveType<TranslocationType>;
         /**
-          * Specifies the trigger mode for the dropdown.
+          * Specifies the trigger mode for the dropdown.   hover: The dropdown is shown/hidden on hover, and listens for global area clicks.   click: The dropdown is shown/hidden on click, and listens for global area clicks.   none: The dropdown does not listen for any events; you must control its visibility within the component.   custom: Custom trigger strategy, more information can refer to https://gethired.atlassian.net/wiki/spaces/VKB/pages/657031171/Trigger+strategy.
           * @vegaVersion 1.3.0
          */
-        "trigger": 'hover' | 'click' | 'none';
+        "trigger": VegaEATriggerType;
         /**
           * Determines whether to enable source filtering based on input words.  When set to 'false', the component will emit a `vegaSearch` event    when input words are provided. In this case, you are responsible for    managing the source, including adding, deleting, and updating the source.  Note that the `dynamicOption` property will not work when    this property is set to `false`.
           * @VegaWarning Set `preserveValueIfNotInSource` to 'true' to get custom filter fully supported when set to 'false'.
@@ -2057,6 +2057,11 @@ export namespace Components {
           * @vegaVersion 1.0.5
          */
         "email": boolean;
+        /**
+          * Invoke this method to hide the suggestions dropdown.
+          * @vegaVersion 2.75.0
+         */
+        "hideSuggestionsDropdown": () => Promise<void>;
         /**
           * Provides a supplementary prompt message that assists users in    understanding the expected value for the input field.
           * @vegaVersion 1.3.0
@@ -2137,11 +2142,21 @@ export namespace Components {
           * @vegaVersion 1.3.0
          */
         "showClearIcon": boolean;
+        /**
+          * Invoke this method to show the suggestions dropdown.
+          * @vegaVersion 2.75.0
+         */
+        "showSuggestionsDropdown": (dropdownConfig?: VegaInputSuggestionsDropdownConfig) => Promise<void>;
         /**
           * Defines the size of the input field,    specifying its width or length.
           * @vegaVersion 1.3.0
          */
         "size": 'default' | 'small';
+        /**
+          * Sets the source array of items for the suggestion dropdown.    You should set this property at least a empty array if you want enable the source mode suggestion dropdown feature.
+          * @vegaVersion 2.75.0
+         */
+        "suggestionsDropdownSource": VegaDropdownSourceItem[];
         /**
           * Defines the specific type or category of the input field.  It specifies the intended format or purpose of the    data to be entered by the user.
           * @vegaVersion 1.0.9
@@ -7409,10 +7424,10 @@ declare namespace LocalJSX {
          */
         "translocation"?: ResponsiveType<TranslocationType>;
         /**
-          * Specifies the trigger mode for the dropdown.
+          * Specifies the trigger mode for the dropdown.   hover: The dropdown is shown/hidden on hover, and listens for global area clicks.   click: The dropdown is shown/hidden on click, and listens for global area clicks.   none: The dropdown does not listen for any events; you must control its visibility within the component.   custom: Custom trigger strategy, more information can refer to https://gethired.atlassian.net/wiki/spaces/VKB/pages/657031171/Trigger+strategy.
           * @vegaVersion 1.3.0
          */
-        "trigger"?: 'hover' | 'click' | 'none';
+        "trigger"?: VegaEATriggerType;
         /**
           * Determines whether to enable source filtering based on input words.  When set to 'false', the component will emit a `vegaSearch` event    when input words are provided. In this case, you are responsible for    managing the source, including adding, deleting, and updating the source.  Note that the `dynamicOption` property will not work when    this property is set to `false`.
           * @VegaWarning Set `preserveValueIfNotInSource` to 'true' to get custom filter fully supported when set to 'false'.
@@ -8090,12 +8105,24 @@ declare namespace LocalJSX {
           * @vegaVersion 2.25.0
          */
         "onLabelButtonClick"?: (event: VegaInputCustomEvent<any>) => void;
+        /**
+          * An event emitter notifying a value change by input action of native input dom.
+          * @eventSemantics namespace:native
+          * @vegaVersion 2.75.0
+         */
+        "onNativeInputChange"?: (event: VegaInputCustomEvent<string>) => void;
         /**
           * An event emitter notifying the paste of the inner input element.
           * @eventSemantics namespace:native
           * @vegaVersion 2.66.0
          */
         "onPaste"?: (event: VegaInputCustomEvent<DataTransferType>) => void;
+        /**
+          * An event emitter notifying the click of a suggestion item.
+          * @eventSemantics namespace:native
+          * @vegaVersion 2.75.0
+         */
+        "onSuggestionItemClick"?: (event: VegaInputCustomEvent<VegaDropdownSourceItem>) => void;
         /**
           * An event emitter notifying the blur of the inner input element.
           * @vegaVersion 1.3.0
@@ -8116,11 +8143,21 @@ declare namespace LocalJSX {
           * @vegaVersion 2.25.0
          */
         "onVegaLabelButtonClick"?: (event: VegaInputCustomEvent<any>) => void;
+        /**
+          * An event emitter notifying a value change by input action of native input dom.
+          * @vegaVersion 2.75.0
+         */
+        "onVegaNativeInputChange"?: (event: VegaInputCustomEvent<string>) => void;
         /**
           * An event emitter notifying the paste of the inner input element.
           * @vegaVersion 2.66.0
          */
         "onVegaPaste"?: (event: VegaInputCustomEvent<DataTransferType>) => void;
+        /**
+          * An event emitter notifying the click of a suggestion item.
+          * @vegaVersion 2.75.0
+         */
+        "onVegaSuggestionItemClick"?: (event: VegaInputCustomEvent<VegaDropdownSourceItem>) => void;
         /**
           * Specifies a placeholder string that displays as a temporary hint    or example inside the input field.  It indicates the expected format or pattern of the input.
           * @vegaVersion 1.3.0
@@ -8146,6 +8183,11 @@ declare namespace LocalJSX {
           * @vegaVersion 1.3.0
          */
         "size"?: 'default' | 'small';
+        /**
+          * Sets the source array of items for the suggestion dropdown.    You should set this property at least a empty array if you want enable the source mode suggestion dropdown feature.
+          * @vegaVersion 2.75.0
+         */
+        "suggestionsDropdownSource"?: VegaDropdownSourceItem[];
         /**
           * Defines the specific type or category of the input field.  It specifies the intended format or purpose of the    data to be entered by the user.
           * @vegaVersion 1.0.9

package/dist/types/constants/ui.d.ts

@@ -12,5 +12,5 @@ export declare const FlexWrap: readonly ["nowrap", "wrap", "wrap-reverse"];
 export declare const BoxDisplay: readonly ["block", "inline-block", "none"];
 export declare const BorderStyle: readonly ["solid", "dashed", "dotted", "double", "none"];
 export declare const TextAlign: readonly ["start", "end", "left", "right", "center", "justify"];
-export declare const VegaNativeEventName: readonly ["change", "click", "focus", "blur", "close", "modalOpen", "validate", "formSubmit", "formReset", "rowClick", "rowExpand", "selectChange", "selectAllChange", "pageSizeChange", "dropdownClick", "create", "search", "searchTrigger", "hide", "show", "popoverShow", "popoverHide", "cancel", "remove", "pageUpdate", "currentStepUpdate", "toggleStatus", "stateUpdate", "groupClick", "menuClick", "accordionExpand", "dropdownShow", "dropdownHide", "dropdownSearch", "actionClick", "eventClick", "dateDblClick", "dateClick", "countryChange", "actionButtonClick", "moreActionClick", "expand", "rowSelect", "rowSelectAll", "retry", "selectedFileChange", "preview", "labelButtonClick", "imageInserted", "reset", "eventPreviewShow", "monthYearChange", "complete", "paste", "clear", "periodChange", "selectionChange"];
+export declare const VegaNativeEventName: readonly ["change", "click", "focus", "blur", "close", "modalOpen", "validate", "formSubmit", "formReset", "rowClick", "rowExpand", "selectChange", "selectAllChange", "pageSizeChange", "dropdownClick", "create", "search", "searchTrigger", "hide", "show", "popoverShow", "popoverHide", "cancel", "remove", "pageUpdate", "currentStepUpdate", "toggleStatus", "stateUpdate", "groupClick", "menuClick", "accordionExpand", "dropdownShow", "dropdownHide", "dropdownSearch", "actionClick", "eventClick", "dateDblClick", "dateClick", "countryChange", "actionButtonClick", "moreActionClick", "expand", "rowSelect", "rowSelectAll", "retry", "selectedFileChange", "preview", "labelButtonClick", "imageInserted", "reset", "eventPreviewShow", "monthYearChange", "complete", "paste", "clear", "periodChange", "selectionChange", "suggestionItemClick", "nativeInputChange"];
 export declare const CssStates: readonly ["default", "hover", "active", "focus-visible"];

package/dist/types/helpers/event-manager/event-id/vega-event-id.d.ts

@@ -99,3 +99,5 @@ export declare const VegaPaste: VegaEventID;
 export declare const HTMLNativeEventIds: VegaEventID[];
 export declare const VegaMonthYearChange: VegaEventID;
 export declare const VegaSelectionChange: VegaEventID;
+export declare const VegaSuggestionItemClick: VegaEventID;
+export declare const VegaNativeInputChange: VegaEventID;

package/dist/types/helpers/slimmers/element-appender/element-appender-slimmer.d.ts

@@ -2,15 +2,9 @@ import { VegaSlimmer } from '../../../vega-slimmer/vega-slimmer-core';
 import { ElementAppender, ElementAppenderShowConfig } from '../../ui/element-appender';
 import { Nullable } from '../../../types/general';
 import { ElementAppenderHierarchyTreeManager } from './element-appender-hierarchy-tree-manager';
+import { VegaEATriggerType } from '../../../types/ui.type';
 declare type ShowConfigFactoryType = () => ElementAppenderShowConfig;
-/**
- * - click: means the dropdown show/hide by click, it also listen global area click. example: VegaPopover
- * - hover: means the dropdown show/hide by hover, it also listen global area click. example: VegaDropdown VegaAppHeaderButton
- * - none: means element appender not listens any event, you should control the dropdown show/hide in component. example: VegaDatePicker
- * - custom: means element appender only listen the outer area click. when clicked the dropdown will hide. example: VegaTimePicker
- */
-declare type TriggerType = 'click' | 'hover' | 'none' | 'custom';
-declare type GetTriggerType = () => TriggerType;
+declare type GetTriggerType = () => VegaEATriggerType;
 declare type DisableInteractiveGetter = () => boolean;
 export declare class ElementAppenderSlimmer extends VegaSlimmer {
   private static readonly DELAY_HIDE_TIME;
@@ -58,7 +52,6 @@ export declare class ElementAppenderSlimmer extends VegaSlimmer {
   private globalScrollHandler;
   private createDelayHideTimer;
   private clearDelayHideTimer;
-  private shouldListenerWork;
   /**
    * Sets up an observer to handle scroll events in a shadow root element.
    */
@@ -74,5 +67,7 @@ export declare class ElementAppenderSlimmer extends VegaSlimmer {
    * Remove observer for scrolling in a shadow root element.
    */
   private removeShadowRootElementScrolling;
+  private executeTriggerStrategy;
+  private getTriggerStrategy;
 }
 export {};

package/dist/types/helpers/slimmers/element-appender/trigger-strategies/click-outside-only-to-dismiss-strategy.d.ts

@@ -0,0 +1,21 @@
+import { VegaEAEventType } from '../../../../types/ui.type';
+import { VegaEATriggerStrategy, VegaEATriggerContext, VegaEATriggerResult } from './trigger-strategy.interface';
+/**
+ * A trigger strategy that hides the appendable element when a global mouse down event occurs outside the element.
+ */
+export declare class ClickOutsideOnlyToDismissStrategy implements VegaEATriggerStrategy {
+  /**
+   * Determines if the strategy can evaluate the given event type.
+   *
+   * @param {VegaEAEventType} type - The type of the event.
+   * @returns {boolean} True if the event type is 'globalMouseDown', otherwise false.
+   */
+  canEvaluate(type: VegaEAEventType): boolean;
+  /**
+   * Evaluates the trigger context and determines whether to hide the appendable element.
+   *
+   * @param {VegaEATriggerContext} context - The context of the trigger event.
+   * @returns {VegaEATriggerResult} An object indicating whether to hide the appendable element.
+   */
+  evaluate(context: VegaEATriggerContext): VegaEATriggerResult;
+}

package/dist/types/helpers/slimmers/element-appender/trigger-strategies/click-trigger-strategy.d.ts

@@ -0,0 +1,21 @@
+import { VegaEAEventType } from '../../../../types/ui.type';
+import { VegaEATriggerStrategy, VegaEATriggerContext, VegaEATriggerResult } from './trigger-strategy.interface';
+/**
+ * ClickTriggerStrategy handles 'targetClick' and 'globalMouseDown' events to toggle or hide the appendable element.
+ */
+export declare class ClickTriggerStrategy implements VegaEATriggerStrategy {
+  /**
+   * Determines if the strategy can evaluate the given event type.
+   *
+   * @param {VegaEAEventType} type - The type of the event.
+   * @returns {boolean} True if the event type is 'targetClick' or 'globalMouseDown', otherwise false.
+   */
+  canEvaluate(type: VegaEAEventType): boolean;
+  /**
+   * Evaluates the trigger context and determines whether to show, hide, or toggle the appendable element.
+   *
+   * @param {VegaEATriggerContext} context - The context of the trigger event.
+   * @returns {VegaEATriggerResult} An object indicating whether to show, hide, or toggle the appendable element.
+   */
+  evaluate(context: VegaEATriggerContext): VegaEATriggerResult;
+}

package/dist/types/helpers/slimmers/element-appender/trigger-strategies/hover-trigger-strategy.d.ts

@@ -0,0 +1,22 @@
+import { VegaEAEventType } from '../../../../types/ui.type';
+import { VegaEATriggerStrategy, VegaEATriggerContext, VegaEATriggerResult } from './trigger-strategy.interface';
+/**
+ * HoverTriggerStrategy handles mouse enter and leave events on the target and appendable elements,
+ * as well as global mouse down events to show or hide the appendable element.
+ */
+export declare class HoverTriggerStrategy implements VegaEATriggerStrategy {
+  /**
+   * Determines if the strategy can evaluate the given event type.
+   *
+   * @param {VegaEAEventType} type - The type of the event.
+   * @returns {boolean} True if the event type is related to hover actions or global mouse down, otherwise false.
+   */
+  canEvaluate(type: VegaEAEventType): boolean;
+  /**
+   * Evaluates the trigger context and determines whether to show, hide, or toggle the appendable element.
+   *
+   * @param {VegaEATriggerContext} context - The context of the trigger event.
+   * @returns {VegaEATriggerResult} An object indicating whether to show, hide, or toggle the appendable element.
+   */
+  evaluate(context: VegaEATriggerContext): VegaEATriggerResult;
+}