mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-18 22:36:31 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

Merge branch 'feature' into master-merge-feature

Browse Source
This commit is contained in:
lijianan 2024-01-28 11:58:38 +08:00 committed by GitHub
commit 2f141e6d25
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 26 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
components/segmented/demo/basic.tsx
View File

@ -2,7 +2,12 @@ import React from 'react';
import { Segmented } from 'antd'; import { Segmented } from 'antd';
const Demo: React.FC = () => ( const Demo: React.FC = () => (
<Segmented options={['Daily', 'Weekly', 'Monthly', 'Quarterly', 'Yearly']} /> <Segmented<string>
options={['Daily', 'Weekly', 'Monthly', 'Quarterly', 'Yearly']}
onChange={(value) => {
console.log(value); // string
}}
/>
); );
export default Demo; export default Demo;

27
components/segmented/index.tsx
View File

@ -2,6 +2,7 @@ import classNames from 'classnames';
import type { import type {
SegmentedLabeledOption as RcSegmentedLabeledOption, SegmentedLabeledOption as RcSegmentedLabeledOption,
SegmentedProps as RCSegmentedProps, SegmentedProps as RCSegmentedProps,
SegmentedValue as RcSegmentedValue,
SegmentedRawOption, SegmentedRawOption,
} from 'rc-segmented'; } from 'rc-segmented';
import RcSegmented from 'rc-segmented'; import RcSegmented from 'rc-segmented';
@ -13,11 +14,13 @@ import useStyle from './style';
export type { SegmentedValue } from 'rc-segmented'; export type { SegmentedValue } from 'rc-segmented';
interface SegmentedLabeledOptionWithoutIcon extends RcSegmentedLabeledOption { interface SegmentedLabeledOptionWithoutIcon<ValueType = RcSegmentedValue>
extends RcSegmentedLabeledOption<ValueType> {
label: RcSegmentedLabeledOption['label']; label: RcSegmentedLabeledOption['label'];
} }
interface SegmentedLabeledOptionWithIcon extends Omit<RcSegmentedLabeledOption, 'label'> { interface SegmentedLabeledOptionWithIcon<ValueType = RcSegmentedValue>
extends Omit<RcSegmentedLabeledOption<ValueType>, 'label'> {
label?: RcSegmentedLabeledOption['label']; label?: RcSegmentedLabeledOption['label'];
/** Set icon for Segmented item */ /** Set icon for Segmented item */
icon: React.ReactNode; icon: React.ReactNode;
@ -29,20 +32,23 @@ function isSegmentedLabeledOptionWithIcon(
return typeof option === 'object' && !!(option as SegmentedLabeledOptionWithIcon)?.icon; return typeof option === 'object' && !!(option as SegmentedLabeledOptionWithIcon)?.icon;
} }
export type SegmentedLabeledOption = export type SegmentedLabeledOption<ValueType = RcSegmentedValue> =
| SegmentedLabeledOptionWithIcon | SegmentedLabeledOptionWithIcon<ValueType>
| SegmentedLabeledOptionWithoutIcon; | SegmentedLabeledOptionWithoutIcon<ValueType>;
export interface SegmentedProps extends Omit<RCSegmentedProps, 'size' | 'options'> { export type SegmentedOptions<T = SegmentedRawOption> = (T | SegmentedLabeledOption<T>)[];
export interface SegmentedProps<ValueType = RcSegmentedValue>
extends Omit<RCSegmentedProps<ValueType>, 'size' | 'options'> {
rootClassName?: string; rootClassName?: string;
options: (SegmentedRawOption | SegmentedLabeledOption)[]; options: SegmentedOptions<ValueType>;
/** Option to fit width to its parent's width */ /** Option to fit width to its parent's width */
block?: boolean; block?: boolean;
/** Option to control the display size */ /** Option to control the display size */
size?: SizeType; size?: SizeType;
} }
const Segmented = React.forwardRef<HTMLDivElement, SegmentedProps>((props, ref) => { const InternalSegmented = React.forwardRef<HTMLDivElement, SegmentedProps>((props, ref) => {
const { const {
prefixCls: customizePrefixCls, prefixCls: customizePrefixCls,
className, className,
@ -111,6 +117,11 @@ const Segmented = React.forwardRef<HTMLDivElement, SegmentedProps>((props, ref)
); );
}); });
const Segmented = InternalSegmented as (<ValueType>(
props: SegmentedProps<ValueType> & React.RefAttributes<HTMLDivElement>,
) => ReturnType<typeof InternalSegmented>) &
Pick<React.FC, 'displayName'>;
if (process.env.NODE_ENV !== 'production') { if (process.env.NODE_ENV !== 'production') {
Segmented.displayName = 'Segmented'; Segmented.displayName = 'Segmented';
} }

2
package.json
View File

@ -148,7 +148,7 @@
"rc-progress": "~3.5.1", "rc-progress": "~3.5.1",
"rc-rate": "~2.12.0", "rc-rate": "~2.12.0",
"rc-resize-observer": "^1.4.0", "rc-resize-observer": "^1.4.0",
"rc-segmented": "~2.2.2", "rc-segmented": "~2.3.0",
"rc-select": "~14.11.0", "rc-select": "~14.11.0",
"rc-slider": "~10.5.0", "rc-slider": "~10.5.0",
"rc-steps": "~6.0.1", "rc-steps": "~6.0.1",