@globalpayments/vega 1.0.0 → 2.13.0-backfill-beta.0

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

@@ -0,0 +1,25 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputRange } from '../../vega-input-range';
+export declare class VegaInputRangeClearIconRenderer extends VegaSlimmer {
+  protected showClearIcon: VegaInputRange['showClearIcon'];
+  protected value: VegaInputRange['value'];
+  protected disabled: VegaInputRange['disabled'];
+  protected inputRangeInputRenderer: VegaInputRange['inputRangeInputRenderer'];
+  protected valueController: VegaInputRange['valueController'];
+  /**
+   * This function renders a clear icon element for an input range with specific styling and event handlers.
+   *
+   * @returns {HTMLElement} the clear button
+   */
+  render(): HTMLElement;
+  /**
+   * Set the component value to empty and focus on the first input element
+   */
+  private clearInputRangeValue;
+  /**
+   * It is responsible for determining whether the clear icon should be displayed based on certain conditions.
+   *
+   * @returns {boolean} boolean result
+   */
+  private shouldShowClearIcon;
+}

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

@@ -0,0 +1,63 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputRange } from '../../vega-input-range';
+import { RangeInputIndexType } from '../../types';
+export declare class VegaInputRangeInputRenderer extends VegaSlimmer {
+  static readonly defaultPlaceholder: string[];
+  protected value: VegaInputRange['value'];
+  protected prefixIcon: VegaInputRange['prefixIcon'];
+  protected disabled: VegaInputRange['disabled'];
+  protected min: VegaInputRange['min'];
+  protected max: VegaInputRange['max'];
+  protected size: VegaInputRange['size'];
+  protected placeholder: VegaInputRange['placeholder'];
+  protected showClearIcon: VegaInputRange['showClearIcon'];
+  protected valueController: VegaInputRange['valueController'];
+  protected clearIconRenderer: VegaInputRange['clearIconRenderer'];
+  private isMobileDevice;
+  private minFieldInputRef;
+  private maxFieldInputRef;
+  /**
+   * The function `getInputRefByIndex` returns the HTML input element reference based on the index provided.
+   *
+   * @param {RangeInputIndexType} index - The `index` parameter in the `getInputRefByIndex` function is
+   * of type `RangeInputIndexType`. This type is used to specify whether the index refers to the minimum
+   * or maximum input field in a range input element.
+   * @returns {HTMLElement} The `getInputRefByIndex` function returns either the `minFieldInputRef` or
+   * `maxFieldInputRef` based on the `index` provided.
+   */
+  getInputRefByIndex(index: RangeInputIndexType): HTMLVegaInputElement;
+  /**
+   * The below method is e2e-test covered in
+   * @see{module:vega-input-range-label-click}
+   */
+  focusFirstInput: () => void;
+  /** The `render()` method in the `VegaInputRangeInputRenderer` class is responsible for rendering the JSX structure of the input range component. Here's a breakdown of what the `render()` method is doing: */
+  render(): HTMLElement;
+  /**
+   * Get the input props object by range index
+   *
+   * @param {number} index the range index
+   * @returns {InputPropsType} the input props object
+   */
+  private getInputPropsByRangeIndex;
+  /**
+   * update the component value when the range input value change
+   *
+   * @param {NotifyObserverPayload<string>} payload the input value and the input element object
+   */
+  private inputValueChange;
+  /**
+   * get the input placeholder text by the input range index
+   *
+   * @param {number} index the range index 0|1
+   * @returns {string} the input placeholder text
+   */
+  private getPlaceholderByIndex;
+  /**
+   * get the input value by the input range index
+   *
+   * @param {number} index 0|1
+   * @returns {string} the input value
+   */
+  private getDefaultValueByIndex;
+}

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

