@flux-ui/components 3.0.0-next.64 → 3.0.0-next.66

package/dist/index.js

@@ -2557,6 +2557,48 @@ var freeSelf = typeof self == "object" && self && self.Object === Object && self
 /** Built-in value references. */
 var Symbol$1 = (freeGlobal || freeSelf || Function("return this")()).Symbol;
 //#endregion
+//#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/_arrayMap.js
+/**
+* A specialized version of `_.map` for arrays without support for iteratee
+* shorthands.
+*
+* @private
+* @param {Array} [array] The array to iterate over.
+* @param {Function} iteratee The function invoked per iteration.
+* @returns {Array} Returns the new mapped array.
+*/
+function arrayMap(array, iteratee) {
+	var index = -1, length = array == null ? 0 : array.length, result = Array(length);
+	while (++index < length) result[index] = iteratee(array[index], index, array);
+	return result;
+}
+//#endregion
+//#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isArray.js
+/**
+* Checks if `value` is classified as an `Array` object.
+*
+* @static
+* @memberOf _
+* @since 0.1.0
+* @category Lang
+* @param {*} value The value to check.
+* @returns {boolean} Returns `true` if `value` is an array, else `false`.
+* @example
+*
+* _.isArray([1, 2, 3]);
+* // => true
+*
+* _.isArray(document.body.children);
+* // => false
+*
+* _.isArray('abc');
+* // => false
+*
+* _.isArray(_.noop);
+* // => false
+*/
+var isArray = Array.isArray;
+//#endregion
 //#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/_getRawTag.js
 /** Used for built-in method references. */
 var objectProto = Object.prototype;
@@ -2677,48 +2719,6 @@ function isSymbol(value) {
 	return typeof value == "symbol" || isObjectLike(value) && baseGetTag(value) == symbolTag;
 }
 //#endregion
-//#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/_arrayMap.js
-/**
-* A specialized version of `_.map` for arrays without support for iteratee
-* shorthands.
-*
-* @private
-* @param {Array} [array] The array to iterate over.
-* @param {Function} iteratee The function invoked per iteration.
-* @returns {Array} Returns the new mapped array.
-*/
-function arrayMap(array, iteratee) {
-	var index = -1, length = array == null ? 0 : array.length, result = Array(length);
-	while (++index < length) result[index] = iteratee(array[index], index, array);
-	return result;
-}
-//#endregion
-//#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isArray.js
-/**
-* Checks if `value` is classified as an `Array` object.
-*
-* @static
-* @memberOf _
-* @since 0.1.0
-* @category Lang
-* @param {*} value The value to check.
-* @returns {boolean} Returns `true` if `value` is an array, else `false`.
-* @example
-*
-* _.isArray([1, 2, 3]);
-* // => true
-*
-* _.isArray(document.body.children);
-* // => false
-*
-* _.isArray('abc');
-* // => false
-*
-* _.isArray(_.noop);
-* // => false
-*/
-var isArray = Array.isArray;
-//#endregion
 //#region ../../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/_baseToString.js
 /** Used as references for various `Number` constants. */
 var INFINITY = Infinity;
@@ -9068,32 +9068,32 @@ function useTreeView(params) {
 }
 //#endregion
 //#region src/css/component/Button.module.scss
