@heartlandone/vega 2.84.0 → 2.85.0

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

@@ -1,8 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ImmutableSet } from '../../helpers/immutable/immutable-set';
 import { BreakpointsTokenType } from '../../types/design-token.type';
-import { ResponsiveType } from '../../types/ui.type';
-import { VegaTableChangePropType, VegaTableColumnConfig, VegaTableDataSourceItem, VegaTableDensityType, VegaTablePagination, VegaTableRowClickPropType, VegaTableRowSelectionConfig, VegaTableRowSelectProp, VegaTableSelectAllProp, VegaTableScrollConfig, VegaTableSortConfig, VegaTableRowSelectAllEventDetail, VegaTableRowSelectEventDetail, VegaTableRowExpandEventDetail, VegaTableGroupColumnConfig } from './interface';
+import { DragDropEventPayload, ResponsiveType } from '../../types/ui.type';
+import { VegaTableChangePropType, VegaTableColumnConfig, VegaTableDataSourceItem, VegaTableDensityType, VegaTablePagination, VegaTableRowClickPropType, VegaTableRowSelectionConfig, VegaTableRowSelectProp, VegaTableSelectAllProp, VegaTableScrollConfig, VegaTableSortConfig, VegaTableRowSelectAllEventDetail, VegaTableRowSelectEventDetail, VegaTableRowExpandEventDetail, VegaTableGroupColumnConfig, VegaTableRowExpandableType } from './interface';
 import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
 import { VegaTableCellRenderer } from './slimmers/renderers/vega-table-cell-renderer';
 import { VegaTableExpandRowController } from './slimmers/controllers/vega-table-expand-row-controller';
@@ -32,6 +32,7 @@ import { VegaTableColumnStructureModelController } from './slimmers/controllers/
 import { ColumnStructureModel } from './slimmers/controllers/dto/column-structure-model';
 import { VegaTableRenderInputController } from './slimmers/controllers/vega-table-render-input-controller';
 import { VegaTablePinnedRenderer } from './slimmers/renderers/vega-table-pinned-renderer';
+import { VegaTableRowDraggableController } from './slimmers/controllers/vega-table-row-draggable-controller';
 /**
  * @vegaVersion 1.3.0
  */