@@ -0,0 +1,36 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputRange } from '../../vega-input-range';
+/** The class VegaInputRangeRenderer is a TypeScript React component that renders an input range field with custom label, hint, and styling options. */
+export declare class VegaInputRangeRenderer extends VegaSlimmer {
+  protected required: VegaInputRange['required'];
+  protected disabled: VegaInputRange['disabled'];
+  protected label: VegaInputRange['label'];
+  protected hint: VegaInputRange['hint'];
+  protected stack: VegaInputRange['stack'];
+  protected inputRangeInputRenderer: VegaInputRange['inputRangeInputRenderer'];
+  private inputRangeContainerRef;
+  /**
+   * This function returns the reference to the input range container element in a TypeScript React component.
+   *
+   * @returns {HTMLElement} An HTMLElement, specifically the inputRangeContainerRef.
+   */
+  getInputRangeContainerRef(): HTMLElement;
+  /**
+   * The render function returns a JSX structure that includes a vega-flex container with a vega-field-label and an input range input renderer.
+   *
+   * @returns {HTMLElement} An HTMLElement is being returned. The code snippet is a render method of a component that
+   * returns a structure containing a vega-flex element with various attributes and child elements,
+   * including a vega-field-label and the result of calling the render method of
+   * inputRangeInputRenderer. Additionally, the renderHintDom method is being called and its result is
+   * included in the returned structure.
+   */
+  render(): HTMLElement;
+  /**
+   * The function `renderHintDom` returns a label element with a hint text if the `hint` property is provided.
+   *
+   * @returns {HTMLElement|null} A `label` element with the class `vega-input-range-hint` containing a `vega-font` element
+   * with the variant `font-footnote1-short` and color `text-secondary`, displaying the hint text stored
+   * in the `this.hint` property.
+   */
+  private renderHintDom;
+}

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

@@ -0,0 +1,5 @@
+export type InputRangeValueType = string[];
+
+export type RangeInputIndexType = 0 | 1;
+
+export type InputRangeStackType = 'vertical' | 'horizontal';

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

