Skip to content

Commit ccf7bb1

Browse files
[CL-736] migrate chip select to use signals (#17136)
* migrate chip select to use signals * Have Claude address feedback and create spec file * remove eslint disable comment * fix failing tests * remove unnecessary tests * improved documentation * remove unnecessary test logic * consolidate tests and remove fragile selectors
1 parent 9586057 commit ccf7bb1

File tree

3 files changed

+545
-56
lines changed

3 files changed

+545
-56
lines changed

libs/components/src/chip-select/chip-select.component.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33
class="tw-inline-flex tw-items-center tw-rounded-full tw-w-full tw-border-solid tw-border tw-gap-1.5 tw-group/chip-select"
44
[ngClass]="{
55
'tw-bg-text-muted hover:tw-bg-secondary-700 tw-text-contrast hover:!tw-border-secondary-700':
6-
selectedOption && !disabled,
6+
selectedOption && !disabled(),
77
'tw-bg-transparent hover:tw-border-secondary-700 !tw-text-muted hover:tw-bg-secondary-100':
8-
!selectedOption && !disabled,
9-
'tw-bg-secondary-300 tw-text-muted tw-border-transparent': disabled,
10-
'tw-border-text-muted': !disabled,
8+
!selectedOption && !disabled(),
9+
'tw-bg-secondary-300 tw-text-muted tw-border-transparent': disabled(),
10+
'tw-border-text-muted': !disabled(),
1111
'tw-ring-2 tw-ring-primary-600 tw-ring-offset-1': focusVisibleWithin(),
1212
}"
1313
>
@@ -17,11 +17,11 @@
1717
class="tw-inline-flex tw-gap-1.5 tw-items-center tw-justify-between tw-bg-transparent hover:tw-bg-transparent tw-border-none tw-outline-none tw-w-full tw-py-1 tw-ps-3 last:tw-pe-3 [&:not(:last-child)]:tw-pe-0 tw-truncate tw-text-[color:inherit] tw-text-[length:inherit]"
1818
data-fvw-target
1919
[ngClass]="{
20-
'tw-cursor-not-allowed': disabled,
21-
'group-hover/chip-select:tw-text-secondary-700': !selectedOption && !disabled,
20+
'tw-cursor-not-allowed': disabled(),
21+
'group-hover/chip-select:tw-text-secondary-700': !selectedOption && !disabled(),
2222
}"
2323
[bitMenuTriggerFor]="menu"
24-
[disabled]="disabled"
24+
[disabled]="disabled()"
2525
[title]="label"
2626
#menuTrigger="menuTrigger"
2727
(click)="setMenuWidth()"
@@ -45,10 +45,10 @@
4545
<button
4646
type="button"
4747
[attr.aria-label]="'removeItem' | i18n: label"
48-
[disabled]="disabled"
48+
[disabled]="disabled()"
4949
class="tw-bg-transparent hover:tw-bg-hover-contrast tw-outline-none tw-rounded-full tw-py-0.5 tw-px-1 tw-me-1 tw-text-[color:inherit] tw-text-[length:inherit] tw-border-solid tw-border tw-border-transparent tw-flex tw-items-center tw-justify-center focus-visible:tw-ring-2 tw-ring-text-contrast hover:disabled:tw-bg-transparent"
5050
[ngClass]="{
51-
'tw-cursor-not-allowed': disabled,
51+
'tw-cursor-not-allowed': disabled(),
5252
}"
5353
(click)="clear()"
5454
>

0 commit comments

Comments
 (0)