@drivenets/design-system 0.11.1 → 0.12.0

package/dist/index.cjs

@@ -16991,6 +16991,167 @@ const DsStatusBadge = (t0) => {
 	return t12;
 };
 //#endregion
+//#region src/components/ds-status-badge-v2/ds-status-badge-v2.module.scss
+var ds_status_badge_v2_module_default = {
+	"active": "xQkUdW_active",
+	"deprecated": "xQkUdW_deprecated",
+	"execution": "xQkUdW_execution",
+	"icon": "xQkUdW_icon",
+	"iconOnly": "xQkUdW_iconOnly",
+	"in-review": "xQkUdW_in-review",
+	"label": "xQkUdW_label",
+	"medium": "xQkUdW_medium",
+	"not-started": "xQkUdW_not-started",
+	"pending": "xQkUdW_pending",
+	"result-failed": "xQkUdW_result-failed",
+	"result-succeeded": "xQkUdW_result-succeeded",
+	"result-warning": "xQkUdW_result-warning",
+	"root": "xQkUdW_root",
+	"secondary": "xQkUdW_secondary",
+	"small": "xQkUdW_small",
+	"temporary": "xQkUdW_temporary",
+	"textOnly": "xQkUdW_textOnly"
+};
+//#endregion
+//#region src/components/ds-status-badge-v2/phase-config.ts
+const phaseIconMap = Object.freeze({
+	"not-started": "lasso_select",
+	temporary: "hourglass_empty",
+	"in-review": "document_search",
+	pending: "timer_pause",
+	active: "power_settings_circle",
+	execution: "timelapse",
+	"result-succeeded": "verified",
+	"result-warning": "warning",
+	"result-failed": "cancel",
+	deprecated: "inventory_2"
+});
+//#endregion
+//#region src/components/ds-status-badge-v2/ds-status-badge-v2.tsx
+const DsStatusBadgeV2$1 = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(26);
+	const { phase, label, icon, iconOnly: t1, variant: t2, size: t3, className, style, ref, "aria-label": ariaLabel } = t0;
+	const iconOnly = t1 === void 0 ? false : t1;
+	const variant = t2 === void 0 ? "primary" : t2;
+	const size = t3 === void 0 ? "medium" : t3;
+	const resolvedIcon = icon === null ? null : icon ?? phaseIconMap[phase];
+	const hasIcon = resolvedIcon !== null;
+	const isTextOnly = !hasIcon;
+	const tooltipContent = iconOnly ? label : void 0;
+	let t4;
+	if ($[0] !== size) {
+		t4 = size === "small" ? {
+			fontSize: "var(--_badge-icon-size)",
+			width: "var(--_badge-icon-size)",
+			height: "var(--_badge-icon-size)"
+		} : void 0;
+		$[0] = size;
+		$[1] = t4;
+	} else t4 = $[1];
+	const iconStyle = t4;
+	const t5 = ds_status_badge_v2_module_default[phase];
+	const t6 = ds_status_badge_v2_module_default[size];
+	const t7 = variant === "secondary";
+	let t8;
+	if ($[2] !== className || $[3] !== iconOnly || $[4] !== isTextOnly || $[5] !== t5 || $[6] !== t6 || $[7] !== t7) {
+		t8 = (0, classnames.default)(ds_status_badge_v2_module_default.root, t5, t6, {
+			[ds_status_badge_v2_module_default.secondary]: t7,
+			[ds_status_badge_v2_module_default.iconOnly]: iconOnly,
+			[ds_status_badge_v2_module_default.textOnly]: isTextOnly
+		}, className);
+		$[2] = className;
+		$[3] = iconOnly;
+		$[4] = isTextOnly;
+		$[5] = t5;
+		$[6] = t6;
+		$[7] = t7;
+		$[8] = t8;
+	} else t8 = $[8];
+	const rootClass = t8;
+	const t9 = ref;
+	const t10 = ariaLabel ?? label;
+	let t11;
+	if ($[9] !== hasIcon || $[10] !== iconStyle || $[11] !== resolvedIcon) {
+		t11 = hasIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: ds_status_badge_v2_module_default.icon,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
+				icon: resolvedIcon,
+				size: "tiny",
+				filled: true,
+				"aria-hidden": "true",
+				style: iconStyle
+			})
+		});
+		$[9] = hasIcon;
+		$[10] = iconStyle;
+		$[11] = resolvedIcon;
+		$[12] = t11;
+	} else t11 = $[12];
+	let t12;
+	if ($[13] !== iconOnly || $[14] !== label) {
+		t12 = !iconOnly && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTypography, {
+			className: ds_status_badge_v2_module_default.label,
+			variant: "body-xs-reg",
+			children: label
+		});
+		$[13] = iconOnly;
+		$[14] = label;
+		$[15] = t12;
+	} else t12 = $[15];
+	let t13;
+	if ($[16] !== rootClass || $[17] !== style || $[18] !== t10 || $[19] !== t11 || $[20] !== t12 || $[21] !== t9) {
+		t13 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			ref: t9,
+			className: rootClass,
+			style,
+			role: "status",
+			"aria-label": t10,
+			children: [t11, t12]
+		});
+		$[16] = rootClass;
+		$[17] = style;
+		$[18] = t10;
+		$[19] = t11;
+		$[20] = t12;
+		$[21] = t9;
+		$[22] = t13;
+	} else t13 = $[22];
+	const badge = t13;
+	if (iconOnly) {
+		let t14;
+		if ($[23] !== badge || $[24] !== tooltipContent) {
+			t14 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTooltip, {
+				content: tooltipContent,
+				children: badge
+			});
+			$[23] = badge;
+			$[24] = tooltipContent;
+			$[25] = t14;
+		} else t14 = $[25];
+		return t14;
+	}
+	return badge;
+};
+//#endregion
+//#region src/components/ds-status-badge-v2/ds-status-badge-v2.types.ts
+const statusBadgeV2Phases = [
+	"not-started",
+	"temporary",
+	"in-review",
+	"pending",
+	"active",
+	"execution",
+	"result-succeeded",
+	"result-warning",
+	"result-failed",
+	"deprecated"
+];
+const statusBadgeV2Variants = ["primary", "secondary"];
+const statusBadgeV2Sizes = ["medium", "small"];
+//#endregion
+//#region src/components/ds-status-badge-v2/index.ts
+const DsStatusBadgeV2 = withResponsiveProps(DsStatusBadgeV2$1, ["size"]);
+//#endregion
 //#region src/components/ds-stepper/ds-stepper.module.scss
 var ds_stepper_module_default = {
 	"dragHandle": "kFAdma_dragHandle",
@@ -18132,8 +18293,7 @@ var ds_table_header_module_default = {
 	"headerSortContainer": "-2rCNG_headerSortContainer",
 	"pageButtonIcon": "-2rCNG_pageButtonIcon",
 	"pageButtonIconContainer": "-2rCNG_pageButtonIconContainer",
-	"reorderColumn": "-2rCNG_reorderColumn",
-	"selectColumn": "-2rCNG_selectColumn",
+	"selectHeaderCell": "-2rCNG_selectHeaderCell",
 	"sortableHeader": "-2rCNG_sortableHeader",
 	"stickyHeader": "-2rCNG_stickyHeader",
 	"virtualizedHeader": "-2rCNG_virtualizedHeader"
@@ -18173,54 +18333,58 @@ const getColumnSizeStyle = (columnSize, virtualized) => {
 	if (columnSize !== _tanstack_react_table.defaultColumnSizing.size) return { width: columnSize };
 	if (virtualized) return { flex: 1 };
 };
+/**
+* Column id used for the synthetic expander column injected when `expandable` is set.
+*/
+const EXPANDER_COLUMN_ID = "expander";
+/**
+* Column id used for the synthetic selection column injected when `selectable` is set.
+*/
+const SELECT_COLUMN_ID = "select";
+/**
+* Column id used for the synthetic reorder column injected when `reorderable` is set
+* (non-virtualized tables only).
+*/
+const REORDER_COLUMN_ID = "reorder";
 //#endregion
 //#region src/components/ds-table/components/ds-table-header/ds-table-header.tsx
 const DsTableHeader = ({ table }) => {
-	const { stickyHeader, bordered, selectable, reorderable, showSelectAllCheckbox, virtualized } = useDsTableContext();
+	const { stickyHeader, bordered, virtualized } = useDsTableContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHeader, {
 		className: (0, classnames.default)(stickyHeader && ds_table_header_module_default.stickyHeader, virtualized && ds_table_header_module_default.virtualizedHeader),
-		children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TableRow, {
+		children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, {
 			className: (0, classnames.default)(ds_table_header_module_default.headerRow, !bordered && ds_table_header_module_default.headerRowNoBorder, virtualized && ds_table_header_module_default.headerRowVirtualized),
-			children: [
-				selectable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHead, {
-					className: (0, classnames.default)(ds_table_header_module_default.headerCell, ds_table_header_module_default.selectColumn),
-					children: showSelectAllCheckbox && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
-						className: ds_table_shared_module_default.checkboxContainer,
-						checked: table.getIsAllRowsSelected() ? true : table.getIsSomeRowsSelected() ? "indeterminate" : false,
-						onCheckedChange: (checked) => table.toggleAllRowsSelected(!!checked),
-						onClick: (e) => e.stopPropagation()
+			children: headerGroup.headers.map((header) => {
+				const headerStyle = getColumnSizeStyle(header.column.getSize(), virtualized);
+				const canSort = header.column.getCanSort();
+				const isSelectColumn = header.column.id === SELECT_COLUMN_ID;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHead, {
+					className: (0, classnames.default)(ds_table_header_module_default.headerCell, canSort && ds_table_header_module_default.sortableHeader, isSelectColumn && ds_table_header_module_default.selectHeaderCell),
+					onClick: header.column.getToggleSortingHandler(),
+					style: headerStyle,
+					children: header.isPlaceholder ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: ds_table_header_module_default.headerSortContainer,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsStack, {
+							direction: "column",
+							justifyContent: "center",
+							width: "100%",
+							children: (0, _tanstack_react_table.flexRender)(header.column.columnDef.header, header.getContext())
+						}), canSort && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: ds_table_header_module_default.pageButtonIconContainer,
+							children: {
+								asc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
+									icon: "arrow_drop_up",
+									className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
+								}),
+								desc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
+									icon: "arrow_drop_down",
+									className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
+								})
+							}[header.column.getIsSorted()] ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon) })
+						})]
 					})