@@ -0,0 +1,131 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { FormFieldValidationRule } from '../../helpers/validator/rules/formFieldValidationRule';
+import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
+import { VegaInputRangeRenderer } from './slimmers/renderers/vega-input-range-renderer';
+import { EventEmitSlimmerBase } from '../../helpers/event-manager/slimmers/eventEmitSlimmer';
+import { FormFieldControllerSlimmer } from '../../helpers/slimmers/formFieldControllerSlimmer';
+import { InputRangeStackType, InputRangeValueType } from './types';
+import { VegaInputRangeValueController } from './slimmers/controllers/vega-input-range-value-controller';
+import { VegaInputRangeInputRenderer } from './slimmers/renderers/vega-input-range-input-renderer';
+import { ChildNodesEventPreventSlimmer } from '../../helpers/event-manager/slimmers/childNodesEventPreventSlimmer';
+import { VegaInputRangeClearIconRenderer } from './slimmers/renderers/vega-input-range-clear-icon-renderer';
+import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/componentUsageRuntimeMetrics';
+export declare class VegaInputRange {
+  protected readonly globalSlimmers: GlobalSlimmers;
+  protected formFieldController: FormFieldControllerSlimmer<InputRangeValueType>;
+  protected inputRangeInputRenderer: VegaInputRangeInputRenderer;
+  protected clearIconRenderer: VegaInputRangeClearIconRenderer;
+  protected inputRangeRenderer: VegaInputRangeRenderer;
+  protected valueController: VegaInputRangeValueController;
+  protected inputChangeEventPrevent: ChildNodesEventPreventSlimmer;
+  protected changeEventEmitter: EventEmitSlimmerBase;
+  protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaInputRangeElement>;
+  host: HTMLVegaInputRangeElement;
+  /**
+   * Specifies the label or title for the input range.
+   *
+   * It provides descriptive text that helps identify the
+   *    purpose or content expected in the input field.
+   */
+  label: string;
+  /**
+   * Represents a pre-set or default value for the input field.
+   *
+   * It allows you to initialize the field with a specific value,
+   *    which is displayed to the user when the input is
+   *    initially rendered.
+   *
+   * If the value is too long, it may be truncated with
+   *    an ellipsis for visual presentation.
+   */
+  value: InputRangeValueType;
+  /**
+   * The input range component is embedded in other components.
+   *
+   * If modifying the input value does not meet the requirements
+   *    of other components, such as limiting the maximum value, etc.,
+   *    you need to modify the value of the input range component and
+   *    display it in real time.
+   *
+   * Since the value of `inputRef` retains the old value,
+   *    it needs to be updated manually when a value changes.
+   *
+   * @param {InputRangeValueType} newValue - The `newValue` parameter represents the new value of the input range.
+   * @param {InputRangeValueType} oldValue - The `oldValue` parameter represents the previous value of the input range before it was changed to the `newValue`.
+   */
+  watchValue(newValue: InputRangeValueType, oldValue: InputRangeValueType): void;
+  /**
+   * Specifies an icon or symbol that appears before the input range,
+   *    providing visual context or enhancing the aesthetic appearance
+   *    of the input.
+   */
+  prefixIcon: string;
+  /**
+   * Determines whether the clear icon should be displayed.
+   */
+  showClearIcon: boolean;
+  /**
+   * Sets the minimum allowable numeric value for the input value.
+   */
+  min: number;
+  /**
+   * Sets the maximum allowable numeric value for the input value.
+   */
+  max: number;
+  /**
+   * Determines whether the input range is required.
+   */
+  required: boolean;
+  /**
+   * Indicates whether the current value in the field is considered valid
+   *    based on the defined validation rules.
+   */
+  isValid: boolean;
+  /**
+   * Determines whether the input field should undergo automatic validation
+   *    during the user's input.
+   */
+  autoValidation: boolean;
+  /**
+   * Defines custom validation rules for the input field.
+   */
+  validationRules: FormFieldValidationRule<unknown>[];
+  watchValidationRules(): void;
+  /**
+   * Defines the size of the input range,
+   *    specifying its width or length.
+   */
+  size: 'default' | 'small';
+  /**
+   * 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.
+   */
+  placeholder: [string, string];
+  /**
+   * Determines whether the input range is disabled.
+   */
+  disabled: boolean;
+  /**
+   * Provides a supplementary prompt message that assists users in
+   *    understanding the expected value for the input field.
+   */
+  hint: string;
+  /**
+   * Determines the arrangement and appearance of
+   *    the label and input areas.
+   */
+  stack: InputRangeStackType;
+  /**
+   * An event emitter notifying a value change.
+   */
+  vegaChange: EventEmitter<[number, number]>;
+  /**
+   * An event emitter notifying a value change.
+   *
+   * @eventSemantics namespace:native
+   */
+  change: EventEmitter<[number, number]>;
+  render(): VegaInputRange;
+}

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

@@ -0,0 +1,38 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { SelectSourceItem } from '../../types';
+import { VegaInputSelect } from '../../vega-input-select';
+/** The `VegaInputSelectDropdownController` class is a TypeScript React component that controls the behavior of a dropdown select input. */
+export declare class VegaInputSelectDropdownController extends VegaSlimmer {
+  source: VegaInputSelect['source'];
+  dropdownSource: VegaInputSelect['dropdownSource'];
+  isDropdownShow: VegaInputSelect['isDropdownShow'];
+  vegaSearch: VegaInputSelect['vegaSearch'];
+  searchEventEmitter: VegaInputSelect['searchEventEmitter'];
+  vegaInputSelectValueController: VegaInputSelect['vegaInputSelectValueController'];
+  /**
+   * call the method when component componentWillLoad call
+   */
+  handleWillLoad(): void;
+  /**
+   * convert the dropdown source when the component watchSource call
+   */
+  handleSourceChange: () => void;
+  /** The `onDropdownShow` function is setting the `isDropdownShow` property of the`VegaInputSelectDropdownController` class to `true`. This function is called when the dropdown select input is shown. */
+  onDropdownShow: () => void;
+  /** The `onDropdownHide` function is setting the `isDropdownShow` property of the `VegaInputSelectDropdownController` class to `false`. This function is called when the dropdown select input is hidden. */
+  onDropdownHide: () => void;
+  /**
+   * Append items to source
+   *
+   * @param {SelectSourceItem[]} items - Appendable items
+   */
+  appendSourceItems(items: SelectSourceItem[]): void;
+  /**
+   * The function `addDropdownObserver` adds event observers to a dropdown element.
+   *
+   * @param {HTMLElement} dropdownRef - The `dropdownRef` parameter is a reference to the HTML element representing the dropdown component.
+   */
+  addDropdownObserver(dropdownRef: HTMLVegaDropdownElement): void;
+  /** update the dropdown list by source value */
+  private convertToDropdownSource;
+}