-var { "buttonLabel": _0$14, "button": _1$5, "buttonIcon": _2$4 } = Button_module_default$1;
+var { "button": _0$14, "buttonIcon": _1$5, "buttonLabel": _2$4 } = Button_module_default$1;
 var Button_module_default = {
-	primaryButton: `primary-button ${_1$5}`,
+	primaryButton: `primary-button ${_0$14}`,
 	spinner: `spinner`,
-	primaryButtonIcon: `primary-button-icon ${_2$4}`,
-	primaryButtonLabel: `primary-button-label ${_0$14}`,
-	secondaryButton: `secondary-button ${_1$5}`,
-	secondaryButtonIcon: `secondary-button-icon ${_2$4}`,
-	secondaryButtonLabel: `secondary-button-label ${_0$14}`,
-	destructiveButton: `destructive-button ${_1$5}`,
-	destructiveButtonIcon: `destructive-button-icon ${_2$4}`,
-	destructiveButtonLabel: `destructive-button-label ${_0$14}`,
-	baseLinkButton: `base-link-button ${_1$5}`,
-	primaryLinkButton: `primary-link-button base-link-button ${_1$5}`,
-	primaryLinkButtonIcon: `primary-link-button-icon ${_2$4}`,
-	primaryLinkButtonLabel: `primary-link-button-label ${_0$14}`,
-	secondaryLinkButton: `secondary-link-button base-link-button ${_1$5}`,
-	secondaryLinkButtonIcon: `secondary-link-button-icon ${_2$4}`,
-	secondaryLinkButtonLabel: `secondary-link-button-label ${_0$14}`,
-	linkButton: `link-button ${_1$5}`,
-	linkButtonIcon: `link-button-icon ${_2$4}`,
+	primaryButtonIcon: `primary-button-icon ${_1$5}`,
+	primaryButtonLabel: `primary-button-label ${_2$4}`,
+	secondaryButton: `secondary-button ${_0$14}`,
+	secondaryButtonIcon: `secondary-button-icon ${_1$5}`,
+	secondaryButtonLabel: `secondary-button-label ${_2$4}`,
+	destructiveButton: `destructive-button ${_0$14}`,
+	destructiveButtonIcon: `destructive-button-icon ${_1$5}`,
+	destructiveButtonLabel: `destructive-button-label ${_2$4}`,
+	baseLinkButton: `base-link-button ${_0$14}`,
+	primaryLinkButton: `primary-link-button base-link-button ${_0$14}`,
+	primaryLinkButtonIcon: `primary-link-button-icon ${_1$5}`,
+	primaryLinkButtonLabel: `primary-link-button-label ${_2$4}`,
+	secondaryLinkButton: `secondary-link-button base-link-button ${_0$14}`,
+	secondaryLinkButtonIcon: `secondary-link-button-icon ${_1$5}`,
+	secondaryLinkButtonLabel: `secondary-link-button-label ${_2$4}`,
+	linkButton: `link-button ${_0$14}`,
+	linkButtonIcon: `link-button-icon ${_1$5}`,
 	icon: `icon`,
-	linkButtonLabel: `link-button-label ${_0$14}`,
-	publishButton: `publish-button primary-button ${_1$5}`,
-	publishButtonIcon: `publish-button-icon primary-button-icon ${_2$4}`,
-	publishButtonLabel: `publish-button-label primary-button-label ${_0$14}`,
+	linkButtonLabel: `link-button-label ${_2$4}`,
+	publishButton: `publish-button primary-button ${_0$14}`,
+	publishButtonIcon: `publish-button-icon primary-button-icon ${_1$5}`,
+	publishButtonLabel: `publish-button-label primary-button-label ${_2$4}`,
 	publishButtonAnimation: `publish-button-animation`,
 	isDone: `is-done`,
 	publishButtonAnimationArrow: `publish-button-animation-arrow`,
@@ -11536,6 +11536,8 @@ var LayerPane_module_default = {
 	layerPane: `layer-pane`,
 	basePaneStructure: `base-pane-structure`,
 	paneFooter: `pane-footer`,
+	paneHeader: `pane-header`,
+	button: `button`,
 	layerPaneSecondary: `layer-pane-secondary`
 };
 //#endregion
@@ -12231,11 +12233,11 @@ var FluxCheckbox_default = /* @__PURE__ */ defineComponent({
 				}, [isIndeterminate.value ? (openBlock(), createBlock(FluxIcon_default, {
 					key: 0,
 					name: "minus",
-					size: 16
+					size: 12
 				})) : (openBlock(), createBlock(FluxIcon_default, {
 					key: 1,
 					name: "check",
-					size: 16
+					size: 12
 				}))], 2),
 				__props.label ? (openBlock(), createElementBlock("span", {
 					key: 0,
@@ -13615,7 +13617,7 @@ var FilterBadge_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/css/component/Menu.module.scss
-var { "buttonLabel": _0$9, "button": _1$3, "buttonIcon": _2$2 } = Button_module_default$1;
+var { "button": _0$9, "buttonLabel": _1$3, "buttonIcon": _2$2 } = Button_module_default$1;
 var Menu_module_default = {
 	menu: `menu`,
 	menuNormal: `menu-normal menu`,
@@ -13623,10 +13625,10 @@ var Menu_module_default = {
 	menuGroup: `menu-group`,
 	menuGroupHorizontal: `menu-group-horizontal menu-group`,
 	menuGroupVertical: `menu-group-vertical menu-group`,
-	menuItem: `menu-item ${_1$3}`,
+	menuItem: `menu-item ${_0$9}`,
 	badge: `badge`,
 	menuItemIcon: `menu-item-icon ${_2$2}`,
-	menuItemLabel: `menu-item-label ${_0$9}`,
+	menuItemLabel: `menu-item-label ${_1$3}`,
 	menuItemActive: `menu-item-active`,
 	menuItemDestructive: `menu-item-destructive`,
 	menuItemHighlighted: `menu-item-highlighted`,
@@ -13652,6 +13654,20 @@ var Menu_module_default = {
 	expandableBody: `expandable-body`
 };
 //#endregion
+//#region src/component/FluxMenuGroup.vue
+var FluxMenuGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "FluxMenuGroup",
+	props: { isHorizontal: { type: Boolean } },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass(__props.isHorizontal ? unref(Menu_module_default).menuGroupHorizontal : unref(Menu_module_default).menuGroupVertical),
+				role: "group"
+			}, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
 //#region src/component/FluxMenuItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$41 = ["src", "alt"];
 //#endregion
@@ -13764,76 +13780,6 @@ var FluxMenuItem_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-//#region src/component/primitive/FilterItem.vue
-var FilterItem_default = /* @__PURE__ */ defineComponent({
-	__name: "FilterItem",
-	props: {
-		item: {},
-		value: { type: [
-			Object,
-			String,
-			Boolean,
-			Number,
-			null,
-			Array
-		] },
-		disabled: { type: Boolean }
-	},
-	emits: ["click"],
-	setup(__props, { emit: __emit }) {
-		const emit = __emit;
-		const { isLoading, loaded } = Z$1();
-		const getValueLabel = computed(() => loaded(__props.item.getValueLabel));
-		const valueLabel = ref();
-		function onClick(evt) {
-			emit("click", evt);
-		}
-		watch([() => __props.item, () => __props.value], async ([, nextValue], _prev, onCleanup) => {
-			let cancelled = false;
-			onCleanup(() => {
-				cancelled = true;
-			});
-			const nextLabel = await unref(getValueLabel)(nextValue);
-			if (!cancelled) valueLabel.value = nextLabel ?? void 0;
-		}, {
-			deep: true,
-			immediate: true
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createBlock(FluxMenuItem_default, {
-				command: valueLabel.value,
-				"command-icon": "angle-right",
-				"command-loading": unref(isLoading),
-				disabled: __props.disabled,
-				"icon-leading": __props.item.icon,
-				label: __props.item.label,
-				type: "button",
-				onClick
-			}, null, 8, [
-				"command",
-				"command-loading",
-				"disabled",
-				"icon-leading",
-				"label"
-			]);
-		};
-	}
-});
-//#endregion
-//#region src/component/FluxMenuGroup.vue
-var FluxMenuGroup_default = /* @__PURE__ */ defineComponent({
-	__name: "FluxMenuGroup",
-	props: { isHorizontal: { type: Boolean } },
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", {
-				class: normalizeClass(__props.isHorizontal ? unref(Menu_module_default).menuGroupHorizontal : unref(Menu_module_default).menuGroupVertical),
-				role: "group"
-			}, [renderSlot(_ctx.$slots, "default")], 2);
-		};
-	}
-});
-//#endregion
 //#region src/component/FluxMenuSubHeader.vue
 var FluxMenuSubHeader_default = /* @__PURE__ */ defineComponent({
 	__name: "FluxMenuSubHeader",
@@ -14476,6 +14422,62 @@ var FluxSeparator_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/component/primitive/FilterItem.vue
+var FilterItem_default = /* @__PURE__ */ defineComponent({
+	__name: "FilterItem",
+	props: {
+		item: {},
+		value: { type: [
+			Object,
+			String,
+			Boolean,
+			Number,
+			null,
+			Array
+		] },
+		disabled: { type: Boolean }
+	},
+	emits: ["click"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const { isLoading, loaded } = Z$1();
+		const getValueLabel = computed(() => loaded(__props.item.getValueLabel));
+		const valueLabel = ref();
+		function onClick(evt) {
+			emit("click", evt);
+		}
+		watch([() => __props.item, () => __props.value], async ([, nextValue], _prev, onCleanup) => {
+			let cancelled = false;
+			onCleanup(() => {
+				cancelled = true;
+			});
+			const nextLabel = await unref(getValueLabel)(nextValue);
+			if (!cancelled) valueLabel.value = nextLabel ?? void 0;
+		}, {
+			deep: true,
+			immediate: true
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(FluxMenuItem_default, {
+				command: valueLabel.value,
+				"command-icon": "angle-right",
+				"command-loading": unref(isLoading),
+				disabled: __props.disabled,
+				"icon-leading": __props.item.icon,
+				label: __props.item.label,
+				type: "button",
+				onClick
+			}, null, 8, [
+				"command",
+				"command-loading",
+				"disabled",
+				"icon-leading",
+				"label"
+			]);
+		};
+	}
+});
+//#endregion
 //#region src/component/primitive/FilterMenuRenderer.ts
 var FilterMenuRenderer = defineComponent({
 	props: {
@@ -15494,14 +15496,15 @@ var FluxPaginationBar_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/css/component/Table.module.scss
-var { "basePaneLoader": _0$7, "basePaneElement": _1$1 } = Pane_module_default$1;
+var { "basePaneElement": _0$7, "basePaneLoader": _1$1 } = Pane_module_default$1;
 var Table_module_default = {
-	table: `table ${_1$1}`,
+	table: `table ${_0$7}`,
 	tableBase: `table-base`,
 	tableFill: `table-fill`,
 	tablePagination: `table-pagination`,
-	tableLoader: `table-loader ${_0$7}`,
+	tableLoader: `table-loader ${_1$1}`,
 	tableRow: `table-row`,
+	isSelectableRow: `is-selectable-row`,
 	tableCell: `table-cell`,
 	tableCellContent: `table-cell-content`,
 	tableHeader: `table-header table-cell`,
@@ -15509,10 +15512,12 @@ var Table_module_default = {
 	isSticky: `is-sticky`,
 	tableHeaderContent: `table-header-content table-cell-content`,
 	isStriped: `is-striped`,
+	isSelected: `is-selected`,
 	isHoverable: `is-hoverable`,
 	isBordered: `is-bordered`,
 	isSeparated: `is-separated`,
 	tableActions: `table-actions`,
+	tableCellSelection: `table-cell-selection`,
 	tableBar: `table-bar table-cell`,
 	tableBarContent: `table-bar-content table-cell-content`,
 	tableSort: `table-sort`,
@@ -15546,9 +15551,10 @@ var FluxTableCell_default = /* @__PURE__ */ defineComponent({
 //#region src/component/FluxTableRow.vue
 var FluxTableRow_default = /* @__PURE__ */ defineComponent({
 	__name: "FluxTableRow",
+	props: { isSelected: { type: Boolean } },
 	setup(__props) {
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("tr", { class: normalizeClass(unref(Table_module_default).tableRow) }, [renderSlot(_ctx.$slots, "default")], 2);
+			return openBlock(), createElementBlock("tr", { class: normalizeClass(unref(clsx)(unref(Table_module_default).tableRow, __props.isSelected && unref(Table_module_default).isSelected)) }, [renderSlot(_ctx.$slots, "default")], 2);
 		};
 	}
 });
@@ -15594,7 +15600,7 @@ var FluxTable_default = /* @__PURE__ */ defineComponent({
 			isStriped: __props.isStriped
 		});
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(Table_module_default).table) }, [
+			return openBlock(), createElementBlock("div", { class: normalizeClass([unref(Table_module_default).table, __props.isBordered && unref(Table_module_default).isBordered]) }, [
 				createElementVNode("table", { class: normalizeClass(unref(Table_module_default).tableBase) }, [
 					renderSlot(_ctx.$slots, "colgroups"),
 					slots.header ? (openBlock(), createElementBlock("thead", _hoisted_1$35, [renderSlot(_ctx.$slots, "header")])) : createCommentVNode("", true),
@@ -15629,10 +15635,83 @@ var FluxTable_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/component/FluxTableHeader.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$34 = ["aria-sort"];
+var _hoisted_2$12 = ["aria-label", "onClick"];
+//#endregion
+//#region src/component/FluxTableHeader.vue
+var FluxTableHeader_default = /* @__PURE__ */ defineComponent({
+	__name: "FluxTableHeader",
+	props: {
+		isShrinking: { type: Boolean },
+		isSortable: { type: Boolean },
+		isSticky: { type: Boolean },
+		minWidth: { default: 0 },
+		sort: {}
+	},
+	emits: ["sort"],
+	setup(__props, { emit: $emit }) {
+		const { isBordered } = useTableInjection_default();
+		const translate = useTranslate_default();
+		const sortingIcon = computed(() => {
+			switch (__props.sort) {
+				case "ascending": return "arrow-down-a-z";
+				case "descending": return "arrow-up-a-z";
+				default: return "arrow-up-arrow-down";
+			}
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("th", {
+				class: normalizeClass(unref(clsx)(unref(Table_module_default).tableHeader, unref(isBordered) && unref(Table_module_default).isBordered, __props.isShrinking && unref(Table_module_default).isShrinking, __props.isSticky && unref(Table_module_default).isSticky)),
+				scope: "col",
+				"aria-sort": __props.isSortable ? __props.sort ?? "none" : void 0,
+				style: normalizeStyle({ minWidth: `${__props.minWidth}px` })
+			}, [createElementVNode("div", { class: normalizeClass(unref(Table_module_default).tableHeaderContent) }, [renderSlot(_ctx.$slots, "default"), __props.isSortable ? (openBlock(), createBlock(FluxFlyout_default, { key: 0 }, {
+				opener: withCtx(({ open }) => [createElementVNode("button", {
+					class: normalizeClass(unref(Table_module_default).tableSort),
+					"aria-label": unref(translate)("flux.sort"),
+					tabindex: "-1",
+					type: "button",
+					onClick: open
+				}, [createVNode(FluxIcon_default, {
+					size: 16,
+					name: sortingIcon.value
+				}, null, 8, ["name"])], 10, _hoisted_2$12)]),
+				default: withCtx(() => [createVNode(FluxMenu_default, null, {
+					default: withCtx(() => [createVNode(FluxMenuGroup_default, null, {
+						default: withCtx(() => [createVNode(FluxMenuItem_default, {
+							"is-highlighted": __props.sort === "ascending",
+							"icon-leading": "arrow-down-a-z",
+							label: unref(translate)("flux.sortAscending"),
+							onClick: _cache[0] || (_cache[0] = ($event) => $emit("sort", "ascending"))
+						}, null, 8, ["is-highlighted", "label"]), createVNode(FluxMenuItem_default, {
+							"is-highlighted": __props.sort === "descending",
+							"icon-leading": "arrow-up-a-z",
+							label: unref(translate)("flux.sortDescending"),
+							onClick: _cache[1] || (_cache[1] = ($event) => $emit("sort", "descending"))
+						}, null, 8, ["is-highlighted", "label"])]),
+						_: 1
+					}), __props.sort ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createVNode(FluxSeparator_default), createVNode(FluxMenuGroup_default, null, {
+						default: withCtx(() => [createVNode(FluxMenuItem_default, {
+							"icon-leading": "circle-xmark",
+							"is-destructive": "",
+							label: unref(translate)("flux.sortRemove"),
+							onClick: _cache[2] || (_cache[2] = ($event) => $emit("sort", null))
+						}, null, 8, ["label"])]),
+						_: 1
+					})], 64)) : createCommentVNode("", true)]),
+					_: 1
+				})]),
+				_: 1
+			})) : createCommentVNode("", true)], 2)], 14, _hoisted_1$34);
+		};
+	}
+});
+//#endregion
 //#region src/component/FluxDataTable.vue
 var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 	__name: "FluxDataTable",
-	props: {
+	props: /* @__PURE__ */ mergeModels({
 		fillColumns: {},
 		isBordered: {
 			type: Boolean,
@@ -15658,10 +15737,14 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 		limits: {},
 		page: {},
 		perPage: {},
+		selectionMode: {},
 		total: {},
 		uniqueKey: {}
-	},
-	emits: ["limit", "navigate"],
+	}, {
+		"selected": {},
+		"selectedModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels(["limit", "navigate"], ["update:selected"]),
 	setup(__props, { emit: __emit }) {
 		const IGNORED_SLOTS = [
 			"filter",
@@ -15671,8 +15754,60 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 			"pagination"
 		];
 		const emit = __emit;
+		const selected = useModel(__props, "selected");
 		const slots = useSlots();
 		const limitedItems = computed(() => __props.items.slice(0, __props.perPage));
+		const currentPageIds = computed(() => {
+			if (!__props.uniqueKey) return [];
+			return unref(limitedItems).map((item) => item[__props.uniqueKey]);
+		});
+		const selectAllState = computed(() => {
+			const ids = unref(currentPageIds);
+			const value = unref(selected);
+			if (ids.length === 0 || !Array.isArray(value)) return false;
+			const selectedOnPage = ids.filter((id) => value.includes(id)).length;
+			if (selectedOnPage === 0) return false;
+			if (selectedOnPage === ids.length) return true;
+			return null;
+		});
+		function getItemId(item) {
+			if (!__props.uniqueKey) return;
+			return item[__props.uniqueKey];
+		}
+		function isItemSelected(item) {
+			if (!__props.selectionMode) return false;
+			const id = getItemId(item);
+			if (id === void 0) return false;
+			const value = unref(selected);
+			if (Array.isArray(value)) return value.includes(id);
+			return value === id;
+		}
+		function onRowClick(item, event) {
+			if (!__props.selectionMode) return;
+			if (event.target?.closest("a, button, input, label, select, textarea, [role=\"button\"]")) return;
+			onSelectRow(item);
+		}
+		function onSelectRow(item) {
+			const id = getItemId(item);
+			if (id === void 0) return;
+			if (__props.selectionMode === "multiple") {
+				const current = Array.isArray(unref(selected)) ? unref(selected) : [];
+				selected.value = current.includes(id) ? current.filter((v) => v !== id) : [...current, id];
+				return;
+			}
+			if (__props.selectionMode === "single") selected.value = isItemSelected(item) ? null : id;
+		}
+		function onSelectAll(value) {
+			if (__props.selectionMode !== "multiple") return;
+			const ids = unref(currentPageIds);
+			const current = Array.isArray(unref(selected)) ? unref(selected) : [];
+			if (value) {
+				const additions = ids.filter((id) => !current.includes(id));
+				selected.value = [...current, ...additions];
+				return;
+			}
+			selected.value = current.filter((id) => !ids.includes(id));
+		}
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(FluxTable_default, {
 				"fill-columns": __props.fillColumns,
@@ -15683,8 +15818,22 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 				"is-striped": __props.isStriped
 			}, createSlots({
 				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(limitedItems.value, (item, index) => {
-					return openBlock(), createBlock(FluxTableRow_default, { key: __props.uniqueKey ? item[__props.uniqueKey] : index }, {
-						default: withCtx(() => [(openBlock(), createElementBlock(Fragment, null, renderList(slots, (_, name) => {
+					return openBlock(), createBlock(FluxTableRow_default, {
+						key: __props.uniqueKey ? item[__props.uniqueKey] : index,
+						class: normalizeClass(__props.selectionMode && unref(Table_module_default).isSelectableRow),
+						"is-selected": __props.selectionMode ? isItemSelected(item) : false,
+						onClick: ($event) => onRowClick(item, $event)
+					}, {
+						default: withCtx(() => [__props.selectionMode ? (openBlock(), createBlock(FluxTableCell_default, {
+							key: 0,
+							class: normalizeClass(unref(Table_module_default).tableCellSelection)
+						}, {
+							default: withCtx(() => [createVNode(FluxCheckbox_default, {
+								"model-value": isItemSelected(item),
+								"onUpdate:modelValue": ($event) => onSelectRow(item)
+							}, null, 8, ["model-value", "onUpdate:modelValue"])]),
+							_: 2
+						}, 1032, ["class"])) : createCommentVNode("", true), (openBlock(), createElementBlock(Fragment, null, renderList(slots, (_, name) => {
 							return openBlock(), createElementBlock(Fragment, null, [!IGNORED_SLOTS.includes(name) ? renderSlot(_ctx.$slots, name, mergeProps({
 								key: 0,
 								ref_for: true
@@ -15694,11 +15843,16 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 								items: limitedItems.value,
 								page: __props.page,
 								perPage: __props.perPage,
-								total: __props.total
+								total: __props.total,
+								isSelected: isItemSelected(item)
 							})) : createCommentVNode("", true)], 64);
 						}), 64))]),
 						_: 2
-					}, 1024);
+					}, 1032, [
+						"class",
+						"is-selected",
+						"onClick"
+					]);
 				}), 128))]),
 				_: 2
 			}, [
@@ -15707,7 +15861,7 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "colgroups")]),
 					key: "0"
 				} : void 0,
-				"header" in slots ? {
+				"header" in slots || __props.selectionMode ? {
 					name: "header",
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "filter", normalizeProps(guardReactiveProps({
 						page: __props.page,
@@ -15715,7 +15869,18 @@ var FluxDataTable_default = /* @__PURE__ */ defineComponent({
 						items: limitedItems.value,
 						total: __props.total
 					}))), createVNode(FluxTableRow_default, null, {
-						default: withCtx(() => [renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps({
+						default: withCtx(() => [__props.selectionMode ? (openBlock(), createBlock(FluxTableHeader_default, {
+							key: 0,
+							"is-shrinking": "",
+							class: normalizeClass(unref(Table_module_default).tableCellSelection)
+						}, {
+							default: withCtx(() => [__props.selectionMode === "multiple" ? (openBlock(), createBlock(FluxCheckbox_default, {
+								key: 0,
+								"model-value": selectAllState.value,
+								"onUpdate:modelValue": onSelectAll
+							}, null, 8, ["model-value"])) : createCommentVNode("", true)]),
+							_: 1
+						}, 8, ["class"])) : createCommentVNode("", true), renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps({
 							page: __props.page,
 							perPage: __props.perPage,
 							items: limitedItems.value,
@@ -15789,7 +15954,7 @@ var FluxDisabled_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxDivider.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$34 = ["aria-orientation"];
+var _hoisted_1$33 = ["aria-orientation"];
 //#endregion
 //#region src/component/FluxDivider.vue
 var FluxDivider_default = /* @__PURE__ */ defineComponent({
@@ -15811,18 +15976,18 @@ var FluxDivider_default = /* @__PURE__ */ defineComponent({
 			}, [renderSlot(_ctx.$slots, "default")], 2)) : (openBlock(), createElementBlock("hr", {
 				key: 1,
 				class: normalizeClass(unref(Divider_module_default).dividerLine)
-			}, null, 2))], 10, _hoisted_1$34);
+			}, null, 2))], 10, _hoisted_1$33);
 		};
 	}
 });
 //#endregion
 //#region src/component/FluxDotPattern.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$33 = [
+var _hoisted_1$32 = [
 	"id",
 	"width",
 	"height"
 ];
-var _hoisted_2$12 = [
+var _hoisted_2$11 = [
 	"r",
 	"cx",
 	"cy"
@@ -15872,7 +16037,7 @@ var FluxDotPattern_default = /* @__PURE__ */ defineComponent({
 				r: __props.cr,
 				cx: __props.width / 2 - __props.cx,
 				cy: __props.height / 2 - __props.cy
-			}, null, 8, _hoisted_2$12)], 8, _hoisted_1$33)]), createElementVNode("rect", {
+			}, null, 8, _hoisted_2$11)], 8, _hoisted_1$32)]), createElementVNode("rect", {
 				width: "100%",
 				height: "100%",
 				"stroke-width": "0",
@@ -15895,12 +16060,12 @@ var DropZone_module_default = {
 };
 //#endregion
 //#region src/component/FluxDropZone.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$32 = [
+var _hoisted_1$31 = [
 	"aria-disabled",
 	"aria-label",
 	"tabindex"
 ];
-var _hoisted_2$11 = ["pathLength"];
+var _hoisted_2$10 = ["pathLength"];
 //#endregion
 //#region src/component/FluxDropZone.vue
 var FluxDropZone_default = /* @__PURE__ */ defineComponent({
@@ -16014,7 +16179,7 @@ var FluxDropZone_default = /* @__PURE__ */ defineComponent({
 						"stroke-linecap": "round",
 						"stroke-linejoin": "round",
 						pathLength: pathLength.value
-					}, null, 8, _hoisted_2$11)], 2)),
+					}, null, 8, _hoisted_2$10)], 2)),
 					renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
 						isDragging: isDragging.value,
 						isDraggingOver: isDraggingOver.value,
@@ -16041,7 +16206,7 @@ var FluxDropZone_default = /* @__PURE__ */ defineComponent({
 					isDraggingOver: isDraggingOver.value,
 					showPicker
 				})))
-			], 42, _hoisted_1$32);
+			], 42, _hoisted_1$31);
 		};
 	}
 });
