// ===== showcase/src/examples/components/search_box.ts ===== import {  RenderPageHeader,  RenderSearchBox,  RenderStackPanel,  RenderText,} from 'ds-ui' export function createSearchBoxExample(): RenderStackPanel {  const status = new RenderText('输入关键字后按 Enter，或点击右侧搜索图标')  const panel = new RenderStackPanel({ orientation: 'vertical', spacing: 14, crossAxisAlignment: 'stretch' })  panel.addChild(new RenderPageHeader({    title: 'SearchBox 搜索输入',    description: '即时过滤与显式提交可以分别绑定 onChange 和 onSearch。',  }))  panel.addChild(new RenderSearchBox({    value: '',    placeholder: '搜索组件、API 或文档…',    helperText: '输入时更新候选结果，Enter 提交完整查询',    maxLength: 64,    onChange: value => { status.text = value ? `即时过滤：${value}` : '已清空即时过滤' },    onSearch: value => { status.text = value ? `已提交搜索：${value}` : '已提交空查询' },  }))  panel.addChild(new RenderSearchBox({    value: 'DataGrid',    placeholder: '只读查询条件',    readonly: true,    helperText: '只读状态保留当前检索文本',  }))  panel.addChild(new RenderSearchBox({ value: '', placeholder: '搜索暂不可用', disabled: true }))  panel.addChild(status)  panel.padding = 24  return panel}