-				}),
-				reorderable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHead, {
-					className: (0, classnames.default)(ds_table_header_module_default.headerCell, ds_table_header_module_default.reorderColumn),
-					children: "Order"
-				}),
-				headerGroup.headers.map((header) => {
-					const headerStyle = getColumnSizeStyle(header.column.getSize(), virtualized);
-					const canSort = header.column.getCanSort();
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHead, {
-						className: (0, classnames.default)(ds_table_header_module_default.headerCell, canSort && ds_table_header_module_default.sortableHeader),
-						onClick: header.column.getToggleSortingHandler(),
-						style: headerStyle,
-						children: header.isPlaceholder ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: ds_table_header_module_default.headerSortContainer,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: (0, _tanstack_react_table.flexRender)(header.column.columnDef.header, header.getContext()) }), canSort && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: ds_table_header_module_default.pageButtonIconContainer,
-								children: {
-									asc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
-										icon: "arrow_drop_up",
-										className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
-									}),
-									desc: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
-										icon: "arrow_drop_down",
-										className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon)
-									})
-								}[header.column.getIsSorted()] ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, classnames.default)(ds_table_header_module_default.pageButtonIcon, ds_table_shared_module_default.pageButtonIcon) })
-							})]
-						})
-					}, header.id);
-				})
-			]
+				}, header.id);
+			})
 		}, headerGroup.id))
 	});
 };
