rsuite 5.55.1 → 5.57.0

package/cjs/MultiCascadeTree/types.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import type { CascadeTreeProps } from '../CascadeTree/types';
+import type { ItemDataType, ToArray, WithAsProps } from '../@types/common';
+export interface ItemKeys {
+    valueKey: string;
+    labelKey: string;
+    childrenKey: string;
+}
+export interface MultiCascadeTreeProps<T, V = T[]> extends WithAsProps, CascadeTreeProps<T, V> {
+    /**
+     * When set to true, selecting a child node will update the state of the parent node.
+     */
+    cascade?: boolean;
+    /**
+     * Disabled items
+     */
+    disabledItemValues?: ToArray<NonNullable<T>>;
+    /**
+     * Set the option value for the check box not to be rendered
+     */
+    uncheckableItemValues?: T[];
+    /**
+     * Called after the checkbox state changes.
+     */
+    onCheck?: (value: T[], node: ItemDataType<T>, checked: boolean, event: React.SyntheticEvent) => void;
+}

package/cjs/MultiCascadeTree/types.js

@@ -0,0 +1,2 @@
+'use client';
+"use strict";

package/cjs/MultiCascadeTree/utils.d.ts

@@ -0,0 +1,37 @@
+import { ItemDataType } from '../@types/common';
+export interface ItemType<T = any> extends ItemDataType<T> {
+    parent?: ItemType<T>;
+}
+interface ItemKeys {
+    valueKey: string;
+    labelKey: string;
+    childrenKey: string;
+}
+declare type MayHasParent<T extends Record<string, unknown>> = T & {
+    parent?: MayHasParent<T>;
+};
+/**
+ * Get all parents of a node
+ * @param node
+ */
+export declare const getParents: <T extends Record<string, unknown>>(node: MayHasParent<T>) => MayHasParent<T>[];
+/**
+ * Check if any child nodes are selected.
+ * @param node
+ * @param value
+ * @param itemKeys
+ */
+export declare const isSomeChildChecked: <T extends Record<string, unknown>>(node: T, value: T[], itemKeys: Omit<ItemKeys, 'labelKey'>) => any;
+/**
+ * Check if the parent is selected.
+ * @param node
+ * @param value
+ * @param itemKeys
+ */
+export declare const isSomeParentChecked: <T extends Record<string, unknown>>(node: MayHasParent<T>, value: T[], itemKeys: Pick<ItemKeys, 'valueKey'>) => any;
+export declare const getOtherItemValuesByUnselectChild: <T>(itemNode: ItemType, value: any, itemKeys: Omit<ItemKeys, 'labelKey'>) => T[];
+/**
+ * Remove the values of all children.
+ */
+export declare const removeAllChildrenValue: <T>(value: T[], item: ItemType, itemKeys: Omit<ItemKeys, 'labelKey'>) => T[] | undefined;
+export {};

package/cjs/MultiCascadeTree/utils.js

