你的功能请求是否与问题相关?请描述
目前有一个 text
控件,具有以下选项:
https://github.com/storybookjs/storybook/blob/next/code/ui/blocks/src/controls/types.ts#L68-L70
这创建了一个单行文本输入框。然而,如果能支持一个多行文本输入框(textarea)控件,将更容易支持较长的文本字符串。
描述你希望实现的解决方案
我们可以添加以下选项:
export interface TextConfig {
maxLength?: number;
rows?: number;
}
如果设置了该选项,它将把行数传递给底层的 Form.Textarea
组件:
https://github.com/storybookjs/storybook/blob/next/code/ui/blocks/src/controls/Text.tsx#L51
描述你考虑过的替代方案
我们也可以创建一个新的控件类型。但我认为添加一个选项更轻量级、更简洁。
你是否能够协助将这个功能变为现实?
是的,我可以
其他信息
- 无响应*
4条答案
按热度按时间46scxncf1#
I like the idea of a
rows
option! 👍l0oc07j22#
@shilman
根据我目前看到的,
Text
控制是一个具有max-height: 400px;
规则的自动调整大小的文本区域,因此它可以很好地支持较长的文本字符串。我们是否仍然需要这个新属性?lztngnrs3#
当前的解决方案并不完美,因为调整大小的切换按钮太小了,而且相当难以点击。用户肯定会喜欢一些默认的"扩展"大小。
额外的情况是:
raw
交换机几乎与调整大小的切换按钮有100%的重叠,当以“原始”模式编辑对象时文本区域在这里也会非常有用。
3qpi33ja4#
当前的解决方案并不完美,因为调整大小的切换按钮太小,而且相当难以点击。用户肯定会喜欢一些默认的"展开"大小。
另外一种情况是:
raw
开关几乎100%与调整大小的切换按钮重叠,当以“原始”模式编辑对象时,这里的文本区域也非常有用。+1,这个UI bug正在让我们的测试人员发疯,试图在那么小的区域内点击调整大小的手柄。
另一种选择(对象编辑器)也有自己的问题:添加新值会将库代码中的默认不可更改属性添加到故事书控件中-这些属性和值甚至开发者都无法更改。它占用空间,没有用...我会为这个问题记录一个bug。
对于任何寻找一个临时解决方法的人,直到这个问题得到修复,你可以尝试像这样(自己添加最小高度):
preview.js
:上述代码的缺点是它会影响所有的文本区域,而不仅仅是用于对象编辑的那些,所以根据需要进行调整。