@@ -18324,24 +18488,6 @@ const DsTableCell = ({ row, cell, primaryRowActions = [], secondaryRowActions =
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsDefaultTableCell, { cell });
 };
 //#endregion
-//#region src/components/ds-table/components/ds-table-row-selectable-cell/ds-table-row-selectable-cell.module.scss
-var ds_table_row_selectable_cell_module_default = { "cell": "BxP8ta_cell" };
-//#endregion
-//#region src/components/ds-table/components/ds-table-row-selectable-cell/ds-table-row-selectable-cell.tsx
-const DsTableRowSelectableCell = ({ row, isSelected, className }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
-		className: (0, classnames.default)(ds_table_row_selectable_cell_module_default.cell, className),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
-			className: ds_table_shared_module_default.checkboxContainer,
-			checked: isSelected,
-			disabled: !row.getCanSelect(),
-			onCheckedChange: (checked) => row.toggleSelected(!!checked),
-			onClick: (e) => e.stopPropagation(),
-			onDoubleClick: (e) => e.stopPropagation()
-		})
-	});
-};
-//#endregion
 //#region src/components/ds-table/components/ds-table-row/ds-table-row.module.scss
 var ds_table_row_module_default = {
 	"cellReorder": "t8OZCq_cellReorder",
@@ -18359,15 +18505,12 @@ var ds_table_row_module_default = {
 	"tableCell": "t8OZCq_tableCell",
 	"tableRow": "t8OZCq_tableRow"
 };
-/**
-* Column id used for the synthetic expander column injected when `expandable` is set.
-*/
-const EXPANDER_COLUMN_ID = "expander";
 //#endregion
 //#region src/components/ds-table/components/ds-table-row/ds-table-row.tsx
-const DsRowDragHandle = ({ isDragging, attributes, listeners }) => {
+const DsRowDragHandle = ({ isDragging, attributes, listeners, style }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
 		className: (0, classnames.default)(ds_table_row_module_default.tableCell, ds_table_row_module_default.cellReorder, { [ds_table_row_module_default.isDragging]: isDragging }),
+		style,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsIcon, {
 			className: ds_table_row_module_default.rowDragHandle,
 			icon: isDragging ? "drag_indicator" : "arrow_downward",
@@ -18379,7 +18522,7 @@ const DsRowDragHandle = ({ isDragging, attributes, listeners }) => {
 	});
 };
 const DsTableRow = ({ ref, row, isSelected }) => {
-	const { selectable, reorderable, onRowClick, onRowDoubleClick, renderExpandedRow, bordered, rowSize, primaryRowActions, secondaryRowActions, activeRowId } = useDsTableContext();
+	const { reorderable, onRowClick, onRowDoubleClick, renderExpandedRow, bordered, rowSize, primaryRowActions, secondaryRowActions, activeRowId } = useDsTableContext();
 	const isExpanded = row.getIsExpanded();
 	const isActive = activeRowId === row.id;
 	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = (0, _dnd_kit_sortable.useSortable)({
@@ -18396,7 +18539,7 @@ const DsTableRow = ({ ref, row, isSelected }) => {
 		} : {},
 		position: "relative"
 	} : {};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TableRow, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, {
 		ref: mergeRefs(reorderable ? setNodeRef : null, ref),
 		"data-state": isActive ? "active" : isSelected ? "selected" : void 0,
 		className: (0, classnames.default)(ds_table_row_module_default.tableRow, {
@@ -18407,39 +18550,33 @@ const DsTableRow = ({ ref, row, isSelected }) => {
 		style: rowStyle,
 		onClick: () => onRowClick?.(row.original),
 		onDoubleClick: () => onRowDoubleClick?.(row.original),
-		children: [
-			selectable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowSelectableCell, {
-				row,
-				isSelected,
-				className: ds_table_row_module_default.selectableCell
-			}),
-			reorderable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsRowDragHandle, {
+		children: row.getVisibleCells().map((cell, idx) => {
+			const cellStyle = getColumnSizeStyle(cell.column.getSize());
+			if (cell.column.id === "reorder") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsRowDragHandle, {
 				isDragging,
 				attributes,
-				listeners
-			}),
-			row.getVisibleCells().map((cell, idx) => {
-				const isLastColumn = idx === row.getVisibleCells().length - 1;
-				const cellStyle = getColumnSizeStyle(cell.column.getSize());
-				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
-					className: (0, classnames.default)(ds_table_row_module_default.tableCell, cell.column.id === "expander" && ds_table_row_module_default.expandableCell),
-					style: cellStyle,
-					children: isLastColumn ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
-						row,
-						cell,
-						primaryRowActions,
-						secondaryRowActions
-					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
-						row,
-						cell
-					})
-				}, cell.id);
-			})
-		]
+				listeners,
+				style: cellStyle
+			}, cell.id);
+			const isLastColumn = idx === row.getVisibleCells().length - 1;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
+				className: (0, classnames.default)(ds_table_row_module_default.tableCell, cell.column.id === "expander" && ds_table_row_module_default.expandableCell, cell.column.id === "select" && ds_table_row_module_default.selectableCell),
+				style: cellStyle,
+				children: isLastColumn ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
+					row,
+					cell,
+					primaryRowActions,
+					secondaryRowActions
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
+					row,
+					cell
+				})
+			}, cell.id);
+		})
 	}), isExpanded && renderExpandedRow && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, {
 		className: ds_table_row_module_default.expandedRow,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
-			colSpan: row.getVisibleCells().length + (selectable ? 1 : 0) + (reorderable ? 1 : 0),
+			colSpan: row.getVisibleCells().length,
 			className: ds_table_row_module_default.tableCell,
 			children: renderExpandedRow(row.original)
 		})
