From 87d0bec8cd9059efc80dc7797c6adf02dbaf1f10 Mon Sep 17 00:00:00 2001 From: Gino Dzin Date: Mon, 16 Feb 2026 11:21:41 +0100 Subject: [PATCH 1/2] fix(ios/fabric): stop overriding JS width in Yoga layout The `adopt` method in `ComponentDescriptors.h` called `setSize()` with both width and height from `sizeThatFits:UILayoutFittingCompressedSize`. Because `UIDatePicker` has a native minimum width of 280pt, this forced a fixed width on the Yoga node, overriding any JS style such as `width: "100%"`. Only set the **height** from the native measurement and let the JS side control the width through regular Yoga styles. Adds `setMeasuredHeight()` to `RNDateTimePickerShadowNode` which sets only `yoga::Dimension::Height` on the Yoga node style, leaving the width dimension untouched. Fixes #1014 --- .../components/RNDateTimePicker/ComponentDescriptors.h | 5 ++--- .../renderer/components/RNDateTimePicker/ShadowNodes.h | 7 +++++++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ComponentDescriptors.h b/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ComponentDescriptors.h index d51a3272..19874156 100644 --- a/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ComponentDescriptors.h +++ b/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ComponentDescriptors.h @@ -20,13 +20,12 @@ class RNDateTimePickerComponentDescriptor final : public ConcreteComponentDescri void adopt(ShadowNode& shadowNode) const override { auto& pickerShadowNode = static_cast(shadowNode); - auto& layoutableShadowNode = static_cast(pickerShadowNode); auto state = std::static_pointer_cast(shadowNode.getState()); auto stateData = state->getData(); - if(stateData.frameSize.width != 0 && stateData.frameSize.height != 0) { - layoutableShadowNode.setSize(Size{stateData.frameSize.width, stateData.frameSize.height}); + if(stateData.frameSize.height != 0) { + pickerShadowNode.setMeasuredHeight(stateData.frameSize.height); } ConcreteComponentDescriptor::adopt(shadowNode); diff --git a/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ShadowNodes.h b/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ShadowNodes.h index bf2fa2ea..59cdef98 100644 --- a/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ShadowNodes.h +++ b/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ShadowNodes.h @@ -33,6 +33,13 @@ class JSI_EXPORT RNDateTimePickerShadowNode final : public ConcreteViewShadowNod traits.set(ShadowNodeTraits::Trait::LeafYogaNode); return traits; } + + void setMeasuredHeight(float height) const { + auto style = yogaNode_.style(); + style.setDimension(yoga::Dimension::Height, yoga::StyleSizeLength::points(height)); + yogaNode_.setStyle(style); + yogaNode_.setDirty(true); + } }; } // namespace react From ff5f32e60ac5cdce69badda3d9199cba00437897 Mon Sep 17 00:00:00 2001 From: Gino Dzin Date: Tue, 17 Feb 2026 19:59:13 +0100 Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=90=9B=20fix:=20iOS=20inline=20dateTi?= =?UTF-8?q?me=20picker=20height?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ios/fabric/RNDateTimePickerComponentView.mm | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/ios/fabric/RNDateTimePickerComponentView.mm b/ios/fabric/RNDateTimePickerComponentView.mm index ec9d7cdc..ebe5bab4 100644 --- a/ios/fabric/RNDateTimePickerComponentView.mm +++ b/ios/fabric/RNDateTimePickerComponentView.mm @@ -104,6 +104,21 @@ - (void) updateMeasurements { } CGSize size = [_dummyPicker sizeThatFits:UILayoutFittingCompressedSize]; size.width += 10; + + // Workaround: sizeThatFits: returns incorrect height for + // UIDatePickerModeDateAndTime + UIDatePickerStyleInline (Apple bug). + // The returned height only accounts for the calendar, missing the time row. + if (@available(iOS 14.0, *)) { + if (_dummyPicker.datePickerMode == UIDatePickerModeDateAndTime && + _dummyPicker.preferredDatePickerStyle == UIDatePickerStyleInline) { + UIDatePicker *timePicker = [UIDatePicker new]; + timePicker.datePickerMode = UIDatePickerModeTime; + timePicker.preferredDatePickerStyle = UIDatePickerStyleInline; + CGSize timeSize = [timePicker sizeThatFits:UILayoutFittingCompressedSize]; + size.height += timeSize.height; + } + } + auto newState = RNDateTimePickerState{RCTSizeFromCGSize(size)}; _state->updateState(std::move(newState)); }