Skip to content

Commit 3f98735

Browse files
zombieJzombieJ
committed
chore: adjust cls
1 parent 648f73d commit 3f98735

File tree

6 files changed

+73
-71
lines changed

6 files changed

+73
-71
lines changed

‎src/BaseSelect/index.tsx‎

Lines changed: 30 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -522,7 +522,7 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
522522

523523
// KeyDown
524524
const onInternalKeyDown: React.KeyboardEventHandler<HTMLDivElement> = (event) => {
525-
// const clearLock = getClearLock();
525+
const clearLock = getClearLock();
526526
const { key } = event;
527527

528528
const isEnterKey = key === 'Enter';
@@ -539,36 +539,36 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
539539
}
540540
}
541541

542-
// setClearLock(!!mergedSearchValue);
543-
544-
// // Remove value by `backspace`
545-
// if (
546-
// key === 'Backspace' &&
547-
// !clearLock &&
548-
// multiple &&
549-
// !mergedSearchValue &&
550-
// displayValues.length
551-
// ) {
552-
// const cloneDisplayValues = [...displayValues];
553-
// let removedDisplayValue = null;
554-
555-
// for (let i = cloneDisplayValues.length - 1; i >= 0; i -= 1) {
556-
// const current = cloneDisplayValues[i];
557-
558-
// if (!current.disabled) {
559-
// cloneDisplayValues.splice(i, 1);
560-
// removedDisplayValue = current;
561-
// break;
562-
// }
563-
// }
542+
setClearLock(!!mergedSearchValue);
543+
544+
// Remove value by `backspace`
545+
if (
546+
key === 'Backspace' &&
547+
!clearLock &&
548+
multiple &&
549+
!mergedSearchValue &&
550+
displayValues.length
551+
) {
552+
const cloneDisplayValues = [...displayValues];
553+
let removedDisplayValue = null;
554+
555+
for (let i = cloneDisplayValues.length - 1; i >= 0; i -= 1) {
556+
const current = cloneDisplayValues[i];
557+
558+
if (!current.disabled) {
559+
cloneDisplayValues.splice(i, 1);
560+
removedDisplayValue = current;
561+
break;
562+
}
563+
}
564564

565-
// if (removedDisplayValue) {
566-
// onDisplayValuesChange(cloneDisplayValues, {
567-
// type: 'remove',
568-
// values: [removedDisplayValue],
569-
// });
570-
// }
571-
// }
565+
if (removedDisplayValue) {
566+
onDisplayValuesChange(cloneDisplayValues, {
567+
type: 'remove',
568+
values: [removedDisplayValue],
569+
});
570+
}
571+
}
572572

