aloha-vue 1.2.158 → 1.2.160

package/package.json

@@ -14,7 +14,7 @@
     "Vue.js"
   ],
   "homepage": "https://github.com/ilia-brykin/aloha/#README.md",
-  "version": "1.2.158",
+  "version": "1.2.160",
   "author": {
     "name": "Ilia Brykin",
     "email": "brykin.ilia@gmail.com"

package/src/ATable/ATable.js

@@ -54,6 +54,11 @@ export default {
       required: false,
       default: () => [],
     },
+    clearSelectedRowsOnDataChange: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
     columnActionsWidth: {
       type: Number,
       required: false,
@@ -118,7 +123,6 @@ export default {
     disabledPreviewRowCallback: {
       type: Function,
       required: false,
-      default: () => {},
     },
     disabledRowActions: {
       type: Boolean,
@@ -1006,6 +1010,7 @@ export default {
           previewStyles: this.previewStyles,
           rowIndex: this.previewRightRowIndex,
           rows: this.rowsLocalAll,
+          disabledPreviewRowCallback: this.disabledPreviewRowCallback,
           usePagination: !!this.usePaginationLocal,
           onClosePreview: this.closePreview,
           onMousedownResizePreviewRight: this.mousedownResizePreviewRight,

package/src/ATable/ATableGroupedHeader/ATableGroupedHeader.js

@@ -2,15 +2,13 @@ import {
   h,
 } from "vue";
 
-import ATableHeaderTh from "../ATableHeaderTh/ATableHeaderTh";
+import AOneCheckbox from "../../ui/AOneCheckbox/AOneCheckbox";
 import ATableHeaderThAction from "../ATableHeaderThAction/ATableHeaderThAction";
 
+import CheckboxAPI from "../ATableHeader/compositionAPI/CheckboxAPI";
+
 export default {
   name: "ATableGroupedHeader",
-  components: {
-    ATableHeaderTh,
-    ATableHeaderThAction,
-  },
   props: {
     areAllRowsSelected: {
       type: Boolean,
@@ -75,6 +73,23 @@ export default {
     "isMobile",
     "isMultipleActionsActive",
   ],
+  setup(props, context) {
+    const {
+      isCheckboxDisabled,
+      isCheckboxIndeterminate,
+      labelCheckbox,
+      modelValueCheckboxLocal,
+      toggleCheckbox,
+    } = CheckboxAPI(props, context);
+
+    return {
+      isCheckboxDisabled,
+      isCheckboxIndeterminate,
+      labelCheckbox,
+      modelValueCheckboxLocal,
+      toggleCheckbox,
+    };
+  },
   render() {
     return h("div", {
       ref: "root",
@@ -85,6 +100,23 @@ export default {
         class: "a_table__row a_table__head__row",
         role: "row",
       }, [
+        this.isMultipleActionsActive && h("div", {
+          role: "columnheader",
+          class: "a_table__th a_table__cell a_table__cell_checkbox",
+          style: `width: 50px; min-width: 50px; max-width: 50px;`,
+          "aria-colindex": 1,
+        }, [
+          h(AOneCheckbox, {
+            isWidthAuto: true,
+            modelValue: this.modelValueCheckboxLocal,
+            indeterminate: this.isCheckboxIndeterminate,
+            disabled: this.isCheckboxDisabled,
+            label: this.labelCheckbox,
+            labelClass: "a_sr_only",
+            isLabelTitle: true,
+            "onUpdate:modelValue": this.toggleCheckbox,
+          }),
+        ]),
         this.columnsForRender,
         this.isActionColumnVisible && h(ATableHeaderThAction, {
           disabledOptions: this.disabledOptions,

package/src/ATable/ATablePreviewRight/ATablePreviewRight.js

@@ -24,6 +24,11 @@ export default {
       type: Number,
       required: true,
     },
+    disabledPreviewRowCallback: {
+      type: Function,
+      required: false,
+      default: () => {},
+    },
     isLoadingTable: {
       type: Boolean,
       required: false,
@@ -102,6 +107,8 @@ export default {
     const {
       countAllRowsFormatted,
       currentRow,
+      nextAvailableRowIndex,
+      previousAvailableRowIndex,
       rowNumber,
       rowNumberFormatted,
     } = RowAPI(props);
@@ -109,9 +116,11 @@ export default {
     const {
       disabledBtnArrowLeft,
       disabledBtnArrowRight,
-      toLastRow,
       toNextRow,
+      toPreviousRow,
     } = ArrowsAPI(props, context, {
+      nextAvailableRowIndex,
+      previousAvailableRowIndex,
       rowNumber,
     });
 
@@ -146,8 +155,8 @@ export default {
       previewRef,
       rowNumber,
       rowNumberFormatted,
-      toLastRow,
       toNextRow,
+      toPreviousRow,
     };
   },
   render() {
@@ -175,7 +184,7 @@ export default {
               iconLeft: "ArrowLeft",
               title: "_A_TABLE_PREVIEW_RIGHT_PREVIOUS_ROW_",
               textScreenReader: "_A_TABLE_PREVIEW_RIGHT_PREVIOUS_ROW_",
-              onClick: this.toLastRow,
+              onClick: this.toPreviousRow,
             }),
             h(AButton, {
               class: "a_btn a_btn_transparent_dark a_btn_small",

package/src/ATable/ATablePreviewRight/compositionAPI/ArrowsAPI.js

@@ -3,7 +3,13 @@ import {
   toRef,
 } from "vue";
 
+import {
+  isNil,
+} from "lodash-es";
+
 export default function ArrowsAPI(props, { emit }, {
+  nextAvailableRowIndex,
+  previousAvailableRowIndex,
   rowNumber = computed(() => 0),
 }) {
   const countAllRows = toRef(props, "countAllRows");
@@ -13,14 +19,14 @@ export default function ArrowsAPI(props, { emit }, {
   const usePagination = toRef(props, "usePagination");
 
   const disabledBtnArrowLeft = computed(() => {
-    return rowNumber.value <= 1;
+    return rowNumber.value <= 1 || isNil(previousAvailableRowIndex.value);
   });
 
   const disabledBtnArrowRight = computed(() => {
-    return rowNumber.value >= countAllRows.value;
+    return rowNumber.value >= countAllRows.value || isNil(nextAvailableRowIndex.value);
   });
 
-  const toLastRow = () => {
+  const toPreviousRow = () => {
     if (disabledBtnArrowLeft.value) {
       return;
     }
@@ -30,10 +36,10 @@ export default function ArrowsAPI(props, { emit }, {
         emit("update:offset", { offset: offsetPagination.value - limitPagination.value, reload: false });
         emit("togglePreview", { rowIndex: limitPagination.value - 1 });
       } else {
-        emit("togglePreview", { rowIndex: rowIndex.value - 1 });
+        emit("togglePreview", { rowIndex: previousAvailableRowIndex.value });
       }
     } else {
-      emit("togglePreview", { rowIndex: rowIndex.value - 1 });
+      emit("togglePreview", { rowIndex: previousAvailableRowIndex.value });
     }
   };
 
@@ -47,17 +53,17 @@ export default function ArrowsAPI(props, { emit }, {
         emit("update:offset", { offset: offsetPagination.value + limitPagination.value, reload: false });
         emit("togglePreview", { rowIndex: 0 });
       } else {
-        emit("togglePreview", { rowIndex: rowIndex.value + 1 });
+        emit("togglePreview", { rowIndex: nextAvailableRowIndex.value });
       }
     } else {
-      emit("togglePreview", { rowIndex: rowIndex.value + 1 });
+      emit("togglePreview", { rowIndex: nextAvailableRowIndex.value });
     }
   };
 
   return {
     disabledBtnArrowLeft,
     disabledBtnArrowRight,
-    toLastRow,
     toNextRow,
+    toPreviousRow,
   };
 }

package/src/ATable/ATablePreviewRight/compositionAPI/RowAPI.js

@@ -5,8 +5,13 @@ import {
 
 import AFiltersAPI from "../../../compositionAPI/AFiltersAPI";
 
+import {
+  isFunction,
+} from "lodash-es";
+
 export default function RowAPI(props) {
   const countAllRows = toRef(props, "countAllRows");
+  const disabledPreviewRowCallback = toRef(props, "disabledPreviewRowCallback");
   const offsetPagination = toRef(props, "offsetPagination");
   const rowIndex = toRef(props, "rowIndex");
   const rows = toRef(props, "rows");
@@ -27,6 +32,40 @@ export default function RowAPI(props) {
   const currentRow = computed(() => {
     return rows.value[rowIndex.value];
   });
+  const nextAvailableRowIndex = computed(() => {
+    let nextIndex = null;
+    if (!isFunction(disabledPreviewRowCallback.value)) {
+      nextIndex = rowIndex.value === rows.value.length - 1 ? null : rowIndex.value++;
+    } else {
+      for (let index = rowIndex.value + 1; index < rows.value.length; index++) {
+        const ROW = rows.value[index];
+
+        if (!disabledPreviewRowCallback.value({ row: ROW, rowIndex: index })) {
+          nextIndex = index;
+          break;
+        }
+      }
+    }
+
+    return nextIndex;
+  });
+  const previousAvailableRowIndex = computed(() => {
+    let prevIndex = null;
+    if (!isFunction(disabledPreviewRowCallback.value)) {
+      prevIndex = rowIndex.value === 0 ? null : rowIndex.value--;
+    } else {
+      for (let index = rowIndex.value - 1; index >= 0; index--) {
+        const ROW = rows.value[index];
+
+        if (!disabledPreviewRowCallback.value({ row: ROW, rowIndex: index })) {
+          prevIndex = index;
+          break;
+        }
+      }
+    }
+
+    return prevIndex;
+  });
 
   const countAllRowsFormatted = computed(() => {
     return filterCurrency(countAllRows.value, { suffix: "", digits: 0 });
@@ -39,6 +78,8 @@ export default function RowAPI(props) {
   return {
     countAllRowsFormatted,
     currentRow,
+    nextAvailableRowIndex,
+    previousAvailableRowIndex,
     rowNumber,
     rowNumberFormatted,
   };

package/src/ATable/ATableTr/compositionAPI/AttributesAPI.js

@@ -61,7 +61,10 @@ export default function AttributesAPI(props, {
   });
 
   const disabledPreviewRow = computed(() => {
-    return disabledPreview.value || disabledPreviewRowCallback.value({ row: row.value, rowIndex: rowIndex.value });
+    if (isFunction(disabledPreviewRowCallback.value)) {
+      return disabledPreviewRowCallback.value({ row: row.value, rowIndex: rowIndex.value });
+    }
+    return disabledPreview.value;
   });
 
   const onClickRow = $event => {

package/src/ATable/compositionAPI/RowsAPI.js

@@ -17,6 +17,7 @@ export default function RowsAPI(props, {
   setEmptySelectedRowsIndexes = () => {},
   usePaginationLocal = computed(() => false),
 }) {
+  const clearSelectedRowsOnDataChange = toRef(props, "clearSelectedRowsOnDataChange");
   const pagination = toRef(props, "pagination");
   const rowsCountRenderPerTick = toRef(props, "rowsCountRenderPerTick");
 
@@ -88,7 +89,7 @@ export default function RowsAPI(props, {
       return;
     }
     prevDataPaginated.value = [...newValue];
-    if (!firstLoad) {
+    if (!firstLoad && clearSelectedRowsOnDataChange.value) {
       setEmptySelectedRowsIndexes();
     }
     firstLoad = false;