From 848abfc6a3163c6bd6e283b9016decbddc7dd676 Mon Sep 17 00:00:00 2001 From: zombiej Date: Fri, 27 Aug 2021 17:35:18 +0800 Subject: [PATCH 1/4] feat: Add dropdownPrefixCls --- src/Cascader.tsx | 4 ++++ src/OptionList/index.tsx | 12 ++++++++---- src/context.ts | 31 ++++++++++++++++--------------- 3 files changed, 28 insertions(+), 19 deletions(-) diff --git a/src/Cascader.tsx b/src/Cascader.tsx index 7badc14d..0e508b81 100644 --- a/src/Cascader.tsx +++ b/src/Cascader.tsx @@ -97,6 +97,7 @@ interface BaseCascaderProps expandTrigger?: 'hover' | 'click'; dropdownMenuColumnStyle?: React.CSSProperties; + dropdownPrefixCls?: string; loadData?: (selectOptions: DataNode[]) => void; expandIcon?: React.ReactNode; @@ -153,6 +154,7 @@ const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref; +type OptionListProps = SelectOptionListProps & { prefixCls: string }; export type FlattenOptions = OptionListProps['flattenOptions']; const RefOptionList = React.forwardRef((props, ref) => { @@ -33,9 +33,11 @@ const RefOptionList = React.forwardRef((pro const rtl = direction === 'rtl'; const { checkedKeys, halfCheckedKeys } = React.useContext(SelectContext); - const { changeOnSelect, expandTrigger, fieldNames, loadData, search } = + const { changeOnSelect, expandTrigger, fieldNames, loadData, search, dropdownPrefixCls } = React.useContext(CascaderContext); + const mergedPrefixCls = dropdownPrefixCls || prefixCls; + // ========================= loadData ========================= const [loadingKeys, setLoadingKeys] = React.useState([]); @@ -122,6 +124,7 @@ const RefOptionList = React.forwardRef((pro // ========================== Search ========================== const searchOptions = useSearchResult({ ...props, + prefixCls: mergedPrefixCls, fieldNames, changeOnSelect, searchConfig: search, @@ -310,6 +313,7 @@ const RefOptionList = React.forwardRef((pro key={index} index={index} {...columnProps} + prefixCls={mergedPrefixCls} options={col.options} openKey={openPath[index]} /> @@ -319,8 +323,8 @@ const RefOptionList = React.forwardRef((pro return ( <>
{columnNodes} diff --git a/src/context.ts b/src/context.ts index b373dfb7..1eb4302a 100644 --- a/src/context.ts +++ b/src/context.ts @@ -2,22 +2,23 @@ import * as React from 'react'; import type { CascaderProps } from './Cascader'; import type { ShowSearchType } from './interface'; -const CascaderContext = React.createContext< - Required< - Pick< - CascaderProps, - | 'changeOnSelect' - | 'expandTrigger' - | 'fieldNames' - | 'expandIcon' - | 'loadingIcon' - | 'loadData' - | 'dropdownMenuColumnStyle' - > & { - search: ShowSearchType; - } +type ContextProps = Required< + Pick< + CascaderProps, + | 'changeOnSelect' + | 'expandTrigger' + | 'fieldNames' + | 'expandIcon' + | 'loadingIcon' + | 'loadData' + | 'dropdownMenuColumnStyle' > ->({ +> & { + search: ShowSearchType; + dropdownPrefixCls?: string; +}; + +const CascaderContext = React.createContext({ changeOnSelect: false, expandTrigger: 'click', fieldNames: null, From b40fc89f44309133b2c0c51c73e1ce545954475a Mon Sep 17 00:00:00 2001 From: zombiej Date: Fri, 27 Aug 2021 17:48:02 +0800 Subject: [PATCH 2/4] test: Update snapshot --- src/Cascader.tsx | 1 + tests/__snapshots__/private.spec.tsx.snap | 101 ++++++++++++++++++++++ tests/private.spec.tsx | 32 +++++++ 3 files changed, 134 insertions(+) create mode 100644 tests/__snapshots__/private.spec.tsx.snap create mode 100644 tests/private.spec.tsx diff --git a/src/Cascader.tsx b/src/Cascader.tsx index 0e508b81..ecaa5465 100644 --- a/src/Cascader.tsx +++ b/src/Cascader.tsx @@ -97,6 +97,7 @@ interface BaseCascaderProps expandTrigger?: 'hover' | 'click'; dropdownMenuColumnStyle?: React.CSSProperties; + /** @private Internal usage. Do not use in your production. */ dropdownPrefixCls?: string; loadData?: (selectOptions: DataNode[]) => void; diff --git a/tests/__snapshots__/private.spec.tsx.snap b/tests/__snapshots__/private.spec.tsx.snap new file mode 100644 index 00000000..3841d29c --- /dev/null +++ b/tests/__snapshots__/private.spec.tsx.snap @@ -0,0 +1,101 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Cascader.Private dropdownPrefixCls 1`] = ` +
+
+ + + + + Light / Toy + +
+
+
+
+
+ + +
+
+
+
+
+`; diff --git a/tests/private.spec.tsx b/tests/private.spec.tsx new file mode 100644 index 00000000..4b269226 --- /dev/null +++ b/tests/private.spec.tsx @@ -0,0 +1,32 @@ +/* eslint-disable @typescript-eslint/consistent-type-imports */ + +import React from 'react'; +import { mount } from './enzyme'; +import Cascader from '../src'; + +describe('Cascader.Private', () => { + it('dropdownPrefixCls', () => { + const wrapper = mount( + , + ); + + expect(wrapper.render()).toMatchSnapshot(); + }); +}); From 1311697f7163f4aabd01c00bb83c6a9027a8312f Mon Sep 17 00:00:00 2001 From: zombiej Date: Fri, 27 Aug 2021 17:49:40 +0800 Subject: [PATCH 3/4] chore: Update holder name --- assets/list.less | 10 +++++----- src/OptionList/index.tsx | 2 +- tests/__snapshots__/private.spec.tsx.snap | 2 +- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/assets/list.less b/assets/list.less index afab02c9..e18fc409 100644 --- a/assets/list.less +++ b/assets/list.less @@ -5,12 +5,12 @@ min-height: auto; } - &-holder { - display: flex; - flex-wrap: nowrap; - } - &-menu { + &-holder { + display: flex; + flex-wrap: nowrap; + } + flex: none; margin: 0; padding: 0; diff --git a/src/OptionList/index.tsx b/src/OptionList/index.tsx index 2489ce45..b79e3644 100644 --- a/src/OptionList/index.tsx +++ b/src/OptionList/index.tsx @@ -323,7 +323,7 @@ const RefOptionList = React.forwardRef((pro return ( <>
diff --git a/tests/__snapshots__/private.spec.tsx.snap b/tests/__snapshots__/private.spec.tsx.snap index 3841d29c..929927b8 100644 --- a/tests/__snapshots__/private.spec.tsx.snap +++ b/tests/__snapshots__/private.spec.tsx.snap @@ -42,7 +42,7 @@ exports[`Cascader.Private dropdownPrefixCls 1`] = ` >
    Date: Fri, 27 Aug 2021 18:00:41 +0800 Subject: [PATCH 4/4] test: Update snapshot --- tests/__snapshots__/index.spec.js.snap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/__snapshots__/index.spec.js.snap b/tests/__snapshots__/index.spec.js.snap index 1dad94b9..ffa3cd82 100644 --- a/tests/__snapshots__/index.spec.js.snap +++ b/tests/__snapshots__/index.spec.js.snap @@ -66,7 +66,7 @@ exports[`Cascader.Basic should render custom dropdown correctly 1`] = ` class="custom-dropdown" >