@@ -18472,6 +18609,30 @@ const DsTableRowExpandableCell = ({ row, buttonClassName }) => {
 	});
 };
 //#endregion
+//#region src/components/ds-table/components/ds-table-row-selectable-cell/ds-table-row-selectable-cell.tsx
+const DsTableRowSelectableCell = ({ row }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
+		className: ds_table_shared_module_default.checkboxContainer,
+		checked: row.getIsSelected(),
+		disabled: !row.getCanSelect(),
+		onCheckedChange: (checked) => row.toggleSelected(!!checked),
+		onClick: (e) => e.stopPropagation(),
+		onDoubleClick: (e) => e.stopPropagation()
+	});
+};
+//#endregion
+//#region src/components/ds-table/components/ds-table-header-selectable-cell/ds-table-header-selectable-cell.tsx
+const DsTableHeaderSelectableCell = ({ table }) => {
+	const checked = table.getIsAllRowsSelected() ? true : table.getIsSomeRowsSelected() ? "indeterminate" : false;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsCheckbox, {
+		className: ds_table_shared_module_default.checkboxContainer,
+		checked,
+		onCheckedChange: (nextChecked) => table.toggleAllRowsSelected(!!nextChecked),
+		onClick: (e) => e.stopPropagation(),
+		onDoubleClick: (e) => e.stopPropagation()
+	});
+};
+//#endregion
 //#region src/components/ds-table/hooks/use-drag-and-drop.tsx
 const DragWrapper = ({ children, onDragEnd, sensors }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_dnd_kit_core.DndContext, {
 	collisionDetection: _dnd_kit_core.closestCenter,
@@ -18540,7 +18701,7 @@ var ds_table_row_virtualized_module_default = {
 //#endregion
 //#region src/components/ds-table/components/ds-table-row-virtualized/ds-table-row-virtualized.tsx
 const DsTableRowVirtualized = ({ row, isSelected, rowsMapRef, rowHeightsMapRef, rowVirtualizer, virtualRow, isExpandedRowContent }) => {
-	const { selectable, bordered, rowSize, activeRowId, primaryRowActions, secondaryRowActions, renderExpandedRow, onRowClick, onRowDoubleClick } = useDsTableContext();
+	const { bordered, rowSize, activeRowId, primaryRowActions, secondaryRowActions, renderExpandedRow, onRowClick, onRowDoubleClick } = useDsTableContext();
 	const isExpanded = row.getIsExpanded();
 	const isActive = activeRowId === row.id;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, {
@@ -18562,15 +18723,11 @@ const DsTableRowVirtualized = ({ row, isSelected, rowsMapRef, rowHeightsMapRef,
 		}, isExpandedRowContent && ds_table_row_virtualized_module_default.expandedRowContent, onRowClick && ds_table_row_virtualized_module_default.clickableRow, !bordered && ds_table_row_virtualized_module_default.rowNoBorder, isExpanded && ds_table_row_virtualized_module_default.expanded),
 		onClick: isExpandedRowContent ? void 0 : () => onRowClick?.(row.original),
 		onDoubleClick: isExpandedRowContent ? void 0 : () => onRowDoubleClick?.(row.original),
-		children: isExpandedRowContent ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, { children: renderExpandedRow?.(row.original) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [selectable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowSelectableCell, {
-			row,
-			isSelected,
-			className: ds_table_row_virtualized_module_default.selectableCell
-		}), row.getVisibleCells().map((cell, idx) => {
+		children: isExpandedRowContent ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, { children: renderExpandedRow?.(row.original) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: row.getVisibleCells().map((cell, idx) => {
 			const isLastColumn = idx === row.getVisibleCells().length - 1;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
 				style: getColumnSizeStyle(cell.column.getSize(), true),
-				className: (0, classnames.default)(ds_table_row_virtualized_module_default.cell, cell.column.id === "expander" && ds_table_row_virtualized_module_default.expandableCell),
+				className: (0, classnames.default)(ds_table_row_virtualized_module_default.cell, cell.column.id === "expander" && ds_table_row_virtualized_module_default.expandableCell, cell.column.id === "select" && ds_table_row_virtualized_module_default.selectableCell),
 				children: isLastColumn ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableCell, {
 					row,
 					cell,
@@ -18581,12 +18738,41 @@ const DsTableRowVirtualized = ({ row, isSelected, rowsMapRef, rowHeightsMapRef,
 					cell
 				})
 			}, cell.id);
-		})] })
+		}) })
 	});
 };
 //#endregion
