Skip to content

Commit 8f9ee40

Browse files
ajivanyandevajivanyandev
authored
Merge branch '25_2' into angular/deprecation-warning
2 parents b8cc7da + e142efe commit 8f9ee40

File tree

1,855 files changed

+20341
-10783
lines changed

Some content is hidden

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

1,855 files changed

+20341
-10783
lines changed

‎apps/demos/Demos/Accordion/Overview/Angular/app/app.component.html‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,8 +57,11 @@
5757
<div class="option">
5858
<span>Animation duration</span>
5959
<dx-slider [min]="0" [max]="1000" [(value)]="accordion.animationDuration">
60-
<dxo-tooltip [enabled]="true" position="bottom"></dxo-tooltip>
61-
<dxo-label [visible]="true"></dxo-label>
60+
<dxo-slider-tooltip
61+
[enabled]="true"
62+
position="bottom"
63+
></dxo-slider-tooltip>
64+
<dxo-slider-label [visible]="true"></dxo-slider-label>
6265
</dx-slider>
6366
</div>
6467
<div class="option">

‎apps/demos/Demos/ActionSheet/PopoverMode/Angular/app/app.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<dx-list (onItemClick)="itemClick($event)">
2-
<dxi-item *ngFor="let contact of contacts">
2+
<dxi-list-item *ngFor="let contact of contacts">
33
<div>{{ contact.name }}</div>
44
<div>{{ contact.phone }}</div>
55
<div>{{ contact.email }}</div>
6-
</dxi-item>
6+
</dxi-list-item>
77
</dx-list>
88
<dx-action-sheet
99
[items]="commands"

‎apps/demos/Demos/Box/Overview/Angular/app/app.component.html‎

Lines changed: 29 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,51 @@
11
<dx-box direction="row" width="100%" [height]="75">
2-
<dxi-item class="rect demo-dark" [ratio]="1"> ratio = 1 </dxi-item>
3-
<dxi-item class="rect demo-light" [ratio]="2"> ratio = 2 </dxi-item>
4-
<dxi-item class="rect demo-dark" [ratio]="1"> ratio = 1 </dxi-item>
2+
<dxi-box-item class="rect demo-dark" [ratio]="1"> ratio = 1 </dxi-box-item>
3+
<dxi-box-item class="rect demo-light" [ratio]="2"> ratio = 2 </dxi-box-item>
4+
<dxi-box-item class="rect demo-dark" [ratio]="1"> ratio = 1 </dxi-box-item>
55
</dx-box>
66
<br />
77
<dx-box direction="row" width="100%" [height]="75">
8-
<dxi-item class="rect demo-dark" [ratio]="0" [baseSize]="150">
8+
<dxi-box-item class="rect demo-dark" [ratio]="0" [baseSize]="150">
99
150px
10-
</dxi-item>
11-
<dxi-item class="demo-light" [ratio]="1">
10+
</dxi-box-item>
11+
<dxi-box-item class="demo-light" [ratio]="1">
1212
<dx-box
1313
direction="row"
1414
width="100%"
1515
[height]="75"
1616
align="center"
1717
crossAlign="center"
1818
>
19-
<dxi-item [ratio]="0" [baseSize]="50">
19+
<dxi-box-item [ratio]="0" [baseSize]="50">
2020
<div class="small"></div>
21-
</dxi-item>
22-
<dxi-item [ratio]="0" [baseSize]="50">
21+
</dxi-box-item>
22+
<dxi-box-item [ratio]="0" [baseSize]="50">
2323
<div class="small"></div>
24-
</dxi-item>
25-
<dxi-item [ratio]="0" [baseSize]="50">
24+
</dxi-box-item>
25+
<dxi-box-item [ratio]="0" [baseSize]="50">
2626
<div class="small"></div>
27-
</dxi-item>
27+
</dxi-box-item>
2828
</dx-box>
29-
</dxi-item>
30-
<dxi-item class="rect demo-dark" [ratio]="0" baseSize="10%"> 10% </dxi-item>
29+
</dxi-box-item>
30+
<dxi-box-item class="rect demo-dark" [ratio]="0" baseSize="10%">
31+
10%
32+
</dxi-box-item>
3133
</dx-box>
3234
<br />
3335
<dx-box direction="col" width="100%" [height]="250">
34-
<dxi-item class="rect demo-dark header" [ratio]="1"> Header </dxi-item>
35-
<dxi-item [ratio]="2" [baseSize]="0">
36+
<dxi-box-item class="rect demo-dark header" [ratio]="1">
37+
Header
38+
</dxi-box-item>
39+
<dxi-box-item [ratio]="2" [baseSize]="0">
3640
<dx-box direction="row" width="100%" [height]="125">
37-
<dxi-item class="rect demo-dark" [ratio]="1"> Left Bar </dxi-item>
38-
<dxi-item class="rect demo-light" [ratio]="1"> Content </dxi-item>
39-
<dxi-item class="rect demo-dark" [ratio]="1"> Right Bar </dxi-item>
41+
<dxi-box-item class="rect demo-dark" [ratio]="1"> Left Bar </dxi-box-item>
42+
<dxi-box-item class="rect demo-light" [ratio]="1"> Content </dxi-box-item>
43+
<dxi-box-item class="rect demo-dark" [ratio]="1">
44+
Right Bar
45+
</dxi-box-item>
4046
</dx-box>
41-
</dxi-item>
42-
<dxi-item class="rect demo-dark footer" [ratio]="1"> Footer </dxi-item>
47+
</dxi-box-item>
48+
<dxi-box-item class="rect demo-dark footer" [ratio]="1">
49+
Footer
50+
</dxi-box-item>
4351
</dx-box>