@@ -49,7 +50,6 @@ export declare class VegaTable {
   protected readonly vegaTableCellRenderer: VegaTableCellRenderer;
   protected readonly vegaTablePaginationRenderer: VegaTablePaginationRenderer;
   protected readonly vegaTableScrollContainerRenderer: VegaTableScrollContainerRenderer;
-  protected readonly vegaTableExpandRowController: VegaTableExpandRowController;
   protected readonly vegaTableRowSelectionController: VegaTableRowSelectionController;
   protected readonly vegaTableDataSourceController: VegaTableDataSourceController;
   protected readonly vegaTablePaginationController: VegaTablePaginationController;
@@ -57,13 +57,20 @@ export declare class VegaTable {
   protected readonly vegaTableSortController: VegaTableSortController;
   protected readonly vegaTableColGroupRenderer: VegaTableColGroupRenderer;
   protected readonly vegaTableChildrenController: VegaTableChildrenController;
+  protected readonly vegaTableRowDraggableController: VegaTableRowDraggableController;
+  /**
+   * vegaTableExpandRowController should be injected after childrenController and VegaTableDataSourceController,
+   *     because it needs to wait for sync currentData to set expandableRows.
+   */
+  protected readonly vegaTableExpandRowController: VegaTableExpandRowController;
   /**
    * The below method is e2e-test covered in
    * @see{module:should-render-responsive-columns-with-expandable-row-and-current-breakpoint-is-smaller-than-S}
    */
   protected readonly pageResizeObserverSlimmer: PageResizeObserverSlimmer;
   protected readonly rowSelectionNotifySlimmer: SubStateNotifySlimmerBase;
-  protected readonly rowExpandableNotifySlimmer: SubStateNotifySlimmerBase;
+  protected readonly expandableRowsNotifySlimmer: SubStateNotifySlimmerBase;
+  protected readonly hasExpandableRowNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly paddingXNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly rowClickableNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly scrollConfigNotifySlimmer: SubStateNotifySlimmerBase;
@@ -73,11 +80,13 @@ export declare class VegaTable {
   protected selectAllChangeEventEmitter: EventEmitSlimmerBase;
   protected rowClickEventEmitter: EventEmitSlimmerBase;
   protected rowExpandEventEmitter: EventEmitSlimmerBase;
+  protected rowDragDropEventEmitter: EventEmitSlimmerBase;
   protected readonly rowDividerNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly columnDividerNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly densityNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly isTemplateRenderModeNotifySlimmer: SubStateNotifySlimmerBase;
   protected readonly currentDataNotifySlimmer: SubStateNotifySlimmerBase;
+  protected readonly rowDraggableNotifySlimmer: SubStateNotifySlimmerBase;
   protected vegaComponentUsageRuntimeMetricsSlimmer: VegaComponentUsageRuntimeMetricsSlimmer<HTMLVegaTableElement>;
   protected rowSelectEventEmitter: EventEmitSlimmerBase;
   protected rowSelectAllEventEmitter: EventEmitSlimmerBase;
@@ -111,6 +120,10 @@ export declare class VegaTable {
   watchTemplateRenderMode(): void;
   columnStructureModel: ColumnStructureModel;
   watchColumnStructureModel(): void;
+  expandableRows: string[];
+  watchExpandableRows(): void;
+  hasExpandableRow: boolean;
+  watchHasExpandableRow(): void;
   /**
    * Defines the columns of the table.
    *
@@ -153,7 +166,7 @@ export declare class VegaTable {
    *
    * @vegaVersion 1.3.0
    */
-  rowExpandable: boolean;
+  rowExpandable: VegaTableRowExpandableType;
   watchRowExpandable(): void;
   /**
    * Specifies whether rows in the table can be clicked.
@@ -164,6 +177,13 @@ export declare class VegaTable {
    */
   rowClickable: boolean;
   watchRowClickable(): void;
+  /**
+   * Specifies whether the table supports row dragging for reordering.
+   *
+   * @vegaVersion 2.85.0
+   */
+  rowDraggable: boolean;
+  watchRowDraggable(): void;
   /**
    * Specifies whether dividers should be displayed
    *    between rows in the table.
@@ -341,6 +361,21 @@ export declare class VegaTable {
    * @vegaVersion 2.23.0
    */
   rowSelectAll: EventEmitter<VegaTableRowSelectAllEventDetail>;
+  /**
+   * An event emitter notifying when a row is drag and drop,
+   *    it include full lifecycle, like drag start, drag, drag enter, drag leave, drag over, drop and drag end.
+   *
+   * @vegaVersion 2.85.0
+   */
+  vegaRowDragDrop: EventEmitter<DragDropEventPayload>;
+  /**
+   * An event emitter notifying when a row is drag and drop,
+   *     it include full lifecycle, like drag start, drag, drag enter, drag leave, drag over, drop and drag end.
+   *
+   * @eventSemantics namespace:native
+   * @vegaVersion 2.85.0
+   */
+  rowDragDrop: EventEmitter<DragDropEventPayload>;
   /**
    * Invoke this method to expand the row with the specified `rowKey`,
    *    revealing additional content.

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, GridJustifyItemsType, GridRowsType, HeightType, IconAlignType, MarginType, MaxHeightType, MinHeightType, PaddingType, PlacementType, PositionAlignmentType, ResponsiveType, SizeType, StateVariantType, TextAlignType, TranslocationType, VegaComponentInterface, VegaEATriggerType, VegaFlexProps, WidthType } from "./types/ui.type";
+import { BorderStyleType, BoxDisplayType, CornersType, CssStatesType, DragDropEventPayload, ElementAppenderAlignmentType, ElementAppenderPlacementType, FlexAlignItemType, FlexDirectionType, FlexJustifyContentType, FlexWrapType, GapType, GridColumnsType, GridJustifyItemsType, 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, VegaAppHeaderLabelConfig } from "./components/vega-app-header-button/types";
 import { VegaBannerActionButtonType, VegaBannerPropType } from "./components/vega-banner/types";
@@ -65,7 +65,7 @@ import { OpenByDefaultType, SidebarHeaderConfig, SidebarTopLevelItem } from "./c
 import { VegaSignatureCaptureMode, VegaSignatureValue } from "./components/vega-signature-capture/types";
 import { VegaSkeletonType } from "./components/vega-skeleton/interface";
 import { TabConfig, TabGroupOverflowType, TabGroupVariant } from "./components/vega-tab-group/types";
-import { VegaTableChangePropType, VegaTableColumnBreakpoint, VegaTableColumnConfig, VegaTableDataSourceItem, VegaTableDensityType, VegaTableGroupColumnConfig, VegaTableHeadCellClickEvent, VegaTablePagination, VegaTablePinnedType, VegaTableRowClickEvent, VegaTableRowClickPropType, VegaTableRowExpandEvent, VegaTableRowExpandEventDetail, VegaTableRowSelectAllEventDetail, VegaTableRowSelectEventDetail, VegaTableRowSelectionConfig, VegaTableRowSelectProp, VegaTableScrollConfig, VegaTableSelectAllProp, VegaTableSortConfig, VegaTableSorterConfig, VegaTableSortOrderType } from "./components/vega-table/interface";
+import { VegaTableChangePropType, VegaTableColumnBreakpoint, VegaTableColumnConfig, VegaTableDataSourceItem, VegaTableDensityType, VegaTableGroupColumnConfig, VegaTableHeadCellClickEvent, VegaTablePagination, VegaTablePinnedType, VegaTableRowClickEvent, VegaTableRowClickPropType, VegaTableRowExpandableType, VegaTableRowExpandEvent, VegaTableRowExpandEventDetail, VegaTableRowSelectAllEventDetail, VegaTableRowSelectEventDetail, VegaTableRowSelectionConfig, VegaTableRowSelectProp, VegaTableScrollConfig, VegaTableSelectAllProp, VegaTableSortConfig, VegaTableSorterConfig, VegaTableSortOrderType } from "./components/vega-table/interface";
 import { VegaTextTooltipProps } from "./components/vega-text/types";
 import { TimePickerModeType, TimePickerValueType } from "./components/vega-time-picker/types";
 import { SourceItemType } from "./components/vega-virtual-scroll/types";
@@ -1091,7 +1091,7 @@ export namespace Components {
          */
         "selected": boolean;
         /**
-          * Controls the outer shape of the swatch. - 'basket': Rounded corners for spaced layouts. - 'block': Square corners for dense or flush layouts.
+          * Controls the outer shape of the swatch. - `basket`: Rounded corners for spaced layouts. - `block`: Square corners for dense or flush layouts.
           * @vegaVersion 2.82.0
          */
         "shape": VegaColorSwatchShape;
@@ -1101,7 +1101,7 @@ export namespace Components {
          */
         "size": VegaColorSwatchSize;
         /**
-          * Specifies the visual style and prominence of the swatch.    It determines how the swatch will be presented to the user. - 'swatch': Displays the color fill. - 'clear': Displays a diagonal line to indicate no color (clear selection).
+          * Specifies the visual style and prominence of the swatch.    It determines how the swatch will be presented to the user. - `swatch`: Displays the color fill. - `clear`: Displays a diagonal line to indicate no color (clear selection).
           * @vegaVersion 2.82.0
          */
         "variant": VegaColorSwatchVariant;
@@ -1125,6 +1125,7 @@ export namespace Components {
         /**
           * Specifies the formatting method for color values in the color swatch picker. It can be set to a predefined format (`hexColorFormatter`) or a custom   formatter function. The `hexColorFormatter` automatically adds a # prefix on output and removes it on input. A custom formatter function   allows more complex formatting logic based on the processing stage (input or output). Applies only when `showInput` is set to `true`.
           * @vegaVersion 2.84.0
+          * @defaultValue hexColorFormatter
          */
         "inputFormatter": VegaColorSwatchPickerFormatOption;
         /**
@@ -1135,6 +1136,7 @@ export namespace Components {
         /**
           * The icon for the custom color input in the color swatch picker popover. Specifies the icon displayed in the custom color input field   within the color swatch picker popover.
           * @vegaVersion 2.84.0
+          * @defaultValue hexColorIcon
          */
         "inputPrefixIcon": string;
         /**
@@ -4349,11 +4351,16 @@ export namespace Components {
           * @vegaVersion 1.3.0
          */
         "rowDivider": boolean;
+        /**
+          * Specifies whether the table supports row dragging for reordering.
+          * @vegaVersion 2.85.0
+         */
+        "rowDraggable": boolean;
         /**
           * Indicates whether the row is expandable.
           * @vegaVersion 1.3.0
          */
-        "rowExpandable": boolean;
+        "rowExpandable": VegaTableRowExpandableType;
         /**
           * Defines a unique key for each row in the table.
           * @vegaVersion 1.9.2
@@ -7279,7 +7286,7 @@ declare namespace LocalJSX {
          */
         "selected"?: boolean;
         /**
-          * Controls the outer shape of the swatch. - 'basket': Rounded corners for spaced layouts. - 'block': Square corners for dense or flush layouts.
+          * Controls the outer shape of the swatch. - `basket`: Rounded corners for spaced layouts. - `block`: Square corners for dense or flush layouts.
           * @vegaVersion 2.82.0
          */
         "shape"?: VegaColorSwatchShape;
@@ -7289,7 +7296,7 @@ declare namespace LocalJSX {
          */
         "size"?: VegaColorSwatchSize;
         /**
-          * Specifies the visual style and prominence of the swatch.    It determines how the swatch will be presented to the user. - 'swatch': Displays the color fill. - 'clear': Displays a diagonal line to indicate no color (clear selection).
+          * Specifies the visual style and prominence of the swatch.    It determines how the swatch will be presented to the user. - `swatch`: Displays the color fill. - `clear`: Displays a diagonal line to indicate no color (clear selection).
           * @vegaVersion 2.82.0
          */
         "variant"?: VegaColorSwatchVariant;
@@ -7313,6 +7320,7 @@ declare namespace LocalJSX {
         /**
           * Specifies the formatting method for color values in the color swatch picker. It can be set to a predefined format (`hexColorFormatter`) or a custom   formatter function. The `hexColorFormatter` automatically adds a # prefix on output and removes it on input. A custom formatter function   allows more complex formatting logic based on the processing stage (input or output). Applies only when `showInput` is set to `true`.
           * @vegaVersion 2.84.0
+          * @defaultValue hexColorFormatter
          */
         "inputFormatter"?: VegaColorSwatchPickerFormatOption;
         /**
@@ -7323,6 +7331,7 @@ declare namespace LocalJSX {
         /**
           * The icon for the custom color input in the color swatch picker popover. Specifies the icon displayed in the custom color input field   within the color swatch picker popover.
           * @vegaVersion 2.84.0
+          * @defaultValue hexColorIcon
          */
         "inputPrefixIcon"?: string;
         /**
@@ -11188,6 +11197,12 @@ declare namespace LocalJSX {
           * @vegaVersion 2.0.0
          */
         "onRowClick"?: (event: VegaTableCustomEvent<VegaTableRowClickPropType>) => void;
+        /**
+          * An event emitter notifying when a row is drag and drop,     it include full lifecycle, like drag start, drag, drag enter, drag leave, drag over, drop and drag end.
+          * @eventSemantics namespace:native
+          * @vegaVersion 2.85.0
+         */
+        "onRowDragDrop"?: (event: VegaTableCustomEvent<DragDropEventPayload>) => void;
         /**
           * An event emitter notifying the expanded event of a row    in the table.
           * @eventSemantics namespace:native
@@ -11228,6 +11243,11 @@ declare namespace LocalJSX {
           * @vegaVersion 1.3.0
          */
         "onVegaRowClick"?: (event: VegaTableCustomEvent<VegaTableRowClickPropType>) => void;
+        /**
+          * An event emitter notifying when a row is drag and drop,    it include full lifecycle, like drag start, drag, drag enter, drag leave, drag over, drop and drag end.
+          * @vegaVersion 2.85.0
+         */
+        "onVegaRowDragDrop"?: (event: VegaTableCustomEvent<DragDropEventPayload>) => void;
         /**
           * An event emitter notifying the expanded event of a row    in the table.
           * @vegaVersion 2.24.0
@@ -11273,11 +11293,16 @@ declare namespace LocalJSX {
           * @vegaVersion 1.3.0
          */
         "rowDivider"?: boolean;
+        /**
+          * Specifies whether the table supports row dragging for reordering.
+          * @vegaVersion 2.85.0
+         */
+        "rowDraggable"?: boolean;
         /**
           * Indicates whether the row is expandable.
           * @vegaVersion 1.3.0
          */
-        "rowExpandable"?: boolean;
+        "rowExpandable"?: VegaTableRowExpandableType;
         /**
           * Defines a unique key for each row in the table.
           * @vegaVersion 1.9.2

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

@@ -13,5 +13,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", "suggestionItemClick", "nativeInputChange", "sourceCodeChange"];
+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", "sourceCodeChange", "rowDragDrop"];
 export declare const CssStates: readonly ["default", "hover", "active", "focus-visible"];

package/dist/types/global/icons/grip-dots-vertical.d.ts

@@ -0,0 +1,3 @@
+import { IconPayload } from '../../helpers/icon/interface';
+declare const _default: IconPayload;
+export default _default;

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

@@ -55,6 +55,7 @@ export declare const VegaFormSubmit: VegaEventID;
 export declare const VegaFormReset: VegaEventID;
 export declare const VegaRowClick: VegaEventID;
 export declare const VegaRowExpand: VegaEventID;
+export declare const VegaRowDragDrop: VegaEventID;
 export declare const VegaSelectChange: VegaEventID;
 export declare const VegaRowSelect: VegaEventID;
 export declare const VegaRowSelectAll: VegaEventID;

package/dist/types/helpers/immutable/immutable-map.d.ts

@@ -68,9 +68,12 @@ export declare class ImmutableMap<K, V> implements Immutable<Map<K, V>> {
    *
    * @typedef K generic type
    * @typedef V generic type
+   * @param {boolean} [withMutation=true] - The `withMutation` parameter is a boolean that determines whether the `clear` operation should be performed using the `withMutation` method or not.
+   * 		If `withMutation` is set to `true`, the `clear` operation will be performed using the `withMutation` method, which allows for efficient batch updates to the map.
+   * 		If `withMutation` is set to `false`, the `clear` operation will be performed by directly clearing the underlying map without using the `withMutation` method. The default value for `withMutation` is `true`.
    * @returns {ImmutableMap<K, V>} The method is returning an ImmutableMap<K, V>.
    */
-  clear(): ImmutableMap<K, V>;
+  clear(withMutation?: boolean): ImmutableMap<K, V>;
   /**
    * The function is called when the map is mutated
    *

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

@@ -0,0 +1,260 @@
+import { VegaSlimmer } from '../../vega-slimmer/vega-slimmer-core';
+import { Nullable } from '../../types/general';
+import { DragDropEventPayload } from '../../types/ui.type';
+export declare type DraggableElementEntry = {
+  /**
+   * Returns the container element whose direct children are the sortable items.
+   * Can be an HTMLElement or a Vega component's shadow-root child.
+   */
+  container: () => Nullable<HTMLElement>;
+  /**
+   * CSS selector that identifies each draggable item within the container.
+   *
+   * Example: `vega-table-row`
+   */
+  itemSelector: string;
+  /**
+   * CSS selector that identifies the element that starts dragging.
+   * The selector is matched against the event composed path.
+   *
+   * Example: While item is a container, the trigger is a specific handle element inside it, e.g. `td.vega-table-draggable-column`
+   */
+  triggerElementSelector?: string;
+  /**
+   * CSS selector for the element that should receive drag-related styles.
+   * The selector is resolved relative to each item. Shadow-root content is checked first.
+   * If omitted, the item element itself receives the styles.
+   *
+   * Example: `tr.vega-table-row`
+   */
+  visualElementSelector?: string;
+  /**
+   * Full lifecycle callbacks for drag drop progress.
+   * The callback receives the current drag state and relevant item details, and is responsible for emitting corresponding events.
+   *
+   * @param {DragDropEventPayload} detail - An object containing details about the drag event.
+   */
+  onDragDrop?: (detail: DragDropEventPayload) => void;
+};
+/**
+ * Makes the direct children of a container element sortable via pointer events.
+ * This works across shadow DOM boundaries because pointer events are composed.
+ */
+export declare class DraggableElementSlimmer extends VegaSlimmer {
+  private static readonly DRAG_THRESHOLD;
+  isDraggable: boolean;
+  private entry;
+  private activePointerId;
+  private activeItem;
+  private isDragging;
+  private startX;
+  private startY;
+  private dragFromIndex;
+  private dragToIndex;
+  private currentOverItem;
+  private currentOverIndex;
+  private activeItemHeight;
+  private cachedItems;
+  private cachedItemDraggableMap;
+  /**
+   * Re-registers pointer event listeners when the host component is re-attached to the DOM after a prior disconnection.
+   */
+  connectedCallback(): void;
+  /**
+   * Removes all pointer event listeners and clears drag state when the host component is detached from the DOM.
+   */
+  disconnectedCallback(): void;
+  /**
+   * Registers pointer event listeners once the host component has finished its initial render.
+   */
+  componentDidLoad(): void;
+  constructor(entry: DraggableElementEntry);
+  /**
+   * Updates the slimmer's draggable state in response to changes in the host component's `rowDraggable` property.
+   */
+  watchIsDraggable(): void;
+  /**
+   * Initializes the slimmer by attaching pointer event listeners if `isDraggable` is true.
+   */
+  private init;
+  /**
+   * Cleans up the slimmer by removing pointer event listeners and resetting all drag state.
+   */
+  private destroy;
+  /**
+   * Attaches `pointerdown` on the container and `pointermove` / `pointerup` / `pointercancel` on the window.
+   */
+  private listenPointerEvents;
+  /**
+   * Removes all pointer event listeners that were registered by {@link listenPointerEvents}.
+   */
+  private removePointerListeners;
+  /**
+   * Handles the `pointerdown` event. Validates that the event originated from the trigger element
+   * and initiates a drag session for the matched item.
+   *
+   * @param {PointerEvent} e - The pointer event fired on the container.
+   */
+  private onPointerDown;
+  /**
+   * Handles the `pointermove` event. Once the drag threshold is crossed, updates the dragged
+   * element's visual position and recalculates the current drop target.
+   *
+   * @param {PointerEvent} e - The pointer event fired on the window.
+   */
+  private onPointerMove;
+  /**
+   * Handles the `pointerup` event. Finalizes the drag and fires the reorder callback
+   * if the item was released at a different position.
+   *
+   * @param {PointerEvent} e - The pointer event fired on the window.
+   */
+  private onPointerUp;
+  /**
+   * Handles the `pointercancel` event. Aborts the active drag session and restores all
+   * inline styles to their pre-drag state. Only responds to the active pointer.
+   *
+   * @param {PointerEvent} e - The pointer event fired on the window.
+   */
+  private onPointerCancel;
+  /**
+   * Initializes all drag state for the given item. Caches the current item list,
+   * records the pointer origin, and captures the item height used for sibling offset calculations.
+   *
+   * @param {HTMLElement} item - The draggable item element that was grabbed.
+   * @param {PointerEvent} e - The originating `pointerdown` event.
+   */
+  private startDrag;
+  /**
+   * Marks the interaction as an active drag after threshold crossing.
+   */
+  private beginDragging;
+  /**
+   * Translates the dragged item's visual element to follow the pointer and lifts it
+   * above sibling items by applying `zIndex` and disabling its pointer events.
+   *
+   * @param {PointerEvent} e - The current `pointermove` event.
+   */
+  private syncActiveVisual;
+  /**
+   * Resolves the item currently under the pointer and updates `dragToIndex`,
+   * then applies slot-shift transforms to all sibling items.
+   *
+   * @param {PointerEvent} e - The current `pointermove` event.
+   */
+  private updateDropTarget;
+  /**
+   * Completes the drag session. Captures the final `fromIndex` and `toIndex` before
+   * resetting state, then fires `onReorder` if the item was moved to a new position.
+   */
+  private finishDrag;
+  /**
+   * Clears all inline drag styles applied to cached items and resets every
+   * drag-related state field to its initial value.
+   */
+  private resetDragState;
+  /**
+   * Invokes the container factory function to retrieve the current container element.
+   *
+   * @returns {Nullable<HTMLElement>} The resolved container element, or `null` if the factory throws.
+   */
+  private getContainer;
+  /**
+   * Performs a live DOM query for all elements matching `itemSelector` within the container.
+   *
+   * @returns {HTMLElement[]} An array of matched item elements, or an empty array if the container is unavailable.
+   */
+  private queryItems;
+  /**
+   * Returns the cached item list during an active drag session.
+   * Falls back to a live DOM query when no drag is in progress.
+   *
+   * @returns {HTMLElement[]} The current list of draggable item elements.
+   */
+  private getItems;
+  /**
+   * Returns the zero-based index of the given element within the current item list.
+   *
+   * @param {HTMLElement} target - The element to locate.
+   * @returns {number} The index of the element, or `-1` if it is not found.
+   */
+  private getItemIndex;
+  /**
+   * Resolves the element that should receive drag-related inline styles for a given item.
+   * Checks the item's shadow root first, then its light DOM children, then falls back to the item itself.
+   *
+   * @param {HTMLElement} item - The draggable item element.
+   * @returns {HTMLElement} The visual target element for style application.
+   */
+  private getVisualElement;
+  /**
+   * Resolves the element that should receive drag-related inline styles for a given item.
+   * Checks the item's shadow root first, then its light DOM children, then falls back to the item itself.
+   *
+   * @param {HTMLElement} item - The draggable item element.
+   * @returns {HTMLElement} The visual target element for style application.
+   */
+  private resolveVisualElement;
+  /**
+   * Caches each draggable item using the item as the map key and stores its resolved visual element
+   * together with the visual element's original inline style for precise restoration after dragging.
+   */
+  private cacheItems;
+  /**
+   * Walks the event's composed path to find the matching item element.
+   * When `requireTriggerMatch` is `true`, also verifies that the event originated
+   * inside the configured trigger element; returns `null` if either condition fails.
+   *
+   * @param {Event} e - The event whose composed path is inspected.
+   * @param {boolean} requireTriggerMatch - When `true`, the item is only returned if the trigger element was also matched.
+   * @returns {Nullable<HTMLElement>} The matched item element, or `null` if not found or trigger requirement not met.
+   */
+  private getItemFromComposedPath;
+  /**
+   * Translates sibling items up or down to visually make space for the dragged item at its current drop target.
+   * Items within the affected index range shift by one item height; all others are reset to their natural position.
+   */
+  private applyLayoutTransforms;
+  /**
+   * Calculates the resolved drop index based on whether the pointer is above or below
+   * the midpoint of the hovered item. The slot only switches after crossing the 50% mark,
+   * preventing index jitter at slot boundaries.
+   *
+   * @param {HTMLElement} overItem - The item element currently under the pointer.
+   * @param {number} pointerClientY - The vertical client coordinate of the pointer.
+   * @returns {number} The resolved zero-based index where the dragged item would be inserted.
+   */
+  private getResolvedDropIndex;
+  /**
+   * Checks whether the given pointer event belongs to the pointer that started the current drag session.
+   *
+   * @param {PointerEvent} e - The pointer event to test.
+   * @returns {boolean} `true` if the event's `pointerId` matches the active drag pointer.
+   */
+  private isCurrentPointEvent;
+  /**
+   * Checks whether the pointer has moved at least `DRAG_THRESHOLD` pixels (combined X + Y delta)
+   * from its origin, or whether a drag is already in progress.
+   *
+   * @param {PointerEvent} e - The current `pointermove` event.
+   * @returns {boolean} `true` if the drag threshold has been crossed or dragging is already active.
+   */
+  private hasCrossedDragThreshold;
+  /**
+   * Emits the drag lifecycle callback while the pointer is moving.
+   */
+  private emitDrag;
+  /**
+   * Emits a drag-leave lifecycle callback when the pointer exits a hovered item.
+   *
+   * @param {Nullable<number>} toIndex - Index of the item being left.
+   * @param {Nullable<HTMLElement>} toItem - Item element being left.
+   */
+  private emitDragLeave;
+  /**
+   * Emits a drag lifecycle payload to consumers.
+   *
+   * @param {DragDropEventStatus} status - Current lifecycle phase.
+   */
+  private onDragDrop;
+}

package/dist/types/helpers/slimmers/popover-nested-slot-projection-slimmer.d.ts

@@ -0,0 +1,65 @@
+import { VegaSlimmer } from '../../vega-slimmer/vega-slimmer-core';
+declare type GetContainerRef = () => HTMLElement | undefined;
+/**
+ * Projects a light-DOM slot element into a container that lives inside a `vega-popover`'s `popover` slot.
+ *
+ * Why this slimmer exists:
+ * `vega-popover` appends its `popover` slot content to a different shadow root (the appender), which breaks
+ * normal slot projection for any extra slots declared inside that popover content. To support customization
+ * via additional slots (e.g. a left-side panel), the host component must imperatively move the slot element
+ * into the rendered container on every render, and observe DOM mutations to keep the projection in sync when
+ * consumers add, replace, or remove the slot at runtime.
+ *
+ * Usage:
+ * 1. Inject this slimmer into the component with the slot name and a getter returning the container ref.
+ * 2. Call `hasSlot()` in the renderer to conditionally render the container wrapper.
+ *
+ * Lifecycle:
+ * - `componentWillLoad`: capture the current slot element and set up observers.
+ * - `componentDidRender`: append the slot element into the container when needed.
+ * - `disconnectedCallback`: disconnect observers.
+ */
+export declare class PopoverNestedSlotProjectionSlimmer extends VegaSlimmer {
+  protected host: HTMLElement;
+  private slotName;
+  private getContainerRef;
+  private slotElement;
+  private hostMutationObserver;
+  private containerMutationObserver;
+  constructor(slotName: string, getContainerRef: GetContainerRef);
+  /**
+   * Returns whether the host currently has a matching slot element.
+   *
+   * @returns {boolean} True if a slot element is present.
+   */
+  hasSlot(): boolean;
+  /**
+   * Captures the current slot element from the host's light DOM and initializes the mutation observers
+   * that keep the projection in sync with runtime changes.
+   */
+  detectSlot(): void;
+  /**
+   * Appends the slot element into the container after each render. The popover moves its `popover` slot
+   * content into a different shadow root, so normal slot projection cannot keep the nested slot attached.
+   */
+  appendSlotContent(): void;
+  /**
+   * Disconnects the mutation observers when the component is removed from the DOM.
+   */
+  cleanup(): void;
+  /**
+   * Builds the CSS selector for the configured slot name.
+   *
+   * @returns {string} The attribute selector string.
+   */
+  private slotSelector;
+  /**
+   * Syncs the stored slot reference with dynamic light-DOM additions or replacements.
+   */
+  private syncSlotElementFromHost;
+  /**
+   * Syncs the stored slot reference when the appended slot element is removed from the container.
+   */
+  private syncRemovedSlotElement;
+}
+export {};

package/dist/types/types/components.type.d.ts

@@ -9,6 +9,7 @@ export {
 	BoxDisplayType,
 	CornersType,
 	CssStatesType,
+	DragDropEventPayload,
 	ElementAppenderAlignmentType,
 	ElementAppenderPlacementType,
 	FlexAlignItemType,
@@ -253,6 +254,7 @@ export {
 	VegaTablePinnedType,
 	VegaTableRowClickEvent,
 	VegaTableRowClickPropType,
+	VegaTableRowExpandableType,
 	VegaTableRowExpandEvent,
 	VegaTableRowExpandEventDetail,
 	VegaTableRowSelectAllEventDetail,

package/dist/types/types/public-api.d.ts

@@ -57,3 +57,4 @@ export type { VegaRTELogicControlBlock } from '../components/vega-rich-text-edit
 export type { VegaFunctionBlock } from '../components/vega-rich-text-editor/extensions/functions/dto/function-block';
 export type { StringFormatStrategy } from '../helpers/formatter/string-formatter/string-format-strategy.abstract';
 export type { VegaPaginationPageSizeLabeledOption } from '../components/vega-pagination/types';
+export type { VegaColorFormatter, VegaColorStageType, } from '../components/vega-color-swatch/vega-color-swatch-picker/types';