@@ -16071,12 +16236,12 @@ var Expandable_module_default = {
 };
 //#endregion
 //#region src/component/FluxExpandable.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$31 = [
+var _hoisted_1$30 = [
 	"id",
 	"aria-controls",
 	"aria-expanded"
 ];
-var _hoisted_2$10 = ["id", "aria-labelledby"];
+var _hoisted_2$9 = ["id", "aria-labelledby"];
 //#endregion
 //#region src/component/FluxExpandable.vue
 var FluxExpandable_default = /* @__PURE__ */ defineComponent({
@@ -16167,9 +16332,9 @@ var FluxExpandable_default = /* @__PURE__ */ defineComponent({
 				})), () => [createElementVNode("div", { class: normalizeClass(unref(Expandable_module_default).expandableContent) }, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
 					label: __props.label,
 					close
-				})))], 2)])], 10, _hoisted_2$10)) : createCommentVNode("", true)]),
+				})))], 2)])], 10, _hoisted_2$9)) : createCommentVNode("", true)]),
 				_: 3
-			})], 10, _hoisted_1$31);
+			})], 10, _hoisted_1$30);
 		};
 	}
 });
@@ -17388,7 +17553,7 @@ var FocalPoint_module_default = {
 };
 //#endregion
 //#region src/component/FluxFocalPointEditor.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$30 = ["src"];