+//#region src/components/ds-table/components/ds-table-body-virtualized/use-infinite-scroll.ts
+const DEFAULT_THRESHOLD_PX = 500;
+const DEFAULT_AUTO_FILL = true;
+/**
+* Owns the infinite-scroll trigger logic for `DsTable`:
+* threshold detection and the auto-fill loop for short initial pages.
+*/
+const useInfiniteScroll = (scrollElementRef, rowCount, config) => {
+	const hasMore = config?.hasMore ?? false;
+	const isLoadingMore = config?.isLoadingMore ?? false;
+	const thresholdPx = config?.thresholdPx ?? DEFAULT_THRESHOLD_PX;
+	const autoFill = config?.autoFill ?? DEFAULT_AUTO_FILL;
+	const loadDataIfNeeded = () => {
+		const el = scrollElementRef.current;
+		if (!config || !hasMore || isLoadingMore || !el) return;
+		const isScrollable = el.scrollHeight > el.clientHeight;
+		const distanceToBottom = el.scrollHeight - el.scrollTop - el.clientHeight;
+		if (isScrollable && distanceToBottom <= thresholdPx || autoFill && !isScrollable) config.onLoadMore();
+	};
+	(0, react.useEffect)(() => {
+		loadDataIfNeeded();
+	}, [
+		rowCount,
+		hasMore,
+		isLoadingMore
+	]);
+	return { loadDataIfNeeded };
+};
+//#endregion
 //#region src/components/ds-table/components/ds-table-body-virtualized/ds-table-body-virtualized.tsx
