react-native-windows 0.83.0-preview.0 → 0.83.0-preview.1

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.
@@ -1210,6 +1210,30 @@ void CompositionEventHandler::onPointerPressed(
1210
1210
  ActiveTouch activeTouch{0};
1211
1211
  activeTouch.touchType = UITouchType::Mouse;
1212
1212
 
1213
+ // Map PointerUpdateKind to W3C button value
1214
+ // https://developer.mozilla.org/docs/Web/API/MouseEvent/button
1215
+ auto updateKind = pointerPoint.Properties().PointerUpdateKind();
1216
+ switch (updateKind) {
1217
+ case Composition::Input::PointerUpdateKind::LeftButtonPressed:
1218
+ activeTouch.button = 0;
1219
+ break;
1220
+ case Composition::Input::PointerUpdateKind::MiddleButtonPressed:
1221
+ activeTouch.button = 1;
1222
+ break;
1223
+ case Composition::Input::PointerUpdateKind::RightButtonPressed:
1224
+ activeTouch.button = 2;
1225
+ break;
1226
+ case Composition::Input::PointerUpdateKind::XButton1Pressed:
1227
+ activeTouch.button = 3;
1228
+ break;
1229
+ case Composition::Input::PointerUpdateKind::XButton2Pressed:
1230
+ activeTouch.button = 4;
1231
+ break;
1232
+ default:
1233
+ activeTouch.button = -1;
1234
+ break;
1235
+ }
1236
+
1213
1237
  while (targetComponentView) {
1214
1238
  if (auto eventEmitter =
1215
1239
  winrt::get_self<winrt::Microsoft::ReactNative::implementation::ComponentView>(targetComponentView)
@@ -1394,8 +1418,34 @@ facebook::react::PointerEvent CompositionEventHandler::CreatePointerEventFromAct
1394
1418
 
1395
1419
  event.detail = 0;
1396
1420
 
1397
- // event.button = activeTouch.button;
1398
- // event.buttons = ButtonMaskToButtons(activeTouch.buttonMask);
1421
+ event.button = activeTouch.button;
1422
+
1423
+ // Build W3C buttons bitmask from the active button
1424
+ // https://developer.mozilla.org/docs/Web/API/MouseEvent/buttons
1425
+ if (IsEndishEventType(eventType)) {
1426
+ event.buttons = 0;
1427
+ } else {
1428
+ switch (activeTouch.button) {
1429
+ case 0:
1430
+ event.buttons = 1;
1431
+ break; // primary
1432
+ case 1:
1433
+ event.buttons = 4;
1434
+ break; // auxiliary (middle)
1435
+ case 2:
1436
+ event.buttons = 2;
1437
+ break; // secondary (right)
1438
+ case 3:
1439
+ event.buttons = 8;
1440
+ break; // X1
1441
+ case 4:
1442
+ event.buttons = 16;
1443
+ break; // X2
1444
+ default:
1445
+ event.buttons = 0;
1446
+ break;
1447
+ }
1448
+ }
1399
1449
 
1400
1450
  // UpdatePointerEventModifierFlags(event, activeTouch.modifierFlags);
1401
1451
 
@@ -10,11 +10,11 @@
10
10
  -->
11
11
  <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
12
12
  <PropertyGroup>
13
- <ReactNativeWindowsVersion>0.0.0-canary.1037</ReactNativeWindowsVersion>
13
+ <ReactNativeWindowsVersion>0.83.0-preview.1</ReactNativeWindowsVersion>
14
14
  <ReactNativeWindowsMajor>0</ReactNativeWindowsMajor>
15
- <ReactNativeWindowsMinor>0</ReactNativeWindowsMinor>
15
+ <ReactNativeWindowsMinor>83</ReactNativeWindowsMinor>
16
16
  <ReactNativeWindowsPatch>0</ReactNativeWindowsPatch>
17
- <ReactNativeWindowsCanary>true</ReactNativeWindowsCanary>
18
- <ReactNativeWindowsCommitId>d02a7c64b3d3528e4a0f622702921ba63bbeeb01</ReactNativeWindowsCommitId>
17
+ <ReactNativeWindowsCanary>false</ReactNativeWindowsCanary>
18
+ <ReactNativeWindowsCommitId>b3b48d21776b189c66ab6ef77f0a48a9a3781b75</ReactNativeWindowsCommitId>
19
19
  </PropertyGroup>
20
20
  </Project>
@@ -0,0 +1,664 @@
1
+ /*
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ #include "BaseViewProps.h"
9
+
10
+ #include <algorithm>
11
+
12
+ #include <react/featureflags/ReactNativeFeatureFlags.h>
13
+ #include <react/renderer/components/view/BackgroundImagePropsConversions.h>
14
+ #include <react/renderer/components/view/BoxShadowPropsConversions.h>
15
+ #include <react/renderer/components/view/FilterPropsConversions.h>
16
+ #include <react/renderer/components/view/conversions.h>
17
+ #include <react/renderer/components/view/primitives.h>
18
+ #include <react/renderer/components/view/propsConversions.h>
19
+ #include <react/renderer/core/graphicsConversions.h>
20
+ #include <react/renderer/core/propsConversions.h>
21
+ #include <react/renderer/debug/debugStringConvertibleUtils.h>
22
+ #include <react/renderer/graphics/ValueUnit.h>
23
+
24
+ namespace facebook::react {
25
+
26
+ namespace {
27
+
28
+ std::array<float, 3> getTranslateForTransformOrigin(
29
+ float viewWidth,
30
+ float viewHeight,
31
+ TransformOrigin transformOrigin) {
32
+ float viewCenterX = viewWidth / 2;
33
+ float viewCenterY = viewHeight / 2;
34
+
35
+ std::array<float, 3> origin = {viewCenterX, viewCenterY, transformOrigin.z};
36
+
37
+ for (size_t i = 0; i < transformOrigin.xy.size(); ++i) {
38
+ auto& currentOrigin = transformOrigin.xy[i];
39
+ if (currentOrigin.unit == UnitType::Point) {
40
+ origin[i] = currentOrigin.value;
41
+ } else if (currentOrigin.unit == UnitType::Percent) {
42
+ origin[i] =
43
+ ((i == 0) ? viewWidth : viewHeight) * currentOrigin.value / 100.0f;
44
+ }
45
+ }
46
+
47
+ float newTranslateX = -viewCenterX + origin[0];
48
+ float newTranslateY = -viewCenterY + origin[1];
49
+ float newTranslateZ = origin[2];
50
+
51
+ return std::array{newTranslateX, newTranslateY, newTranslateZ};
52
+ }
53
+
54
+ } // namespace
55
+
56
+ BaseViewProps::BaseViewProps(
57
+ const PropsParserContext& context,
58
+ const BaseViewProps& sourceProps,
59
+ const RawProps& rawProps,
60
+ const std::function<bool(const std::string&)>& filterObjectKeys)
61
+ : YogaStylableProps(context, sourceProps, rawProps, filterObjectKeys),
62
+ AccessibilityProps(context, sourceProps, rawProps),
63
+ opacity(
64
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
65
+ ? sourceProps.opacity
66
+ : convertRawProp(
67
+ context,
68
+ rawProps,
69
+ "opacity",
70
+ sourceProps.opacity,
71
+ (Float)1.0)),
72
+ backgroundColor(
73
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
74
+ ? sourceProps.backgroundColor
75
+ : convertRawProp(
76
+ context,
77
+ rawProps,
78
+ "backgroundColor",
79
+ sourceProps.backgroundColor,
80
+ {})),
81
+ borderRadii(
82
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
83
+ ? sourceProps.borderRadii
84
+ : convertRawProp(
85
+ context,
86
+ rawProps,
87
+ "border",
88
+ "Radius",
89
+ sourceProps.borderRadii,
90
+ {})),
91
+ borderColors(
92
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
93
+ ? sourceProps.borderColors
94
+ : convertRawProp(
95
+ context,
96
+ rawProps,
97
+ "border",
98
+ "Color",
99
+ sourceProps.borderColors,
100
+ {})),
101
+ borderCurves(
102
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
103
+ ? sourceProps.borderCurves
104
+ : convertRawProp(
105
+ context,
106
+ rawProps,
107
+ "border",
108
+ "Curve",
109
+ sourceProps.borderCurves,
110
+ {})),
111
+ borderStyles(
112
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
113
+ ? sourceProps.borderStyles
114
+ : convertRawProp(
115
+ context,
116
+ rawProps,
117
+ "border",
118
+ "Style",
119
+ sourceProps.borderStyles,
120
+ {})),
121
+ outlineColor(
122
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
123
+ ? sourceProps.outlineColor
124
+ : convertRawProp(
125
+ context,
126
+ rawProps,
127
+ "outlineColor",
128
+ sourceProps.outlineColor,
129
+ {})),
130
+ outlineOffset(
131
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
132
+ ? sourceProps.outlineOffset
133
+ : convertRawProp(
134
+ context,
135
+ rawProps,
136
+ "outlineOffset",
137
+ sourceProps.outlineOffset,
138
+ {})),
139
+ outlineStyle(
140
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
141
+ ? sourceProps.outlineStyle
142
+ : convertRawProp(
143
+ context,
144
+ rawProps,
145
+ "outlineStyle",
146
+ sourceProps.outlineStyle,
147
+ {})),
148
+ outlineWidth(
149
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
150
+ ? sourceProps.outlineWidth
151
+ : convertRawProp(
152
+ context,
153
+ rawProps,
154
+ "outlineWidth",
155
+ sourceProps.outlineWidth,
156
+ {})),
157
+ shadowColor(
158
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
159
+ ? sourceProps.shadowColor
160
+ : convertRawProp(
161
+ context,
162
+ rawProps,
163
+ "shadowColor",
164
+ sourceProps.shadowColor,
165
+ {})),
166
+ shadowOffset(
167
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
168
+ ? sourceProps.shadowOffset
169
+ : convertRawProp(
170
+ context,
171
+ rawProps,
172
+ "shadowOffset",
173
+ sourceProps.shadowOffset,
174
+ {})),
175
+ shadowOpacity(
176
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
177
+ ? sourceProps.shadowOpacity
178
+ : convertRawProp(
179
+ context,
180
+ rawProps,
181
+ "shadowOpacity",
182
+ sourceProps.shadowOpacity,
183
+ {})),
184
+ shadowRadius(
185
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
186
+ ? sourceProps.shadowRadius
187
+ : convertRawProp(
188
+ context,
189
+ rawProps,
190
+ "shadowRadius",
191
+ sourceProps.shadowRadius,
192
+ {})),
193
+ cursor(
194
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
195
+ ? sourceProps.cursor
196
+ : convertRawProp(
197
+ context,
198
+ rawProps,
199
+ "cursor",
200
+ sourceProps.cursor,
201
+ {})),
202
+ boxShadow(
203
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
204
+ ? sourceProps.boxShadow
205
+ : convertRawProp(
206
+ context,
207
+ rawProps,
208
+ "boxShadow",
209
+ sourceProps.boxShadow,
210
+ {})),
211
+ filter(
212
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
213
+ ? sourceProps.filter
214
+ : convertRawProp(
215
+ context,
216
+ rawProps,
217
+ "filter",
218
+ sourceProps.filter,
219
+ {})),
220
+ backgroundImage(
221
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
222
+ ? sourceProps.backgroundImage
223
+ : convertRawProp(
224
+ context,
225
+ rawProps,
226
+ "experimental_backgroundImage",
227
+ sourceProps.backgroundImage,
228
+ {})),
229
+ backgroundSize(
230
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
231
+ ? sourceProps.backgroundSize
232
+ : convertRawProp(
233
+ context,
234
+ rawProps,
235
+ "experimental_backgroundSize",
236
+ sourceProps.backgroundSize,
237
+ {})),
238
+ backgroundPosition(
239
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
240
+ ? sourceProps.backgroundPosition
241
+ : convertRawProp(
242
+ context,
243
+ rawProps,
244
+ "experimental_backgroundPosition",
245
+ sourceProps.backgroundPosition,
246
+ {})),
247
+ backgroundRepeat(
248
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
249
+ ? sourceProps.backgroundRepeat
250
+ : convertRawProp(
251
+ context,
252
+ rawProps,
253
+ "experimental_backgroundRepeat",
254
+ sourceProps.backgroundRepeat,
255
+ {})),
256
+ mixBlendMode(
257
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
258
+ ? sourceProps.mixBlendMode
259
+ : convertRawProp(
260
+ context,
261
+ rawProps,
262
+ "mixBlendMode",
263
+ sourceProps.mixBlendMode,
264
+ {})),
265
+ isolation(
266
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
267
+ ? sourceProps.isolation
268
+ : convertRawProp(
269
+ context,
270
+ rawProps,
271
+ "isolation",
272
+ sourceProps.isolation,
273
+ {})),
274
+ transform(
275
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
276
+ ? sourceProps.transform
277
+ : convertRawProp(
278
+ context,
279
+ rawProps,
280
+ "transform",
281
+ sourceProps.transform,
282
+ {})),
283
+ transformOrigin(
284
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
285
+ ? sourceProps.transformOrigin
286
+ : convertRawProp(
287
+ context,
288
+ rawProps,
289
+ "transformOrigin",
290
+ sourceProps.transformOrigin,
291
+ {})),
292
+ backfaceVisibility(
293
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
294
+ ? sourceProps.backfaceVisibility
295
+ : convertRawProp(
296
+ context,
297
+ rawProps,
298
+ "backfaceVisibility",
299
+ sourceProps.backfaceVisibility,
300
+ {})),
301
+ shouldRasterize(
302
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
303
+ ? sourceProps.shouldRasterize
304
+ : convertRawProp(
305
+ context,
306
+ rawProps,
307
+ "shouldRasterizeIOS",
308
+ sourceProps.shouldRasterize,
309
+ {})),
310
+ zIndex(
311
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
312
+ ? sourceProps.zIndex
313
+ : convertRawProp(
314
+ context,
315
+ rawProps,
316
+ "zIndex",
317
+ sourceProps.zIndex,
318
+ {})),
319
+ pointerEvents(
320
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
321
+ ? sourceProps.pointerEvents
322
+ : convertRawProp(
323
+ context,
324
+ rawProps,
325
+ "pointerEvents",
326
+ sourceProps.pointerEvents,
327
+ {})),
328
+ hitSlop(
329
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
330
+ ? sourceProps.hitSlop
331
+ : convertRawProp(
332
+ context,
333
+ rawProps,
334
+ "hitSlop",
335
+ sourceProps.hitSlop,
336
+ {})),
337
+ onLayout(
338
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
339
+ ? sourceProps.onLayout
340
+ : convertRawProp(
341
+ context,
342
+ rawProps,
343
+ "onLayout",
344
+ sourceProps.onLayout,
345
+ {})),
346
+ events(
347
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
348
+ ? sourceProps.events
349
+ : convertRawProp(context, rawProps, sourceProps.events, {})),
350
+ collapsable(
351
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
352
+ ? sourceProps.collapsable
353
+ : convertRawProp(
354
+ context,
355
+ rawProps,
356
+ "collapsable",
357
+ sourceProps.collapsable,
358
+ true)),
359
+ collapsableChildren(
360
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
361
+ ? sourceProps.collapsableChildren
362
+ : convertRawProp(
363
+ context,
364
+ rawProps,
365
+ "collapsableChildren",
366
+ sourceProps.collapsableChildren,
367
+ true)),
368
+ removeClippedSubviews(
369
+ ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
370
+ ? sourceProps.removeClippedSubviews
371
+ : convertRawProp(
372
+ context,
373
+ rawProps,
374
+ "removeClippedSubviews",
375
+ sourceProps.removeClippedSubviews,
376
+ false)) {}
377
+
378
+ #define VIEW_EVENT_CASE(eventType) \
379
+ case CONSTEXPR_RAW_PROPS_KEY_HASH("on" #eventType): { \
380
+ const auto offset = ViewEvents::Offset::eventType; \
381
+ ViewEvents defaultViewEvents{}; \
382
+ bool res = defaultViewEvents[offset]; \
383
+ if (value.hasValue()) { \
384
+ fromRawValue(context, value, res); \
385
+ } \
386
+ events[offset] = res; \
387
+ return; \
388
+ }
389
+
390
+ void BaseViewProps::setProp(
391
+ const PropsParserContext& context,
392
+ RawPropsPropNameHash hash,
393
+ const char* propName,
394
+ const RawValue& value) {
395
+ // All Props structs setProp methods must always, unconditionally,
396
+ // call all super::setProp methods, since multiple structs may
397
+ // reuse the same values.
398
+ YogaStylableProps::setProp(context, hash, propName, value);
399
+ AccessibilityProps::setProp(context, hash, propName, value);
400
+
401
+ static auto defaults = BaseViewProps{};
402
+
403
+ switch (hash) {
404
+ RAW_SET_PROP_SWITCH_CASE_BASIC(opacity);
405
+ RAW_SET_PROP_SWITCH_CASE_BASIC(backgroundColor);
406
+ RAW_SET_PROP_SWITCH_CASE(backgroundImage, "experimental_backgroundImage");
407
+ RAW_SET_PROP_SWITCH_CASE(backgroundSize, "experimental_backgroundSize");
408
+ RAW_SET_PROP_SWITCH_CASE(
409
+ backgroundPosition, "experimental_backgroundPosition");
410
+ RAW_SET_PROP_SWITCH_CASE(backgroundRepeat, "experimental_backgroundRepeat");
411
+ RAW_SET_PROP_SWITCH_CASE_BASIC(shadowColor);
412
+ RAW_SET_PROP_SWITCH_CASE_BASIC(shadowOffset);
413
+ RAW_SET_PROP_SWITCH_CASE_BASIC(shadowOpacity);
414
+ RAW_SET_PROP_SWITCH_CASE_BASIC(shadowRadius);
415
+ RAW_SET_PROP_SWITCH_CASE_BASIC(transform);
416
+ RAW_SET_PROP_SWITCH_CASE_BASIC(backfaceVisibility);
417
+ RAW_SET_PROP_SWITCH_CASE_BASIC(shouldRasterize);
418
+ RAW_SET_PROP_SWITCH_CASE_BASIC(zIndex);
419
+ RAW_SET_PROP_SWITCH_CASE_BASIC(pointerEvents);
420
+ RAW_SET_PROP_SWITCH_CASE_BASIC(isolation);
421
+ RAW_SET_PROP_SWITCH_CASE_BASIC(hitSlop);
422
+ RAW_SET_PROP_SWITCH_CASE_BASIC(onLayout);
423
+ RAW_SET_PROP_SWITCH_CASE_BASIC(collapsable);
424
+ RAW_SET_PROP_SWITCH_CASE_BASIC(collapsableChildren);
425
+ RAW_SET_PROP_SWITCH_CASE_BASIC(removeClippedSubviews);
426
+ RAW_SET_PROP_SWITCH_CASE_BASIC(cursor);
427
+ RAW_SET_PROP_SWITCH_CASE_BASIC(outlineColor);
428
+ RAW_SET_PROP_SWITCH_CASE_BASIC(outlineOffset);
429
+ RAW_SET_PROP_SWITCH_CASE_BASIC(outlineStyle);
430
+ RAW_SET_PROP_SWITCH_CASE_BASIC(outlineWidth);
431
+ RAW_SET_PROP_SWITCH_CASE_BASIC(filter);
432
+ RAW_SET_PROP_SWITCH_CASE_BASIC(boxShadow);
433
+ RAW_SET_PROP_SWITCH_CASE_BASIC(mixBlendMode);
434
+ // events field
435
+ VIEW_EVENT_CASE(PointerEnter);
436
+ VIEW_EVENT_CASE(PointerEnterCapture);
437
+ VIEW_EVENT_CASE(PointerMove);
438
+ VIEW_EVENT_CASE(PointerMoveCapture);
439
+ VIEW_EVENT_CASE(PointerLeave);
440
+ VIEW_EVENT_CASE(PointerLeaveCapture);
441
+ VIEW_EVENT_CASE(PointerOver);
442
+ VIEW_EVENT_CASE(PointerOverCapture);
443
+ VIEW_EVENT_CASE(PointerOut);
444
+ VIEW_EVENT_CASE(PointerOutCapture);
445
+ // [Windows
446
+ VIEW_EVENT_CASE(Click);
447
+ VIEW_EVENT_CASE(ClickCapture);
448
+ VIEW_EVENT_CASE(PointerDown);
449
+ VIEW_EVENT_CASE(PointerDownCapture);
450
+ VIEW_EVENT_CASE(PointerUp);
451
+ VIEW_EVENT_CASE(PointerUpCapture);
452
+ VIEW_EVENT_CASE(GotPointerCapture);
453
+ VIEW_EVENT_CASE(LostPointerCapture);
454
+ // Windows]
455
+ VIEW_EVENT_CASE(MoveShouldSetResponder);
456
+ VIEW_EVENT_CASE(MoveShouldSetResponderCapture);
457
+ VIEW_EVENT_CASE(StartShouldSetResponder);
458
+ VIEW_EVENT_CASE(StartShouldSetResponderCapture);
459
+ VIEW_EVENT_CASE(ResponderGrant);
460
+ VIEW_EVENT_CASE(ResponderReject);
461
+ VIEW_EVENT_CASE(ResponderStart);
462
+ VIEW_EVENT_CASE(ResponderEnd);
463
+ VIEW_EVENT_CASE(ResponderRelease);
464
+ VIEW_EVENT_CASE(ResponderMove);
465
+ VIEW_EVENT_CASE(ResponderTerminate);
466
+ VIEW_EVENT_CASE(ResponderTerminationRequest);
467
+ VIEW_EVENT_CASE(ShouldBlockNativeResponder);
468
+ VIEW_EVENT_CASE(TouchStart);
469
+ VIEW_EVENT_CASE(TouchMove);
470
+ VIEW_EVENT_CASE(TouchEnd);
471
+ VIEW_EVENT_CASE(TouchCancel);
472
+ // BorderRadii
473
+ SET_CASCADED_RECTANGLE_CORNERS(borderRadii, "border", "Radius", value);
474
+ SET_CASCADED_RECTANGLE_EDGES(borderColors, "border", "Color", value);
475
+ SET_CASCADED_RECTANGLE_EDGES(borderStyles, "border", "Style", value);
476
+ }
477
+ }
478
+
479
+ #pragma mark - Convenience Methods
480
+
481
+ static BorderRadii ensureNoOverlap(const BorderRadii& radii, const Size& size) {
482
+ // "Corner curves must not overlap: When the sum of any two adjacent border
483
+ // radii exceeds the size of the border box, UAs must proportionally reduce
484
+ // the used values of all border radii until none of them overlap."
485
+ // Source: https://www.w3.org/TR/css-backgrounds-3/#corner-overlap
486
+
487
+ float leftEdgeRadii = radii.topLeft.vertical + radii.bottomLeft.vertical;
488
+ float topEdgeRadii = radii.topLeft.horizontal + radii.topRight.horizontal;
489
+ float rightEdgeRadii = radii.topRight.vertical + radii.bottomRight.vertical;
490
+ float bottomEdgeRadii =
491
+ radii.bottomLeft.horizontal + radii.bottomRight.horizontal;
492
+
493
+ float leftEdgeRadiiScale =
494
+ (leftEdgeRadii > 0) ? std::min(size.height / leftEdgeRadii, (Float)1) : 0;
495
+ float topEdgeRadiiScale =
496
+ (topEdgeRadii > 0) ? std::min(size.width / topEdgeRadii, (Float)1) : 0;
497
+ float rightEdgeRadiiScale = (rightEdgeRadii > 0)
498
+ ? std::min(size.height / rightEdgeRadii, (Float)1)
499
+ : 0;
500
+ float bottomEdgeRadiiScale = (bottomEdgeRadii > 0)
501
+ ? std::min(size.width / bottomEdgeRadii, (Float)1)
502
+ : 0;
503
+
504
+ return BorderRadii{
505
+ .topLeft =
506
+ {static_cast<float>(
507
+ radii.topLeft.vertical *
508
+ std::min(topEdgeRadiiScale, leftEdgeRadiiScale)),
509
+ static_cast<float>(
510
+ radii.topLeft.horizontal *
511
+ std::min(topEdgeRadiiScale, leftEdgeRadiiScale))},
512
+ .topRight =
513
+ {static_cast<float>(
514
+ radii.topRight.vertical *
515
+ std::min(topEdgeRadiiScale, rightEdgeRadiiScale)),
516
+ static_cast<float>(
517
+ radii.topRight.horizontal *
518
+ std::min(topEdgeRadiiScale, rightEdgeRadiiScale))},
519
+ .bottomLeft =
520
+ {static_cast<float>(
521
+ radii.bottomLeft.vertical *
522
+ std::min(bottomEdgeRadiiScale, leftEdgeRadiiScale)),
523
+ static_cast<float>(
524
+ radii.bottomLeft.horizontal *
525
+ std::min(bottomEdgeRadiiScale, leftEdgeRadiiScale))},
526
+ .bottomRight =
527
+ {static_cast<float>(
528
+ radii.bottomRight.vertical *
529
+ std::min(bottomEdgeRadiiScale, rightEdgeRadiiScale)),
530
+ static_cast<float>(
531
+ radii.bottomRight.horizontal *
532
+ std::min(bottomEdgeRadiiScale, rightEdgeRadiiScale))},
533
+ };
534
+ }
535
+
536
+ static BorderRadii radiiPercentToPoint(
537
+ const RectangleCorners<ValueUnit>& radii,
538
+ const Size& size) {
539
+ return BorderRadii{
540
+ .topLeft =
541
+ {radii.topLeft.resolve(size.height),
542
+ radii.topLeft.resolve(size.width)},
543
+ .topRight =
544
+ {radii.topRight.resolve(size.height),
545
+ radii.topRight.resolve(size.width)},
546
+ .bottomLeft =
547
+ {radii.bottomLeft.resolve(size.height),
548
+ radii.bottomLeft.resolve(size.width)},
549
+ .bottomRight =
550
+ {radii.bottomRight.resolve(size.height),
551
+ radii.bottomRight.resolve(size.width)},
552
+ };
553
+ }
554
+
555
+ CascadedBorderWidths BaseViewProps::getBorderWidths() const {
556
+ return CascadedBorderWidths{
557
+ .left = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Left)),
558
+ .top = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Top)),
559
+ .right = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Right)),
560
+ .bottom =
561
+ optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Bottom)),
562
+ .start = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Start)),
563
+ .end = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::End)),
564
+ .horizontal =
565
+ optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Horizontal)),
566
+ .vertical =
567
+ optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::Vertical)),
568
+ .all = optionalFloatFromYogaValue(yogaStyle.border(yoga::Edge::All)),
569
+ };
570
+ }
571
+
572
+ BorderMetrics BaseViewProps::resolveBorderMetrics(
573
+ const LayoutMetrics& layoutMetrics) const {
574
+ auto isRTL =
575
+ bool{layoutMetrics.layoutDirection == LayoutDirection::RightToLeft};
576
+
577
+ auto borderWidths = getBorderWidths();
578
+
579
+ BorderRadii radii = radiiPercentToPoint(
580
+ borderRadii.resolve(isRTL, ValueUnit{0.0f, UnitType::Point}),
581
+ layoutMetrics.frame.size);
582
+
583
+ return {
584
+ .borderColors = borderColors.resolve(isRTL, {}),
585
+ .borderWidths = borderWidths.resolve(isRTL, 0),
586
+ .borderRadii = ensureNoOverlap(radii, layoutMetrics.frame.size),
587
+ .borderCurves = borderCurves.resolve(isRTL, BorderCurve::Circular),
588
+ .borderStyles = borderStyles.resolve(isRTL, BorderStyle::Solid),
589
+ };
590
+ }
591
+
592
+ Transform BaseViewProps::resolveTransform(
593
+ const LayoutMetrics& layoutMetrics) const {
594
+ const auto& frameSize = layoutMetrics.frame.size;
595
+ return resolveTransform(frameSize, transform, transformOrigin);
596
+ }
597
+
598
+ Transform BaseViewProps::resolveTransform(
599
+ const Size& frameSize,
600
+ const Transform& transform,
601
+ const TransformOrigin& transformOrigin) {
602
+ auto transformMatrix = Transform{};
603
+
604
+ // transform is matrix
605
+ if (transform.operations.size() == 1 &&
606
+ transform.operations[0].type == TransformOperationType::Arbitrary) {
607
+ transformMatrix = transform;
608
+ } else {
609
+ for (const auto& operation : transform.operations) {
610
+ transformMatrix = transformMatrix *
611
+ Transform::FromTransformOperation(operation, frameSize, transform);
612
+ }
613
+ }
614
+
615
+ if (transformOrigin.isSet()) {
616
+ std::array<float, 3> translateOffsets = getTranslateForTransformOrigin(
617
+ frameSize.width, frameSize.height, transformOrigin);
618
+ transformMatrix =
619
+ Transform::Translate(
620
+ translateOffsets[0], translateOffsets[1], translateOffsets[2]) *
621
+ transformMatrix *
622
+ Transform::Translate(
623
+ -translateOffsets[0], -translateOffsets[1], -translateOffsets[2]);
624
+ }
625
+
626
+ return transformMatrix;
627
+ }
628
+
629
+ bool BaseViewProps::getClipsContentToBounds() const {
630
+ return yogaStyle.overflow() != yoga::Overflow::Visible;
631
+ }
632
+
633
+ #pragma mark - DebugStringConvertible
634
+
635
+ #if RN_DEBUG_STRING_CONVERTIBLE
636
+ SharedDebugStringConvertibleList BaseViewProps::getDebugProps() const {
637
+ const auto& defaultBaseViewProps = BaseViewProps();
638
+
639
+ return AccessibilityProps::getDebugProps() +
640
+ YogaStylableProps::getDebugProps() +
641
+ SharedDebugStringConvertibleList{
642
+ debugStringConvertibleItem(
643
+ "opacity", opacity, defaultBaseViewProps.opacity),
644
+ debugStringConvertibleItem(
645
+ "backgroundColor",
646
+ backgroundColor,
647
+ defaultBaseViewProps.backgroundColor),
648
+ debugStringConvertibleItem(
649
+ "zIndex", zIndex, defaultBaseViewProps.zIndex.value_or(0)),
650
+ debugStringConvertibleItem(
651
+ "pointerEvents",
652
+ pointerEvents,
653
+ defaultBaseViewProps.pointerEvents),
654
+ debugStringConvertibleItem(
655
+ "transform", transform, defaultBaseViewProps.transform),
656
+ debugStringConvertibleItem(
657
+ "backgroundImage",
658
+ backgroundImage,
659
+ defaultBaseViewProps.backgroundImage),
660
+ };
661
+ }
662
+ #endif
663
+
664
+ } // namespace facebook::react
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-windows",
3
- "version": "0.83.0-preview.0",
3
+ "version": "0.83.0-preview.1",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",
@@ -26,7 +26,7 @@
26
26
  "@react-native-community/cli": "20.0.0",
27
27
  "@react-native-community/cli-platform-android": "20.0.0",
28
28
  "@react-native-community/cli-platform-ios": "20.0.0",
29
- "@react-native-windows/cli": "0.83.0-preview.0",
29
+ "@react-native-windows/cli": "0.83.0-preview.1",
30
30
  "@react-native/assets": "1.0.0",
31
31
  "@react-native/assets-registry": "0.83.0-rc.5",
32
32
  "@react-native/codegen": "0.83.0-rc.5",
@@ -69,7 +69,7 @@
69
69
  "yargs": "^17.6.2"
70
70
  },
71
71
  "devDependencies": {
72
- "@react-native-windows/codegen": "0.83.0-preview.0",
72
+ "@react-native-windows/codegen": "0.83.0-preview.1",
73
73
  "@react-native/metro-config": "0.83.0-rc.5",
74
74
  "@rnw-scripts/babel-react-native-config": "0.0.0",
75
75
  "@rnw-scripts/eslint-config": "1.2.38",
@@ -86,7 +86,7 @@
86
86
  "prettier": "2.8.8",
87
87
  "react": "19.2.0",
88
88
  "react-native": "0.83.0-rc.5",
89
- "react-native-platform-override": "0.83.0-preview.0",
89
+ "react-native-platform-override": "0.83.0-preview.1",
90
90
  "react-refresh": "^0.14.0",
91
91
  "typescript": "5.0.4"
92
92
  },