bootstrap-vue-next 0.45.2 → 0.45.4

package/dist/{BTable-G-Pjvx68.js → BTable-CXxJl2ps.js}

@@ -375,8 +375,16 @@ var useItemExpansion = ({ allItems, primaryKey, expandedItems }) => {
 };
 var useTableKeyboardNavigation = ({ items, id }, events) => {
 	const keyboardNavigation = (0, vue.inject)(require_keys.tableKeyboardNavigationKey, null);
-	const shouldHeaderBeFocusable = (field) => !!(keyboardNavigation?.headerNavigation.value && field.sortable === true);
-	const shouldRowBeFocusable = (0, vue.computed)(() => !!(keyboardNavigation?.rowNavigation.value && (0, vue.toValue)(items).length > 0));
+	const instance = (0, vue.getCurrentInstance)();
+	const hasEventHandler = (eventName) => {
+		const props = instance?.vnode.props;
+		if (!props) return false;
+		return !!(props[`on${eventName}`] || props[`on${eventName}Once`]);
+	};
+	const hasHeadClickedHandler = (0, vue.computed)(() => hasEventHandler("HeadClicked"));
+	const hasRowClickedHandler = (0, vue.computed)(() => hasEventHandler("RowClicked"));
+	const shouldHeaderBeFocusable = (field) => keyboardNavigation ? !!(keyboardNavigation.headerNavigation.value && field.sortable === true) : hasHeadClickedHandler.value;
+	const shouldRowBeFocusable = (0, vue.computed)(() => keyboardNavigation ? !!(keyboardNavigation.rowNavigation.value && (0, vue.toValue)(items).length > 0) : !!(hasRowClickedHandler.value && (0, vue.toValue)(items).length > 0));
 	const headerClicked = (field, event, isFooter = false) => {
 		events.onHeadClicked({
 			key: field.key,
@@ -446,7 +454,7 @@ var _hoisted_2$1 = {
 	key: 0,
 	class: "b-table-stacked-label"
 };
-var _hoisted_3 = { class: "d-inline-flex flex-nowrap align-items-center gap-1" };
+var _hoisted_3$1 = { class: "d-inline-flex flex-nowrap align-items-center gap-1" };
 var _hoisted_4 = { key: 3 };
 //#endregion
 //#region src/components/BTable/BTableLite.vue
@@ -787,7 +795,10 @@ var BTableLite_default = /* @__PURE__ */ (0, vue.defineComponent)({
 											key: field.key,
 											variant: ((0, vue.unref)(isTableItem)(item) ? item._cellVariants?.[field.key] : false) ? null : field.variant,
 											class: getFieldRowClasses(field, item)
-										}, { ref_for: true }, itemAttributes(item, field)), {
+										}, { ref_for: true }, {
+											...field.isRowHeader ? { scope: "row" } : void 0,
+											...itemAttributes(item, field)
+										}), {
 											default: (0, vue.withCtx)(() => [(0, vue.unref)(props).stacked && (0, vue.unref)(props).labelStacked ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("label", _hoisted_2$1, (0, vue.toDisplayString)((0, vue.unref)(getTableFieldHeadLabel)(field)), 1)) : (0, vue.createCommentVNode)("", true), (0, vue.renderSlot)(_ctx.$slots, slots[`cell(${field.key})`] ? `cell(${field.key})` : "cell()", {
 												value: (0, vue.unref)(formatItem)(item, field),
 												unformatted: (0, vue.unref)(getByFieldKey)(item, field),
@@ -869,7 +880,7 @@ var BTableLite_default = /* @__PURE__ */ (0, vue.defineComponent)({
 									onClick: ($event) => (0, vue.unref)(keyboardController).headerClicked(field, $event, true),
 									onKeydown: ($event) => (0, vue.unref)(keyboardController).handleHeaderKeydown(field, $event, true)
 								}), {
-									default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_3, [(0, vue.createElementVNode)("div", null, [(0, vue.renderSlot)(_ctx.$slots, calculatedFooterSlot(field.key), {
+									default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_3$1, [(0, vue.createElementVNode)("div", null, [(0, vue.renderSlot)(_ctx.$slots, calculatedFooterSlot(field.key), {
 										label: field.label,
 										column: field.key,
 										field,
@@ -937,6 +948,7 @@ var useTableMapper = ({ fields, items, stackedProps, provider, events, paginatio
 		};
 	}));
 	const getFormatter = (value) => typeof value.sortByFormatted === "function" ? value.sortByFormatted : value.formatter;
+	const getFilterFormatter = (value) => typeof value.filterByFormatted === "function" ? value.filterByFormatted : value.formatter;
 	const getStringValue = (ob, key) => {
 		if (!isTableItem(ob)) return String(ob);
 		const sortField = computedFields.value.find((el) => {
@@ -983,7 +995,7 @@ var useTableMapper = ({ fields, items, stackedProps, provider, events, paginatio
 						return false;
 					});
 					if (isTableField(filterField) && !!filterField.filterByFormatted) {
-						const formatter = getFormatter(filterField);
+						const formatter = getFilterFormatter(filterField);
 						if (formatter) return String(formatter({
 							value: val,
 							key: String(filterField.key),
@@ -1003,12 +1015,25 @@ var useTableMapper = ({ fields, items, stackedProps, provider, events, paginatio
 		}, []);
 		if (sortByItems?.length && (isSortableResolved.value === true && !usesProviderResolved.value && !(0, vue.toValue)(pagination.sort.noLocalSorting) || isSortableResolved.value === true && usesProviderResolved.value && (0, vue.toValue)(provider.noProviderSorting))) {
 			const sortCompareValue = (0, vue.unref)(pagination.sort.sortCompare);
+			const sortNullLastValue = (0, vue.toValue)(pagination.sort.sortNullLast);
 			return mappedItems.sort((a, b) => {
 				for (let i = 0; i < sortByItems.length; i++) {
 					const value = sortByItems[i];
 					if (value === void 0) continue;
 					const { key, order } = value;
-					const comparer = fieldByKey.value.get(key)?.sortCompare || sortCompareValue;
+					const field = fieldByKey.value.get(key);
+					const comparer = field?.sortCompare || sortCompareValue;
+					if (sortNullLastValue && !comparer) {
+						const getItemVal = (item) => {
+							if (!isTableItem(item)) return void 0;
+							return isTableField(field) && field.accessor ? getWithGetter(item, field.accessor) : getWithGetter(item, key);
+						};
+						const aIsNull = getItemVal(a) == null;
+						const bIsNull = getItemVal(b) == null;
+						if (aIsNull && bIsNull) continue;
+						if (aIsNull) return 1;
+						if (bIsNull) return -1;
+					}
 					const comparison = comparer ? comparer(a, b, key) : getStringValue(a, key).localeCompare(getStringValue(b, key), void 0, { numeric: true });
 					if (comparison !== 0) return order === "asc" ? comparison : -comparison;
 				}
@@ -1263,10 +1288,14 @@ var useTableSort = ({ fields, sortBy, initialSortDirection, multisort, mustSort,
 //#endregion
 //#region src/components/BTable/BTable.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = {
+	key: 0,
+	class: "visually-hidden"
+};
+var _hoisted_2 = {
 	role: "alert",
 	"aria-live": "polite"
 };
-var _hoisted_2 = { class: "text-center my-2" };
+var _hoisted_3 = { class: "text-center my-2" };
 //#endregion
 //#region src/components/BTable/BTable.vue
 var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
@@ -1323,6 +1352,13 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			default: void 0
 		},
 		filterable: { default: void 0 },
+		labelSortAsc: { default: "Click to sort ascending" },
+		labelSortClear: { default: "Click to clear sorting" },
+		labelSortDesc: { default: "Click to sort descending" },
+		noFooterSorting: {
+			type: Boolean,
+			default: false
+		},
 		noLocalSorting: {
 			type: Boolean,
 			default: false
@@ -1331,6 +1367,10 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			type: Boolean,
 			default: false
 		},
+		sortNullLast: {
+			type: Boolean,
+			default: false
+		},
 		noSortableIcon: {
 			type: Boolean,
 			default: false
@@ -1480,6 +1520,7 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		"row-unselected",
 		"sorted",
 		"change",
+		"context-changed",
 		"head-clicked",
 		"row-clicked",
 		"row-dblclicked",
@@ -1578,7 +1619,8 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 					isSortable: sortController.isSortable,
 					noLocalSorting: () => props.noLocalSorting,
 					by: sortByModel,
-					sortCompare: (0, vue.toRef)(() => props.sortCompare)
+					sortCompare: (0, vue.toRef)(() => props.sortCompare),
+					sortNullLast: () => props.sortNullLast
 				}
 			},
 			stackedProps: {
@@ -1625,7 +1667,7 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 					event,
 					isFooter
 				});
-				sortController.handleFieldSorting(field);
+				if (!isFooter || !props.noFooterSorting) sortController.handleFieldSorting(field);
 			},
 			onRowClicked: ({ item, index, event }) => {
 				if (!props.noSelectOnClick) selectedItemsController.handleRowSelection({
@@ -1649,7 +1691,10 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		};
 		const computedLiteProps = (0, vue.computed)(() => ({
 			...require_object.pick(props, [...bTableLiteProps, ...bTableSimpleProps]),
-			tableAttrs: { ariaBusy: busyModel.value },
+			tableAttrs: {
+				ariaBusy: busyModel.value,
+				"aria-multiselectable": props.selectable && props.selectMode !== "single" ? true : void 0
+			},
 			items: computedDisplayItems.value,
 			fields: computedFields.value,
 			tableClass: tableClasses.value,
@@ -1665,6 +1710,28 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			items: computedItems.value
 		}));
 		const showEmptyFiltered = (0, vue.computed)(() => isFilterableTable.value && props.filter !== void 0 && props.filter !== "");
+		const getSortLabel = (field) => {
+			if (!sortController.isSortable.value || !field.sortable) return "";
+			const currentSort = sortByModel.value?.find((s) => s.key === field.key);
+			if (!currentSort || currentSort.order === void 0) return props.labelSortAsc;
+			if (currentSort.order === "asc") return props.labelSortDesc;
+			const mustSortValue = props.mustSort;
+			if (mustSortValue === true || Array.isArray(mustSortValue) && mustSortValue.includes(field.key)) return props.labelSortAsc;
+			return props.labelSortClear;
+		};
+		(0, vue.watch)([
+			() => props.filter,
+			sortByModel,
+			writableCurrentPageNumber,
+			perPageNumber
+		], ([filter, sortBy, currentPage, perPage]) => {
+			emit("context-changed", {
+				filter,
+				sortBy,
+				currentPage,
+				perPage
+			});
+		}, { deep: true });
 		__expose({
 			expansion: {
 				...expandedItemsController,
@@ -1698,7 +1765,7 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 					class: "b-table-empty-row"
 				}, {
 					default: (0, vue.withCtx)(() => [(0, vue.createVNode)(BTd_default, { colspan: (0, vue.unref)(computedFields).length }, {
-						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1, [(0, vue.createElementVNode)("div", _hoisted_2, [showEmptyFiltered.value ? (0, vue.renderSlot)(_ctx.$slots, "empty-filtered", (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 0 }, emptySlotScope.value)), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(props).emptyFilteredText), 1)]) : (0, vue.renderSlot)(_ctx.$slots, "empty", (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, emptySlotScope.value)), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(props).emptyText), 1)])])])]),
+						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_2, [(0, vue.createElementVNode)("div", _hoisted_3, [showEmptyFiltered.value ? (0, vue.renderSlot)(_ctx.$slots, "empty-filtered", (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 0 }, emptySlotScope.value)), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(props).emptyFilteredText), 1)]) : (0, vue.renderSlot)(_ctx.$slots, "empty", (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, emptySlotScope.value)), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(props).emptyText), 1)])])])]),
 						_: 3
 					}, 8, ["colspan"])]),
 					_: 3
@@ -1779,7 +1846,7 @@ var BTable_default = /* @__PURE__ */ (0, vue.defineComponent)({
 						fn: (0, vue.withCtx)((scope) => [(0, vue.renderSlot)(_ctx.$slots, slots[`head(${String(field.key)})`] ? `head(${String(field.key)})` : "head()", (0, vue.mergeProps)(scope, {
 							selectAllRows: (0, vue.unref)(selectedItemsController).setAll,
 							clearSelected: (0, vue.unref)(selectedItemsController).clear
-						}), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(getTableFieldHeadLabel)(field)), 1)])])
+						}), () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(getTableFieldHeadLabel)(field)) + " ", 1), (0, vue.unref)(sortController).isSortable.value && field.sortable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_1, (0, vue.toDisplayString)(getSortLabel(field)), 1)) : (0, vue.createCommentVNode)("", true)])])
 					};
 				})
 			]), 1040, ["expanded-items"]);
@@ -1836,4 +1903,4 @@ Object.defineProperty(exports, "BTr_default", {
 	}
 });
 
-//# sourceMappingURL=BTable-G-Pjvx68.js.map
+//# sourceMappingURL=BTable-CXxJl2ps.js.map