573573
if (mergedOpen && (!isEnterKey || !keyLockRef.current)) {
574574
// Lock the Enter key after it is pressed to avoid repeated triggering of the onChange event.

‎src/SelectInput/Content/MultipleContent.tsx‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,8 @@ export default React.forwardRef<HTMLInputElement, SharedContentProps>(function M
4545
maxTagCount,
4646
} = useBaseProps();
4747

48+
const selectionItemPrefixCls = `${prefixCls}-selection-item`;
49+
4850
// ===================== Search ======================
4951
const inputValue = showSearch ? searchValue : '';
5052
const inputEditable: boolean = showSearch && (triggerOpen || focused);
@@ -78,14 +80,14 @@ export default React.forwardRef<HTMLInputElement, SharedContentProps>(function M
7880
) => (
7981
<span
8082
title={getTitle(item)}
81-
className={clsx(`${prefixCls}-item`, {
82-
[`${prefixCls}-item-disabled`]: itemDisabled,
83+
className={clsx(selectionItemPrefixCls, {
84+
[`${selectionItemPrefixCls}-disabled`]: itemDisabled,
8385
})}
8486
>
85-
<span className={`${prefixCls}-item-content`}>{content}</span>
87+
<span className={`${selectionItemPrefixCls}-content`}>{content}</span>
8688
{closable && (
8789
<TransBtn
88-
className={`${prefixCls}-item-remove`}
90+
className={`${selectionItemPrefixCls}-remove`}
8991
onMouseDown={onPreventMouseDown}
9092
onClick={onClose}
9193
customizeIcon={removeIcon}

‎tests/Tags.test.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { act, createEvent, fireEvent, render } from '@testing-library/react';
1+
import { createEvent, fireEvent, render } from '@testing-library/react';
22
import KeyCode from '@rc-component/util/lib/KeyCode';
33
import { clsx } from 'clsx';
44
import * as React from 'react';

‎tests/__snapshots__/Tags.test.tsx.snap‎

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -13,17 +13,17 @@ exports[`Select.Tags OptGroup renders correctly 1`] = `
1313
style="opacity: 1;"
1414
>
1515
<span
16-
class="rc-select-item"
16+
class="rc-select-selection-item"
1717
title="Jack"
1818
>
1919
<span
20-
class="rc-select-item-content"
20+
class="rc-select-selection-item-content"
2121
>
2222
Jack
2323
</span>
2424
<span
2525
aria-hidden="true"
26-
class="rc-select-item-remove"
26+
class="rc-select-selection-item-remove"
2727
style="user-select: none;"
2828
unselectable="on"
2929
>
@@ -36,17 +36,17 @@ exports[`Select.Tags OptGroup renders correctly 1`] = `
3636
style="opacity: 1;"
3737
>
3838
<span
39-
class="rc-select-item"
39+
class="rc-select-selection-item"
4040
title="foo"
4141
>
4242
<span
43-
class="rc-select-item-content"
43+
class="rc-select-selection-item-content"
4444
>
4545
foo
4646
</span>
4747
<span
4848
aria-hidden="true"
49-
class="rc-select-item-remove"
49+
class="rc-select-selection-item-remove"
5050
style="user-select: none;"
5151
unselectable="on"
5252
>
@@ -245,17 +245,17 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
245245
style="opacity: 1;"
246246
>
247247
<span
248-
class="rc-select-item"
248+
class="rc-select-selection-item"
249249
title="One"
250250
>
251251
<span
252-
class="rc-select-item-content"
252+
class="rc-select-selection-item-content"
253253
>
254254
One
255255
</span>
256256
<span
257257
aria-hidden="true"
258-
class="rc-select-item-remove"
258+
class="rc-select-selection-item-remove"
259259
style="user-select: none;"
260260
unselectable="on"
261261
>
@@ -268,17 +268,17 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
268268
style="opacity: 1;"
269269
>
270270
<span
271-
class="rc-select-item"
271+
class="rc-select-selection-item"
272272
title="Two"
273273
>
274274
<span
275-
class="rc-select-item-content"
275+
class="rc-select-selection-item-content"
276276
>
277277
Two
278278
</span>
279279
<span
280280
aria-hidden="true"
281-
class="rc-select-item-remove"
281+
class="rc-select-selection-item-remove"
282282
style="user-select: none;"
283283
unselectable="on"
284284
>
@@ -291,10 +291,10 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
291291
style="opacity: 1;"
292292
>
293293
<span
294-
class="rc-select-item"
294+
class="rc-select-selection-item"
295295
>
296296
<span
297-
class="rc-select-item-content"
297+
class="rc-select-selection-item-content"
298298
>
299299
<span>
300300
Omitted
@@ -337,17 +337,17 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
337337
style="opacity: 1;"
338338
>
339339
<span
340-
class="rc-select-item"
340+
class="rc-select-selection-item"
341341
title="One"
342342
>
343343
<span
344-
class="rc-select-item-content"
344+
class="rc-select-selection-item-content"
345345
>
346346
One
347347
</span>
348348
<span
349349
aria-hidden="true"
350-
class="rc-select-item-remove"
350+
class="rc-select-selection-item-remove"
351351
style="user-select: none;"
352352
unselectable="on"
353353
>
@@ -360,17 +360,17 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
360360
style="opacity: 1;"
361361
>
362362
<span
363-
class="rc-select-item"
363+
class="rc-select-selection-item"
364364
title="Two"
365365
>
366366
<span
367-
class="rc-select-item-content"
367+
class="rc-select-selection-item-content"
368368
>
369369
Two
370370
</span>
371371
<span
372372
aria-hidden="true"
373-
class="rc-select-item-remove"
373+
class="rc-select-selection-item-remove"
374374
style="user-select: none;"
375375
unselectable="on"
376376
>
@@ -383,10 +383,10 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
383383
style="opacity: 1;"
384384
>
385385
<span
386-
class="rc-select-item"
386+
class="rc-select-selection-item"
387387
>
388388
<span
389-
class="rc-select-item-content"
389+
class="rc-select-selection-item-content"
390390
>
391391
<span>
392392
1
@@ -430,17 +430,17 @@ exports[`Select.Tags max tag render truncates values by maxTagTextLength 1`] = `
430430
style="opacity: 1;"
431431
>
432432
<span
433-
class="rc-select-item"
433+
class="rc-select-selection-item"
434434
title="One"
435435
>
436436
<span
437-
class="rc-select-item-content"
437+
class="rc-select-selection-item-content"
438438
>
439439
On...
440440
</span>
441441
<span
442442
aria-hidden="true"
443-
class="rc-select-item-remove"
443+
class="rc-select-selection-item-remove"
444444
style="user-select: none;"
445445
unselectable="on"
446446
>
@@ -453,17 +453,17 @@ exports[`Select.Tags max tag render truncates values by maxTagTextLength 1`] = `
453453
style="opacity: 1;"
454454
>
455455
<span
456-
class="rc-select-item"
456+
class="rc-select-selection-item"
457457
title="Two"
458458
>
459459
<span
460-
class="rc-select-item-content"
460+
class="rc-select-selection-item-content"
461461
>
462462
Tw...
463463
</span>
464464
<span
465465
aria-hidden="true"
466-
class="rc-select-item-remove"
466+
class="rc-select-selection-item-remove"
467467
style="user-select: none;"
468468
unselectable="on"
469469
>

‎tests/shared/maxTagRenderTest.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export default function maxTagTextLengthTest(mode: any) {
2626
</Select>,
2727
);
2828

29-
expect(container.querySelectorAll('.rc-select-item')).toHaveLength(3);
29+
expect(container.querySelectorAll('.rc-select-selection-item')).toHaveLength(3);
3030
});
3131

3232
it('truncates tags by maxTagCount while maxTagCount is 0', () => {
@@ -38,7 +38,7 @@ export default function maxTagTextLengthTest(mode: any) {
3838
</Select>,
3939
);
4040

41-
expect(container.querySelectorAll('.rc-select-item')).toHaveLength(1);
41+
expect(container.querySelectorAll('.rc-select-selection-item')).toHaveLength(1);
4242
expect(findSelection(container).textContent).toEqual('+ 3 ...');
4343
});
4444

‎tests/utils/common.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,9 @@ export function selectItem(wrapper: any, index: number = 0) {
4343

4444
export function findSelection(wrapper: any, index: number = 0) {
4545
if (wrapper instanceof HTMLElement) {
46-
const itemNode = wrapper.querySelectorAll('.rc-select-item')[index];
46+
const itemNode = wrapper.querySelectorAll('.rc-select-selection-item')[index];
4747
const contentNode =
48-
itemNode?.querySelector('.rc-select-item-content') ||
48+
itemNode?.querySelector('.rc-select-selection-item-content') ||
4949
wrapper.querySelector('.rc-select-content-value');
5050

5151
if (contentNode) {
@@ -69,17 +69,17 @@ export function removeSelection(wrapper: any, index: number = 0) {
6969
const preventDefault = jest.fn();
7070

7171
if (wrapper instanceof HTMLElement) {
72-
const ele = wrapper.querySelectorAll('.rc-select-item-remove')[index];
72+
const ele = wrapper.querySelectorAll('.rc-select-selection-item-remove')[index];
7373
const mouseDownEvent = createEvent.mouseDown(ele);
7474
mouseDownEvent.preventDefault = preventDefault;
7575

7676
fireEvent(ele, mouseDownEvent);
77-
fireEvent.click(wrapper.querySelectorAll('.rc-select-item-remove')[index]);
77+
fireEvent.click(wrapper.querySelectorAll('.rc-select-selection-item-remove')[index]);
7878
} else {
7979
wrapper
80-
.find('.rc-select-item')
80+
.find('.rc-select-selection-item')
8181
.at(index)
82-
.find('.rc-select-item-remove')
82+
.find('.rc-select-selection-item-remove')
8383
.last()
8484
.simulate('mousedown', { preventDefault })
8585
.simulate('click');

0 commit comments

Comments
 (0)