feat: Cascader.Panel support default expand cells

.github/FUNDING.yml

@@ -0,0 +1,15 @@
+# These are supported funding model platforms
+
+github: ant-design # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]
+patreon: # Replace with a single Patreon username
+open_collective: ant-design # Replace with a single Open Collective username
+ko_fi: # Replace with a single Ko-fi username
+tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
+community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
+liberapay: # Replace with a single Liberapay username
+issuehunt: # Replace with a single IssueHunt username
+lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry
+polar: # Replace with a single Polar username
+buy_me_a_coffee: # Replace with a single Buy Me a Coffee username
+thanks_dev: # Replace with a single thanks.dev username
+custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']

.github/workflows/main.yml

@@ -1,113 +1,6 @@
-name: CI
-
-on:
-  push:
-    branches: [master]
-  pull_request:
-
+name: ✅ test
+on: [push, pull_request]
 jobs:
-  setup:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@master
-
-      - uses: actions/setup-node@v1
-        with:
-          node-version: '16'
-
-      - name: cache package-lock.json
-        uses: actions/cache@v2
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: create package-lock.json
-        run: npm i --package-lock-only
-
-      - name: hack for singe file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v2
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
-  lint:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@master
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v2
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v2
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: lint
-        run: npm run lint
-
-    needs: setup
-
-  compile:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@master
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v2
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v2
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: compile
-        run: npm run compile
-
-    needs: setup
-
-  coverage:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@master
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v2
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v2
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-      - name: tsc
-        run: npm run lint:tsc
-      - name: coverage
-        run: npm test -- --coverage && bash <(curl -s https://codecov.io/bash)
-
-    needs: setup
+  test:
+    uses: react-component/rc-test/.github/workflows/test.yml@main
+    secrets: inherit

.gitignore

@@ -38,4 +38,6 @@ coverage
 .dumi/tmp
 .dumi/tmp-production
 dist
-.vscode
+.vscode
+
+bun.lockb

README.md

@@ -1,6 +1,6 @@
 # rc-cascader
 
-React Cascader Component
+React Cascader Component.
 
 [![NPM version][npm-image]][npm-url]
 [![npm download][download-image]][download-url]

bunfig.toml

@@ -0,0 +1,2 @@
+[install]
+peer = false

docs/demo/multiple-search.md

@@ -0,0 +1,8 @@
+---
+title: multiple-search
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../../examples/multiple-search.tsx"></code>

examples/multiple-search.tsx

@@ -0,0 +1,48 @@
+import React from 'react';
+import '../assets/index.less';
+import Cascader from '../src';
+
+const options = [
+  {
+    value: 'zhejiang',
+    label: 'Zhejiang',
+    children: [
+      {
+        value: 'hangzhou',
+        label: 'Hangzhou',
+        children: [
+          {
+            value: 'xihu',
+            label: 'West Lake',
+          },
+          {
+            value: 'xiasha',
+            label: 'Xia Sha',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    value: 'jiangsu',
+    label: 'Jiangsu',
+    children: [
+      {
+        value: 'nanjing',
+        label: 'Nanjing',
+        children: [
+          {
+            value: 'zhonghuamen',
+            label: 'Zhong Hua men',
+          },
+        ],
+      },
+    ],
+  },
+];
+
+const Demo = () => {
+  return <Cascader checkable showSearch options={options} />;
+};
+
+export default Demo;

examples/panel.tsx

@@ -61,6 +61,8 @@ export default () => {
 
   const [value2, setValue2] = React.useState<string[][]>([]);
 
+  const [disabled, setDisabled] = React.useState(false);
+
   return (
     <>
       <h1>Panel</h1>
@@ -71,26 +73,37 @@ export default () => {
       >
         Set Value
       </button>
+      <button
+        onClick={() => {
+          setDisabled(prev => !prev);
+        }}
+      >
+        {disabled ? 'enable panel' : 'disable panel'}
+      </button>
       <Cascader.Panel
         value={value}
         options={addressOptions}
         onChange={nextValue => {
           console.log('Change:', nextValue);
           setValue(nextValue);
         }}
+        disabled={disabled}
       />
 
+      <div>defaultActiveKey=[bj, haidian]</div>
       <Cascader.Panel
         checkable
         value={value2}
         options={addressOptions}
         onChange={nextValue => {
-          console.log('Change:', nextValue);
-          setValue2(nextValue);
+        console.log('Change:', nextValue);
+        setValue2(nextValue);
         }}
+        defaultActiveKey={['bj', 'haidian']}
+        disabled={disabled}
       />
 
-      <Cascader.Panel options={addressOptions} direction="rtl" />
+      <Cascader.Panel options={addressOptions} disabled={disabled} direction="rtl" />
 
       <Cascader.Panel notFoundContent="Empty!!!" />
     </>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rc-cascader",
-  "version": "3.27.0",
+  "version": "3.30.0",
   "description": "cascade select ui component for react",
   "keywords": [
     "react",
@@ -42,12 +42,11 @@
     "test": "rc-test"
   },
   "dependencies": {
-    "@babel/runtime": "^7.12.5",
-    "array-tree-filter": "^2.1.0",
+    "@babel/runtime": "^7.25.7",
     "classnames": "^2.3.1",
-    "rc-select": "~14.15.0",
-    "rc-tree": "~5.8.1",
-    "rc-util": "^5.37.0"
+    "rc-select": "~14.16.2",
+    "rc-tree": "~5.10.1",
+    "rc-util": "^5.43.0"
   },
   "devDependencies": {
     "@rc-component/father-plugin": "^1.0.0",
@@ -60,6 +59,8 @@
     "@types/react-dom": "^18.0.11",
     "@types/warning": "^3.0.0",
     "@umijs/fabric": "^4.0.0",
+    "array-tree-filter": "^3.0.2",
+    "cheerio": "1.0.0-rc.12",
     "cross-env": "^7.0.0",
     "dumi": "^2.1.10",
     "enzyme": "^3.3.0",

src/Cascader.tsx

@@ -159,6 +159,7 @@ export interface CascaderProps<
     value: GetValueType<OptionType, ValueField, Multiple>,
     selectOptions: OptionType[],
   ) => void;
+  defaultActiveKey?: React.Key[];
 }
 
 export type SingleValueType = (string | number)[];
@@ -175,6 +176,7 @@ export type InternalCascaderProps = Omit<CascaderProps, 'onChange' | 'value' | '
     value: InternalValueType,
     selectOptions: BaseOptionType[] | BaseOptionType[][],
   ) => void;
+  defaultActiveKey?: React.Key[];
 };
 
 export type CascaderRef = Omit<BaseSelectRef, 'scrollTo'>;
@@ -280,7 +282,7 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
     mergedFieldNames,
     dropdownPrefixCls || prefixCls,
     searchConfig,
-    changeOnSelect,
+    changeOnSelect || multiple,
   );
 
   // =========================== Values ===========================

src/OptionList/Column.tsx

@@ -23,7 +23,7 @@ export interface ColumnProps<OptionType extends DefaultOptionType = DefaultOptio
   halfCheckedSet: Set<React.Key>;
   loadingKeys: React.Key[];
   isSelectable: (option: DefaultOptionType) => boolean;
-  searchValue?: string;
+  disabled?: boolean;
 }
 
 export default function Column<OptionType extends DefaultOptionType = DefaultOptionType>({
@@ -39,7 +39,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
   halfCheckedSet,
   loadingKeys,
   isSelectable,
-  searchValue,
+  disabled: propsDisabled,
 }: ColumnProps<OptionType>) {
   const menuPrefixCls = `${prefixCls}-menu`;
   const menuItemPrefixCls = `${prefixCls}-menu-item`;
@@ -56,6 +56,8 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
 
   const hoverOpen = expandTrigger === 'hover';
 
+  const isOptionDisabled = (disabled?: boolean) => propsDisabled || disabled;
+
   // ============================ Option ============================
   const optionInfoList = React.useMemo(
     () =>
@@ -117,7 +119,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
         }) => {
           // >>>>> Open
           const triggerOpenPath = () => {
-            if (disabled || searchValue) {
+            if (isOptionDisabled(disabled)) {
               return;
             }
             const nextValueCells = [...fullPath];
@@ -129,7 +131,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
 
           // >>>>> Selection
           const triggerSelect = () => {
-            if (isSelectable(option)) {
+            if (isSelectable(option) && !isOptionDisabled(disabled)) {
               onSelect(fullPath, isMergedLeaf);
             }
           };
@@ -150,7 +152,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
                 [`${menuItemPrefixCls}-expand`]: !isMergedLeaf,
                 [`${menuItemPrefixCls}-active`]:
                   activeValue === value || activeValue === fullPathKey,
-                [`${menuItemPrefixCls}-disabled`]: disabled,
+                [`${menuItemPrefixCls}-disabled`]: isOptionDisabled(disabled),
                 [`${menuItemPrefixCls}-loading`]: isLoading,
               })}
               style={dropdownMenuColumnStyle}
@@ -187,7 +189,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
                   prefixCls={`${prefixCls}-checkbox`}
                   checked={checked}
                   halfChecked={halfChecked}
-                  disabled={disabled || disableCheckbox}
+                  disabled={isOptionDisabled(disabled) || disableCheckbox}
                   disableCheckbox={disableCheckbox}
                   onClick={(e: React.MouseEvent<HTMLSpanElement>) => {
                     if (disableCheckbox) {