package/dist/types/components/vega-input-select/slimmers/controllers/vega-input-select-lazy-load-controller.d.ts

@@ -0,0 +1,28 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputSelect } from '../../vega-input-select';
+/**
+ * VegaInputSelectLazyLoadController
+ */
+export declare class VegaInputSelectLazyLoadController extends VegaSlimmer {
+  sourceLazyLoadCallback: VegaInputSelect['sourceLazyLoadCallback'];
+  isLazyLoading: VegaInputSelect['isLazyLoading'];
+  vegaInputSelectDropdownController: VegaInputSelect['vegaInputSelectDropdownController'];
+  vegaInputSelectDropdownRenderer: VegaInputSelect['vegaInputSelectDropdownRenderer'];
+  private hasMore;
+  /**
+   * Observer scroll to bottom on vegaVirtualScroll
+   */
+  componentDidLoad(): void;
+  /**
+   * Get virtualScroll
+   *
+   * @returns {Nullable<HTMLElement>} - virtualScroll
+   */
+  private getVirtualScroll;
+  /**
+   * The function `onScrollToBottom` logs a message and emits an event if lazy loading is enabled.
+   *
+   * @param {VegaVirtualScrollToBottomEvent} payload - payload
+   */
+  private onScrollToBottom;
+}

package/dist/types/components/vega-input-select/slimmers/controllers/vega-input-select-value-controller.d.ts

@@ -0,0 +1,31 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { SelectType, SelectValueType } from '../../types';
+/** The `VegaInputSelectValueController` class is a TypeScript React component that handles the value and change events for an input select component. */
+export declare class VegaInputSelectValueController extends VegaSlimmer {
+  private value;
+  private selectType;
+  private source;
+  private changeEventEmitter;
+  private host;
+  /**
+   * handle the value change when the component watchValue call
+   *
+   * @param {SelectValueType<SelectType>} newValue the new value
+   * @param {SelectValueType<SelectType>} oldValue the old value
+   */
+  handleValueChange: (newValue: SelectValueType<SelectType>, oldValue: SelectValueType<SelectType>) => void;
+  /**
+   * The function sets the value of a select input if it passes a value guard check.
+   *
+   * @param {unknown} value - The `value` parameter is the value that you want to set for the `value` property. It
+   * can be of any type that extends the `SelectType` type.
+   */
+  setValue<T extends SelectType>(value: SelectValueType<T>): void;
+  /**
+   * The function `valueGuard` checks if the input value is valid based on the select type.
+   *
+   * @param {SelectValueType<SelectType>} value - The `value` parameter is of type `SelectValueType<SelectType>`.
+   * @returns {boolean} a boolean value.
+   */
+  private valueGuard;
+}

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

