@varlet/ui 3.17.1 → 3.18.0-alpha.1781190469654

package/es/data-table/usePagination.mjs

@@ -0,0 +1,101 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { call, clamp, isBoolean } from "@varlet/shared";
+import { computed, watch } from "vue";
+const defaultPaginationOptions = {
+  simple: false,
+  disabled: false,
+  showSizeChanger: false,
+  showQuickJumper: false,
+  maxPagerCount: 5,
+  sizeOption: [10, 20, 50, 100],
+  showTotal: void 0
+};
+function usePagination({
+  pagination,
+  remote,
+  loading,
+  page,
+  pageSize,
+  total,
+  data,
+  onUpdatePage
+}) {
+  const paginationProps = computed(() => {
+    const resolvedPagination = pagination();
+    if (isBoolean(resolvedPagination)) {
+      return __spreadProps(__spreadValues({}, defaultPaginationOptions), {
+        disabled: loading()
+      });
+    }
+    return __spreadProps(__spreadValues(__spreadValues({}, defaultPaginationOptions), resolvedPagination), {
+      disabled: loading() || resolvedPagination.disabled === true
+    });
+  });
+  const paginationTotal = computed(() => {
+    var _a;
+    if (pagination() === false) {
+      return data().length;
+    }
+    return remote() ? (_a = total()) != null ? _a : 0 : data().length;
+  });
+  const showPagination = computed(() => {
+    return pagination() !== false && paginationTotal.value > 0;
+  });
+  const pageCount = computed(() => {
+    if (!showPagination.value) {
+      return 1;
+    }
+    return clamp(Math.ceil(paginationTotal.value / pageSize()), 1, Number.MAX_SAFE_INTEGER);
+  });
+  const normalizedPage = computed(() => {
+    if (!showPagination.value) {
+      return 1;
+    }
+    return clamp(page(), 1, pageCount.value);
+  });
+  const pagedData = computed(() => {
+    if (!showPagination.value || remote()) {
+      return data();
+    }
+    const start = (normalizedPage.value - 1) * pageSize();
+    return data().slice(start, start + pageSize());
+  });
+  watch(
+    [pagination, remote, total, page, normalizedPage],
+    ([currentPagination, currentRemote, currentTotal, currentPage, nextPage]) => {
+      if (currentPagination === false || currentRemote && currentTotal == null || currentPage === nextPage) {
+        return;
+      }
+      call(onUpdatePage == null ? void 0 : onUpdatePage(), nextPage);
+    },
+    { immediate: true }
+  );
+  return {
+    paginationProps,
+    paginationTotal,
+    showPagination,
+    normalizedPage,
+    pagedData
+  };
+}
+export {
+  usePagination
+};

package/es/data-table/useSelectionColumn.mjs