@@ -0,0 +1,140 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.removeAllChildrenValue = exports.getOtherItemValuesByUnselectChild = exports.isSomeParentChecked = exports.isSomeChildChecked = exports.getParents = void 0;
+var _remove = _interopRequireDefault(require("lodash/remove"));
+/**
+ * Get all parents of a node
+ * @param node
+ */
+var getParents = function getParents(node) {
+  var parents = [];
+  if (!node.parent) {
+    return parents;
+  }
+  parents.push(node.parent);
+  parents = parents.concat(getParents(node.parent));
+  return parents;
+};
+
+/**
+ * Check if any child nodes are selected.
+ * @param node
+ * @param value
+ * @param itemKeys
+ */
+exports.getParents = getParents;
+var isSomeChildChecked = function isSomeChildChecked(node, value, itemKeys) {
+  var childrenKey = itemKeys.childrenKey,
+    valueKey = itemKeys.valueKey;
+  if (!node[childrenKey] || !value) {
+    return false;
+  }
+  return node[childrenKey].some(function (child) {
+    var _child$childrenKey;
+    if (value.some(function (n) {
+      return n === child[valueKey];
+    })) {
+      return true;
+    }
+    if ((_child$childrenKey = child[childrenKey]) !== null && _child$childrenKey !== void 0 && _child$childrenKey.length) {
+      return isSomeChildChecked(child, value, itemKeys);
+    }
+    return false;
+  });
+};
+
+/**
+ * Check if the parent is selected.
+ * @param node
+ * @param value
+ * @param itemKeys
+ */
+exports.isSomeChildChecked = isSomeChildChecked;
+var isSomeParentChecked = function isSomeParentChecked(node, value, itemKeys) {
+  var valueKey = itemKeys.valueKey;
+  if (!value) {
+    return false;
+  }
+  if (value.some(function (n) {
+    return n === node[valueKey];
+  })) {
+    return true;
+  }
+  if (node.parent) {
+    return isSomeParentChecked(node.parent, value, itemKeys);
+  }
+  return false;
+};
+exports.isSomeParentChecked = isSomeParentChecked;
+var getOtherItemValuesByUnselectChild = function getOtherItemValuesByUnselectChild(itemNode, value, itemKeys) {
+  var valueKey = itemKeys.valueKey,
+    childrenKey = itemKeys.childrenKey;
+  var parentValues = [];
+  var itemValues = [];
+
+  // Find the parent node of the current node by value
+  function findParent(item) {
+    parentValues.push(item[valueKey]);
+    if (value.some(function (v) {
+      return v === item[valueKey];
+    })) {
+      return item;
+    }
+    if (item.parent) {
+      var p = findParent(item.parent);
+      if (p) {
+        return p;
+      }
+    }
+    return null;
+  }
+
+  // Get child nodes through parent node
+  function pushChildValue(item) {
+    if (!item[childrenKey]) {
+      return;
+    }
+    item[childrenKey].forEach(function (n) {
+      // Determine whether it is a direct parent
+      if (parentValues.some(function (v) {
+        return v === n[valueKey];
+      }) && n[childrenKey]) {
+        pushChildValue(n);
+      } else if (n[valueKey] !== itemNode[valueKey]) {
+        itemValues.push(n[valueKey]);
+      }
+    });
+  }
+  var parent = findParent(itemNode);
+  if (!parent) {
+    return [];
+  }
+  pushChildValue(parent);
+  return itemValues;
+};
+
+/**
+ * Remove the values of all children.
+ */
+exports.getOtherItemValuesByUnselectChild = getOtherItemValuesByUnselectChild;
+var removeAllChildrenValue = function removeAllChildrenValue(value, item, itemKeys) {
+  var valueKey = itemKeys.valueKey,
+    childrenKey = itemKeys.childrenKey;
+  var removedValue = [];
+  if (!item[childrenKey]) {
+    return;
+  }
+  item[childrenKey].forEach(function (n) {
+    removedValue = removedValue.concat((0, _remove.default)(value, function (v) {
+      return v === n[valueKey];
+    }));
+    if (n[childrenKey]) {
+      removeAllChildrenValue(value, n, itemKeys);
+    }
+  });
+  return removedValue;
+};
+exports.removeAllChildrenValue = removeAllChildrenValue;

package/cjs/MultiCascader/MultiCascader.d.ts

@@ -1,42 +1,70 @@
 import React from 'react';
 import { PickerLocale } from '../locales';
 import { PickerComponent, PickerToggleProps } from '../internals/Picker';