-const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimateSize, overscan, onScroll, rowSelection }) => {
+const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimateSize, overscan, onScroll, rowSelection, infiniteScroll }) => {
 	const rowsMapRef = (0, react.useRef)(/* @__PURE__ */ new Map());
 	const rowHeightsMapRef = (0, react.useRef)(/* @__PURE__ */ new Map());
 	const { rows } = table.getRowModel();
@@ -18598,6 +18784,7 @@ const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimate
 		const item = rowsAndExpandedRowContent[index];
 		return item ? `${item.row.id}${item.isExpandedRowContent ? "-expanded-content" : ""}` : String(index);
 	};
+	const { loadDataIfNeeded } = useInfiniteScroll(tableContainerRef, rows.length, infiniteScroll);
 	const rowVirtualizer = (0, _tanstack_react_virtual.useVirtualizer)({
 		count: rowsAndExpandedRowContent.length,
 		estimateSize: (index) => {
@@ -18615,18 +18802,21 @@ const DsTableBodyVirtualized = ({ table, tableContainerRef, emptyState, estimate
 					row.style.transform = `translateY(${virtualRow.start.toString()}px)`;
 				});
 			});
-			if (sync && onScroll) {
-				const scrollOffset = instance.scrollOffset || 0;
-				const totalContentHeight = instance.getTotalSize();
-				const viewportHeight = instance.scrollElement?.clientHeight;
-				const scrollDirection = instance.scrollDirection;
-				if (viewportHeight) onScroll({
-					scrollOffset,
-					totalContentHeight,
-					viewportHeight,
-					bottomOffset: totalContentHeight - (scrollOffset + viewportHeight),
-					scrollDirection
-				});
+			if (sync) {
+				if (onScroll) {
+					const scrollOffset = instance.scrollOffset || 0;
+					const totalContentHeight = instance.getTotalSize();
+					const viewportHeight = instance.scrollElement?.clientHeight;
+					const scrollDirection = instance.scrollDirection;
+					if (viewportHeight) onScroll({
+						scrollOffset,
+						totalContentHeight,
+						viewportHeight,
+						bottomOffset: totalContentHeight - (scrollOffset + viewportHeight),
+						scrollDirection
+					});
+				}
+				loadDataIfNeeded();
 			}
 		}
 	});
