Skip to content

Commit b6edd11

Browse files
Akshat55Akshat55
authored
Merge pull request #2463 from Akshat55/selector-update
feat: Add additional selectors with 'cds' prefix
2 parents 3336ecb + 6c45ad5 commit b6edd11

File tree

277 files changed

+2143
-1985
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

277 files changed

+2143
-1985
lines changed

‎integration/ng13/src/app/app.component.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
<button ibmButton="primary">Hello world!</button>
1+
<button cdsButton="primary">Hello world!</button>
22

3-
<ibm-dropdown placeholder="Select">
4-
<ibm-dropdown-list [items]="items"></ibm-dropdown-list>
5-
</ibm-dropdown>
3+
<cds-dropdown placeholder="Select">
4+
<cds-dropdown-list [items]="items"></cds-dropdown-list>
5+
</cds-dropdown>
66

77
<router-outlet></router-outlet>

‎integration/ng14/src/app/app.component.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
<button ibmButton="primary">Hello world!</button>
1+
<button cdsButton="primary">Hello world!</button>
22

3-
<ibm-dropdown placeholder="Select">
4-
<ibm-dropdown-list [items]="items"></ibm-dropdown-list>
5-
</ibm-dropdown>
3+
<cds-dropdown placeholder="Select">
4+
<cds-dropdown-list [items]="items"></cds-dropdown-list>
5+
</cds-dropdown>
66

77
<router-outlet></router-outlet>

‎integration/ng15/src/app/app.component.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
<button ibmButton="primary">Hello world!</button>
1+
<button cdsButton="primary">Hello world!</button>
22

3-
<ibm-dropdown placeholder="Select">
4-
<ibm-dropdown-list [items]="items"></ibm-dropdown-list>
5-
</ibm-dropdown>
3+
<cds-dropdown placeholder="Select">
4+
<cds-dropdown-list [items]="items"></cds-dropdown-list>
5+
</cds-dropdown>
66

77
<router-outlet></router-outlet>

‎src/accordion/accordion-item.component.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
} from "@angular/core";
99

