callstack / callstack/react-native-paper

IconButton style prop is not manageable due to container element.

未关闭
#4,339 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
bug Icon Button
主要语言
TypeScript
星标
14.5k
派生
2.2k
平均合并
5 天 23 小时
30 天内合并 PR
12

描述

### Current behaviour

When you add style prop such as zIndex to IconButton component it's no applied because IconButton wrapped in Surface component which has static styles defined.

### Expected behaviour

When adding zIndex property it applies to Surface component and works.
### How to reproduce?

Create ` `
### Preview

How it looks when I add zIndex: 1 to IconButton style prop
![Screenshot 2024-03-12 at 10 27 34](https://github.com/callstack/react-native-paper/assets/54139019/18d9ec91-a841-4568-8791-a8783c42f9ae)
How it looks when I add View wrapper with zIndex: 1
![Screenshot 2024-03-12 at 10 28 05](https://github.com/callstack/react-native-paper/assets/54139019/7114370e-82ba-4ec5-8989-59a941ffe561)
### What have you tried so far?

In order to fix it I wrapped IconButton with extra ``
### Your Environment

| software | version
| --------------------- | -------
| react-native | 0.73.4
| react-native-paper | 5.11.3

贡献指南

打开贡献指南

调研方向

首先定位 IconButton 和 Surface 组件的实现,并使用指定的 React Native 和 react-native-paper 版本重现所报告的示例。跟踪 IconButton 的 style prop 如何传递到渲染出的容器;当该 prop 中的 zIndex 和 position 按预期影响组件,并为此行为添加回归检查时,该 issue 即完成。

由索引模型根据 Issue 内容生成。

评估

技术栈
react-native, typescript
领域
frontend, mobile
Issue 类型
缺陷
难度
2/5
预计耗时
1-3 小时
活跃度
停滞
描述清晰度
基本清楚
新手友好度
45/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。