+var _hoisted_1$29 = ["src"];
 //#endregion
 //#region src/component/FluxFocalPointEditor.vue
 var FluxFocalPointEditor_default = /* @__PURE__ */ defineComponent({
@@ -17457,7 +17622,7 @@ var FluxFocalPointEditor_default = /* @__PURE__ */ defineComponent({
 							src: __props.src,
 							alt: "",
 							onLoad: onImageLoaded
-						}, null, 42, _hoisted_1$30), createElementVNode("div", {
+						}, null, 42, _hoisted_1$29), createElementVNode("div", {
 							class: normalizeClass(unref(FocalPoint_module_default).focalPointEditorArea),
 							style: normalizeStyle({
 								top: `${focalPointY.value}%`,
@@ -17486,7 +17651,7 @@ var FluxFocalPointEditor_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxFocalPointImage.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$29 = ["src", "alt"];
+var _hoisted_1$28 = ["src", "alt"];
 //#endregion
 //#region src/component/FluxFocalPointImage.vue
 var FluxFocalPointImage_default = /* @__PURE__ */ defineComponent({
@@ -17505,13 +17670,13 @@ var FluxFocalPointImage_default = /* @__PURE__ */ defineComponent({
 				style: normalizeStyle({ objectPosition: `${x.value}% ${y.value}%` }),
 				src: __props.src,
 				alt: __props.alt
-			}, null, 14, _hoisted_1$29);
+			}, null, 14, _hoisted_1$28);
 		};
 	}
 });
 //#endregion
 //#region src/component/FluxForm.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$28 = ["aria-disabled"];
+var _hoisted_1$27 = ["aria-disabled"];
 //#endregion
 //#region src/component/FluxForm.vue
 var FluxForm_default = /* @__PURE__ */ defineComponent({
@@ -17534,7 +17699,7 @@ var FluxForm_default = /* @__PURE__ */ defineComponent({
 			}, [createVNode(FluxDisabled_default, { disabled: __props.disabled }, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["disabled"])], 42, _hoisted_1$28);
+			}, 8, ["disabled"])], 42, _hoisted_1$27);
 		};
 	}
 });