‎apps/demos/Demos/Chat/FileAttachments/client-script.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
MockDate.set(new Date('2025/05/05 16:35:10'));

‎apps/demos/Demos/Chat/FileAttachments/jQuery/data.js‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
const getTimestamp = function (date, offsetMinutes = 0) {
2+
return date.getTime() + offsetMinutes * 60000;
3+
};
4+
5+
const date = new Date();
6+
date.setHours(0, 0, 0, 0);
7+
8+
const currentUser = {
9+
id: 'c94c0e76-fb49-4b9b-8f07-9f93ed93b4f3',
10+
name: 'John Doe',
11+
};
12+
13+
const supportAgent = {
14+
id: 'd16d1a4c-5c67-4e20-b70e-2991c22747c3',
15+
name: 'Support Agent',
16+
avatarUrl: '../../../../images/petersmith.png',
17+
};
18+
19+
const createEmptyAttachment = (name, type) => {
20+
const blob = new Blob([''], { type });
21+
const url = URL.createObjectURL(blob);
22+
23+
return {
24+
name,
25+
url,
26+
size: 1024 * 10,
27+
};
28+
};
29+
30+
const screenshot1 = createEmptyAttachment('Screenshot1.jpg', 'image/jpeg');
31+
const screenshot2 = createEmptyAttachment('Screenshot2.jpg', 'image/jpeg');
32+
const screenshot3 = createEmptyAttachment('Screenshot3.jpg', 'image/jpeg');
33+
const instructions = createEmptyAttachment('Instructions.pdf', 'application/pdf');
34+
35+
const messages = [
36+
{
37+
id: new DevExpress.data.Guid(),
38+
timestamp: getTimestamp(date, -9),
39+
author: supportAgent,
40+
text: 'Hello, John!\nHow can I assist you today?',
41+
},
42+
{
43+
id: new DevExpress.data.Guid(),
44+
timestamp: getTimestamp(date, -7),
45+
author: currentUser,
46+
text: "Hi, I'm having trouble accessing my account.\nIt says my password is incorrect. I’ve attached some screenshots for you to check.",
47+
attachments: [screenshot1, screenshot2, screenshot3],
48+
},
49+
{
50+
id: new DevExpress.data.Guid(),
51+
timestamp: getTimestamp(date, -7),
52+
author: supportAgent,
53+
text: 'Thanks for the screenshots! I can help you with that. Please refer to the attached file for instructions to restore access.',
54+
attachments: [instructions],
55+
},
56+
];

