YInput

适用范围：Legacy Admin Kit / Schema 与旧 admin-vue。新 admin-nuxtui 的开发入口见管理端 Nuxt UI 指南。

定位 / Owner

YInput 是稳定文本输入 facade。DOM 展示空值时允许上层 DTO 使用 nullable value；字段 label、hint、error 应由 YFormField 组合。

什么时候使用

• text/search/email/password/url/tel/number 等原生输入语义。
• 需要 comfortable / compact 密度。
• 需要组件级 autofocus。

不什么时候使用

• 不用 YInput type="date" 替代 Yoyo DateOnly 交互；标准日期使用 YDatePicker。
• 标准 Schema field 不要在 feature 手写 Input projection；优先 YSchemaForm。

基础用法

<YFormField control-id="name" label="名称" required>
  <template #default="{ controlId, describedBy, invalid }">
    <YInput
      :id="controlId"
      v-model="name"
      :aria-describedby="describedBy"
      :aria-invalid="invalid"
      placeholder="请输入名称"
    />
  </template>
</YFormField>

Public API

v-model 为公共值入口。主要 props：type、placeholder、disabled、min、autofocus、compact；其它标准 input attrs 透传到 primitive。

Composition

YInput 只拥有 control；label/description/error/readonly 由 YFormField 拥有，Form state 由 TanStack Form / feature owner 持有。

Live Workbench

Admin Vue 稳定路径：

/frontend-module-demo/component-workbench/input

该路径只标识 live scenario，不固化部署 Host；官方文档站与 Admin Vue 可以独立部署。

Verification / Source

• packages/yoyo-admin/admin-kit/src/ui/components/input/YInput.vue
• Live Component Workbench