@@ -17646,7 +17811,7 @@ var FluxFormDateInput_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxFormDateRangeInput.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$27 = { key: 0 };
+var _hoisted_1$26 = { key: 0 };
 //#endregion
 //#region src/component/FluxFormDateRangeInput.vue
 var FluxFormDateRangeInput_default = /* @__PURE__ */ defineComponent({
@@ -17692,7 +17857,7 @@ var FluxFormDateRangeInput_default = /* @__PURE__ */ defineComponent({
 					default: withCtx(() => [createElementVNode("div", {
 						class: normalizeClass(unref(clsx)(unref(Form_module_default).formDateRangeInput, unref(disabled) && unref(Form_module_default).isDisabled, __props.isCondensed && unref(Form_module_default).isCondensed, __props.isSecondary && unref(Form_module_default).isSecondary, __props.error && unref(Form_module_default).isInvalid)),
 						role: "presentation"
-					}, [label.value ? (openBlock(), createElementBlock("span", _hoisted_1$27, toDisplayString(label.value), 1)) : __props.placeholder ? (openBlock(), createElementBlock("span", {
+					}, [label.value ? (openBlock(), createElementBlock("span", _hoisted_1$26, toDisplayString(label.value), 1)) : __props.placeholder ? (openBlock(), createElementBlock("span", {
 						key: 1,
 						class: normalizeClass(unref(Form_module_default).formSelectPlaceholder)
 					}, toDisplayString(__props.placeholder), 3)) : createCommentVNode("", true)], 2), createVNode(FluxSecondaryButton_default, {
@@ -17864,7 +18029,7 @@ var FluxFormGrid_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxFormInputAddition.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$26 = { key: 1 };
+var _hoisted_1$25 = { key: 1 };
 //#endregion
 //#region src/component/FluxFormInputAddition.vue
 var FluxFormInputAddition_default = /* @__PURE__ */ defineComponent({
@@ -17881,7 +18046,7 @@ var FluxFormInputAddition_default = /* @__PURE__ */ defineComponent({
 					name: __props.icon,
 					size: 18
 				}, null, 8, ["name"])) : createCommentVNode("", true),
-				__props.label ? (openBlock(), createElementBlock("span", _hoisted_1$26, toDisplayString(__props.label), 1)) : createCommentVNode("", true),
+				__props.label ? (openBlock(), createElementBlock("span", _hoisted_1$25, toDisplayString(__props.label), 1)) : createCommentVNode("", true),
 				renderSlot(_ctx.$slots, "default")
 			], 2);
 		};
@@ -17889,14 +18054,14 @@ var FluxFormInputAddition_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxFormPinInput.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$25 = [
+var _hoisted_1$24 = [
 	"id",
 	"name",
 	"autofocus",
 	"aria-disabled",
 	"aria-invalid"
 ];
-var _hoisted_2$9 = [
+var _hoisted_2$8 = [
 	"aria-label",
 	"autocomplete",
 	"autofocus",
@@ -18012,8 +18177,8 @@ var FluxFormPinInput_default = /* @__PURE__ */ defineComponent({
 					onInput,
 					onKeydown: onKeyDown,
 					onPaste
-				}, null, 42, _hoisted_2$9);
-			}), 128))], 14, _hoisted_1$25);
+				}, null, 42, _hoisted_2$8);
+			}), 128))], 14, _hoisted_1$24);
 		};
 	}
 });
@@ -18309,7 +18474,7 @@ var FluxFormSelectAsync_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxFormTextArea.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$24 = [
+var _hoisted_1$23 = [
 	"id",
 	"name",
 	"autocomplete",
@@ -18371,7 +18536,7 @@ var FluxFormTextArea_default = /* @__PURE__ */ defineComponent({
 				"aria-invalid": __props.error ? true : void 0,
 				onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur")),
 				onFocus: _cache[2] || (_cache[2] = ($event) => emit("focus"))
-			}, null, 46, _hoisted_1$24)), [[vModelText, modelValue.value]]);
+			}, null, 46, _hoisted_1$23)), [[vModelText, modelValue.value]]);
 		};
 	}
 });
@@ -19098,7 +19263,7 @@ var TreeViewSelect_module_default = {
 };
 //#endregion
 //#region src/component/FluxFormTreeViewSelect.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$23 = [
+var _hoisted_1$22 = [
 	"role",
 	"tabindex",
 	"aria-selected",
@@ -19339,7 +19504,7 @@ var FluxFormTreeViewSelect_default = /* @__PURE__ */ defineComponent({
 							"expanded",
 							"level-colors",
 							"onExpandClick"
-						])], 42, _hoisted_1$23);
+						])], 42, _hoisted_1$22);
 					}), 128))], 2)]),
 					_: 1
 				}, 8, ["class", "anchor"])) : createCommentVNode("", true)]),
@@ -19354,7 +19519,7 @@ var Remove_module_default = {
 };
 //#endregion
 //#region src/component/FluxRemove.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$22 = ["aria-label"];
+var _hoisted_1$21 = ["aria-label"];
 //#endregion
 //#region src/component/FluxRemove.vue
 var FluxRemove_default = /* @__PURE__ */ defineComponent({
@@ -19377,7 +19542,7 @@ var FluxRemove_default = /* @__PURE__ */ defineComponent({
 				key: 0,
 				name: __props.icon,
 				size: 16
-			}, null, 8, ["name"])) : createCommentVNode("", true)], 10, _hoisted_1$22);
+			}, null, 8, ["name"])) : createCommentVNode("", true)], 10, _hoisted_1$21);
 		};
 	}
 });
@@ -19450,7 +19615,7 @@ var FluxGalleryItem_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxGallery.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$21 = ["onClick"];
+var _hoisted_1$20 = ["onClick"];
 //#endregion
 //#region src/component/FluxGallery.vue
 var FluxGallery_default = /* @__PURE__ */ defineComponent({
@@ -19528,7 +19693,7 @@ var FluxGallery_default = /* @__PURE__ */ defineComponent({
 							class: normalizeClass(unref(Gallery_module_default).galleryAdd),
 							type: "button",
 							onClick: ($event) => showPicker()
-						}, [createVNode(FluxIcon_default, { name: "plus" })], 10, _hoisted_1$21)) : createCommentVNode("", true)
+						}, [createVNode(FluxIcon_default, { name: "plus" })], 10, _hoisted_1$20)) : createCommentVNode("", true)
 					]),
 					_: 2
 				}, 1032, ["class", "move-class"])]),