@@ -0,0 +1,30 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+/** The `VegaInputSelectDropdownRenderer` class is a TypeScript React component that renders a dropdown select input with various customization options. */
+export declare class VegaInputSelectDropdownRenderer extends VegaSlimmer {
+  private dropdown;
+  private inputSelectContainer;
+  private value;
+  private source;
+  private selectType;
+  private isDropdownShow;
+  private vegaDropdownProps;
+  private dropdownSource;
+  private prefixIcon;
+  private placeholder;
+  private selectedLabel;
+  private isLazyLoading;
+  private vegaInputSelectDropdownController;
+  show(): Promise<void>;
+  hide(): Promise<void>;
+  getDropdownRef(): HTMLVegaDropdownElement;
+  getInputSelectContainerRef(): HTMLDivElement;
+  render(): HTMLVegaDropdownElement;
+  private renderContainer;
+  private renderPrefixIcon;
+  private renderToggleIcon;
+  private renderSelectContainer;
+  private renderMultipleSelected;
+  private renderSingleSelected;
+  private preventBlur;
+  private getVegaDropdownProperties;
+}

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

@@ -0,0 +1,15 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaInputSelect } from '../../vega-input-select';
+/** The `VegaInputSelectRenderer` class is a TypeScript React component that renders a select input field with various properties and methods. */
+export declare class VegaInputSelectRenderer extends VegaSlimmer {
+  private disabled;
+  private size;
+  private hint;
+  private label;
+  private required;
+  private dropdownRenderer;
+  render(): VegaInputSelect;
+  private renderLabel;
+  private renderErrorMessage;
+  private renderHelpMessage;
+}

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

@@ -0,0 +1,34 @@
+import { VegaComponentInterface } from '../../types/ui.type';
+
+export type SelectSourceItem = {
+	id: string;
+	displayName: string;
+};
+
+export type SelectedLabelType = (value: string[]) => string;
+
+export type VegaDropdownPropsForSelect = Partial<
+	Pick<
+		VegaComponentInterface<HTMLVegaDropdownElement>,
+		| 'positionRelativeTo'
+		| 'maxHeight'
+		| 'matchContainerHeight'
+		| 'searchable'
+		| 'caseSensitive'
+		| 'matchTargetWidth'
+		| 'useDefaultFilter'
+	>
+>;
+
+export type VegaInputSelectSize = 'default' | 'small';
+export type SelectType = 'single' | 'multiple';
+export type SelectValueType<T extends SelectType> = T extends 'single' ? string : string[];
+
+export type VegaInputSourceLazyLoadResponse = {
+	hasMore: boolean;
+	items: SelectSourceItem[];
+};
+
+export type VegaInputSelectSourceLazyLoadCallback = (
+	endIndex: number,
+) => Promise<VegaInputSourceLazyLoadResponse>;

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