-import { FormControlPickerProps, ItemDataType } from '../@types/common';
-export declare type ValueType = (number | string)[];
-export interface MultiCascaderProps<T = ValueType> extends FormControlPickerProps<T, PickerLocale, ItemDataType>, Pick<PickerToggleProps, 'loading'> {
-    cascade?: boolean;
-    /** A picker that can be counted */
+import { FormControlPickerProps, ItemDataType, DataItemValue } from '../@types/common';
+import type { MultiCascadeTreeProps } from '../MultiCascadeTree';
+export interface MultiCascaderProps<T extends DataItemValue> extends FormControlPickerProps<T[], PickerLocale, ItemDataType<T>, T>, MultiCascadeTreeProps<T, T[]>, Pick<PickerToggleProps, 'loading'> {
+    /**
+     * A picker that can be counted
+     */
     countable?: boolean;
-    /** Sets the width of the menu */
+    /**
+     * Sets the width of the menu.
+     *
+     * @deprecated Use columnWidth instead
+     */
     menuWidth?: number;
-    /** Sets the height of the menu */
-    menuHeight?: number | string;
-    /** Set the option value for the check box not to be rendered */
-    uncheckableItemValues?: T;
-    /** Whether dispaly search input box */
-    searchable?: boolean;
-    /** The menu is displayed directly when the component is initialized */
+    /**
+     * Sets the height of the menu
+     * @deprecated Use columnHeight instead
+     */
+    menuHeight?: number;
+    /**
+     * Custom menu class name
+     * @deprecated Use popupClassName instead
+     */
+    menuClassName?: string;
+    /**
+     * Custom menu style
+     * @deprecated Use popupStyle instead
+     */
+    menuStyle?: React.CSSProperties;
+    /**
+     * Custom popup style
+     */
+    popupStyle?: React.CSSProperties;
+    /**
+     * Custom popup style
+     */
+    popupClassName?: string;
+    /**
+     * The panel is displayed directly when the component is initialized
+     * @deprecated Use MultiCascadeTree instead
+     * @see MultiCascadeTree https://rsuitejs.com/components/multi-cascade-tree
+     */
     inline?: boolean;
-    /** Custom render menu */
-    renderMenu?: (items: readonly ItemDataType[], menu: React.ReactNode, parentNode?: any, layer?: number) => React.ReactNode;
-    /** Custom render menu items */
-    renderMenuItem?: (itemLabel: React.ReactNode, item: any) => React.ReactNode;
-    /** Custom render selected items */
-    renderValue?: (value: T, selectedItems: ItemDataType[], selectedElement: React.ReactNode) => React.ReactNode;
-    /** Called when the option is selected */
-    onSelect?: (node: ItemDataType, cascadePaths: ItemDataType[], event: React.SyntheticEvent) => void;
-    /** Called after the checkbox state changes */
-    onCheck?: (value: ValueType, node: ItemDataType, checked: boolean, event: React.SyntheticEvent) => void;
-    /** Called when clean */
+    /**
+     * Custom render menu
+     * @deprecated Use renderColumn instead
+     */
+    renderMenu?: (items: readonly ItemDataType<T>[], menu: React.ReactNode, parentNode?: any, layer?: number) => React.ReactNode;
+    /**
+     * Custom render menu item
+     * @deprecated Use renderTreeNode instead
+     */
+    renderMenuItem?: (node: React.ReactNode, item: ItemDataType<T>) => React.ReactNode;
+    /**
+     * Custom render selected items
+     */
+    renderValue?: (value: T[], selectedItems: ItemDataType<T>[], selectedElement: React.ReactNode) => React.ReactNode;
+    /**
+     * Called when clean
+     */
     onClean?: (event: React.SyntheticEvent) => void;
-    /** Called when searching */
-    onSearch?: (searchKeyword: string, event: React.SyntheticEvent) => void;
-    /** Asynchronously load the children of the tree node. */
-    getChildren?: (node: ItemDataType) => ItemDataType[] | Promise<ItemDataType[]>;
 }
 /**
  * The `MultiCascader` component is used to select multiple values from cascading options.
  * @see https://rsuitejs.com/components/multi-cascader/
  */
-declare const MultiCascader: PickerComponent<MultiCascaderProps>;
+declare const MultiCascader: PickerComponent<MultiCascaderProps<DataItemValue>>;
 export default MultiCascader;