@@ -19603,12 +19768,12 @@ var FluxGridColumn_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxGridPattern.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$20 = [
+var _hoisted_1$19 = [
 	"id",
 	"width",
 	"height"
 ];
-var _hoisted_2$8 = ["d", "stroke-dasharray"];
+var _hoisted_2$7 = ["d", "stroke-dasharray"];
 var _hoisted_3$3 = ["fill"];
 var _hoisted_4 = {
 	key: 0,
@@ -19648,7 +19813,7 @@ var FluxGridPattern_default = /* @__PURE__ */ defineComponent({
 					d: `M.5 ${__props.height}V.5H${__props.width}`,
 					fill: "none",
 					"stroke-dasharray": __props.strokeDasharray
-				}, null, 8, _hoisted_2$8)], 8, _hoisted_1$20)]),
+				}, null, 8, _hoisted_2$7)], 8, _hoisted_1$19)]),
 				createElementVNode("rect", {
 					width: "100%",
 					height: "100%",
@@ -19715,7 +19880,7 @@ var Kanban_module_default = {
 };
 //#endregion
 //#region src/component/FluxKanban.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$19 = ["aria-label"];
+var _hoisted_1$18 = ["aria-label"];
 //#endregion
 //#region src/component/FluxKanban.vue
 var FluxKanban_default = /* @__PURE__ */ defineComponent({
@@ -19782,14 +19947,14 @@ var FluxKanban_default = /* @__PURE__ */ defineComponent({
 				"aria-live": "polite",
 				"aria-atomic": "true",
 				class: normalizeClass(unref(Kanban_module_default).kanbanLiveRegion)
-			}, toDisplayString(liveMessage.value), 3)], 10, _hoisted_1$19);
+			}, toDisplayString(liveMessage.value), 3)], 10, _hoisted_1$18);
 		};
 	}
 });
 //#endregion
 //#region src/component/FluxKanbanColumn.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$18 = ["aria-label", "aria-disabled"];
-var _hoisted_2$7 = ["draggable", "tabindex"];
+var _hoisted_1$17 = ["aria-label", "aria-disabled"];
+var _hoisted_2$6 = ["draggable", "tabindex"];
 //#endregion
 //#region src/component/FluxKanbanColumn.vue
 var FluxKanbanColumn_default = /* @__PURE__ */ defineComponent({
@@ -19941,7 +20106,7 @@ var FluxKanbanColumn_default = /* @__PURE__ */ defineComponent({
 						key: 1,
 						label: String(__props.count)
 					}, null, 8, ["label"])) : createCommentVNode("", true)
-				], 2), renderSlot(_ctx.$slots, "actions")], 42, _hoisted_2$7),
+				], 2), renderSlot(_ctx.$slots, "actions")], 42, _hoisted_2$6),
 				createElementVNode("main", {
 					ref_key: "body",
 					ref: body,
@@ -19970,13 +20135,13 @@ var FluxKanbanColumn_default = /* @__PURE__ */ defineComponent({
 					key: 0,
 					class: normalizeClass(unref(Kanban_module_default).kanbanColumnFooter)
 				}, [hasFooter.value ? renderSlot(_ctx.$slots, "footer", { key: 0 }) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)
-			], 10, _hoisted_1$18);
+			], 10, _hoisted_1$17);
 		};
 	}
 });
 //#endregion
 //#region src/component/FluxKanbanItem.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$17 = [
+var _hoisted_1$16 = [
 	"aria-disabled",
 	"draggable",
 	"tabindex"
@@ -20102,7 +20267,7 @@ var FluxKanbanItem_default = /* @__PURE__ */ defineComponent({
 				onDragover: withModifiers(onDragOver, ["stop"]),
 				onFocus,
 				onKeydown: _cache[0] || (_cache[0] = (...args) => unref(handleKeyDown) && unref(handleKeyDown)(...args))
-			}, [renderSlot(_ctx.$slots, "default")], 42, _hoisted_1$17);
+			}, [renderSlot(_ctx.$slots, "default")], 42, _hoisted_1$16);
 		};
 	}
 });
@@ -20299,7 +20464,7 @@ var FluxLink_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxMenuCollapsible.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$16 = ["id"];
+var _hoisted_1$15 = ["id"];
 //#endregion
 //#region src/component/FluxMenuCollapsible.vue
 var FluxMenuCollapsible_default = /* @__PURE__ */ defineComponent({
@@ -20409,7 +20574,7 @@ var FluxMenuCollapsible_default = /* @__PURE__ */ defineComponent({
 					id: unref(bodyId),
 					class: normalizeClass(unref(Menu_module_default).menuCollapsibleBody),
 					role: "group"
-				}, [createElementVNode("div", { class: normalizeClass(unref(Menu_module_default).menuCollapsibleContent) }, [renderSlot(_ctx.$slots, "default")], 2)], 10, _hoisted_1$16)) : createCommentVNode("", true)]),
+				}, [createElementVNode("div", { class: normalizeClass(unref(Menu_module_default).menuCollapsibleContent) }, [renderSlot(_ctx.$slots, "default")], 2)], 10, _hoisted_1$15)) : createCommentVNode("", true)]),
 				_: 3
 			})], 2);
 		};
@@ -20487,7 +20652,7 @@ var Notice_module_default = {
 };
 //#endregion
 //#region src/component/FluxNotice.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$15 = ["aria-label"];
+var _hoisted_1$14 = ["aria-label"];
 //#endregion
 //#region src/component/FluxNotice.vue
 var FluxNotice_default = /* @__PURE__ */ defineComponent({
@@ -20538,7 +20703,7 @@ var FluxNotice_default = /* @__PURE__ */ defineComponent({
 					type: "button",
 					"aria-label": unref(translate)("flux.close"),
 					onClick: _cache[0] || (_cache[0] = ($event) => emit("close"))
-				}, [createVNode(FluxIcon_default, { name: "xmark" })], 10, _hoisted_1$15)) : createCommentVNode("", true)
+				}, [createVNode(FluxIcon_default, { name: "xmark" })], 10, _hoisted_1$14)) : createCommentVNode("", true)
 			], 2);
 		};
 	}
@@ -20791,7 +20956,7 @@ var FluxPaneIllustration_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxPaneMedia.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$14 = ["src", "alt"];
+var _hoisted_1$13 = ["src", "alt"];
 //#endregion
 //#region src/component/FluxPaneMedia.vue
 var FluxPaneMedia_default = /* @__PURE__ */ defineComponent({
@@ -20816,7 +20981,7 @@ var FluxPaneMedia_default = /* @__PURE__ */ defineComponent({
 				}),
 				src: __props.imageUrl,
 				alt: __props.imageAlt
-			}, null, 14, _hoisted_1$14)) : createCommentVNode("", true)], 2);
+			}, null, 14, _hoisted_1$13)) : createCommentVNode("", true)], 2);
 		};
 	}
 });
@@ -20861,7 +21026,7 @@ var FluxPercentageBar_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxPersona.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$13 = { key: 0 };
+var _hoisted_1$12 = { key: 0 };
 //#endregion
 //#region src/component/FluxPersona.vue
 var FluxPersona_default = /* @__PURE__ */ defineComponent({
@@ -20901,14 +21066,14 @@ var FluxPersona_default = /* @__PURE__ */ defineComponent({
 			]), !__props.isCompact ? (openBlock(), createElementBlock("div", {
 				key: 0,
 				class: normalizeClass(unref(Avatar_module_default).personaDetails)
-			}, [createElementVNode("strong", null, toDisplayString(__props.name), 1), __props.title ? (openBlock(), createElementBlock("span", _hoisted_1$13, toDisplayString(__props.title), 1)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)], 2);
+			}, [createElementVNode("strong", null, toDisplayString(__props.name), 1), __props.title ? (openBlock(), createElementBlock("span", _hoisted_1$12, toDisplayString(__props.title), 1)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)], 2);
 		};
 	}
 });
 //#endregion
 //#region src/component/FluxPlaceholder.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$12 = { key: 0 };