@@ -0,0 +1,166 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { BreakpointsTokenType } from '../../types/designToken.type';
+import { ResponsiveType } from '../../types/ui.type';
+import { FormFieldValidationRule } from '../../helpers/validator/rules/formFieldValidationRule';
+import { DropdownSourceItem } from '../vega-dropdown/types';
+import { SelectedLabelType, SelectSourceItem, SelectType, SelectValueType, VegaDropdownPropsForSelect, VegaInputSelectSize, VegaInputSelectSourceLazyLoadCallback } from './types';
+import { VegaInputSelectRenderer } from './slimmers/renderers/vega-input-select-renderer';
+import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
+import { VegaInputSelectDropdownController } from './slimmers/controllers/vega-input-select-dropdown-controller';
+import { VegaInputSelectValueController } from './slimmers/controllers/vega-input-select-value-controller';
+import { VegaInputSelectDropdownRenderer } from './slimmers/renderers/vega-input-select-dropdown-renderer';
+import { FormFieldControllerSlimmer } from '../../helpers/slimmers/formFieldControllerSlimmer';
+import { PageResizeObserverSlimmer } from '../../helpers/slimmers/pageResizeObserverSlimmer';
+import { EventEmitSlimmerBase } from '../../helpers/event-manager/slimmers/eventEmitSlimmer';
+import { ChildNodesEventPreventSlimmer } from '../../helpers/event-manager/slimmers/childNodesEventPreventSlimmer';
+import { VegaInputSelectLazyLoadController } from './slimmers/controllers/vega-input-select-lazy-load-controller';
+import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/componentUsageRuntimeMetrics';
+export declare class VegaInputSelect {
+  protected readonly globalSlimmers: GlobalSlimmers;
+  protected readonly vegaInputSelectRenderer: VegaInputSelectRenderer;
+  protected readonly vegaInputSelectDropdownController: VegaInputSelectDropdownController;
+  protected readonly vegaInputSelectValueController: VegaInputSelectValueController;
+  protected readonly vegaInputSelectDropdownRenderer: VegaInputSelectDropdownRenderer;
+  protected readonly formFieldControllerSlimmer: FormFieldControllerSlimmer<SelectValueType<SelectType>>;
+  protected readonly pageResizeObserverSlimmer: PageResizeObserverSlimmer;
+  protected readonly lazyLoadController: VegaInputSelectLazyLoadController;
+  protected changeEventEmitter: EventEmitSlimmerBase;
+  protected searchEventEmitter: EventEmitSlimmerBase;
+  protected eventPrevent: ChildNodesEventPreventSlimmer;
+  protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaInputSelectElement>;
+  host: HTMLVegaInputSelectElement;
+  isDropdownShow: boolean;
+  dropdownSource: DropdownSourceItem[];
+  currentBreakpoint: BreakpointsTokenType;
+  isLazyLoading: boolean;
+  /**
+   * Specifies the label or title for the input field.
+   *
+   * It provides descriptive text that helps identify the purpose or
+   *    content expected in the input select field.
+   */
+  label: string;
+  /**
+   * Determines whether the input select field is required.
+   */
+  required: boolean;
+  /**
+   * Allows customization of the text displayed within the
+   *    select field when multiple items are selected.
+   *    The default format for the selected label is
+   *    `${number of selected items} Selected`.
+   */
+  selectedLabel: SelectedLabelType;
+  /**
+   * Controls the selection capabilities of the associated dropdown menu.
+   */
+  selectType: SelectType;
+  /**
+   * Specifies the dataset used to populate the options
+   *    available in the select input dropdown menu.
+   */
+  source: SelectSourceItem[];
+  watchSource(): void;
+  /**
+   * Specifies the ID of the item selected from the source data
+   *    in the dropdown menu.
+   *
+   * The ID should be unique within the source collection to
+   *    correctly associate the chosen option with its
+   *    corresponding data entry.
+   */
+  value: SelectValueType<SelectType>;
+  watchValue(newValue: SelectValueType<SelectType>, oldValue: SelectValueType<SelectType>): void;
+  /**
+   * Indicates the current validation status of the user's selection
+   *    from the dropdown menu.
+   */
+  isValid: boolean | null;
+  /**
+   * Specifies whether the system should automatically carry out
+   *    validation checks on the user's selection in real-time,
+   *    ensuring that the input adheres to predefined criteria before
+   *    submission or proceeding further.
+   */
+  autoValidation: boolean;
+  /**
+   * Allows setting custom criteria or constraints that
+   *    the user's selection in the dropdown menu must
+   *    comply with.
+   */
+  validationRules: FormFieldValidationRule<unknown>[];
+  watchValidationRules(): void;
+  /**
+   * Specifies a prefix icon for visual context or aesthetic enhancement.
+   */
+  prefixIcon: string;
+  /**
+   * Specifies whether the input select field is disabled.
+   */
+  disabled: boolean;
+  /**
+   * Specifies a placeholder string that displays as a temporary hint or
+   *    example inside the input select field.
+   *
+   * It indicates the expected format or pattern of the input.
+   */
+  placeholder: string;
+  /**
+   * Provides a supplementary prompt message that assists users in
+   *    understanding the expected value for the input select field.
+   */
+  hint: string;
+  /**
+   * Provides partial properties for the dropdown component used
+   *    in the input select element.
+   *
+   * You can specify custom properties and their corresponding values as needed.
+   */
+  vegaDropdownProps: VegaDropdownPropsForSelect;
+  /**
+   * Defines the size of the input select field.
+   */
+  size: ResponsiveType<VegaInputSelectSize>;
+  /**
+   *  Specifies the callback function for source lazy loading, which returns new data to load.
+   *
+   *  When the dropdown reaches the bottom, this function is triggered and
+   *      receives the current end index as a parameter.
+   */
+  sourceLazyLoadCallback: VegaInputSelectSourceLazyLoadCallback;
+  /**
+   * An event emitter notifying the change of the select value.
+   */
+  vegaChange: EventEmitter<SelectValueType<SelectType>>;
+  /**
+   * An event emitter notifying the change of the select value.
+   *
+   * @eventSemantics namespace:native
+   */
+  change: EventEmitter<SelectValueType<SelectType>>;
+  /**
+   * An event emitter notifying the search of the dropdown.
+   */
+  vegaSearch: EventEmitter<string>;
+  /**
+   * An event emitter notifying the search of the dropdown.
+   *
+   * @eventSemantics namespace:native
+   */
+  search: EventEmitter<string>;
+  componentWillLoad(): void;
+  /**
+   * Invoke this method to close the select dropdown and clear
+   *    the dropdown element reference.
+   */
+  doClose(): Promise<void>;
+  /**
+   * Invoke this method to open the select dropdown.
+   */
+  doOpen(): Promise<void>;
+  /**
+   * Invoke this method to change the ID of the select source item.
+   */
+  doChange(value: SelectValueType<SelectType>): Promise<void>;
+  render(): VegaInputSelect;
+}