@@ -0,0 +1,242 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { computed } from "vue";
+function useSelectionColumn({
+  columns,
+  tree,
+  cascade,
+  pagedData,
+  allFlatRows,
+  treeRowMeta,
+  checkedRowKeys,
+  isSelectionColumn,
+  getTreeChildren
+}) {
+  const selectionColumn = computed(() => columns().find(isSelectionColumn));
+  const cascadeSelectionEnabled = computed(() => {
+    return tree() && cascade() && !!selectionColumn.value && isMultipleSelectionColumn(selectionColumn.value);
+  });
+  const checkedRowKeySet = computed(() => new Set(checkedRowKeys.value));
+  const treeSelectionStates = computed(() => {
+    const states = /* @__PURE__ */ new Map();
+    const column = selectionColumn.value;
+    if (!column) {
+      return states;
+    }
+    for (const row of pagedData()) {
+      visit(row);
+    }
+    function visit(row) {
+      const flatRow = treeRowMeta().rowByObject.get(row);
+      if (!flatRow) {
+        return {
+          checked: false,
+          indeterminate: false,
+          selectable: false
+        };
+      }
+      const children = getTreeChildren(row);
+      const childStates = children.map(visit);
+      const selectable = isRowSelectable(row, flatRow.rowIndex, column);
+      const selfChecked = checkedRowKeySet.value.has(flatRow.key);
+      if (!cascadeSelectionEnabled.value || childStates.length === 0) {
+        const state2 = {
+          checked: selfChecked,
+          indeterminate: false
+        };
+        states.set(flatRow.key, state2);
+        return __spreadProps(__spreadValues({}, state2), {
+          selectable
+        });
+      }
+      const selectableChildren = childStates.filter((childState) => childState.selectable);
+      const allChildrenChecked = selectableChildren.length > 0 ? selectableChildren.every((childState) => childState.checked) : selfChecked;
+      const someChildrenSelected = selectableChildren.some(
+        (childState) => childState.checked || childState.indeterminate
+      );
+      const state = {
+        checked: selectable ? allChildrenChecked : false,
+        indeterminate: selectableChildren.length > 0 && !allChildrenChecked && someChildrenSelected
+      };
+      states.set(flatRow.key, state);
+      return __spreadProps(__spreadValues({}, state), {
+        selectable: selectable || selectableChildren.length > 0
+      });
+    }
+    return states;
+  });
+  const currentSelectableRows = computed(() => {
+    const column = selectionColumn.value;
+    if (!column) {
+      return [];
+    }
+    return allFlatRows().filter((flatRow) => isRowSelectable(flatRow.row, flatRow.rowIndex, column));
+  });
+  const allCurrentRowsSelected = computed(() => {
+    return currentSelectableRows.value.length > 0 && currentSelectableRows.value.every((flatRow) => {
+      return isRowKeySelected(flatRow.key);
+    });
+  });
+  const someCurrentRowsSelected = computed(() => {
+    return currentSelectableRows.value.some(
+      (flatRow) => isRowKeySelected(flatRow.key) || isRowKeyIndeterminate(flatRow.key)
+    ) && !allCurrentRowsSelected.value;
+  });
+  function isMultipleSelectionColumn(column) {
+    return column.multiple !== false;
+  }
+  function isSelectionColumnSelectable(column) {
+    return column.selectable !== false;
+  }
+  function isRowSelectable(row, rowIndex, column) {
+    if (!column || column.selectable == null || column.selectable === true) {
+      return true;
+    }
+    if (column.selectable === false) {
+      return false;
+    }
+    return column.selectable({
+      row,
+      rowIndex
+    });
+  }
+  function updateCheckedRowKeys(value) {
+    checkedRowKeys.value = value;
+  }
+  function isRowKeySelected(key) {
+    var _a, _b;
+    return (_b = (_a = treeSelectionStates.value.get(key)) == null ? void 0 : _a.checked) != null ? _b : checkedRowKeySet.value.has(key);
+  }
+  function isRowKeyIndeterminate(key) {
+    var _a, _b;
+    return (_b = (_a = treeSelectionStates.value.get(key)) == null ? void 0 : _a.indeterminate) != null ? _b : false;
+  }
+  function toggleRowSelection(bodyRow, selected) {
+    const column = selectionColumn.value;
+    if (!column || !isSelectionColumnSelectable(column) || !isRowSelectable(bodyRow.row, bodyRow.rowIndex, column)) {
+      return;
+    }
+    if (!isMultipleSelectionColumn(column)) {
+      updateCheckedRowKeys(
+        selected ? [bodyRow.key] : checkedRowKeys.value.filter((key) => {
+          return key !== bodyRow.key;
+        })
+      );
+      return;
+    }
+    const nextKeys = new Set(checkedRowKeys.value);
+    if (cascadeSelectionEnabled.value) {
+      for (const key of collectSelectableBranchKeys(bodyRow.row)) {
+        if (selected) {
+          nextKeys.add(key);
+        } else {
+          nextKeys.delete(key);
+        }
+      }
+      syncAncestorSelection(nextKeys, bodyRow.key);
+    } else if (selected) {
+      nextKeys.add(bodyRow.key);
+    } else {
+      nextKeys.delete(bodyRow.key);
+    }
+    updateCheckedRowKeys([...nextKeys]);
+  }
+  function toggleCurrentSelectableRows(selected) {
+    const column = selectionColumn.value;
+    if (!column || !isSelectionColumnSelectable(column) || !isMultipleSelectionColumn(column)) {
+      return;
+    }
+    const nextKeys = new Set(checkedRowKeys.value);
+    for (const flatRow of currentSelectableRows.value) {
+      if (selected) {
+        nextKeys.add(flatRow.key);
+      } else {
+        nextKeys.delete(flatRow.key);
+      }
+    }
+    updateCheckedRowKeys([...nextKeys]);
+  }
+  function collectSelectableBranchKeys(row) {
+    const column = selectionColumn.value;
+    const keys = [];
+    if (!column) {
+      return keys;
+    }
+    function visit(currentRow) {
+      const flatRow = treeRowMeta().rowByObject.get(currentRow);
+      if (!flatRow) {
+        return;
+      }
+      if (isRowSelectable(currentRow, flatRow.rowIndex, column)) {
+        keys.push(flatRow.key);
+      }
+      for (const child of getTreeChildren(currentRow)) {
+        visit(child);
+      }
+    }
+    visit(row);
+    return keys;
+  }
+  function shouldAncestorBeChecked(row, nextKeys) {
+    const column = selectionColumn.value;
+    const flatRow = treeRowMeta().rowByObject.get(row);
+    if (!column || !flatRow) {
+      return false;
+    }
+    const selectable = isRowSelectable(row, flatRow.rowIndex, column);
+    const children = getTreeChildren(row);
+    if (!children.length) {
+      return selectable ? nextKeys.has(flatRow.key) : true;
+    }
+    return selectable && children.every((child) => {
+      return shouldAncestorBeChecked(child, nextKeys);
+    });
+  }
+  function syncAncestorSelection(nextKeys, key) {
+    let parentKey = treeRowMeta().parentKeyByChild.get(key);
+    while (parentKey != null) {
+      const parentRow = treeRowMeta().rowByKey.get(parentKey);
+      if (!parentRow) {
+        break;
+      }
+      if (shouldAncestorBeChecked(parentRow.row, nextKeys)) {
+        nextKeys.add(parentKey);
+      } else {
+        nextKeys.delete(parentKey);
+      }
+      parentKey = treeRowMeta().parentKeyByChild.get(parentKey);
+    }
+  }
+  return {
+    currentSelectableRows,
+    allCurrentRowsSelected,
+    someCurrentRowsSelected,
+    isMultipleSelectionColumn,
+    isSelectionColumnSelectable,
+    isRowSelectable,
+    isRowKeySelected,
+    isRowKeyIndeterminate,
+    toggleRowSelection,
+    toggleCurrentSelectableRows
+  };
+}
+export {
+  useSelectionColumn
+};