‎apps/demos/Demos/Chat/FileAttachments/jQuery/index.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
3+
<head>
4+
<title>DevExtreme Demo</title>
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
8+
<script src="../../../../node_modules/jquery/dist/jquery.min.js"></script>
9+
<link rel="stylesheet" type="text/css" href="../../../../node_modules/devextreme-dist/css/dx.light.css" />
10+
<script src="../../../../node_modules/devextreme-dist/js/dx.all.js"></script>
11+
<link rel="stylesheet" type="text/css" href="styles.css" />
12+
<script src="data.js"></script>
13+
<script src="index.js"></script>
14+
</head>
15+
<body class="dx-viewport">
16+
<div class="demo-container">
17+
<div class="chat-container">
18+
<div id="chat"></div>
19+
</div>
20+
</div>
21+
</body>
22+
</html>

‎apps/demos/Demos/Chat/FileAttachments/jQuery/index.js‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
$(() => {
2+
const customStore = new DevExpress.data.CustomStore({
3+
key: 'id',
4+
load: async () => messages,
5+
insert: async (message) => {
6+
messages.push(message);
7+
return message;
8+
},
9+
});
10+
11+
const dataSource = new DevExpress.data.DataSource({
12+
store: customStore,
13+
paginate: false,
14+
});
15+
16+
const uploadedFilesMap = new Map();
17+
18+
$('#chat').dxChat({
19+
height: 600,
20+
dataSource,
21+
reloadOnChange: false,
22+
user: currentUser,
23+
fileUploaderOptions: {
24+
uploadFile: () => {},
25+
onValueChanged(e) {
26+
e.value.forEach((file) => {
27+
const url = URL.createObjectURL(file);
28+
uploadedFilesMap.set(file.name, url);
29+
});
30+
},
31+
},
32+
onMessageEntered(e) {
33+
const { message } = e;
34+
35+
const attachmentsWithUrls = message.attachments?.map((attachment) => {
36+
const url = uploadedFilesMap.get(attachment.name);
37+
return { ...attachment, url };
38+
});
39+
40+
dataSource.store().push([{
41+
type: 'insert',
42+
data: {
43+
id: new DevExpress.data.Guid(),
44+
...message,
45+
attachments: attachmentsWithUrls,
46+
},
47+
}]);
48+
},
49+
onAttachmentDownloadClick(e) {
50+
const { attachment } = e;
51+
52+
if (!attachment?.url) {
53+
return;
54+
}
55+
56+
const link = document.createElement('a');
57+
link.href = attachment.url;
58+
link.download = attachment.name;
59+
document.body.appendChild(link);
60+
61+
link.click();
62+
63+
document.body.removeChild(link);
64+
},
65+
}).dxChat('instance');
66+
});

‎apps/demos/Demos/Chat/FileAttachments/jQuery/styles.css‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
.demo-container {
2+
min-width: 720px;
3+
}
4+
5+
.chat-container {
6+
display: flex;
7+
flex-grow: 1;
8+
align-items: center;
9+
justify-content: center;
10+
}
11+
12+
.dx-chat {
13+
max-width: 480px;
14+
}
15+
16+
.caption {
17+
font-size: var(--dx-font-size-sm);
18+
font-weight: 500;
19+
}
20+
21+
.dx-avatar {
22+
border: 1px solid var(--dx-color-border);
23+
}

