@dynatrace/strato-components 3.12.2 → 3.13.0

package/tables/DataTable/features/RowInteractivity/RowInteractivity.css

@@ -1,4 +1,4 @@
-._15silbj0-3-12-2 {
+._15silbj0-3-13-0 {
   box-sizing: border-box;
   appearance: none;
   outline: 0;
@@ -7,7 +7,7 @@
   position: relative;
   cursor: pointer;
 }
-._15silbj0-3-12-2::after {
+._15silbj0-3-13-0::after {
   content: "";
   position: absolute;
   top: 0;
@@ -20,55 +20,55 @@
   pointer-events: none;
   z-index: 4;
 }
-._15silbj1-3-12-2::after {
+._15silbj1-3-13-0::after {
   border-color: var(--dt-colors-border-primary-accent, #464cce);
 }
-._15silbj1-3-12-2:hover {
+._15silbj1-3-13-0:hover {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbj1-3-12-2:hover::after {
+._15silbj1-3-13-0:hover::after {
   border-color: var(--dt-colors-border-primary-accent, #464cce);
 }
-._15silbj3-3-12-2 {
+._15silbj3-3-13-0 {
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
 }
-._15silbj3-3-12-2::after {
+._15silbj3-3-13-0::after {
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
   border-width: 0;
 }
-._15silbj4-3-12-2 {
+._15silbj4-3-13-0 {
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
 }
-._15silbj4-3-12-2::after {
+._15silbj4-3-13-0::after {
   border-color: var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._ytdpswb-3-12-2 ._14sp6az6-3-12-2._15silbj7-3-12-2::after {
+._ytdpswb-3-13-0 ._14sp6az6-3-13-0._15silbj7-3-13-0::after {
   border-bottom-right-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
   border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._ytdpswd-3-12-2 ._14sp6az6-3-12-2._15silbj7-3-12-2::after {
+._ytdpswd-3-13-0 ._14sp6az6-3-13-0._15silbj7-3-13-0::after {
   border-bottom-right-radius: 0;
   border-bottom-left-radius: calc(var(--dt-borders-radius-container-subdued, 6px) - var(--dt-borders-width-emphasized, 2px));
 }
-._15silbj8-3-12-2 {
+._15silbj8-3-13-0 {
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
 }
-._15silbj9-3-12-2 {
+._15silbj9-3-13-0 {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbj9-3-12-2::after {
+._15silbj9-3-13-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-primary-accent, #464cce), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._15silbja-3-12-2::after {
+._15silbja-3-13-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._15silbjb-3-12-2 {
+._15silbjb-3-13-0 {
   background-color: var(--dt-colors-background-container-primary-default, #f1f2f9);
 }
-._15silbjb-3-12-2::after {
+._15silbjb-3-13-0::after {
   border-width: 0;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-primary-accent, #464cce);
 }

package/tables/DataTable/features/RowInteractivity/RowInteractivity.d.ts

@@ -1,47 +1,48 @@
-import { type Row, type RowData, type Table_Internal, type TableFeature, type TableFeatures, type Updater } from '@tanstack/react-table';
+import { type Row, type RowData, type Table, type TableFeature, type Updater } from '@tanstack/react-table';
 import { type MouseEvent as ReactMouseEvent } from 'react';
-import type { DataTableRowActivationEvent, RowInteractivityFeatureConstructors } from './row-interactivity-types.js';
+import type { DataTableRowActivationEvent } from './row-interactivity-types.js';
+import type { TDataTableFeatures } from '../types/features.types.js';
 /**
  * Activates a given row for the row interactivity
  * @internal
  */
-export declare function table_setActiveRow<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, updater: Updater<string | null>, event?: DataTableRowActivationEvent): void;
+export declare function table_setActiveRow<TData extends RowData>(table: Table<TDataTableFeatures, TData>, updater: Updater<string | null>, event?: DataTableRowActivationEvent): void;
 /**
  * Sets a given row as hovered on the table instance.
  * @internal
  */
-export declare function table_setHoveredRow<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, rowId: string | null): void;
+export declare function table_setHoveredRow<TData extends RowData>(table: Table<TDataTableFeatures, TData>, rowId: string | null): void;
 /**
  * Gets a given row as hovered on the table instance.
  * @internal
  */
-export declare function table_getHoveredRow<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>): string | null;
+export declare function table_getHoveredRow<TData extends RowData>(table: Table<TDataTableFeatures, TData>): string | null;
 /**
  * Handles mouse over events for interactive rows.
  * @internal
  */
-export declare function table_handleInteractiveRowMouseOver<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
+export declare function table_handleInteractiveRowMouseOver<TData extends RowData>(table: Table<TDataTableFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
 /**
  * Handles mouse leave events for interactive rows.
  * @internal
  */
-export declare function table_handleInteractiveRowMouseLeave<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
+export declare function table_handleInteractiveRowMouseLeave<TData extends RowData>(table: Table<TDataTableFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
 /**
  * Handles click events for interactive rows.
  * @internal
  */
-export declare function table_handleInteractiveRowClick<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
+export declare function table_handleInteractiveRowClick<TData extends RowData>(table: Table<TDataTableFeatures, TData>, event: ReactMouseEvent<HTMLDivElement>): void;
 /**
  * Returns a boolean value if the row is currently activated.
  * @internal
  */
-export declare function row_getIsActivated<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>): boolean;
+export declare function row_getIsActivated<TData extends RowData>(row: Row<TDataTableFeatures, TData>): boolean;
 /**
  * Activates the row, if it is not activated.
  * Deactivates the row, if it is currently activated.
  * @internal
  */
-export declare function row_toggleActivated<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>, event?: DataTableRowActivationEvent): void;
+export declare function row_toggleActivated<TData extends RowData>(row: Row<TDataTableFeatures, TData>, event?: DataTableRowActivationEvent): void;
 /**
  * DEPRECATION: [APPDEV-15075] BREAKING-CHANGE: Remove rowInteractivity link
  */
@@ -49,16 +50,16 @@ export declare function row_toggleActivated<TFeatures extends TableFeatures, TDa
  * Gets the link for the row if the `getLinkForRow` option is provided.
  * @internal
  */
-export declare function row_getLinkForRow<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>): string | undefined;
+export declare function row_getLinkForRow<TData extends RowData>(row: Row<TDataTableFeatures, TData>): string | undefined;
 /**
  * Constructs the column row details for the table,
  * including API implementations and prototype assignments.
  * @internal
  */
-export declare function constructRowInteractivityFeature<TFeatures extends TableFeatures, TData extends RowData>(): TableFeature<RowInteractivityFeatureConstructors<TFeatures, TData>>;
+export declare function constructRowInteractivityFeature(): TableFeature;
 /**
  * Feature implementation for Row Details.
  * @internal
  */
-export declare const DataTableRowInteractivityFeature: TableFeature<RowInteractivityFeatureConstructors<TableFeatures, RowData>>;
+export declare const DataTableRowInteractivityFeature: TableFeature;
 //# sourceMappingURL=RowInteractivity.d.ts.map

package/tables/DataTable/features/RowInteractivity/RowInteractivity.js

@@ -44,6 +44,7 @@ var import_react_table = require("@tanstack/react-table");
 var styles = __toESM(require("./RowInteractivity.sty.js"));
 var import_is_target_interactive = require("../../../utils/is-target-interactive.js");
 var import_constants = require("../../constants.js");
+var import_table_types = require("../types/table.types.js");
 function removeHoverStyles(virtualizationContainer) {
   if (virtualizationContainer) {
     const hoveredRows = virtualizationContainer.querySelectorAll(
@@ -136,14 +137,14 @@ function table_handleInteractiveRowMouseOver(table, event) {
   }
 }
 function table_handleInteractiveRowMouseLeave(table, event) {
-  if (table.optionsStore.state.enableRowInteractivity !== true) {
+  if (table.options.enableRowInteractivity !== true) {
     return;
   }
   table.setHoveredRow(null);
   removeHoverStyles(table.getRowVirtualizationContainer());
 }
 function table_handleInteractiveRowClick(table, event) {
-  if (table.optionsStore.state.enableRowInteractivity !== true) {
+  if (table.options.enableRowInteractivity !== true) {
     return;
   }
   const rowInfo = getRowInfoFromMouseEvent(event);
@@ -157,7 +158,7 @@ function table_handleInteractiveRowClick(table, event) {
   }
 }
 function row_getCanActivateRow(row) {
-  return row.table.optionsStore.state.enableRowInteractivity === true;
+  return row.table.options.enableRowInteractivity === true;
 }
 function row_getIsActivated(row) {
   return row.table.atoms.activeRow?.get() === row.id;
@@ -166,7 +167,7 @@ function row_toggleActivated(row, event) {
   row.table.setActiveRow(row.getIsActivated() ? null : row.id, event);
 }
 function row_getLinkForRow(row) {
-  return row.table.optionsStore.state.getLinkForRow?.(row);
+  return row.table.options.getLinkForRow?.(row);
 }
 function constructRowInteractivityFeature() {
   return {
@@ -176,43 +177,47 @@ function constructRowInteractivityFeature() {
         ...initialState
       };
     },
-    assignRowPrototype: (prototype, table) => {
-      (0, import_react_table.assignPrototypeAPIs)(
-        "DataTableRowInteractivityFeature",
-        prototype,
-        table,
-        {
-          row_getCanActivateRow: { fn: (row) => row_getCanActivateRow(row) },
-          row_getIsActivated: { fn: (row) => row_getIsActivated(row) },
-          row_toggleActivated: {
-            fn: (row, event) => row_toggleActivated(row, event)
+    assignRowPrototype: (0, import_table_types.createPrototypeConstructor)(
+      (prototype, table) => {
+        (0, import_react_table.assignPrototypeAPIs)(
+          "DataTableRowInteractivityFeature",
+          prototype,
+          table,
+          {
+            row_getCanActivateRow: { fn: (row) => row_getCanActivateRow(row) },
+            row_getIsActivated: { fn: (row) => row_getIsActivated(row) },
+            row_toggleActivated: {
+              fn: (row, event) => row_toggleActivated(row, event)
+            },
+            row_getLinkForRow: { fn: (row) => row_getLinkForRow(row) }
+          }
+        );
+      }
+    ),
+    constructTableAPIs: (0, import_table_types.createTableConstructor)(
+      (table) => {
+        (0, import_react_table.assignTableAPIs)("DataTableRowInteractivityFeature", table, {
+          table_setActiveRow: {
+            fn: (updater, event) => table_setActiveRow(table, updater, event)
           },
-          row_getLinkForRow: { fn: (row) => row_getLinkForRow(row) }
-        }
-      );
-    },
-    constructTableAPIs: (table) => {
-      (0, import_react_table.assignTableAPIs)("DataTableRowInteractivityFeature", table, {
-        table_setActiveRow: {
-          fn: (updater, event) => table_setActiveRow(table, updater, event)
-        },
-        table_setHoveredRow: {
-          fn: (rowId) => table_setHoveredRow(table, rowId)
-        },
-        table_getHoveredRow: {
-          fn: () => table_getHoveredRow(table)
-        },
-        table_handleInteractiveRowMouseOver: {
-          fn: (event) => table_handleInteractiveRowMouseOver(table, event)
-        },
-        table_handleInteractiveRowMouseLeave: {
-          fn: (event) => table_handleInteractiveRowMouseLeave(table, event)
-        },
-        table_handleInteractiveRowClick: {
-          fn: (event) => table_handleInteractiveRowClick(table, event)
-        }
-      });
-    }
+          table_setHoveredRow: {
+            fn: (rowId) => table_setHoveredRow(table, rowId)
+          },
+          table_getHoveredRow: {
+            fn: () => table_getHoveredRow(table)
+          },
+          table_handleInteractiveRowMouseOver: {
+            fn: (event) => table_handleInteractiveRowMouseOver(table, event)
+          },
+          table_handleInteractiveRowMouseLeave: {
+            fn: (event) => table_handleInteractiveRowMouseLeave(table, event)
+          },
+          table_handleInteractiveRowClick: {
+            fn: (event) => table_handleInteractiveRowClick(table, event)
+          }
+        });
+      }
+    )
   };
 }
 const DataTableRowInteractivityFeature = constructRowInteractivityFeature();

package/tables/DataTable/features/RowInteractivity/RowInteractivity.sty.js

@@ -25,4 +25,4 @@ var import_DataTableVirtualizationContainer_css_ts_vanilla = require("../../comp
 var import_DataTable_css_ts_vanilla = require("../../DataTable.css");
 var import_RowInteractivity_css_ts_vanilla = require("./RowInteractivity.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var interactiveRow = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_15silbj0-3-12-2", variantClassNames: { active: { true: "_15silbj1-3-12-2", false: "_15silbj2-3-12-2" }, focus: { true: "_15silbj3-3-12-2" }, hovered: { true: "_15silbj4-3-12-2" }, singleTone: { true: "_15silbj5-3-12-2", false: "_15silbj6-3-12-2" }, contained: { true: "_15silbj7-3-12-2", false: "_15silbj8-3-12-2" } }, defaultVariants: {}, compoundVariants: [[{ active: true, focus: true }, "_15silbj9-3-12-2"], [{ focus: true, singleTone: true }, "_15silbja-3-12-2"], [{ active: true, focus: true, singleTone: true }, "_15silbjb-3-12-2"]] });
+var interactiveRow = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_15silbj0-3-13-0", variantClassNames: { active: { true: "_15silbj1-3-13-0", false: "_15silbj2-3-13-0" }, focus: { true: "_15silbj3-3-13-0" }, hovered: { true: "_15silbj4-3-13-0" }, singleTone: { true: "_15silbj5-3-13-0", false: "_15silbj6-3-13-0" }, contained: { true: "_15silbj7-3-13-0", false: "_15silbj8-3-13-0" } }, defaultVariants: {}, compoundVariants: [[{ active: true, focus: true }, "_15silbj9-3-13-0"], [{ focus: true, singleTone: true }, "_15silbja-3-13-0"], [{ active: true, focus: true, singleTone: true }, "_15silbjb-3-13-0"]] });

package/tables/DataTable/features/RowInteractivity/hooks/useRowInteractivityProps.d.ts

@@ -1,5 +1,6 @@
-import { type Row, type RowData, type TableFeatures } from '@tanstack/react-table';
+import { type Row, type RowData } from '@tanstack/react-table';
 import type { ScrollToOptions } from '@tanstack/react-virtual';
+import type { TDataTableFeatures } from '../../types/features.types.js';
 /**
  * Provides all necessary props for an interactive row element.
  *
@@ -7,7 +8,7 @@ import type { ScrollToOptions } from '@tanstack/react-virtual';
  * @param scrollToIndex - rowVirtualizer function for scrolling to the row with the specified index
  * @returns className and props for the row element
  */
-export declare function useRowInteractivityProps<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>, scrollToIndex: (index: number, options?: ScrollToOptions) => void): {
+export declare function useRowInteractivityProps<TData extends RowData>(row: Row<TDataTableFeatures, TData>, scrollToIndex: (index: number, options?: ScrollToOptions) => void): {
     rowInteractivityClassName: string;
     rowInteractivityProps: Record<string, unknown> | undefined;
 };

package/tables/DataTable/features/RowInteractivity/hooks/useRowInteractivityProps.js

@@ -49,7 +49,7 @@ function useRowInteractivityProps(row, scrollToIndex) {
   }
   const isActivated = row.getIsActivated();
   const isAutoActivationEnabled = table.options.enableAutoActivation;
-  const hasPinnedColumns = table.getLeftVisibleLeafColumns().length > 0 || table.getRightVisibleLeafColumns().length > 0;
+  const hasPinnedColumns = table.getStartVisibleLeafColumns().length > 0 || table.getEndVisibleLeafColumns().length > 0;
   const rowInteractivityClassName = styles.interactiveRow({
     hovered: table.getHoveredRow() === row.id,
     active: isActivated,

package/tables/DataTable/features/RowInteractivity/row-interactivity-types.d.ts

@@ -134,14 +134,4 @@ export interface DataTableRowInteractivityRow {
      */
     getLinkForRow: () => string | undefined;
 }
-/**
- * Interface defining the constructors for the row interactivity feature,
- * including the API implementations and prototype assignments.
- */
-export interface RowInteractivityFeatureConstructors<TFeatures extends TableFeatures, TData extends RowData> {
-    Row: DataTableRowInteractivityRow;
-    Table: DataTableRowInteractivityInstance;
-    TableState: DataTableRowInteractivityState;
-    TableOptions: DataTableRowInteractivityOptions<TFeatures, TData>;
-}
 //# sourceMappingURL=row-interactivity-types.d.ts.map

package/tables/DataTable/features/RowInteractivity/useRowInteractivity.d.ts

@@ -1,10 +1,9 @@
-import { type TableOptions } from '@tanstack/react-table';
 import type { DataTableRowInteractivityProps } from './row-interactivity-types.js';
 import type { DataTableRowData } from '../../row-data-types.js';
-import type { TDataTableFeatures } from '../types/features.types.js';
+import type { DataTableOptions } from '../types/table.types.js';
 /**
  * Configuration hook for the rowInteractivity in the DataTable.
  * @internal
  */
-export declare function useRowInteractivity<TData extends DataTableRowData>(props: DataTableRowInteractivityProps<TData>, options: TableOptions<TDataTableFeatures, Exclude<TData, unknown>>): void;
+export declare function useRowInteractivity<TData extends DataTableRowData>(props: DataTableRowInteractivityProps<TData>, options: DataTableOptions<Exclude<TData, unknown>>): void;
 //# sourceMappingURL=useRowInteractivity.d.ts.map

package/tables/DataTable/features/RowInteractivity/useRowInteractivity.js

@@ -38,7 +38,7 @@ function useRowInteractivity(props, options) {
   options.enableRowInteractivity = interactiveRows !== void 0 && interactiveRows !== false;
   const getLinkForRow = (0, import_react.useCallback)(
     (row) => {
-      if (interactiveRows !== void 0 && typeof interactiveRows === "object" && // eslint-disable-next-line @typescript-eslint/no-deprecated
+      if (interactiveRows !== void 0 && typeof interactiveRows === "object" && // oxlint-disable-next-line typescript/no-deprecated
       interactiveRows.link) {
         return interactiveRows.link(row.original);
       }
@@ -72,7 +72,7 @@ function useRowInteractivity(props, options) {
       }
     },
     // We only want to listen to the individual options parts and not the entire options.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // oxlint-disable-next-line react-hooks/exhaustive-deps
     [options.enableRowInteractivity, options.data]
   );
   options.state = {

package/tables/DataTable/features/RowOrder/RowOrder.css

@@ -1,11 +1,11 @@
-._or8s40-3-12-2 {
+._or8s40-3-13-0 {
   cursor: grabbing;
   box-shadow: var(--dt-box-shadows-surface-flat-drag, 0px 0px 0px 1px #2d2e4e08, 0px 1px 2px #2d2e4e0d, 0px 7px 17px -2px #2d2e4e52);
   background-color: var(--dt-colors-background-surface-default, #fff);
   z-index: 4;
   overflow: hidden;
 }
-._or8s41-3-12-2 {
+._or8s41-3-13-0 {
   vertical-align: middle;
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
   padding-left: var(--dt-spacings-size-2, 2px);
@@ -14,21 +14,21 @@
   padding-bottom: 0;
   transition: none;
 }
-._or8s41-3-12-2:active {
+._or8s41-3-13-0:active {
   background: transparent;
 }
-._or8s41-3-12-2:hover {
+._or8s41-3-13-0:hover {
   background: transparent;
 }
-._or8s40-3-12-2 ._or8s41-3-12-2 {
+._or8s40-3-13-0 ._or8s41-3-13-0 {
   cursor: grabbing;
 }
-._or8s42-3-12-2 {
+._or8s42-3-13-0 {
   cursor: not-allowed;
 }
-._or8s43-3-12-2 {
+._or8s43-3-13-0 {
   cursor: grab;
 }
-._or8s44-3-12-2 {
+._or8s44-3-13-0 {
   opacity: 0.2;
 }

package/tables/DataTable/features/RowOrder/RowOrder.d.ts

@@ -1,11 +1,11 @@
-import { type Row, type RowData, type Table_Internal, type TableFeature, type TableFeatures, type Updater } from '@tanstack/react-table';
-import type { DataTableRowOrderState, RowOrderFeatureConstructors } from './row-order-types.js';
+import { type Row, type RowData, type Table, type TableFeature, type Updater } from '@tanstack/react-table';
+import type { DataTableRowOrderState } from './row-order-types.js';
 import type { TDataTableFeatures } from '../types/features.types.js';
 /**
  * Helper function to update the row order state on the table, which can be called from row-level actions to ensure consistent state management.
  * @internal
  */
-export declare function table_setDraggingRowInfo<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, draggingRowInfo: {
+export declare function table_setDraggingRowInfo<TData extends RowData>(table: Table<TDataTableFeatures, TData>, draggingRowInfo: {
     id: string;
     index: number;
     row: Row<TDataTableFeatures, RowData>;
@@ -14,36 +14,36 @@ export declare function table_setDraggingRowInfo<TFeatures extends TableFeatures
  * Helper function to update the row order state on the table, which can be called from row-level actions to ensure consistent state management.
  * @internal
  */
-export declare function table_setRowOrder<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>, updater: Updater<DataTableRowOrderState<TFeatures, TData>['rowOrder']>): void;
+export declare function table_setRowOrder<TData extends RowData>(table: Table<TDataTableFeatures, TData>, updater: Updater<DataTableRowOrderState<TDataTableFeatures, TData>['rowOrder']>): void;
 /**
  * Helper function to access the row model before the row order is applied on the table, which can be called from row-level actions to ensure consistent state management.
  * @internal
  */
-export declare function table_getPreRowOrderRowModel<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>): import("@tanstack/table-core").RowModel<TFeatures, TData>;
+export declare function table_getPreRowOrderRowModel<TData extends RowData>(table: Table<TDataTableFeatures, TData>): import("@tanstack/table-core").RowModel<TDataTableFeatures, TData>;
 /**
  * Helper function to access the row order model on the table, which can be called from row-level actions to ensure consistent state management.
  * @internal
  */
-export declare function table_getRowOrderRowModel<TFeatures extends TableFeatures, TData extends RowData>(table: Table_Internal<TFeatures, TData>): import("@tanstack/table-core").RowModel<TableFeatures, RowData>;
+export declare function table_getRowOrderRowModel<TData extends RowData>(table: Table<TDataTableFeatures, TData>): import("@tanstack/table-core").RowModel<TDataTableFeatures, TData>;
 /**
  * Helper function to determine if a specific row can be dragged, based on the table options and the row's properties.
  * @internal
  */
-export declare function row_getCanDrag<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>): boolean;
+export declare function row_getCanDrag<TData extends RowData>(row: Row<TDataTableFeatures, TData>): boolean;
 /**
  * Helper function to determine if a row with disabled drag and drop should be locked in place based on the table options and the row's position in the table.
  * @internal
  */
-export declare function row_getDisabledRowDragAndDropLockPosition<TFeatures extends TableFeatures, TData extends RowData>(row: Row<TFeatures, TData>): boolean | 'start' | 'end' | undefined;
+export declare function row_getDisabledRowDragAndDropLockPosition<TData extends RowData>(row: Row<TDataTableFeatures, TData>): boolean | 'start' | 'end' | undefined;
 /**
  * Constructs the column row ordering for the table,
  * including API implementations and prototype assignments.
  * @internal
  */
-export declare function constructRowOrderFeature<TFeatures extends TableFeatures, TData extends RowData>(): TableFeature<RowOrderFeatureConstructors<TFeatures, TData>>;
+export declare function constructRowOrderFeature<TData extends RowData>(): TableFeature;
 /**
  * Feature implementation for Row Order.
  * @internal
  */
-export declare const DataTableRowOrderFeature: TableFeature<RowOrderFeatureConstructors<TableFeatures, RowData>>;
+export declare const DataTableRowOrderFeature: TableFeature;
 //# sourceMappingURL=RowOrder.d.ts.map

package/tables/DataTable/features/RowOrder/RowOrder.js

@@ -28,6 +28,7 @@ __export(RowOrder_exports, {
 });
 module.exports = __toCommonJS(RowOrder_exports);
 var import_react_table = require("@tanstack/react-table");
+var import_table_types = require("../types/table.types.js");
 function table_setDraggingRowInfo(table, draggingRowInfo) {
   table.baseAtoms.draggingRowInfo.set(draggingRowInfo);
 }
@@ -41,7 +42,7 @@ function table_getPreRowOrderRowModel(table) {
   return table.getExpandedRowModel();
 }
 function table_getRowOrderRowModel(table) {
-  table._rowModels.rowOrderRowModel ??= table.options._rowModels?.rowOrderRowModel?.(table);
+  table._rowModels.rowOrderRowModel ??= table.options.rowOrderRowModel?.(table);
   if (!table.options.enableRowOrdering || !table._rowModels.rowOrderRowModel) {
     return table.getPreRowOrderRowModel();
   }
@@ -60,7 +61,7 @@ function row_getCanDrag(row) {
   return true;
 }
 function row_getDisabledRowDragAndDropLockPosition(row) {
-  return row.table.optionsStore.state.lockDisabledRows ?? false;
+  return row.table.options.lockDisabledRows ?? false;
 }
 function constructRowOrderFeature() {
   return {
@@ -71,30 +72,34 @@ function constructRowOrderFeature() {
         ...initialState
       };
     },
-    assignRowPrototype: (prototype, table) => {
-      (0, import_react_table.assignPrototypeAPIs)("DataTableRowOrderFeature", prototype, table, {
-        row_getCanDrag: { fn: (row) => row_getCanDrag(row) },
-        row_getDisabledRowDragAndDropLockPosition: {
-          fn: (row) => row_getDisabledRowDragAndDropLockPosition(row)
-        }
-      });
-    },
-    constructTableAPIs: (table) => {
-      (0, import_react_table.assignTableAPIs)("DataTableRowOrderFeature", table, {
-        table_setDraggingRowInfo: {
-          fn: (draggingRowInfo) => table_setDraggingRowInfo(table, draggingRowInfo)
-        },
-        table_setRowOrder: {
-          fn: (updater) => table_setRowOrder(table, updater)
-        },
-        table_getPreRowOrderRowModel: {
-          fn: () => table_getPreRowOrderRowModel(table)
-        },
-        table_getRowOrderRowModel: {
-          fn: () => table_getRowOrderRowModel(table)
-        }
-      });
-    }
+    assignRowPrototype: (0, import_table_types.createPrototypeConstructor)(
+      (prototype, table) => {
+        (0, import_react_table.assignPrototypeAPIs)("DataTableRowOrderFeature", prototype, table, {
+          row_getCanDrag: { fn: (row) => row_getCanDrag(row) },
+          row_getDisabledRowDragAndDropLockPosition: {
+            fn: (row) => row_getDisabledRowDragAndDropLockPosition(row)
+          }
+        });
+      }
+    ),
+    constructTableAPIs: (0, import_table_types.createTableConstructor)(
+      (table) => {
+        (0, import_react_table.assignTableAPIs)("DataTableRowOrderFeature", table, {
+          table_setDraggingRowInfo: {
+            fn: (draggingRowInfo) => table_setDraggingRowInfo(table, draggingRowInfo)
+          },
+          table_setRowOrder: {
+            fn: (updater) => table_setRowOrder(table, updater)
+          },
+          table_getPreRowOrderRowModel: {
+            fn: () => table_getPreRowOrderRowModel(table)
+          },
+          table_getRowOrderRowModel: {
+            fn: () => table_getRowOrderRowModel(table)
+          }
+        });
+      }
+    )
   };
 }
 const DataTableRowOrderFeature = constructRowOrderFeature();

package/tables/DataTable/features/RowOrder/RowOrder.sty.js

@@ -24,6 +24,6 @@ __export(RowOrder_css_exports, {
 module.exports = __toCommonJS(RowOrder_css_exports);
 var import_RowOrder_css_ts_vanilla = require("./RowOrder.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var disabledNonTargetRow = "_or8s44-3-12-2";
-var dndHandle = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_or8s41-3-12-2", variantClassNames: { disabled: { true: "_or8s42-3-12-2", false: "_or8s43-3-12-2" } }, defaultVariants: {}, compoundVariants: [] });
-var rowDndOverlay = "_or8s40-3-12-2";
+var disabledNonTargetRow = "_or8s44-3-13-0";
+var dndHandle = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_or8s41-3-13-0", variantClassNames: { disabled: { true: "_or8s42-3-13-0", false: "_or8s43-3-13-0" } }, defaultVariants: {}, compoundVariants: [] });
+var rowDndOverlay = "_or8s40-3-13-0";

package/tables/DataTable/features/RowOrder/components/RowOrderingDragAndDropContext.d.ts

@@ -1,12 +1,13 @@
-import { type Row, type RowData, type TableFeatures } from '@tanstack/react-table';
+import { type Row, type RowData } from '@tanstack/react-table';
 import { type VirtualItem } from '@tanstack/react-virtual';
 import { type JSX, type ReactNode } from 'react';
+import type { TDataTableFeatures } from '../../types/features.types.js';
 /**
  * @internal
  */
-export declare function RowOrderingDragAndDropContext<TFeatures extends TableFeatures, TData extends RowData>({ children, rows, virtualColumns, rowSeparation, }: Readonly<{
+export declare function RowOrderingDragAndDropContext<TData extends RowData>({ children, rows, virtualColumns, rowSeparation, }: Readonly<{
     children: ReactNode;
-    rows: Row<TFeatures, TData>[];
+    rows: Row<TDataTableFeatures, TData>[];
     virtualColumns: VirtualItem[];
     rowSeparation: 'none' | 'horizontalDividers' | 'zebraStripes';
 }>): JSX.Element | undefined;

package/tables/DataTable/features/RowOrder/components/RowOrderingDragAndDropContext.js

@@ -242,7 +242,7 @@ function RowOrderingDragAndDropContext({
     );
     const newRowOrder = [...originalRowOrder];
     const activeRowSubRowsCount = draggingRowInfo.row.getLeafRows().length;
-    const overRowSubRowsCount = (over.data.current?.row).getLeafRows().length;
+    const overRowSubRowsCount = over.data.current?.row?.getLeafRows().length ?? 0;
     const rowsToMove = newRowOrder.splice(fromIndex, 1 + activeRowSubRowsCount);
     newRowOrder.splice(
       fromIndex < toIndex ? toIndex + overRowSubRowsCount - activeRowSubRowsCount : toIndex,

package/tables/DataTable/features/RowOrder/row-order-column-utils.d.ts

@@ -1,7 +1,8 @@
-import type { CellData, ColumnDef, RowData, TableFeatures } from '@tanstack/react-table';
+import type { CellData, ColumnDef, RowData } from '@tanstack/react-table';
+import type { TDataTableFeatures } from '../types/features.types.js';
 /**
  * Helper function to identify the row drag column.
  * @internal
  */
-export declare function isRowDragColumnDef<TFeatures extends TableFeatures, TData extends RowData, TValue extends CellData = CellData>(column: ColumnDef<TFeatures, TData, TValue>): boolean;
+export declare function isRowDragColumnDef<TData extends RowData, TValue extends CellData = CellData>(column: ColumnDef<TDataTableFeatures, TData, TValue>): boolean;
 //# sourceMappingURL=row-order-column-utils.d.ts.map

package/tables/DataTable/features/RowOrder/row-order-model.d.ts

@@ -1,8 +1,9 @@
-import { type RowData, type RowModel, type Table, type TableFeatures } from '@tanstack/react-table';
+import { type RowData, type RowModel, type Table } from '@tanstack/react-table';
+import type { TDataTableFeatures } from '../types/features.types.js';
 /**
  * Row model which reflects the order given by the rowOrder set.
  * @returns new row model reflecting the order.
  * @internal
  */
-export declare function createRowOrderRowModel<TFeatures extends TableFeatures, TData extends RowData = any>(): (table: Table<TFeatures, TData>) => () => RowModel<TFeatures, TData>;
+export declare function createRowOrderRowModel<TData extends RowData = any>(): (table: Table<TDataTableFeatures, TData>) => () => RowModel<TDataTableFeatures, TData>;
 //# sourceMappingURL=row-order-model.d.ts.map