@@ -18675,7 +18865,7 @@ const ROW_SIZE_HEIGHT_MAP = {
 /**
 * Design system Table component
 */
-const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = false, virtualizedOptions, className, onRowClick, emptyState, stickyHeader = true, bordered = true, fullWidth = true, rowSize = "medium", expandable = false, renderExpandedRow, selectable = false, showSelectAllCheckbox = true, onSelectionChange, onSortingChange, onScroll, actions = [], onRowDoubleClick, primaryRowActions = [], secondaryRowActions, reorderable = false, onOrderChange, columnFilters: externalColumnFilters, onColumnFiltersChange, columnVisibility: externalColumnVisibility, onColumnVisibilityChange, activeRowId }) => {
+const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = false, virtualizedOptions, className, onRowClick, emptyState, stickyHeader = true, bordered = true, fullWidth = true, rowSize = "medium", expandable = false, renderExpandedRow, selectable = false, showSelectAllCheckbox = true, onSelectionChange, onSortingChange, onScroll, actions = [], onRowDoubleClick, primaryRowActions = [], secondaryRowActions, reorderable = false, onOrderChange, columnFilters: externalColumnFilters, onColumnFiltersChange, columnVisibility: externalColumnVisibility, onColumnVisibilityChange, activeRowId, infiniteScroll }) => {
 	const [data, setData] = react.useState(tableData);
 	const [sorting, setSorting] = react.useState([]);
 	const [internalColumnFilters, setInternalColumnFilters] = react.useState([]);
@@ -18712,17 +18902,52 @@ const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = fal
 		setRowSelection(newRowSelection);
 		onSelectionChange?.(newRowSelection);
 	};