-var _hoisted_2$6 = { key: 1 };
+var _hoisted_1$11 = { key: 0 };
+var _hoisted_2$5 = { key: 1 };
 //#endregion
 //#region src/component/FluxPlaceholder.vue
 var FluxPlaceholder_default = /* @__PURE__ */ defineComponent({
@@ -20937,7 +21102,7 @@ var FluxPlaceholder_default = /* @__PURE__ */ defineComponent({
 					class: normalizeClass(unref(Placeholder_module_default).placeholderIcon),
 					name: __props.icon
 				}, null, 8, ["class", "name"])) : createCommentVNode("", true),
-				createElementVNode("div", { class: normalizeClass(unref(Placeholder_module_default).placeholderCaption) }, [__props.title ? (openBlock(), createElementBlock("strong", _hoisted_1$12, toDisplayString(__props.title), 1)) : createCommentVNode("", true), __props.message ? (openBlock(), createElementBlock("p", _hoisted_2$6, toDisplayString(__props.message), 1)) : createCommentVNode("", true)], 2),
+				createElementVNode("div", { class: normalizeClass(unref(Placeholder_module_default).placeholderCaption) }, [__props.title ? (openBlock(), createElementBlock("strong", _hoisted_1$11, toDisplayString(__props.title), 1)) : createCommentVNode("", true), __props.message ? (openBlock(), createElementBlock("p", _hoisted_2$5, toDisplayString(__props.message), 1)) : createCommentVNode("", true)], 2),
 				renderSlot(_ctx.$slots, "default")
 			], 2);
 		};
@@ -21163,7 +21328,7 @@ var FluxPublishButton_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxQuantitySelector.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$11 = [
+var _hoisted_1$10 = [
 	"disabled",
 	"max",
 	"min",
@@ -21236,7 +21401,7 @@ var FluxQuantitySelector_default = /* @__PURE__ */ defineComponent({
 						max: __props.max,
 						min: __props.min,
 						step: __props.step
-					}, null, 14, _hoisted_1$11), [[vModelText, modelValue.value]]),
+					}, null, 14, _hoisted_1$10), [[vModelText, modelValue.value]]),
 					createVNode(FluxSecondaryButton_default, {
 						class: normalizeClass(unref(Form_module_default).quantitySelectorButton),
 						disabled: unref(disabled) || modelValue.value >= __props.max,
@@ -21283,7 +21448,7 @@ var Snackbar_module_default = {
 };
 //#endregion
 //#region src/component/FluxSnackbar.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$10 = ["onClick"];
+var _hoisted_1$9 = ["onClick"];
 //#endregion
 //#region src/component/FluxSnackbar.vue
 var FluxSnackbar_default = /* @__PURE__ */ defineComponent({
@@ -21399,7 +21564,7 @@ var FluxSnackbar_default = /* @__PURE__ */ defineComponent({
 						tabindex: "-1",
 						type: "button",
 						onClick: ($event) => onAction(actionKey)
-					}, [createElementVNode("span", null, toDisplayString(actionLabel), 1)], 10, _hoisted_1$10);
+					}, [createElementVNode("span", null, toDisplayString(actionLabel), 1)], 10, _hoisted_1$9);
 				}), 128))], 2)) : createCommentVNode("", true),
 				__props.isCloseable ? (openBlock(), createBlock(FluxAction_default, {
 					key: 1,
@@ -21602,7 +21767,7 @@ var Root_module_default = {
 };
 //#endregion
 //#region src/component/FluxRoot.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$9 = ["inert"];
+var _hoisted_1$8 = ["inert"];
 //#endregion
 //#region src/component/FluxRoot.vue
 var FluxRoot_default = /* @__PURE__ */ defineComponent({
@@ -21620,7 +21785,7 @@ var FluxRoot_default = /* @__PURE__ */ defineComponent({
 				createElementVNode("div", mergeProps($attrs, {
 					class: unref(Root_module_default).root,
 					inert: unref(inertMain)
-				}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$9),
+				}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$8),
 				createVNode(FluxOverlayProvider_default),
 				createVNode(FluxSnackbarProvider_default),
 				createVNode(FluxTooltipProvider_default)
@@ -21758,8 +21923,8 @@ var SegmentedControl_module_default = {
 };
 //#endregion
 //#region src/component/FluxSegmentedControl.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$8 = ["aria-label"];
-var _hoisted_2$5 = [
+var _hoisted_1$7 = ["aria-label"];
+var _hoisted_2$4 = [
 	"aria-checked",
 	"aria-label",
 	"tabindex",
@@ -21865,8 +22030,8 @@ var FluxSegmentedControl_default = /* @__PURE__ */ defineComponent({
 					key: 0,
 					name: item.icon,
 					size: 15
-				}, null, 8, ["name"])) : createCommentVNode("", true), item.label ? (openBlock(), createElementBlock("span", _hoisted_3$2, toDisplayString(item.label), 1)) : createCommentVNode("", true)], 10, _hoisted_2$5)], 64);
-			}), 256))], 42, _hoisted_1$8);
+				}, null, 8, ["name"])) : createCommentVNode("", true), item.label ? (openBlock(), createElementBlock("span", _hoisted_3$2, toDisplayString(item.label), 1)) : createCommentVNode("", true)], 10, _hoisted_2$4)], 64);
+			}), 256))], 42, _hoisted_1$7);
 		};
 	}
 });
@@ -21995,7 +22160,7 @@ var FluxSplitViewPane_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxSplitView.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$7 = [
+var _hoisted_1$6 = [
 	"aria-orientation",
 	"aria-valuenow",
 	"tabindex",
@@ -22060,7 +22225,7 @@ var FluxSplitView_default = /* @__PURE__ */ defineComponent({
 						tabindex: pane.isResizable ? 0 : -1,
 						onPointerdown: ($event) => unref(onHandlePointerDown)($event, index),
 						onKeydown: ($event) => unref(onHandleKeyDown)($event, index)
-					}, null, 42, _hoisted_1$7)) : createCommentVNode("", true)], 64);
+					}, null, 42, _hoisted_1$6)) : createCommentVNode("", true)], 64);
 				}), 128))]),
 				_: 1
 			}, 8, ["class", "style"]);
@@ -22085,8 +22250,8 @@ var Statistic_module_default = {
 };
 //#endregion
 //#region src/component/FluxStatistic.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$6 = { key: 1 };
-var _hoisted_2$4 = ["src", "alt"];
+var _hoisted_1$5 = { key: 1 };
+var _hoisted_2$3 = ["src", "alt"];
 var _hoisted_3$1 = { key: 0 };
 //#endregion
 //#region src/component/FluxStatistic.vue