‎apps/demos/Demos/Common/CustomTextEditorButtons/Angular/app/app.component.html‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@
99
stylingMode="filled"
1010
[(mode)]="passwordMode"
1111
>
12-
<dxi-button
12+
<dxi-text-box-button
1313
name="today"
1414
location="after"
1515
[options]="passwordButton"
16-
></dxi-button>
16+
></dxi-text-box-button>
1717
</dx-text-box>
1818
</div>
1919
</div>
@@ -27,13 +27,13 @@
2727
[showSpinButtons]="true"
2828
[inputAttr]="{ 'aria-label': 'Currency Format' }"
2929
>
30-
<dxi-button
30+
<dxi-number-box-button
3131
name="currency"
3232
location="after"
3333
[options]="currencyButton"
34-
></dxi-button>
35-
<dxi-button name="clear"></dxi-button>
36-
<dxi-button name="spins"></dxi-button>
34+
></dxi-number-box-button>
35+
<dxi-number-box-button name="clear"></dxi-number-box-button>
36+
<dxi-number-box-button name="spins"></dxi-number-box-button>
3737
</dx-number-box>
3838
</div>
3939
</div>
@@ -45,22 +45,22 @@
4545
[(value)]="dateValue"
4646
[inputAttr]="{ 'aria-label': 'Date' }"
4747
>
48-
<dxi-button
48+
<dxi-date-box-button
4949
name="today"
5050
location="before"
5151
[options]="todayButton"
52-
></dxi-button>
53-
<dxi-button
52+
></dxi-date-box-button>
53+
<dxi-date-box-button
5454
name="prevDate"
5555
location="before"
5656
[options]="prevDateButton"
57-
></dxi-button>
58-
<dxi-button
57+
></dxi-date-box-button>
58+
<dxi-date-box-button
5959
name="nextDate"
6060
location="after"
6161
[options]="nextDateButton"
62-
></dxi-button>
63-
<dxi-button name="dropDown"></dxi-button>
62+
></dxi-date-box-button>
63+
<dxi-date-box-button name="dropDown"></dxi-date-box-button>
6464
</dx-date-box>
6565
</div>
6666
</div>

‎apps/demos/Demos/Common/EditorAppearanceVariants/Angular/app/app.component.html‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@
3636
[labelMode]="labelMode"
3737
>
3838
<dx-validator>
39-
<dxi-validation-rule type="required"> </dxi-validation-rule>
39+
<dxi-validator-validation-rule type="required">
40+
</dxi-validator-validation-rule>
4041
</dx-validator>
4142
</dx-text-box>
4243
<dx-text-box
@@ -48,7 +49,8 @@
4849
[labelMode]="labelMode"
4950
>
5051
<dx-validator>
51-
<dxi-validation-rule type="required"> </dxi-validation-rule>
52+
<dxi-validator-validation-rule type="required">
53+
</dxi-validator-validation-rule>
5254
</dx-validator>
5355
</dx-text-box>
5456
<dx-date-box
@@ -60,7 +62,8 @@
6062
[inputAttr]="{ 'aria-label': 'Hire Date' }"
6163
>
6264
<dx-validator>
63-
<dxi-validation-rule type="required"> </dxi-validation-rule>
65+
<dxi-validator-validation-rule type="required">
66+
</dxi-validator-validation-rule>
6467
</dx-validator>
6568
</dx-date-box>
6669
<dx-date-box
@@ -73,7 +76,8 @@
7376
[inputAttr]="{ 'aria-label': 'Birth Date' }"
7477
>
7578
<dx-validator>
76-
<dxi-validation-rule type="required"> </dxi-validation-rule>
79+
<dxi-validator-validation-rule type="required">
80+
</dxi-validator-validation-rule>
7781
</dx-validator>
7882
</dx-date-box>
7983
<dx-select-box
@@ -87,7 +91,8 @@
8791
validationMessagePosition="left"
8892
>
8993
<dx-validator>
90-
<dxi-validation-rule type="required"> </dxi-validation-rule>
94+
<dxi-validator-validation-rule type="required">
95+
</dxi-validator-validation-rule>
9196
</dx-validator>
9297
</dx-select-box>
9398
<dx-text-box
@@ -100,7 +105,8 @@
100105
[labelMode]="labelMode"
101106
>
102107
<dx-validator>
103-
<dxi-validation-rule type="required"> </dxi-validation-rule>
108+
<dxi-validator-validation-rule type="required">
109+
</dxi-validator-validation-rule>
104110
</dx-validator>
105111
</dx-text-box>
106112
<dx-date-range-box

0 commit comments

Comments
 (0)