+	const hasExpanderColumn = !!expandable;
+	const hasSelectColumn = !!selectable;
+	const hasReorderColumn = reorderable && !virtualized;
 	const columns = (0, react.useMemo)(() => {
-		if (!expandable) return columnsProp;
-		return [{
-			id: EXPANDER_COLUMN_ID,
-			size: 36,
-			enableSorting: false,
-			enableResizing: false,
-			header: () => null,
-			cell: ({ row }) => row.getCanExpand() ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowExpandableCell, { row }) : null
-		}, ...columnsProp];
-	}, [columnsProp, expandable]);
+		const augmentedColumns = [...columnsProp];
+		if (hasSelectColumn) {
+			const selectColumn = {
+				id: SELECT_COLUMN_ID,
+				size: 36,
+				enableSorting: false,
+				enableResizing: false,
+				header: ({ table }) => showSelectAllCheckbox ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableHeaderSelectableCell, { table }) : null,
+				cell: ({ row }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowSelectableCell, { row })
+			};
+			augmentedColumns.unshift(selectColumn);
+		}
+		if (hasExpanderColumn) {
+			const expanderColumn = {
+				id: EXPANDER_COLUMN_ID,
+				size: 36,
+				enableSorting: false,
+				enableResizing: false,
+				header: () => null,
+				cell: ({ row }) => row.getCanExpand() ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRowExpandableCell, { row }) : null
+			};
+			augmentedColumns.unshift(expanderColumn);
+		}
+		if (hasReorderColumn) {
+			const reorderColumn = {
+				id: REORDER_COLUMN_ID,
+				size: 60,
+				enableSorting: false,
+				enableResizing: false,
+				header: "Order",
+				cell: () => null
+			};
+			augmentedColumns.unshift(reorderColumn);
+		}
+		return augmentedColumns;
+	}, [
+		columnsProp,
+		hasExpanderColumn,
+		hasReorderColumn,
+		hasSelectColumn,
+		showSelectAllCheckbox
+	]);
 	const table = (0, _tanstack_react_table.useReactTable)({
 		data: reorderable ? data : tableData,
 		columns,
@@ -18785,7 +19010,7 @@ const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = fal
 	}), [table]);
 	const { rows, rowsById } = table.getRowModel();
 	const renderEmptyState = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableRow, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableCell, {
-		colSpan: columns.length + (selectable ? 1 : 0) + (reorderable ? 1 : 0),
+		colSpan: columns.length,
 		className: ds_table_module_default.emptyState,
 		children: emptyState || "No results."
 	}) });
@@ -18822,7 +19047,8 @@ const DsTable = ({ ref, columns: columnsProp, data: tableData, virtualized = fal
 					estimateSize: virtualizedOptions?.estimateSize || ROW_SIZE_HEIGHT_MAP[rowSize],
 					overscan: virtualizedOptions?.overscan,
 					onScroll,
-					rowSelection
+					rowSelection,
+					infiniteScroll
 				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableBody, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SortableWrapper, { children: rows.length ? rows.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DsTableRow, {
 					row,
 					isSelected: !!rowSelection[row.id]
@@ -20033,6 +20259,7 @@ exports.DsSpinner = DsSpinner;
 exports.DsSplitButton = DsSplitButton;
 exports.DsStack = DsStack;
 exports.DsStatusBadge = DsStatusBadge;
+exports.DsStatusBadgeV2 = DsStatusBadgeV2;
 exports.DsStep = DsStep;
 exports.DsStepContent = DsStepContent;
 exports.DsStepper = DsStepper;
@@ -20091,6 +20318,9 @@ exports.skeletonColorVariants = skeletonColorVariants;
 exports.skeletonRadiusVariants = skeletonRadiusVariants;
 exports.spinnerSizes = spinnerSizes;
 exports.splitButtonSizes = splitButtonSizes;
+exports.statusBadgeV2Phases = statusBadgeV2Phases;
+exports.statusBadgeV2Sizes = statusBadgeV2Sizes;
+exports.statusBadgeV2Variants = statusBadgeV2Variants;
 exports.systemStatuses = systemStatuses;
 exports.tagSizes = tagSizes;
 exports.tagVariants = tagVariants;