1010
@Component({
11-
selector: "ibm-accordion-item",
11+
selector: "cds-accordion-item, ibm-accordion-item",
1212
template: `
1313
<button
1414
type="button"
@@ -17,7 +17,7 @@ import {
1717
[attr.aria-controls]="id"
1818
(click)="toggleExpanded()"
1919
class="cds--accordion__heading">
20-
<svg ibmIcon="chevron--right" size="16" class="cds--accordion__arrow"></svg>
20+
<svg cdsIcon="chevron--right" size="16" class="cds--accordion__arrow"></svg>
2121
<p *ngIf="!isTemplate(title)"
2222
class="cds--accordion__title"
2323
[ngClass]="{

‎src/accordion/accordion.component.spec.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@ import { Accordion } from "./accordion.component";
88

99
@Component({
1010
template: `
11-
<ibm-accordion [size]="size">
12-
<ibm-accordion-item
11+
<cds-accordion [size]="size">
12+
<cds-accordion-item
1313
[disabled]="disabled"
1414
[title]="title"
1515
[skeleton]="skeleton">
1616
test-content
17-
</ibm-accordion-item>
18-
<ibm-accordion>`
17+
</cds-accordion-item>
18+
<cds-accordion>`
1919
})
2020
class AccordionTest {
2121
disabled = false;
@@ -80,23 +80,23 @@ describe("Accordion", () => {
8080
fixture = TestBed.createComponent(AccordionTest);
8181
wrapper = fixture.componentInstance;
8282
fixture.detectChanges();
83-
debugElement = fixture.debugElement.query(By.css("ibm-accordion .cds--accordion__content"));
83+
debugElement = fixture.debugElement.query(By.css("cds-accordion .cds--accordion__content"));
8484
expect(debugElement.nativeElement.textContent).toContain("test-content");
8585
});
8686

87-
it("should set ibm-accordion item title to 'Section 1'", () => {
87+
it("should set cds-accordion item title to 'Section 1'", () => {
8888
fixture = TestBed.createComponent(AccordionTest);
8989
wrapper = fixture.componentInstance;
9090
fixture.detectChanges();
91-
debugElement = fixture.debugElement.query(By.css("ibm-accordion .cds--accordion__title"));
91+
debugElement = fixture.debugElement.query(By.css("cds-accordion .cds--accordion__title"));
9292
expect(debugElement.nativeElement.textContent).toContain("Section 1");
9393
});
9494

9595
it("should apply style for specified size (md)", () => {
9696
fixture = TestBed.createComponent(AccordionTest);
9797
wrapper = fixture.componentInstance;
9898
fixture.detectChanges();
99-
debugElement = fixture.debugElement.query(By.css("ibm-accordion .cds--accordion"));
99+
debugElement = fixture.debugElement.query(By.css("cds-accordion .cds--accordion"));
100100
expect(debugElement.nativeElement.classList).toContain("cds--accordion--md");
101101
});
102102
});

‎src/accordion/accordion.component.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { AccordionItem } from "./accordion-item.component";
1111
* [See demo](../../?path=/story/components-accordion--basic)
1212
*/
1313
@Component({
14-
selector: "ibm-accordion",
14+
selector: "cds-accordion, ibm-accordion",
1515
template: `
1616
<div class="cds--accordion"
1717
[ngClass]="{

‎src/accordion/accordion.stories.ts‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -17,26 +17,26 @@ export default {
1717
const Template: Story<Accordion> = (args) => ({
1818
props: args,
1919
template: `
20-
<ibm-accordion [align]="align" [size]="size">
21-
<ibm-accordion-item title="Section 1 title" (selected)="selected($event)">
20+
<cds-accordion [align]="align" [size]="size">
21+
<cds-accordion-item title="Section 1 title" (selected)="selected($event)">
2222
Lorem ipsum dolor sit amet, \
2323
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \
2424
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \
2525
ullamco laboris nisi ut aliquip ex ea commodo consequat.
26-
</ibm-accordion-item>
27-
<ibm-accordion-item title="Section 2 title" (selected)="selected($event)">
26+
</cds-accordion-item>
27+
<cds-accordion-item title="Section 2 title" (selected)="selected($event)">
2828
Lorem ipsum dolor sit amet, \
2929
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \
3030
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \
3131
ullamco laboris nisi ut aliquip ex ea commodo consequat.
32-
</ibm-accordion-item>
33-
<ibm-accordion-item title="Section 3 title" (selected)="selected($event)">
32+
</cds-accordion-item>
33+
<cds-accordion-item title="Section 3 title" (selected)="selected($event)">
3434
Lorem ipsum dolor sit amet, \
3535
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \
3636
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \
3737
ullamco laboris nisi ut aliquip ex ea commodo consequat.
38-
</ibm-accordion-item>
39-
</ibm-accordion>
38+
</cds-accordion-item>
39+
</cds-accordion>
4040
`
4141
});
4242
export const Basic = Template.bind({});
@@ -56,20 +56,20 @@ const WithTitleTemplate: Story<Accordion> = (args) => ({
5656
props: args,
5757
template: `
5858
<div style="width: 500px">
59-
<ibm-accordion>
60-
<ibm-accordion-item [title]="title" (selected)="selected($event)">
59+
<cds-accordion>
60+
<cds-accordion-item [title]="title" (selected)="selected($event)">
6161
Lorem ipsum dolor sit amet, \
6262
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \
6363
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \
6464
ullamco laboris nisi ut aliquip ex ea commodo consequat.
65-
</ibm-accordion-item>
66-
<ibm-accordion-item [title]="titleWithContext" [context]="{ index: 2 }" (selected)="selected($event)">
65+
</cds-accordion-item>
66+
<cds-accordion-item [title]="titleWithContext" [context]="{ index: 2 }" (selected)="selected($event)">
6767
Lorem ipsum dolor sit amet, \
6868
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \
6969
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \
7070
ullamco laboris nisi ut aliquip ex ea commodo consequat.
71-
</ibm-accordion-item>
72-
</ibm-accordion>
71+
</cds-accordion-item>
72+
</cds-accordion>
7373
</div>
7474
<ng-template #title>
7575
<p class="cds--accordion__title">Section 1 title</p>
@@ -90,12 +90,12 @@ const WithSkeleton: Story<Accordion> = (args) => ({
9090
props: args,
9191
template: `
9292
<div style="width: 500px">
93-
<ibm-accordion skeleton="true">
94-
<ibm-accordion-item expanded="true"></ibm-accordion-item>
95-
<ibm-accordion-item></ibm-accordion-item>
96-
<ibm-accordion-item></ibm-accordion-item>
97-
<ibm-accordion-item></ibm-accordion-item>
98-
</ibm-accordion>
93+
<cds-accordion skeleton="true">
94+
<cds-accordion-item expanded="true"></cds-accordion-item>
95+
<cds-accordion-item></cds-accordion-item>
96+
<cds-accordion-item></cds-accordion-item>
97+
<cds-accordion-item></cds-accordion-item>
98+
</cds-accordion>
9999
</div>
100100
`
101101
});

‎src/breadcrumb/breadcrumb-item.component.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { DomSanitizer } from "@angular/platform-browser";
1010
import { Router } from "@angular/router";
1111

1212
@Component({
13-
selector: "ibm-breadcrumb-item",
13+
selector: "cds-breadcrumb-item, ibm-breadcrumb-item",
1414
template: `
1515
<a
1616
class="cds--link"

‎src/breadcrumb/breadcrumb.component.spec.ts‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -14,23 +14,23 @@ import { OverflowMenu } from "carbon-components-angular/dialog";
1414
@Component({
1515
selector: "test-breadcrumb",
1616
template: `
17-
<ibm-breadcrumb [noTrailingSlash]="noTrailingSlash">
18-
<ibm-breadcrumb-item href="#">
17+
<cds-breadcrumb [noTrailingSlash]="noTrailingSlash">
18+
<cds-breadcrumb-item href="#">
1919
Breadcrumb 1
20-
</ibm-breadcrumb-item>
21-
<ibm-breadcrumb-item href="#">
20+
</cds-breadcrumb-item>
21+
<cds-breadcrumb-item href="#">
2222
Breadcrumb 2
23-
</ibm-breadcrumb-item>
24-
<ibm-breadcrumb-item href="#">
23+
</cds-breadcrumb-item>
24+
<cds-breadcrumb-item href="#">
2525
Breadcrumb 3
26-
</ibm-breadcrumb-item>
27-
<ibm-breadcrumb-item href="#">
26+
</cds-breadcrumb-item>
27+
<cds-breadcrumb-item href="#">
2828
Breadcrumb 4
29-
</ibm-breadcrumb-item>
30-
<ibm-breadcrumb-item href="#">
29+
</cds-breadcrumb-item>
30+
<cds-breadcrumb-item href="#">
3131
Breadcrumb 5
32-
</ibm-breadcrumb-item>
33-
</ibm-breadcrumb>`
32+
</cds-breadcrumb-item>
33+
</cds-breadcrumb>`
3434
})
3535
class TestBreadcrumb {
3636
noTrailingSlash = true;
@@ -39,11 +39,11 @@ class TestBreadcrumb {
3939
@Component({
4040
selector: "test-breadcrumb",
4141
template: `
42-
<ibm-breadcrumb
42+
<cds-breadcrumb
4343
[noTrailingSlash]="noTrailingSlash"
4444
[threshold]="threshold"
4545
[items]="items">
46-
</ibm-breadcrumb>`
46+
</cds-breadcrumb>`
4747
})
4848
class TestBreadcrumbModel {
4949
noTrailingSlash = true;
@@ -120,6 +120,6 @@ describe("Breadcrumb", () => {
120120
const breadcrumbItemElements = testFixture.debugElement.queryAll(By.directive(BreadcrumbItemComponent));
121121
expect(breadcrumbItemElements).not.toBeNull();
122122
expect(breadcrumbItemElements.length).toBe(4); // 4 because one is created for the overflow menu
123-
expect(breadcrumbItemElements[1].children[0].name).toEqual("ibm-overflow-menu");
123+
expect(breadcrumbItemElements[1].children[0].name).toEqual("cds-overflow-menu");
124124
});
125125
});

‎src/breadcrumb/breadcrumb.component.ts‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
2121
* [See demo](../../?path=/story/components-breadcrumb--basic)
2222
*/
2323
@Component({
24-
selector: "ibm-breadcrumb",
24+
selector: "cds-breadcrumb, ibm-breadcrumb",
2525
template: `
2626
<nav #nav class="cds--breadcrumb"
2727
[ngClass]="{
@@ -33,7 +33,7 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
3333
<ng-content></ng-content>
3434
</ng-template>
3535
<ng-template [ngIf]="!shouldShowOverflow">
36-
<ibm-breadcrumb-item
36+
<cds-breadcrumb-item
3737
*ngFor="let item of items"
3838
[href]="item.href"
3939
[route]="item.route"
@@ -47,10 +47,10 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
4747
[ngTemplateOutlet]="item.template"
4848
[ngTemplateOutletContext]="{ $implicit: item }">
4949
</ng-template>
50-
</ibm-breadcrumb-item>
50+
</cds-breadcrumb-item>
5151
</ng-template>
5252
<ng-template [ngIf]="shouldShowOverflow">
53-
<ibm-breadcrumb-item
53+
<cds-breadcrumb-item
5454
[href]="first?.href"
5555
[route]="first?.route"
5656
[routeExtras]="first?.routeExtras"
@@ -63,9 +63,9 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
6363
[ngTemplateOutlet]="first?.template"
6464
[ngTemplateOutletContext]="{ $implicit: first }">
6565
</ng-template>
66-
</ibm-breadcrumb-item>
67-
<ibm-breadcrumb-item>
68-
<ibm-overflow-menu>
66+
</cds-breadcrumb-item>
67+
<cds-breadcrumb-item>
68+
<cds-overflow-menu>
6969
<li class="cds--overflow-menu-options__option"
7070
*ngFor="let item of overflowItems">
7171
<a class="cds--overflow-menu-options__btn"
@@ -80,9 +80,9 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
8080
</ng-template>
8181
</a>
8282
</li>
83-
</ibm-overflow-menu>
84-
</ibm-breadcrumb-item>
85-
<ibm-breadcrumb-item
83+
</cds-overflow-menu>
84+
</cds-breadcrumb-item>
85+
<cds-breadcrumb-item
8686
[href]="secondLast?.href"
8787
[route]="secondLast?.route"
8888
[routeExtras]="secondLast?.routeExtras"
@@ -95,8 +95,8 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
9595
[ngTemplateOutlet]="secondLast?.template"
9696
[ngTemplateOutletContext]="{ $implicit: secondLast }">
9797
</ng-template>
98-
</ibm-breadcrumb-item>
99-
<ibm-breadcrumb-item
98+
</cds-breadcrumb-item>
99+
<cds-breadcrumb-item
100100
[href]="last?.href"
101101
[route]="last?.route"
102102
[routeExtras]="last?.routeExtras"
@@ -109,7 +109,7 @@ const MINIMUM_OVERFLOW_THRESHOLD = 4;
109109
[ngTemplateOutlet]="last?.template"
110110
[ngTemplateOutletContext]="{ $implicit: last }">
111111
</ng-template>
112-
</ibm-breadcrumb-item>
112+
</cds-breadcrumb-item>
113113
</ng-template>
114114
</nav>`
115115
})

0 commit comments

Comments
 (0)