@@ -22122,11 +22287,11 @@ var FluxStatistic_default = /* @__PURE__ */ defineComponent({
 						"class",
 						"color",
 						"name"
-					])) : __props.imageSrc ? (openBlock(), createElementBlock("div", _hoisted_1$6, [createElementVNode("img", {
+					])) : __props.imageSrc ? (openBlock(), createElementBlock("div", _hoisted_1$5, [createElementVNode("img", {
 						class: normalizeClass(unref(Statistic_module_default).statisticImage),
 						src: __props.imageSrc,
 						alt: __props.imageAlt
-					}, null, 10, _hoisted_2$4)])) : createCommentVNode("", true),
+					}, null, 10, _hoisted_2$3)])) : createCommentVNode("", true),
 					createElementVNode("div", { class: normalizeClass(unref(Statistic_module_default).statisticData) }, [createElementVNode("span", null, toDisplayString(__props.label), 1), createElementVNode("strong", null, toDisplayString(__props.value ?? unref(Z$2)), 1)], 2),
 					__props.changeIcon || __props.changeValue ? (openBlock(), createElementBlock("div", {
 						key: 2,
@@ -22144,7 +22309,7 @@ var FluxStatistic_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/css/component/Stepper.module.scss
-var { "sparklesContainer": _0$2, "sparklesContainerActive": _1, "sparklesParticles": _2 } = {
+var { "sparklesContainerActive": _0$2, "sparklesContainer": _1, "sparklesParticles": _2 } = {
 	sparklesContainer: `sparkles-container`,
 	sparklesParticles: `sparkles-particles`,
 	sparklesContainerActive: `sparkles-container-active`,
@@ -22155,17 +22320,17 @@ var { "sparklesContainer": _0$2, "sparklesContainerActive": _1, "sparklesParticl
 var Stepper_module_default = {
 	stepperStep: `stepper-step`,
 	stepperSteps: `stepper-steps`,
-	stepperStepsItem: `stepper-steps-item ${_0$2}`,
+	stepperStepsItem: `stepper-steps-item ${_1}`,
 	icon: `icon`,
-	stepperStepsItemComplete: `stepper-steps-item-complete ${_1} stepper-steps-item ${_0$2}`,
-	stepperStepsItemCurrent: `stepper-steps-item-current stepper-steps-item ${_0$2}`,
-	stepperStepsItemIdle: `stepper-steps-item-idle stepper-steps-item ${_0$2}`,
+	stepperStepsItemComplete: `stepper-steps-item-complete ${_0$2} stepper-steps-item ${_1}`,
+	stepperStepsItemCurrent: `stepper-steps-item-current stepper-steps-item ${_1}`,
+	stepperStepsItemIdle: `stepper-steps-item-idle stepper-steps-item ${_1}`,
 	stepperStepsItemParticles: `stepper-steps-item-particles ${_2}`
 };
 //#endregion
 //#region src/component/FluxStepperSteps.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$5 = ["onClick"];
-var _hoisted_2$3 = { key: 1 };
+var _hoisted_1$4 = ["onClick"];
+var _hoisted_2$2 = { key: 1 };
 //#endregion
 //#region src/component/FluxStepperSteps.vue
 var FluxStepperSteps_default = /* @__PURE__ */ defineComponent({
@@ -22196,9 +22361,9 @@ var FluxStepperSteps_default = /* @__PURE__ */ defineComponent({
 					default: withCtx(() => [__props.current > step ? (openBlock(), createBlock(FluxIcon_default, {
 						key: 0,
 						name: "check"
-					})) : (openBlock(), createElementBlock("span", _hoisted_2$3, toDisplayString(step), 1))]),
+					})) : (openBlock(), createElementBlock("span", _hoisted_2$2, toDisplayString(step), 1))]),
 					_: 2
-				}, 1024)], 10, _hoisted_1$5);
+				}, 1024)], 10, _hoisted_1$4);
 			}), 128))], 6);
 		};
 	}
@@ -22485,7 +22650,7 @@ var FluxTabBar_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/component/FluxTabBarItem.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$4 = { key: 1 };
+var _hoisted_1$3 = { key: 1 };
 //#endregion
 //#region src/component/FluxTabBarItem.vue
 var FluxTabBarItem_default = /* @__PURE__ */ defineComponent({
@@ -22577,7 +22742,7 @@ var FluxTabBarItem_default = /* @__PURE__ */ defineComponent({
 					key: 0,
 					name: __props.icon,
 					size: 16
-				}, null, 8, ["name"])) : createCommentVNode("", true), __props.label ? (openBlock(), createElementBlock("span", _hoisted_1$4, toDisplayString(__props.label), 1)) : createCommentVNode("", true)]),
+				}, null, 8, ["name"])) : createCommentVNode("", true), __props.label ? (openBlock(), createElementBlock("span", _hoisted_1$3, toDisplayString(__props.label), 1)) : createCommentVNode("", true)]),
 				_: 1
 			}, 8, [
 				"component-type",
@@ -22696,79 +22861,6 @@ var FluxTableBar_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-//#region src/component/FluxTableHeader.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$3 = ["aria-sort"];
-var _hoisted_2$2 = ["aria-label", "onClick"];
-//#endregion
-//#region src/component/FluxTableHeader.vue
-var FluxTableHeader_default = /* @__PURE__ */ defineComponent({
-	__name: "FluxTableHeader",
-	props: {
-		isShrinking: { type: Boolean },
-		isSortable: { type: Boolean },
-		isSticky: { type: Boolean },
-		minWidth: { default: 0 },
-		sort: {}
-	},
-	emits: ["sort"],
-	setup(__props, { emit: $emit }) {
-		const { isBordered } = useTableInjection_default();
-		const translate = useTranslate_default();
-		const sortingIcon = computed(() => {
-			switch (__props.sort) {
-				case "ascending": return "arrow-down-a-z";
-				case "descending": return "arrow-up-a-z";
-				default: return "arrow-up-arrow-down";
-			}
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("th", {
-				class: normalizeClass(unref(clsx)(unref(Table_module_default).tableHeader, unref(isBordered) && unref(Table_module_default).isBordered, __props.isShrinking && unref(Table_module_default).isShrinking, __props.isSticky && unref(Table_module_default).isSticky)),
-				scope: "col",
-				"aria-sort": __props.isSortable ? __props.sort ?? "none" : void 0,
-				style: normalizeStyle({ minWidth: `${__props.minWidth}px` })
-			}, [createElementVNode("div", { class: normalizeClass(unref(Table_module_default).tableHeaderContent) }, [renderSlot(_ctx.$slots, "default"), __props.isSortable ? (openBlock(), createBlock(FluxFlyout_default, { key: 0 }, {
-				opener: withCtx(({ open }) => [createElementVNode("button", {
-					class: normalizeClass(unref(Table_module_default).tableSort),
-					"aria-label": unref(translate)("flux.sort"),
-					tabindex: "-1",
-					type: "button",
-					onClick: open
-				}, [createVNode(FluxIcon_default, {
-					size: 16,
-					name: sortingIcon.value
-				}, null, 8, ["name"])], 10, _hoisted_2$2)]),
-				default: withCtx(() => [createVNode(FluxMenu_default, null, {
-					default: withCtx(() => [createVNode(FluxMenuGroup_default, null, {
-						default: withCtx(() => [createVNode(FluxMenuItem_default, {
-							"is-highlighted": __props.sort === "ascending",
-							"icon-leading": "arrow-down-a-z",
-							label: unref(translate)("flux.sortAscending"),
-							onClick: _cache[0] || (_cache[0] = ($event) => $emit("sort", "ascending"))
-						}, null, 8, ["is-highlighted", "label"]), createVNode(FluxMenuItem_default, {
-							"is-highlighted": __props.sort === "descending",
-							"icon-leading": "arrow-up-a-z",
-							label: unref(translate)("flux.sortDescending"),
-							onClick: _cache[1] || (_cache[1] = ($event) => $emit("sort", "descending"))
-						}, null, 8, ["is-highlighted", "label"])]),
-						_: 1
-					}), __props.sort ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createVNode(FluxSeparator_default), createVNode(FluxMenuGroup_default, null, {
-						default: withCtx(() => [createVNode(FluxMenuItem_default, {
-							"icon-leading": "circle-xmark",
-							"is-destructive": "",
-							label: unref(translate)("flux.sortRemove"),
-							onClick: _cache[2] || (_cache[2] = ($event) => $emit("sort", null))
-						}, null, 8, ["label"])]),
-						_: 1
-					})], 64)) : createCommentVNode("", true)]),
-					_: 1
-				})]),
-				_: 1
-			})) : createCommentVNode("", true)], 2)], 14, _hoisted_1$3);
-		};
-	}
-});
-//#endregion
 //#region src/component/FluxTagStack.vue
 var FluxTagStack_default = /* @__PURE__ */ defineComponent({
 	__name: "FluxTagStack",