@fluentui-react-native/tester 0.66.0 → 0.68.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +64 -1
- package/CHANGELOG.md +29 -2
- package/lib/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.d.ts.map +1 -1
- package/lib/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.js +71 -29
- package/lib/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.js.map +1 -1
- package/lib/FluentTester/TestComponents/Notification/NotificationTest.d.ts.map +1 -1
- package/lib/FluentTester/TestComponents/Notification/NotificationTest.js +6 -56
- package/lib/FluentTester/TestComponents/Notification/NotificationTest.js.map +1 -1
- package/lib-commonjs/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.d.ts.map +1 -1
- package/lib-commonjs/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.js +71 -29
- package/lib-commonjs/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.js.map +1 -1
- package/lib-commonjs/FluentTester/TestComponents/Notification/NotificationTest.d.ts.map +1 -1
- package/lib-commonjs/FluentTester/TestComponents/Notification/NotificationTest.js +6 -56
- package/lib-commonjs/FluentTester/TestComponents/Notification/NotificationTest.js.map +1 -1
- package/package.json +5 -4
- package/src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx +130 -36
- package/src/FluentTester/TestComponents/Notification/NotificationTest.tsx +21 -77
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,70 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/tester",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Thu, 23 Jun 2022 16:07:53 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/tester_v0.68.0",
|
|
7
|
+
"version": "0.68.0",
|
|
8
|
+
"comments": {
|
|
9
|
+
"minor": [
|
|
10
|
+
{
|
|
11
|
+
"author": "78454019+lyzhan7@users.noreply.github.com",
|
|
12
|
+
"package": "@fluentui-react-native/tester",
|
|
13
|
+
"commit": "7880dae12f6e2283020d0a6413fdb7e8193afb2b",
|
|
14
|
+
"comment": "Add ability to set custom reference start/end dates"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui-react-native/tester",
|
|
19
|
+
"comment": "Bump @fluentui-react-native/experimental-avatar to v0.15.1",
|
|
20
|
+
"commit": "7880dae12f6e2283020d0a6413fdb7e8193afb2b"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui-react-native/tester",
|
|
25
|
+
"comment": "Bump @fluentui-react-native/experimental-native-date-picker to v0.5.0",
|
|
26
|
+
"commit": "7880dae12f6e2283020d0a6413fdb7e8193afb2b"
|
|
27
|
+
}
|
|
28
|
+
]
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
"date": "Tue, 21 Jun 2022 23:39:02 GMT",
|
|
33
|
+
"tag": "@fluentui-react-native/tester_v0.67.0",
|
|
34
|
+
"version": "0.67.0",
|
|
35
|
+
"comments": {
|
|
36
|
+
"minor": [
|
|
37
|
+
{
|
|
38
|
+
"author": "joannaquu@gmail.com",
|
|
39
|
+
"package": "@fluentui-react-native/tester",
|
|
40
|
+
"commit": "6426ed850d4667d8cefdd7140017959dca5642fe",
|
|
41
|
+
"comment": "added notification component"
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
"author": "beachball",
|
|
45
|
+
"package": "@fluentui-react-native/tester",
|
|
46
|
+
"comment": "Bump @fluentui-react-native/notification to v0.1.0",
|
|
47
|
+
"commit": "6426ed850d4667d8cefdd7140017959dca5642fe"
|
|
48
|
+
}
|
|
49
|
+
]
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
"date": "Tue, 21 Jun 2022 21:43:45 GMT",
|
|
54
|
+
"tag": "@fluentui-react-native/tester_v0.66.1",
|
|
55
|
+
"version": "0.66.1",
|
|
56
|
+
"comments": {
|
|
57
|
+
"patch": [
|
|
58
|
+
{
|
|
59
|
+
"author": "beachball",
|
|
60
|
+
"package": "@fluentui-react-native/tester",
|
|
61
|
+
"comment": "Bump @fluentui-react-native/menu to v0.15.4",
|
|
62
|
+
"commit": "b63cb286a24e78999adee82781f58d2610b3b776"
|
|
63
|
+
}
|
|
64
|
+
]
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"date": "Tue, 21 Jun 2022 21:07:14 GMT",
|
|
6
69
|
"tag": "@fluentui-react-native/tester_v0.66.0",
|
|
7
70
|
"version": "0.66.0",
|
|
8
71
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,39 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/tester
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Thu, 23 Jun 2022 16:07:53 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.68.0
|
|
8
|
+
|
|
9
|
+
Thu, 23 Jun 2022 16:07:53 GMT
|
|
10
|
+
|
|
11
|
+
### Minor changes
|
|
12
|
+
|
|
13
|
+
- Add ability to set custom reference start/end dates (78454019+lyzhan7@users.noreply.github.com)
|
|
14
|
+
- Bump @fluentui-react-native/experimental-avatar to v0.15.1
|
|
15
|
+
- Bump @fluentui-react-native/experimental-native-date-picker to v0.5.0
|
|
16
|
+
|
|
17
|
+
## 0.67.0
|
|
18
|
+
|
|
19
|
+
Tue, 21 Jun 2022 23:39:02 GMT
|
|
20
|
+
|
|
21
|
+
### Minor changes
|
|
22
|
+
|
|
23
|
+
- added notification component (joannaquu@gmail.com)
|
|
24
|
+
- Bump @fluentui-react-native/notification to v0.1.0
|
|
25
|
+
|
|
26
|
+
## 0.66.1
|
|
27
|
+
|
|
28
|
+
Tue, 21 Jun 2022 21:43:45 GMT
|
|
29
|
+
|
|
30
|
+
### Patches
|
|
31
|
+
|
|
32
|
+
- Bump @fluentui-react-native/menu to v0.15.4
|
|
33
|
+
|
|
7
34
|
## 0.66.0
|
|
8
35
|
|
|
9
|
-
Tue, 21 Jun 2022 21:
|
|
36
|
+
Tue, 21 Jun 2022 21:07:14 GMT
|
|
10
37
|
|
|
11
38
|
### Minor changes
|
|
12
39
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeDatePickerTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"NativeDatePickerTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAwO/B,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,iBAYxC,CAAC"}
|
|
@@ -12,20 +12,23 @@ var NativeDatePickerMainTest = function () {
|
|
|
12
12
|
var _a;
|
|
13
13
|
var _b = React.useState(new Date()), startDate = _b[0], setStartDate = _b[1];
|
|
14
14
|
var _c = React.useState(null), endDate = _c[0], setEndDate = _c[1];
|
|
15
|
-
var _d = React.useState(false),
|
|
15
|
+
var _d = React.useState(false), customCalendarConfiguration = _d[0], setCustomCalendarConfiguration = _d[1];
|
|
16
16
|
function didPickDates(pickedStartDate, pickedEndDate) {
|
|
17
17
|
setStartDate(NativeDatePicker.parseISOString(pickedStartDate));
|
|
18
18
|
setEndDate(NativeDatePicker.parseISOString(pickedEndDate));
|
|
19
19
|
}
|
|
20
|
+
var today = new Date();
|
|
20
21
|
// Here we set up some common options and use the spread operator to copy them repeatedly into examples.
|
|
21
22
|
var fixedDates = {
|
|
22
|
-
startDate:
|
|
23
|
-
endDate:
|
|
24
|
-
overrideReferenceStartDate: NativeDatePicker.parseISOString('1999-01-01T00:00:00.000Z'),
|
|
25
|
-
overrideReferenceEndDate: NativeDatePicker.parseISOString('2000-01-01T00:00:00.000Z'),
|
|
26
|
-
defaultReferenceStartDate: new Date(new Date().getFullYear() - 3, 1, 1),
|
|
27
|
-
defaultReferenceEndDate: new Date(new Date().getFullYear() + 7, 1, 1),
|
|
23
|
+
startDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 7),
|
|
24
|
+
endDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 14),
|
|
28
25
|
};
|
|
26
|
+
var customReferenceStartDate = today;
|
|
27
|
+
var customReferenceEndDate = new Date(today.getFullYear(), today.getMonth() + 1, today.getDate());
|
|
28
|
+
var defaultReferenceStartDate = new Date(today.getFullYear() - 3, 1, 1);
|
|
29
|
+
var defaultReferenceEndDate = new Date(defaultReferenceStartDate.getFullYear() + 10, 1, 1);
|
|
30
|
+
var referenceStartDate = customCalendarConfiguration ? customReferenceStartDate : defaultReferenceStartDate;
|
|
31
|
+
var referenceEndDate = customCalendarConfiguration ? customReferenceEndDate : defaultReferenceEndDate;
|
|
29
32
|
var titles = {
|
|
30
33
|
startTitle: 'Start Title',
|
|
31
34
|
startSubitle: 'Start Subtitle',
|
|
@@ -48,34 +51,73 @@ var NativeDatePickerMainTest = function () {
|
|
|
48
51
|
React.createElement(Text, { variant: "subheaderStandard" }, (_a = endDate === null || endDate === void 0 ? void 0 : endDate.toString()) !== null && _a !== void 0 ? _a : 'N/A',
|
|
49
52
|
" ",
|
|
50
53
|
'\n'),
|
|
51
|
-
React.createElement(Button, { content: "Date picker", onClick: function () {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
54
|
+
React.createElement(Button, { content: "Date picker", onClick: function () {
|
|
55
|
+
return NativeDatePicker.present({
|
|
56
|
+
referenceStartDate: referenceStartDate,
|
|
57
|
+
referenceEndDate: referenceEndDate,
|
|
58
|
+
callback: didPickDates,
|
|
59
|
+
});
|
|
60
|
+
} }),
|
|
61
|
+
React.createElement(Button, { content: "Date time picker", onClick: function () {
|
|
62
|
+
return NativeDatePicker.present({
|
|
63
|
+
mode: 'dateTime',
|
|
64
|
+
referenceStartDate: referenceStartDate,
|
|
65
|
+
referenceEndDate: referenceEndDate,
|
|
66
|
+
callback: didPickDates,
|
|
67
|
+
});
|
|
68
|
+
} }),
|
|
69
|
+
React.createElement(Button, { content: "Preselected date", onClick: function () {
|
|
70
|
+
return NativeDatePicker.present({
|
|
71
|
+
startDate: fixedDates.startDate,
|
|
72
|
+
referenceStartDate: referenceStartDate,
|
|
73
|
+
referenceEndDate: referenceEndDate,
|
|
74
|
+
callback: didPickDates,
|
|
75
|
+
});
|
|
76
|
+
} }),
|
|
77
|
+
React.createElement(Button, { content: "Date range (tabbed)", onClick: function () {
|
|
78
|
+
return NativeDatePicker.present({
|
|
79
|
+
mode: 'dateRange',
|
|
80
|
+
referenceStartDate: referenceStartDate,
|
|
81
|
+
referenceEndDate: referenceEndDate,
|
|
82
|
+
callback: didPickDates,
|
|
83
|
+
});
|
|
84
|
+
} }),
|
|
85
|
+
React.createElement(Button, { content: "Date range (tabbed) remembering last selection", onClick: function () {
|
|
86
|
+
return NativeDatePicker.present({
|
|
87
|
+
mode: 'dateRange',
|
|
88
|
+
startDate: startDate,
|
|
89
|
+
endDate: endDate,
|
|
90
|
+
referenceStartDate: referenceStartDate,
|
|
91
|
+
referenceEndDate: referenceEndDate,
|
|
92
|
+
callback: didPickDates,
|
|
93
|
+
});
|
|
94
|
+
} }),
|
|
95
|
+
React.createElement(Button, { content: "Date with custom titles", onClick: function () {
|
|
96
|
+
return NativeDatePicker.present(__assign(__assign(__assign(__assign({}, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
97
|
+
} }),
|
|
98
|
+
React.createElement(Button, { content: "Date time with custom titles", onClick: function () {
|
|
99
|
+
return NativeDatePicker.present(__assign(__assign(__assign(__assign({ mode: 'dateTime' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
100
|
+
} }),
|
|
58
101
|
React.createElement(Button, { content: "Date range with custom titles (paged)", onClick: function () {
|
|
59
|
-
return NativeDatePicker.present(__assign(__assign(__assign({ mode: 'dateRange', dateRangePresentation: 'paged' }, fixedDates), titles), { callback: didPickDates }));
|
|
102
|
+
return NativeDatePicker.present(__assign(__assign(__assign(__assign({ mode: 'dateRange', dateRangePresentation: 'paged' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
103
|
+
} }),
|
|
104
|
+
React.createElement(Button, { content: "Date range with custom titles (tabbed)", onClick: function () {
|
|
105
|
+
return NativeDatePicker.present(__assign(__assign(__assign(__assign({ mode: 'dateRange' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
106
|
+
} }),
|
|
107
|
+
React.createElement(Button, { content: "Date time range with custom titles (tabbed)", onClick: function () {
|
|
108
|
+
return NativeDatePicker.present(__assign(__assign(__assign(__assign({ mode: 'dateTimeRange' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
60
109
|
} }),
|
|
61
|
-
React.createElement(Button, { content: "Date range with custom titles (tabbed)", onClick: function () { return NativeDatePicker.present(__assign(__assign(__assign({ mode: 'dateRange' }, fixedDates), titles), { callback: didPickDates })); } }),
|
|
62
|
-
React.createElement(Button, { content: "Date time range with custom titles (tabbed)", onClick: function () { return NativeDatePicker.present(__assign(__assign(__assign({ mode: 'dateTimeRange' }, fixedDates), titles), { callback: didPickDates })); } }),
|
|
63
|
-
React.createElement(Text, { variant: "headerStandard" }, "Calendar configuration"),
|
|
64
110
|
React.createElement(View, { style: commonStyles.switch },
|
|
65
|
-
React.createElement(Text,
|
|
66
|
-
React.createElement(Switch, { value:
|
|
67
|
-
|
|
68
|
-
NativeDatePicker.setDefaultCalendarConfiguration({
|
|
69
|
-
referenceStartDate: value ? fixedDates.overrideReferenceStartDate : fixedDates.defaultReferenceStartDate,
|
|
70
|
-
referenceEndDate: value ? fixedDates.overrideReferenceEndDate : fixedDates.defaultReferenceEndDate,
|
|
71
|
-
});
|
|
111
|
+
React.createElement(Text, { variant: "headerStandard" }, "Custom calendar configuration"),
|
|
112
|
+
React.createElement(Switch, { value: customCalendarConfiguration, onValueChange: function (value) {
|
|
113
|
+
setCustomCalendarConfiguration(value);
|
|
72
114
|
} })),
|
|
73
115
|
React.createElement(Text, { variant: "subheaderStandard" },
|
|
74
|
-
"
|
|
75
|
-
|
|
116
|
+
"Reference start date: ",
|
|
117
|
+
customReferenceStartDate.toDateString()),
|
|
76
118
|
React.createElement(Text, { variant: "subheaderStandard" },
|
|
77
|
-
"
|
|
78
|
-
|
|
119
|
+
"Reference end date: ",
|
|
120
|
+
customReferenceEndDate.toDateString())));
|
|
79
121
|
};
|
|
80
122
|
var nativeDatePickerSections = [
|
|
81
123
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeDatePickerTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAC1F,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,EAAkB,IAAI,EAAe,MAAM,SAAS,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,gBAAgB,IAAI,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,IAAM,wBAAwB,GAA4B;;IAClD,IAAA,KAA4B,KAAK,CAAC,QAAQ,CAAO,IAAI,IAAI,EAAE,CAAC,EAA3D,SAAS,QAAA,EAAE,YAAY,QAAoC,CAAC;IAC7D,IAAA,KAAwB,KAAK,CAAC,QAAQ,CAAO,IAAI,CAAC,EAAjD,OAAO,QAAA,EAAE,UAAU,QAA8B,CAAC;IACnD,IAAA,
|
|
1
|
+
{"version":3,"file":"NativeDatePickerTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAC1F,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,EAAkB,IAAI,EAAe,MAAM,SAAS,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,gBAAgB,IAAI,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,IAAM,wBAAwB,GAA4B;;IAClD,IAAA,KAA4B,KAAK,CAAC,QAAQ,CAAO,IAAI,IAAI,EAAE,CAAC,EAA3D,SAAS,QAAA,EAAE,YAAY,QAAoC,CAAC;IAC7D,IAAA,KAAwB,KAAK,CAAC,QAAQ,CAAO,IAAI,CAAC,EAAjD,OAAO,QAAA,EAAE,UAAU,QAA8B,CAAC;IACnD,IAAA,KAAgE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAApF,2BAA2B,QAAA,EAAE,8BAA8B,QAAyB,CAAC;IAE5F,SAAS,YAAY,CAAC,eAAuB,EAAE,aAAqB;QAClE,YAAY,CAAC,gBAAgB,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC;QAC/D,UAAU,CAAC,gBAAgB,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC,CAAC;IAC7D,CAAC;IAED,IAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IAEzB,wGAAwG;IACxG,IAAM,UAAU,GAAG;QACjB,SAAS,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC/E,OAAO,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC;KAC/E,CAAC;IAEF,IAAM,wBAAwB,GAAG,KAAK,CAAC;IACvC,IAAM,sBAAsB,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;IACpG,IAAM,yBAAyB,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC1E,IAAM,uBAAuB,GAAG,IAAI,IAAI,CAAC,yBAAyB,CAAC,WAAW,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAE7F,IAAM,kBAAkB,GAAG,2BAA2B,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,yBAAyB,CAAC;IAC9G,IAAM,gBAAgB,GAAG,2BAA2B,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,uBAAuB,CAAC;IAExG,IAAM,MAAM,GAAG;QACb,UAAU,EAAE,aAAa;QACzB,YAAY,EAAE,gBAAgB;QAC9B,QAAQ,EAAE,WAAW;QACrB,QAAQ,EAAE,WAAW;QACrB,WAAW,EAAE,cAAc;QAC3B,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,YAAY;QACvB,YAAY,EAAE,eAAe;QAC7B,SAAS,EAAE,YAAY;QACvB,YAAY,EAAE,eAAe;KAC9B,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,IAAC,KAAK,EAAE,UAAU;QACtB,oBAAC,IAAI,IAAC,OAAO,EAAC,gBAAgB,+BAAgC;QAC9D,oBAAC,IAAI,IAAC,OAAO,EAAC,mBAAmB,IAC9B,SAAS,aAAT,SAAS;YAAT,SAAS,CAAE,QAAQ,EAAE;;YAAG,IAAI,CACxB;QAEP,oBAAC,IAAI,IAAC,OAAO,EAAC,gBAAgB,6BAA8B;QAC5D,oBAAC,IAAI,IAAC,OAAO,EAAC,mBAAmB,IAC9B,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,EAAE,mCAAI,KAAK;;YAAG,IAAI,CAC/B;QAEP,oBAAC,MAAM,IACL,OAAO,EAAC,aAAa,EACrB,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,CAAC;oBACvB,kBAAkB,EAAE,kBAAkB;oBACtC,gBAAgB,EAAE,gBAAgB;oBAClC,QAAQ,EAAE,YAAY;iBACvB,CAAC;YAJF,CAIE,GAEJ;QACF,oBAAC,MAAM,IACL,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,CAAC;oBACvB,IAAI,EAAE,UAAU;oBAChB,kBAAkB,EAAE,kBAAkB;oBACtC,gBAAgB,EAAE,gBAAgB;oBAClC,QAAQ,EAAE,YAAY;iBACvB,CAAC;YALF,CAKE,GAEJ;QACF,oBAAC,MAAM,IACL,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,CAAC;oBACvB,SAAS,EAAE,UAAU,CAAC,SAAS;oBAC/B,kBAAkB,EAAE,kBAAkB;oBACtC,gBAAgB,EAAE,gBAAgB;oBAClC,QAAQ,EAAE,YAAY;iBACvB,CAAC;YALF,CAKE,GAEJ;QACF,oBAAC,MAAM,IACL,OAAO,EAAC,qBAAqB,EAC7B,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,CAAC;oBACvB,IAAI,EAAE,WAAW;oBACjB,kBAAkB,EAAE,kBAAkB;oBACtC,gBAAgB,EAAE,gBAAgB;oBAClC,QAAQ,EAAE,YAAY;iBACvB,CAAC;YALF,CAKE,GAEJ;QACF,oBAAC,MAAM,IACL,OAAO,EAAC,gDAAgD,EACxD,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,CAAC;oBACvB,IAAI,EAAE,WAAW;oBACjB,SAAS,EAAE,SAAS;oBACpB,OAAO,EAAE,OAAO;oBAChB,kBAAkB,EAAE,kBAAkB;oBACtC,gBAAgB,EAAE,gBAAgB;oBAClC,QAAQ,EAAE,YAAY;iBACvB,CAAC;YAPF,CAOE,GAEJ;QAGF,oBAAC,MAAM,IACL,OAAO,EAAC,yBAAyB,EACjC,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,yCACnB,UAAU,KACb,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,KAC/B,MAAM,KACT,QAAQ,EAAE,YAAY,IACtB;YANF,CAME,GAEJ;QAIF,oBAAC,MAAM,IACL,OAAO,EAAC,8BAA8B,EACtC,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,uCACtB,IAAI,EAAE,UAAU,IACb,UAAU,KACb,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,KAC/B,MAAM,KACT,QAAQ,EAAE,YAAY,IACtB;YAPF,CAOE,GAEJ;QAIF,oBAAC,MAAM,IACL,OAAO,EAAC,uCAAuC,EAC/C,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,uCACtB,IAAI,EAAE,WAAW,EACjB,qBAAqB,EAAE,OAAO,IAC3B,UAAU,KACb,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,KAC/B,MAAM,KACT,QAAQ,EAAE,YAAY,IACtB;YARF,CAQE,GAEJ;QAGF,oBAAC,MAAM,IACL,OAAO,EAAC,wCAAwC,EAChD,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,uCACtB,IAAI,EAAE,WAAW,IACd,UAAU,KACb,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,KAC/B,MAAM,KACT,QAAQ,EAAE,YAAY,IACtB;YAPF,CAOE,GAEJ;QAqBF,oBAAC,MAAM,IACL,OAAO,EAAC,6CAA6C,EACrD,OAAO,EAAE;gBACP,OAAA,gBAAgB,CAAC,OAAO,uCACtB,IAAI,EAAE,eAAe,IAClB,UAAU,KACb,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,KAC/B,MAAM,KACT,QAAQ,EAAE,YAAY,IACtB;YAPF,CAOE,GAEJ;QAEF,oBAAC,IAAI,IAAC,KAAK,EAAE,YAAY,CAAC,MAAM;YAC9B,oBAAC,IAAI,IAAC,OAAO,EAAC,gBAAgB,oCAAqC;YACnE,oBAAC,MAAM,IACL,KAAK,EAAE,2BAA2B,EAClC,aAAa,EAAE,UAAC,KAAK;oBACnB,8BAA8B,CAAC,KAAK,CAAC,CAAC;gBACxC,CAAC,GACD,CACG;QACP,oBAAC,IAAI,IAAC,OAAO,EAAC,mBAAmB;;YAAwB,wBAAwB,CAAC,YAAY,EAAE,CAAQ;QACxG,oBAAC,IAAI,IAAC,OAAO,EAAC,mBAAmB;;YAAsB,sBAAsB,CAAC,YAAY,EAAE,CAAQ,CAC9F,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,wBAAwB,GAAkB;IAC9C;QACE,IAAI,EAAE,oBAAoB;QAC1B,MAAM,EAAE,yBAAyB;QACjC,SAAS,EAAE,wBAAwB;KACpC;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,oBAAoB,GAA4B;IAC3D,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,KAAK;QAClB,SAAS,EAAE,KAAK;QAChB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,KAAK;QAClB,aAAa,EAAE,KAAK;KACrB,CAAC;IAEF,IAAM,WAAW,GAAG,oGAAoG,CAAC;IAEzH,OAAO,oBAAC,IAAI,IAAC,IAAI,EAAC,yBAAyB,EAAC,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,wBAAwB,EAAE,MAAM,EAAE,MAAM,GAAS,CAAC;AACpI,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuD/B,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,iBAYpC,CAAC"}
|
|
@@ -1,67 +1,17 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Notification } from '@fluentui-react-native/notification';
|
|
3
3
|
import { Test } from '../Test';
|
|
4
|
-
var NotificationVariants = ['primary', 'neutral', 'danger', 'warning'];
|
|
5
|
-
var Notification = function (props) {
|
|
6
|
-
var variant = props.variant;
|
|
7
|
-
var startText = props.startText;
|
|
8
|
-
var endText = props.endText;
|
|
9
|
-
var containerBackgroundColor = 'skyblue';
|
|
10
|
-
var foregroundColor = 'black';
|
|
11
|
-
switch (variant) {
|
|
12
|
-
case 'primary':
|
|
13
|
-
containerBackgroundColor = 'skyblue';
|
|
14
|
-
break;
|
|
15
|
-
case 'neutral':
|
|
16
|
-
containerBackgroundColor = 'lightgrey';
|
|
17
|
-
break;
|
|
18
|
-
case 'danger':
|
|
19
|
-
containerBackgroundColor = 'pink';
|
|
20
|
-
foregroundColor = 'maroon';
|
|
21
|
-
break;
|
|
22
|
-
case 'warning':
|
|
23
|
-
containerBackgroundColor = 'lightyellow';
|
|
24
|
-
foregroundColor = 'brown';
|
|
25
|
-
break;
|
|
26
|
-
}
|
|
27
|
-
var styles = StyleSheet.create({
|
|
28
|
-
container: {
|
|
29
|
-
borderRadius: 12,
|
|
30
|
-
backgroundColor: containerBackgroundColor,
|
|
31
|
-
flex: 1,
|
|
32
|
-
flexDirection: 'row',
|
|
33
|
-
justifyContent: 'space-between',
|
|
34
|
-
alignItems: 'center',
|
|
35
|
-
padding: 16,
|
|
36
|
-
},
|
|
37
|
-
start: {
|
|
38
|
-
fontSize: 16,
|
|
39
|
-
color: foregroundColor,
|
|
40
|
-
flex: 1,
|
|
41
|
-
flexGrow: 1,
|
|
42
|
-
},
|
|
43
|
-
end: {
|
|
44
|
-
fontSize: 16,
|
|
45
|
-
fontWeight: '500',
|
|
46
|
-
color: foregroundColor,
|
|
47
|
-
marginLeft: 34,
|
|
48
|
-
},
|
|
49
|
-
});
|
|
50
|
-
return (React.createElement(View, { style: styles.container },
|
|
51
|
-
React.createElement(Text, { style: styles.start }, startText),
|
|
52
|
-
React.createElement(Text, { style: styles.end }, endText)));
|
|
53
|
-
};
|
|
54
4
|
var PrimaryTest = function () {
|
|
55
|
-
return React.createElement(Notification, { variant: 'primary',
|
|
5
|
+
return (React.createElement(Notification, { variant: 'primary', endText: "Undo" }, "Mail Archived"));
|
|
56
6
|
};
|
|
57
7
|
var NeutralTest = function () {
|
|
58
|
-
return React.createElement(Notification, { variant: 'neutral',
|
|
8
|
+
return (React.createElement(Notification, { variant: 'neutral', endText: "Sign in" }, "Some items require you to sign in to view them"));
|
|
59
9
|
};
|
|
60
10
|
var DangerTest = function () {
|
|
61
|
-
return React.createElement(Notification, { variant: 'danger',
|
|
11
|
+
return (React.createElement(Notification, { variant: 'danger', endText: "Retry" }, "There was a problem, and your recent changes may not have saved"));
|
|
62
12
|
};
|
|
63
13
|
var WarningTest = function () {
|
|
64
|
-
return React.createElement(Notification, { variant: 'warning',
|
|
14
|
+
return (React.createElement(Notification, { variant: 'warning', endText: "X" }, "Read Only"));
|
|
65
15
|
};
|
|
66
16
|
var notificationSections = [
|
|
67
17
|
{
|
|
@@ -85,7 +35,7 @@ export var NotificationTest = function () {
|
|
|
85
35
|
var status = {
|
|
86
36
|
win32Status: 'Backlog',
|
|
87
37
|
uwpStatus: 'Backlog',
|
|
88
|
-
iosStatus: '
|
|
38
|
+
iosStatus: 'Experimental',
|
|
89
39
|
macosStatus: 'Backlog',
|
|
90
40
|
androidStatus: 'Backlog',
|
|
91
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"NotificationTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,IAAI,EAA+B,MAAM,SAAS,CAAC;AAE5D,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,MAAM,oBAEjC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,SAAS,qDAEpC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,UAAU,GAA4B;IAC1C,OAAO,CACL,oBAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAC,OAAO,sEAEjC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,GAAG,gBAE9B,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,oBAAoB,GAAkB;IAC1C;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;IACD;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;IACD;QACE,IAAI,EAAE,QAAQ;QACd,SAAS,EAAE,UAAU;KACtB;IACD;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAA4B;IACvD,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,SAAS;QACtB,SAAS,EAAE,SAAS;QACpB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GAAG,gCAAgC,CAAC;IAErD,OAAO,oBAAC,IAAI,IAAC,IAAI,EAAC,mBAAmB,EAAC,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,oBAAoB,EAAE,MAAM,EAAE,MAAM,GAAS,CAAC;AAC1H,CAAC,CAAC"}
|
package/lib-commonjs/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeDatePickerTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"NativeDatePickerTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAwO/B,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,iBAYxC,CAAC"}
|
|
@@ -15,20 +15,23 @@ var NativeDatePickerMainTest = function () {
|
|
|
15
15
|
var _a;
|
|
16
16
|
var _b = React.useState(new Date()), startDate = _b[0], setStartDate = _b[1];
|
|
17
17
|
var _c = React.useState(null), endDate = _c[0], setEndDate = _c[1];
|
|
18
|
-
var _d = React.useState(false),
|
|
18
|
+
var _d = React.useState(false), customCalendarConfiguration = _d[0], setCustomCalendarConfiguration = _d[1];
|
|
19
19
|
function didPickDates(pickedStartDate, pickedEndDate) {
|
|
20
20
|
setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(pickedStartDate));
|
|
21
21
|
setEndDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(pickedEndDate));
|
|
22
22
|
}
|
|
23
|
+
var today = new Date();
|
|
23
24
|
// Here we set up some common options and use the spread operator to copy them repeatedly into examples.
|
|
24
25
|
var fixedDates = {
|
|
25
|
-
startDate:
|
|
26
|
-
endDate:
|
|
27
|
-
overrideReferenceStartDate: experimental_native_date_picker_1.NativeDatePicker.parseISOString('1999-01-01T00:00:00.000Z'),
|
|
28
|
-
overrideReferenceEndDate: experimental_native_date_picker_1.NativeDatePicker.parseISOString('2000-01-01T00:00:00.000Z'),
|
|
29
|
-
defaultReferenceStartDate: new Date(new Date().getFullYear() - 3, 1, 1),
|
|
30
|
-
defaultReferenceEndDate: new Date(new Date().getFullYear() + 7, 1, 1),
|
|
26
|
+
startDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 7),
|
|
27
|
+
endDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 14),
|
|
31
28
|
};
|
|
29
|
+
var customReferenceStartDate = today;
|
|
30
|
+
var customReferenceEndDate = new Date(today.getFullYear(), today.getMonth() + 1, today.getDate());
|
|
31
|
+
var defaultReferenceStartDate = new Date(today.getFullYear() - 3, 1, 1);
|
|
32
|
+
var defaultReferenceEndDate = new Date(defaultReferenceStartDate.getFullYear() + 10, 1, 1);
|
|
33
|
+
var referenceStartDate = customCalendarConfiguration ? customReferenceStartDate : defaultReferenceStartDate;
|
|
34
|
+
var referenceEndDate = customCalendarConfiguration ? customReferenceEndDate : defaultReferenceEndDate;
|
|
32
35
|
var titles = {
|
|
33
36
|
startTitle: 'Start Title',
|
|
34
37
|
startSubitle: 'Start Subtitle',
|
|
@@ -51,34 +54,73 @@ var NativeDatePickerMainTest = function () {
|
|
|
51
54
|
React.createElement(react_native_2.Text, { variant: "subheaderStandard" }, (_a = endDate === null || endDate === void 0 ? void 0 : endDate.toString()) !== null && _a !== void 0 ? _a : 'N/A',
|
|
52
55
|
" ",
|
|
53
56
|
'\n'),
|
|
54
|
-
React.createElement(button_1.Button, { content: "Date picker", onClick: function () {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
57
|
+
React.createElement(button_1.Button, { content: "Date picker", onClick: function () {
|
|
58
|
+
return experimental_native_date_picker_1.NativeDatePicker.present({
|
|
59
|
+
referenceStartDate: referenceStartDate,
|
|
60
|
+
referenceEndDate: referenceEndDate,
|
|
61
|
+
callback: didPickDates,
|
|
62
|
+
});
|
|
63
|
+
} }),
|
|
64
|
+
React.createElement(button_1.Button, { content: "Date time picker", onClick: function () {
|
|
65
|
+
return experimental_native_date_picker_1.NativeDatePicker.present({
|
|
66
|
+
mode: 'dateTime',
|
|
67
|
+
referenceStartDate: referenceStartDate,
|
|
68
|
+
referenceEndDate: referenceEndDate,
|
|
69
|
+
callback: didPickDates,
|
|
70
|
+
});
|
|
71
|
+
} }),
|
|
72
|
+
React.createElement(button_1.Button, { content: "Preselected date", onClick: function () {
|
|
73
|
+
return experimental_native_date_picker_1.NativeDatePicker.present({
|
|
74
|
+
startDate: fixedDates.startDate,
|
|
75
|
+
referenceStartDate: referenceStartDate,
|
|
76
|
+
referenceEndDate: referenceEndDate,
|
|
77
|
+
callback: didPickDates,
|
|
78
|
+
});
|
|
79
|
+
} }),
|
|
80
|
+
React.createElement(button_1.Button, { content: "Date range (tabbed)", onClick: function () {
|
|
81
|
+
return experimental_native_date_picker_1.NativeDatePicker.present({
|
|
82
|
+
mode: 'dateRange',
|
|
83
|
+
referenceStartDate: referenceStartDate,
|
|
84
|
+
referenceEndDate: referenceEndDate,
|
|
85
|
+
callback: didPickDates,
|
|
86
|
+
});
|
|
87
|
+
} }),
|
|
88
|
+
React.createElement(button_1.Button, { content: "Date range (tabbed) remembering last selection", onClick: function () {
|
|
89
|
+
return experimental_native_date_picker_1.NativeDatePicker.present({
|
|
90
|
+
mode: 'dateRange',
|
|
91
|
+
startDate: startDate,
|
|
92
|
+
endDate: endDate,
|
|
93
|
+
referenceStartDate: referenceStartDate,
|
|
94
|
+
referenceEndDate: referenceEndDate,
|
|
95
|
+
callback: didPickDates,
|
|
96
|
+
});
|
|
97
|
+
} }),
|
|
98
|
+
React.createElement(button_1.Button, { content: "Date with custom titles", onClick: function () {
|
|
99
|
+
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
100
|
+
} }),
|
|
101
|
+
React.createElement(button_1.Button, { content: "Date time with custom titles", onClick: function () {
|
|
102
|
+
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateTime' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
103
|
+
} }),
|
|
61
104
|
React.createElement(button_1.Button, { content: "Date range with custom titles (paged)", onClick: function () {
|
|
62
|
-
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateRange', dateRangePresentation: 'paged' }, fixedDates), titles), { callback: didPickDates }));
|
|
105
|
+
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateRange', dateRangePresentation: 'paged' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
106
|
+
} }),
|
|
107
|
+
React.createElement(button_1.Button, { content: "Date range with custom titles (tabbed)", onClick: function () {
|
|
108
|
+
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateRange' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
109
|
+
} }),
|
|
110
|
+
React.createElement(button_1.Button, { content: "Date time range with custom titles (tabbed)", onClick: function () {
|
|
111
|
+
return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateTimeRange' }, fixedDates), { referenceStartDate: referenceStartDate, referenceEndDate: referenceEndDate }), titles), { callback: didPickDates }));
|
|
63
112
|
} }),
|
|
64
|
-
React.createElement(button_1.Button, { content: "Date range with custom titles (tabbed)", onClick: function () { return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateRange' }, fixedDates), titles), { callback: didPickDates })); } }),
|
|
65
|
-
React.createElement(button_1.Button, { content: "Date time range with custom titles (tabbed)", onClick: function () { return experimental_native_date_picker_1.NativeDatePicker.present((0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ mode: 'dateTimeRange' }, fixedDates), titles), { callback: didPickDates })); } }),
|
|
66
|
-
React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Calendar configuration"),
|
|
67
113
|
React.createElement(react_native_1.View, { style: styles_1.commonTestStyles.switch },
|
|
68
|
-
React.createElement(react_native_2.Text,
|
|
69
|
-
React.createElement(react_native_1.Switch, { value:
|
|
70
|
-
|
|
71
|
-
experimental_native_date_picker_1.NativeDatePicker.setDefaultCalendarConfiguration({
|
|
72
|
-
referenceStartDate: value ? fixedDates.overrideReferenceStartDate : fixedDates.defaultReferenceStartDate,
|
|
73
|
-
referenceEndDate: value ? fixedDates.overrideReferenceEndDate : fixedDates.defaultReferenceEndDate,
|
|
74
|
-
});
|
|
114
|
+
React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Custom calendar configuration"),
|
|
115
|
+
React.createElement(react_native_1.Switch, { value: customCalendarConfiguration, onValueChange: function (value) {
|
|
116
|
+
setCustomCalendarConfiguration(value);
|
|
75
117
|
} })),
|
|
76
118
|
React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
|
|
77
|
-
"
|
|
78
|
-
|
|
119
|
+
"Reference start date: ",
|
|
120
|
+
customReferenceStartDate.toDateString()),
|
|
79
121
|
React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
|
|
80
|
-
"
|
|
81
|
-
|
|
122
|
+
"Reference end date: ",
|
|
123
|
+
customReferenceEndDate.toDateString())));
|
|
82
124
|
};
|
|
83
125
|
var nativeDatePickerSections = [
|
|
84
126
|
{
|
package/lib-commonjs/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeDatePickerTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":";;;;AAAA,wDAAuD;AACvD,0GAA0F;AAC1F,mCAAqD;AACrD,gCAA4D;AAC5D,wDAA+B;AAC/B,sDAAqD;AACrD,2CAAgF;AAChF,6CAA4C;AAC5C,uDAA8C;AAE9C,IAAM,wBAAwB,GAA4B;;IAClD,IAAA,KAA4B,KAAK,CAAC,QAAQ,CAAO,IAAI,IAAI,EAAE,CAAC,EAA3D,SAAS,QAAA,EAAE,YAAY,QAAoC,CAAC;IAC7D,IAAA,KAAwB,KAAK,CAAC,QAAQ,CAAO,IAAI,CAAC,EAAjD,OAAO,QAAA,EAAE,UAAU,QAA8B,CAAC;IACnD,IAAA,
|
|
1
|
+
{"version":3,"file":"NativeDatePickerTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/NativeDatePicker/NativeDatePickerTest.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationTest.d.ts","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuD/B,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,iBAYpC,CAAC"}
|
|
@@ -3,69 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.NotificationTest = void 0;
|
|
4
4
|
var tslib_1 = require("tslib");
|
|
5
5
|
var React = (0, tslib_1.__importStar)(require("react"));
|
|
6
|
-
var
|
|
6
|
+
var notification_1 = require("@fluentui-react-native/notification");
|
|
7
7
|
var Test_1 = require("../Test");
|
|
8
|
-
var NotificationVariants = ['primary', 'neutral', 'danger', 'warning'];
|
|
9
|
-
var Notification = function (props) {
|
|
10
|
-
var variant = props.variant;
|
|
11
|
-
var startText = props.startText;
|
|
12
|
-
var endText = props.endText;
|
|
13
|
-
var containerBackgroundColor = 'skyblue';
|
|
14
|
-
var foregroundColor = 'black';
|
|
15
|
-
switch (variant) {
|
|
16
|
-
case 'primary':
|
|
17
|
-
containerBackgroundColor = 'skyblue';
|
|
18
|
-
break;
|
|
19
|
-
case 'neutral':
|
|
20
|
-
containerBackgroundColor = 'lightgrey';
|
|
21
|
-
break;
|
|
22
|
-
case 'danger':
|
|
23
|
-
containerBackgroundColor = 'pink';
|
|
24
|
-
foregroundColor = 'maroon';
|
|
25
|
-
break;
|
|
26
|
-
case 'warning':
|
|
27
|
-
containerBackgroundColor = 'lightyellow';
|
|
28
|
-
foregroundColor = 'brown';
|
|
29
|
-
break;
|
|
30
|
-
}
|
|
31
|
-
var styles = react_native_1.StyleSheet.create({
|
|
32
|
-
container: {
|
|
33
|
-
borderRadius: 12,
|
|
34
|
-
backgroundColor: containerBackgroundColor,
|
|
35
|
-
flex: 1,
|
|
36
|
-
flexDirection: 'row',
|
|
37
|
-
justifyContent: 'space-between',
|
|
38
|
-
alignItems: 'center',
|
|
39
|
-
padding: 16,
|
|
40
|
-
},
|
|
41
|
-
start: {
|
|
42
|
-
fontSize: 16,
|
|
43
|
-
color: foregroundColor,
|
|
44
|
-
flex: 1,
|
|
45
|
-
flexGrow: 1,
|
|
46
|
-
},
|
|
47
|
-
end: {
|
|
48
|
-
fontSize: 16,
|
|
49
|
-
fontWeight: '500',
|
|
50
|
-
color: foregroundColor,
|
|
51
|
-
marginLeft: 34,
|
|
52
|
-
},
|
|
53
|
-
});
|
|
54
|
-
return (React.createElement(react_native_1.View, { style: styles.container },
|
|
55
|
-
React.createElement(react_native_1.Text, { style: styles.start }, startText),
|
|
56
|
-
React.createElement(react_native_1.Text, { style: styles.end }, endText)));
|
|
57
|
-
};
|
|
58
8
|
var PrimaryTest = function () {
|
|
59
|
-
return React.createElement(Notification, { variant: 'primary',
|
|
9
|
+
return (React.createElement(notification_1.Notification, { variant: 'primary', endText: "Undo" }, "Mail Archived"));
|
|
60
10
|
};
|
|
61
11
|
var NeutralTest = function () {
|
|
62
|
-
return React.createElement(Notification, { variant: 'neutral',
|
|
12
|
+
return (React.createElement(notification_1.Notification, { variant: 'neutral', endText: "Sign in" }, "Some items require you to sign in to view them"));
|
|
63
13
|
};
|
|
64
14
|
var DangerTest = function () {
|
|
65
|
-
return React.createElement(Notification, { variant: 'danger',
|
|
15
|
+
return (React.createElement(notification_1.Notification, { variant: 'danger', endText: "Retry" }, "There was a problem, and your recent changes may not have saved"));
|
|
66
16
|
};
|
|
67
17
|
var WarningTest = function () {
|
|
68
|
-
return React.createElement(Notification, { variant: 'warning',
|
|
18
|
+
return (React.createElement(notification_1.Notification, { variant: 'warning', endText: "X" }, "Read Only"));
|
|
69
19
|
};
|
|
70
20
|
var notificationSections = [
|
|
71
21
|
{
|
|
@@ -89,7 +39,7 @@ var NotificationTest = function () {
|
|
|
89
39
|
var status = {
|
|
90
40
|
win32Status: 'Backlog',
|
|
91
41
|
uwpStatus: 'Backlog',
|
|
92
|
-
iosStatus: '
|
|
42
|
+
iosStatus: 'Experimental',
|
|
93
43
|
macosStatus: 'Backlog',
|
|
94
44
|
androidStatus: 'Backlog',
|
|
95
45
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAC/B,
|
|
1
|
+
{"version":3,"file":"NotificationTest.js","sourceRoot":"","sources":["../../../../src/FluentTester/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAC/B,oEAAmE;AACnE,gCAA4D;AAE5D,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,2BAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,MAAM,oBAEjC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,2BAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,SAAS,qDAEpC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,UAAU,GAA4B;IAC1C,OAAO,CACL,oBAAC,2BAAY,IAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAC,OAAO,sEAEjC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,WAAW,GAA4B;IAC3C,OAAO,CACL,oBAAC,2BAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAC,GAAG,gBAE9B,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,oBAAoB,GAAkB;IAC1C;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;IACD;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;IACD;QACE,IAAI,EAAE,QAAQ;QACd,SAAS,EAAE,UAAU;KACtB;IACD;QACE,IAAI,EAAE,SAAS;QACf,SAAS,EAAE,WAAW;KACvB;CACF,CAAC;AAEK,IAAM,gBAAgB,GAA4B;IACvD,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,SAAS;QACtB,SAAS,EAAE,SAAS;QACpB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GAAG,gCAAgC,CAAC;IAErD,OAAO,oBAAC,WAAI,IAAC,IAAI,EAAC,mBAAmB,EAAC,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,oBAAoB,EAAE,MAAM,EAAE,MAAM,GAAS,CAAC;AAC1H,CAAC,CAAC;AAZW,QAAA,gBAAgB,oBAY3B"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/tester",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.68.0",
|
|
4
4
|
"description": "A test app to test FluentUI React Native Components during development",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Microsoft <fluentuinativeowners@microsoft.com>",
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
"@fluentui-react-native/button": ">=0.22.29 <1.0.0",
|
|
33
33
|
"@fluentui-react-native/default-theme": ">=0.13.0 <1.0.0",
|
|
34
34
|
"@fluentui-react-native/experimental-activity-indicator": ">=0.5.29 <1.0.0",
|
|
35
|
-
"@fluentui-react-native/experimental-avatar": ">=0.15.
|
|
35
|
+
"@fluentui-react-native/experimental-avatar": ">=0.15.1 <1.0.0",
|
|
36
36
|
"@fluentui-react-native/experimental-button": "0.15.30",
|
|
37
37
|
"@fluentui-react-native/experimental-checkbox": "0.11.14",
|
|
38
38
|
"@fluentui-react-native/experimental-drawer": ">=0.1.13 <1.0.0",
|
|
39
|
-
"@fluentui-react-native/experimental-native-date-picker": ">=0.
|
|
39
|
+
"@fluentui-react-native/experimental-native-date-picker": ">=0.5.0 <1.0.0",
|
|
40
40
|
"@fluentui-react-native/experimental-expander": "0.3.33",
|
|
41
41
|
"@fluentui-react-native/experimental-menu-button": ">=0.3.49 <1.0.0",
|
|
42
42
|
"@fluentui-react-native/experimental-shimmer": "0.6.33",
|
|
@@ -45,7 +45,8 @@
|
|
|
45
45
|
"@fluentui-react-native/framework": ">=0.7.30 <1.0.0",
|
|
46
46
|
"@fluentui-react-native/icon": "0.12.1",
|
|
47
47
|
"@fluentui-react-native/interactive-hooks": ">=0.16.3 <1.0.0",
|
|
48
|
-
"@fluentui-react-native/menu": ">=0.15.
|
|
48
|
+
"@fluentui-react-native/menu": ">=0.15.4 <1.0.0",
|
|
49
|
+
"@fluentui-react-native/notification": "0.1.0",
|
|
49
50
|
"@fluentui-react-native/stack": ">=0.6.29 <1.0.0",
|
|
50
51
|
"@fluentui-react-native/theme": ">=0.6.11 <1.0.0",
|
|
51
52
|
"@fluentui-react-native/theme-types": ">=0.17.0 <1.0.0",
|
|
@@ -11,22 +11,29 @@ import { Text } from '@fluentui/react-native';
|
|
|
11
11
|
const NativeDatePickerMainTest: React.FunctionComponent = () => {
|
|
12
12
|
const [startDate, setStartDate] = React.useState<Date>(new Date());
|
|
13
13
|
const [endDate, setEndDate] = React.useState<Date>(null);
|
|
14
|
-
const [
|
|
14
|
+
const [customCalendarConfiguration, setCustomCalendarConfiguration] = React.useState(false);
|
|
15
15
|
|
|
16
16
|
function didPickDates(pickedStartDate: string, pickedEndDate: string) {
|
|
17
17
|
setStartDate(NativeDatePicker.parseISOString(pickedStartDate));
|
|
18
18
|
setEndDate(NativeDatePicker.parseISOString(pickedEndDate));
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
+
const today = new Date();
|
|
22
|
+
|
|
21
23
|
// Here we set up some common options and use the spread operator to copy them repeatedly into examples.
|
|
22
24
|
const fixedDates = {
|
|
23
|
-
startDate:
|
|
24
|
-
endDate:
|
|
25
|
-
overrideReferenceStartDate: NativeDatePicker.parseISOString('1999-01-01T00:00:00.000Z'),
|
|
26
|
-
overrideReferenceEndDate: NativeDatePicker.parseISOString('2000-01-01T00:00:00.000Z'),
|
|
27
|
-
defaultReferenceStartDate: new Date(new Date().getFullYear() - 3, 1, 1),
|
|
28
|
-
defaultReferenceEndDate: new Date(new Date().getFullYear() + 7, 1, 1),
|
|
25
|
+
startDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 7),
|
|
26
|
+
endDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 14),
|
|
29
27
|
};
|
|
28
|
+
|
|
29
|
+
const customReferenceStartDate = today;
|
|
30
|
+
const customReferenceEndDate = new Date(today.getFullYear(), today.getMonth() + 1, today.getDate());
|
|
31
|
+
const defaultReferenceStartDate = new Date(today.getFullYear() - 3, 1, 1);
|
|
32
|
+
const defaultReferenceEndDate = new Date(defaultReferenceStartDate.getFullYear() + 10, 1, 1);
|
|
33
|
+
|
|
34
|
+
const referenceStartDate = customCalendarConfiguration ? customReferenceStartDate : defaultReferenceStartDate;
|
|
35
|
+
const referenceEndDate = customCalendarConfiguration ? customReferenceEndDate : defaultReferenceEndDate;
|
|
36
|
+
|
|
30
37
|
const titles = {
|
|
31
38
|
startTitle: 'Start Title',
|
|
32
39
|
startSubitle: 'Start Subtitle',
|
|
@@ -52,29 +59,91 @@ const NativeDatePickerMainTest: React.FunctionComponent = () => {
|
|
|
52
59
|
{endDate?.toString() ?? 'N/A'} {'\n'}
|
|
53
60
|
</Text>
|
|
54
61
|
|
|
55
|
-
<Button
|
|
56
|
-
|
|
62
|
+
<Button
|
|
63
|
+
content="Date picker"
|
|
64
|
+
onClick={() =>
|
|
65
|
+
NativeDatePicker.present({
|
|
66
|
+
referenceStartDate: referenceStartDate,
|
|
67
|
+
referenceEndDate: referenceEndDate,
|
|
68
|
+
callback: didPickDates,
|
|
69
|
+
})
|
|
70
|
+
}
|
|
71
|
+
/>
|
|
72
|
+
<Button
|
|
73
|
+
content="Date time picker"
|
|
74
|
+
onClick={() =>
|
|
75
|
+
NativeDatePicker.present({
|
|
76
|
+
mode: 'dateTime',
|
|
77
|
+
referenceStartDate: referenceStartDate,
|
|
78
|
+
referenceEndDate: referenceEndDate,
|
|
79
|
+
callback: didPickDates,
|
|
80
|
+
})
|
|
81
|
+
}
|
|
82
|
+
/>
|
|
57
83
|
<Button
|
|
58
84
|
content="Preselected date"
|
|
59
|
-
onClick={() =>
|
|
85
|
+
onClick={() =>
|
|
86
|
+
NativeDatePicker.present({
|
|
87
|
+
startDate: fixedDates.startDate,
|
|
88
|
+
referenceStartDate: referenceStartDate,
|
|
89
|
+
referenceEndDate: referenceEndDate,
|
|
90
|
+
callback: didPickDates,
|
|
91
|
+
})
|
|
92
|
+
}
|
|
93
|
+
/>
|
|
94
|
+
<Button
|
|
95
|
+
content="Date range (tabbed)"
|
|
96
|
+
onClick={() =>
|
|
97
|
+
NativeDatePicker.present({
|
|
98
|
+
mode: 'dateRange',
|
|
99
|
+
referenceStartDate: referenceStartDate,
|
|
100
|
+
referenceEndDate: referenceEndDate,
|
|
101
|
+
callback: didPickDates,
|
|
102
|
+
})
|
|
103
|
+
}
|
|
60
104
|
/>
|
|
61
|
-
<Button content="Date range (tabbed)" onClick={() => NativeDatePicker.present({ mode: 'dateRange', callback: didPickDates })} />
|
|
62
105
|
<Button
|
|
63
106
|
content="Date range (tabbed) remembering last selection"
|
|
64
|
-
onClick={() =>
|
|
107
|
+
onClick={() =>
|
|
108
|
+
NativeDatePicker.present({
|
|
109
|
+
mode: 'dateRange',
|
|
110
|
+
startDate: startDate,
|
|
111
|
+
endDate: endDate,
|
|
112
|
+
referenceStartDate: referenceStartDate,
|
|
113
|
+
referenceEndDate: referenceEndDate,
|
|
114
|
+
callback: didPickDates,
|
|
115
|
+
})
|
|
116
|
+
}
|
|
65
117
|
/>
|
|
66
118
|
|
|
67
119
|
{/* Shows 'Date Title' and 'Date Subtitle' only. Other titles are ignored. */}
|
|
68
120
|
<Button
|
|
69
121
|
content="Date with custom titles"
|
|
70
|
-
onClick={() =>
|
|
122
|
+
onClick={() =>
|
|
123
|
+
NativeDatePicker.present({
|
|
124
|
+
...fixedDates,
|
|
125
|
+
referenceStartDate: referenceStartDate,
|
|
126
|
+
referenceEndDate: referenceEndDate,
|
|
127
|
+
...titles,
|
|
128
|
+
callback: didPickDates,
|
|
129
|
+
})
|
|
130
|
+
}
|
|
71
131
|
/>
|
|
72
132
|
|
|
73
133
|
{/* Shows 'Date Title' and 'Date Subtitle' on the first page;
|
|
74
134
|
shows 'Time Title' and 'Time Subtitle' on the second page. */}
|
|
75
135
|
<Button
|
|
76
136
|
content="Date time with custom titles"
|
|
77
|
-
onClick={() =>
|
|
137
|
+
onClick={() =>
|
|
138
|
+
NativeDatePicker.present({
|
|
139
|
+
mode: 'dateTime',
|
|
140
|
+
...fixedDates,
|
|
141
|
+
referenceStartDate: referenceStartDate,
|
|
142
|
+
referenceEndDate: referenceEndDate,
|
|
143
|
+
...titles,
|
|
144
|
+
callback: didPickDates,
|
|
145
|
+
})
|
|
146
|
+
}
|
|
78
147
|
/>
|
|
79
148
|
|
|
80
149
|
{/* Shows 'Start Title' and 'Start Subtitle' on the first page;
|
|
@@ -82,52 +151,77 @@ const NativeDatePickerMainTest: React.FunctionComponent = () => {
|
|
|
82
151
|
<Button
|
|
83
152
|
content="Date range with custom titles (paged)"
|
|
84
153
|
onClick={() =>
|
|
85
|
-
NativeDatePicker.present({
|
|
154
|
+
NativeDatePicker.present({
|
|
155
|
+
mode: 'dateRange',
|
|
156
|
+
dateRangePresentation: 'paged',
|
|
157
|
+
...fixedDates,
|
|
158
|
+
referenceStartDate: referenceStartDate,
|
|
159
|
+
referenceEndDate: referenceEndDate,
|
|
160
|
+
...titles,
|
|
161
|
+
callback: didPickDates,
|
|
162
|
+
})
|
|
86
163
|
}
|
|
87
164
|
/>
|
|
88
165
|
|
|
89
166
|
{/* Shows 'Date Title', 'Date Subtitle', 'Start Tab' and 'End Tab'. */}
|
|
90
167
|
<Button
|
|
91
168
|
content="Date range with custom titles (tabbed)"
|
|
92
|
-
onClick={() =>
|
|
169
|
+
onClick={() =>
|
|
170
|
+
NativeDatePicker.present({
|
|
171
|
+
mode: 'dateRange',
|
|
172
|
+
...fixedDates,
|
|
173
|
+
referenceStartDate: referenceStartDate,
|
|
174
|
+
referenceEndDate: referenceEndDate,
|
|
175
|
+
...titles,
|
|
176
|
+
callback: didPickDates,
|
|
177
|
+
})
|
|
178
|
+
}
|
|
93
179
|
/>
|
|
94
180
|
|
|
95
|
-
{/* WARNING: The paged
|
|
181
|
+
{/* WARNING: The paged presentation mode of the date time range picker is bugged.
|
|
96
182
|
It shows only a time picker with start and end tabs. */}
|
|
97
183
|
{/* <Button
|
|
98
|
-
content=
|
|
99
|
-
onClick={() =>
|
|
100
|
-
{
|
|
101
|
-
|
|
184
|
+
content="Date time range with custom titles (paged)"
|
|
185
|
+
onClick={() =>
|
|
186
|
+
NativeDatePicker.present({
|
|
187
|
+
mode: 'dateTimeRange',
|
|
188
|
+
dateRangePresentation: 'paged',
|
|
189
|
+
...fixedDates,
|
|
190
|
+
referenceStartDate: referenceStartDate,
|
|
191
|
+
referenceEndDate: referenceEndDate,
|
|
192
|
+
...titles,
|
|
193
|
+
callback: didPickDates,
|
|
194
|
+
})
|
|
195
|
+
}
|
|
102
196
|
/> */}
|
|
103
197
|
|
|
104
198
|
{/* Shows 'Date Title', 'Date Subtitle', 'Start Tab' and 'End Tab' on the first page;
|
|
105
199
|
shows 'Time Title', 'Time Subtitle', 'Start Tab' and 'End Tab' on the second page */}
|
|
106
200
|
<Button
|
|
107
201
|
content="Date time range with custom titles (tabbed)"
|
|
108
|
-
onClick={() =>
|
|
202
|
+
onClick={() =>
|
|
203
|
+
NativeDatePicker.present({
|
|
204
|
+
mode: 'dateTimeRange',
|
|
205
|
+
...fixedDates,
|
|
206
|
+
referenceStartDate: referenceStartDate,
|
|
207
|
+
referenceEndDate: referenceEndDate,
|
|
208
|
+
...titles,
|
|
209
|
+
callback: didPickDates,
|
|
210
|
+
})
|
|
211
|
+
}
|
|
109
212
|
/>
|
|
110
213
|
|
|
111
|
-
<Text variant="headerStandard">Calendar configuration</Text>
|
|
112
214
|
<View style={commonStyles.switch}>
|
|
113
|
-
<Text>
|
|
215
|
+
<Text variant="headerStandard">Custom calendar configuration</Text>
|
|
114
216
|
<Switch
|
|
115
|
-
value={
|
|
217
|
+
value={customCalendarConfiguration}
|
|
116
218
|
onValueChange={(value) => {
|
|
117
|
-
|
|
118
|
-
NativeDatePicker.setDefaultCalendarConfiguration({
|
|
119
|
-
referenceStartDate: value ? fixedDates.overrideReferenceStartDate : fixedDates.defaultReferenceStartDate,
|
|
120
|
-
referenceEndDate: value ? fixedDates.overrideReferenceEndDate : fixedDates.defaultReferenceEndDate,
|
|
121
|
-
});
|
|
219
|
+
setCustomCalendarConfiguration(value);
|
|
122
220
|
}}
|
|
123
221
|
/>
|
|
124
222
|
</View>
|
|
125
|
-
<Text variant="subheaderStandard">
|
|
126
|
-
|
|
127
|
-
</Text>
|
|
128
|
-
<Text variant="subheaderStandard">
|
|
129
|
-
Override reference end date: {fixedDates.overrideReferenceEndDate.getUTCFullYear().toString()}
|
|
130
|
-
</Text>
|
|
223
|
+
<Text variant="subheaderStandard">Reference start date: {customReferenceStartDate.toDateString()}</Text>
|
|
224
|
+
<Text variant="subheaderStandard">Reference end date: {customReferenceEndDate.toDateString()}</Text>
|
|
131
225
|
</Stack>
|
|
132
226
|
);
|
|
133
227
|
};
|
|
@@ -1,93 +1,37 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Notification } from '@fluentui-react-native/notification';
|
|
3
3
|
import { Test, TestSection, PlatformStatus } from '../Test';
|
|
4
4
|
|
|
5
|
-
const
|
|
6
|
-
type NotificationVariant = typeof NotificationVariants[number];
|
|
7
|
-
|
|
8
|
-
interface NotificationProps {
|
|
9
|
-
/**
|
|
10
|
-
* Notification variants: 'primary' | 'neutral' |'danger' | 'warning'
|
|
11
|
-
*/
|
|
12
|
-
variant: NotificationVariant;
|
|
13
|
-
startText: string;
|
|
14
|
-
endText: string;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
const Notification = (props: NotificationProps) => {
|
|
18
|
-
const variant = props.variant;
|
|
19
|
-
const startText = props.startText;
|
|
20
|
-
const endText = props.endText;
|
|
21
|
-
|
|
22
|
-
let containerBackgroundColor = 'skyblue';
|
|
23
|
-
let foregroundColor = 'black';
|
|
24
|
-
|
|
25
|
-
switch (variant) {
|
|
26
|
-
case 'primary':
|
|
27
|
-
containerBackgroundColor = 'skyblue';
|
|
28
|
-
break;
|
|
29
|
-
case 'neutral':
|
|
30
|
-
containerBackgroundColor = 'lightgrey';
|
|
31
|
-
break;
|
|
32
|
-
case 'danger':
|
|
33
|
-
containerBackgroundColor = 'pink';
|
|
34
|
-
foregroundColor = 'maroon';
|
|
35
|
-
break;
|
|
36
|
-
case 'warning':
|
|
37
|
-
containerBackgroundColor = 'lightyellow';
|
|
38
|
-
foregroundColor = 'brown';
|
|
39
|
-
break;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
const styles = StyleSheet.create({
|
|
43
|
-
container: {
|
|
44
|
-
borderRadius: 12,
|
|
45
|
-
backgroundColor: containerBackgroundColor,
|
|
46
|
-
|
|
47
|
-
flex: 1,
|
|
48
|
-
flexDirection: 'row',
|
|
49
|
-
justifyContent: 'space-between',
|
|
50
|
-
alignItems: 'center',
|
|
51
|
-
padding: 16,
|
|
52
|
-
},
|
|
53
|
-
start: {
|
|
54
|
-
fontSize: 16,
|
|
55
|
-
color: foregroundColor,
|
|
56
|
-
|
|
57
|
-
flex: 1,
|
|
58
|
-
flexGrow: 1,
|
|
59
|
-
},
|
|
60
|
-
end: {
|
|
61
|
-
fontSize: 16,
|
|
62
|
-
fontWeight: '500',
|
|
63
|
-
color: foregroundColor,
|
|
64
|
-
|
|
65
|
-
marginLeft: 34,
|
|
66
|
-
},
|
|
67
|
-
});
|
|
68
|
-
|
|
5
|
+
const PrimaryTest: React.FunctionComponent = () => {
|
|
69
6
|
return (
|
|
70
|
-
<
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
</View>
|
|
7
|
+
<Notification variant={'primary'} endText="Undo">
|
|
8
|
+
Mail Archived
|
|
9
|
+
</Notification>
|
|
74
10
|
);
|
|
75
11
|
};
|
|
76
12
|
|
|
77
|
-
const PrimaryTest: React.FunctionComponent = () => {
|
|
78
|
-
return <Notification variant={'primary'} startText="Mail Archived" endText="Undo" />;
|
|
79
|
-
};
|
|
80
|
-
|
|
81
13
|
const NeutralTest: React.FunctionComponent = () => {
|
|
82
|
-
return
|
|
14
|
+
return (
|
|
15
|
+
<Notification variant={'neutral'} endText="Sign in">
|
|
16
|
+
Some items require you to sign in to view them
|
|
17
|
+
</Notification>
|
|
18
|
+
);
|
|
83
19
|
};
|
|
84
20
|
|
|
85
21
|
const DangerTest: React.FunctionComponent = () => {
|
|
86
|
-
return
|
|
22
|
+
return (
|
|
23
|
+
<Notification variant={'danger'} endText="Retry">
|
|
24
|
+
There was a problem, and your recent changes may not have saved
|
|
25
|
+
</Notification>
|
|
26
|
+
);
|
|
87
27
|
};
|
|
88
28
|
|
|
89
29
|
const WarningTest: React.FunctionComponent = () => {
|
|
90
|
-
return
|
|
30
|
+
return (
|
|
31
|
+
<Notification variant={'warning'} endText="X">
|
|
32
|
+
Read Only
|
|
33
|
+
</Notification>
|
|
34
|
+
);
|
|
91
35
|
};
|
|
92
36
|
|
|
93
37
|
const notificationSections: TestSection[] = [
|
|
@@ -113,7 +57,7 @@ export const NotificationTest: React.FunctionComponent = () => {
|
|
|
113
57
|
const status: PlatformStatus = {
|
|
114
58
|
win32Status: 'Backlog',
|
|
115
59
|
uwpStatus: 'Backlog',
|
|
116
|
-
iosStatus: '
|
|
60
|
+
iosStatus: 'Experimental',
|
|
117
61
|
macosStatus: 'Backlog',
|
|
118
62
|
androidStatus: 'Backlog',
|
|
119
63
|
};
|