package/dist/types/components/vega-item-toggle/types.d.ts

@@ -0,0 +1,8 @@
+export type ItemToggleStatusMap = {
+	unToggledIcon?: string;
+	toggledIcon?: string;
+	unToggledLabel?: string;
+	togglingLabel?: string;
+	toggledLabel?: string;
+	unTogglingLabel?: string;
+};

package/dist/types/components/vega-item-toggle/vega-item-toggle.d.ts

@@ -0,0 +1,45 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { ItemToggleStatusMap } from './types';
+import { EventEmitSlimmerBase } from '../../helpers/event-manager/slimmers/eventEmitSlimmer';
+import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
+import { DeprecatedPropertySlimmerBase } from '../../helpers/slimmers/deprecatedPropertySlimmer';
+import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/componentUsageRuntimeMetrics';
+export declare class VegaItemToggle {
+  private static defaultStatusMap;
+  protected readonly globalSlimmers: GlobalSlimmers;
+  protected toggleStatusEventEmitter: EventEmitSlimmerBase;
+  protected readonly deprecatedPropertySlimmer: DeprecatedPropertySlimmerBase<ItemToggleStatusMap>;
+  protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaItemToggleElement>;
+  host: HTMLVegaItemToggleElement;
+  toggleItemStatus: 'unToggled' | 'toggling' | 'toggled' | 'unToggling';
+  /**
+   * Defines the labels and icons associated with the toggle states.
+   * @deprecated This property will be removed soon and replaced by prop statusMap
+   */
+  itemToggleStatusMap: ItemToggleStatusMap;
+  /**
+   * Defines the labels and icons associated with the toggle states.
+   */
+  statusMap: ItemToggleStatusMap;
+  /**
+   * Determines whether the item is toggled on.
+   */
+  isToggled: boolean;
+  onToggledPropsChange(): void;
+  /**
+   * An event emitter notifying an item toggle event.
+   */
+  vegaToggleStatus: EventEmitter<boolean>;
+  /**
+   * An event emitter notifying an item toggle event.
+   * @eventSemantics namespace:native
+   */
+  toggleStatus: EventEmitter<boolean>;
+  componentWillLoad(): void;
+  render(): VegaItemToggle;
+  private renderLabelDom;
+  private handleToggle;
+  private isTogglingOrUnToggling;
+  private updateToggleStatus;
+  private updateTransitionStatus;
+}