feat: add searchable cascader #435
Open
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
带有搜索功能的级联选择器
引言
在之前,当一个立绘的动作表情(动画)选项过多时,用户可能需要在一个下拉列表中翻查许久,才能选中自己所期待的选项,为了解决这个问题,本人有了为动作表情(动画)的选择添加级联选择与搜索功能的想法。
新增内容
SearchableCascader
组件。packages/origine2/src/pages/editor/GraphiclEditor/components/
文件夹下。searchableCascader.module.scss
样式文件。src/pages/editor/GraphiclEditor/utils/
文件夹下新增getCascaderOptions.ts
文件,用于辅助SearchableCascader
组件实现相关功能。TagInputPicker
组件。ChangeFigure.tsx
中的两个WhellDropdown
组件替换成了SearchableCascader
组件。src/pages/editor/Topbar/tabs/Settings/SettingsTab.tsx
组件中追加了自定义级联选择器分隔符功能。isCascaderDelimitersCustomizable
、cascaderDelimiters
,在src/types/editor.ts
和src/store/useEditorStore.ts
文件中追加了相关内容。效果
依赖
WhellDropdown
、TerreToggle
、CommonOptions
等组件。useEditorStore
的集中状态管理。其他
SearchableCascader
组件与原有WhellDropdown
组件的行为完全相同。欢迎提出改进建议!