package/es/data-table/useSorter.mjs

@@ -0,0 +1,70 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { call } from "@varlet/shared";
+import { computed } from "vue";
+function useSorter({ sorters, sortMode, onUpdateSorters }) {
+  const activeSorters = computed(() => sorters());
+  function isColumnSortable(column) {
+    var _a;
+    return column.type == null && !((_a = column.children) == null ? void 0 : _a.length) && column.sorter === true;
+  }
+  function getColumnSorterOrder(columnKey) {
+    var _a;
+    return (_a = activeSorters.value.find((sorter) => sorter.key === columnKey)) == null ? void 0 : _a.order;
+  }
+  function toggleColumnSorter(columnKey) {
+    const currentOrder = getColumnSorterOrder(columnKey);
+    if (sortMode() === "single") {
+      call(
+        onUpdateSorters(),
+        currentOrder == null ? [{ key: columnKey, order: "asc" }] : currentOrder === "asc" ? [{ key: columnKey, order: "desc" }] : []
+      );
+      return;
+    }
+    if (currentOrder == null) {
+      call(onUpdateSorters(), [...activeSorters.value, { key: columnKey, order: "asc" }]);
+      return;
+    }
+    if (currentOrder === "asc") {
+      call(
+        onUpdateSorters(),
+        activeSorters.value.map(
+          (sorter) => sorter.key !== columnKey ? sorter : __spreadProps(__spreadValues({}, sorter), {
+            order: "desc"
+          })
+        )
+      );
+      return;
+    }
+    call(
+      onUpdateSorters(),
+      activeSorters.value.filter((sorter) => sorter.key !== columnKey)
+    );
+  }
+  return {
+    activeSorters,
+    isColumnSortable,
+    getColumnSorterOrder,
+    toggleColumnSorter
+  };
+}
+export {
+  useSorter
+};

package/es/data-table/useTreeExpand.mjs

@@ -0,0 +1,69 @@
+import { computed, watch } from "vue";
+function useTreeExpand({ tree, data, expandedTreeRowKeys, getRowKey, getTreeChildren }) {
+  const expandedTreeRowKeySet = computed(() => new Set(expandedTreeRowKeys.value));
+  const collapsedTreeRowKeys = computed(() => {
+    if (!tree()) {
+      return /* @__PURE__ */ new Set();
+    }
+    const validKeys = collectExpandableRowKeys(data());
+    const collapsedKeys = /* @__PURE__ */ new Set();
+    for (const key of validKeys) {
+      if (!expandedTreeRowKeySet.value.has(key)) {
+        collapsedKeys.add(key);
+      }
+    }
+    return collapsedKeys;
+  });
+  watch(
+    [data, tree],
+    () => {
+      syncExpandedTreeRowKeys();
+    },
+    { immediate: true }
+  );
+  function toggleTreeRowExpanded(bodyRow) {
+    if (!tree() || !bodyRow.expandable) {
+      return;
+    }
+    const target = new Set(expandedTreeRowKeys.value);
+    if (target.has(bodyRow.key)) {
+      target.delete(bodyRow.key);
+    } else {
+      target.add(bodyRow.key);
+    }
+    expandedTreeRowKeys.value = [...target];
+  }
+  function syncExpandedTreeRowKeys() {
+    if (!tree()) {
+      expandedTreeRowKeys.value = [];
+      return;
+    }
+    const validKeys = collectExpandableRowKeys(data());
+    expandedTreeRowKeys.value = expandedTreeRowKeys.value.filter((key) => validKeys.has(key));
+  }
+  function collectExpandableRowKeys(rows) {
+    const keys = /* @__PURE__ */ new Set();
+    let rowIndex = 0;
+    function visit(source) {
+      for (const row of source) {
+        const currentRowIndex = rowIndex;
+        rowIndex += 1;
+        const children = getTreeChildren(row);
+        if (children.length > 0) {
+          keys.add(getRowKey(row, currentRowIndex));
+        }
+        visit(children);
+      }
+    }
+    visit(rows);
+    return keys;
+  }
+  return {
+    collapsedTreeRowKeys,
+    expandedTreeRowKeySet,
+    toggleTreeRowExpanded
+  };
+}
+export {
+  useTreeExpand
+};