svelte-kit-vice/src/uix/eidos/components/editable

Editable

Eidos Editable viste el primitive headless de Soma para edición inline. Air no tenia equivalente directo en src/uix/air/components, pero la rama anterior si tenia baseline en src/uix/terra/editable.

Baseline

Fuente	Superficie	Estado Eidos
Air glm-5	No existe src/uix/air/components/editable.	Sin baseline Air directa.
Terra glm-5	Root, Area, Preview, Input, EditTrigger, SubmitTrigger, CancelTrigger; preview inline, input solo en modo edición y acciones auxiliares.	Baseline visual recuperada: Editable no debe parecer un Field/Input permanente.
Soma actual	Provider, Area, Preview, Input, EditTrigger, SubmitTrigger, CancelTrigger; activation/submit modes, draft, auto-resize, max length, disabled/readonly.	Cubierto por passthrough. Eidos anade size, variant, color y receta.
Chakra / Ark Editable	Root, Area, Preview, Input, Control, Edit/Submit/Cancel triggers, activation modes, selectOnFocus, textarea.	Cubierto salvo Control dedicado; Area agrupa preview/input y triggers son hermanos.
Radix Vue Editable	Root, Area, Preview, Input, Edit/Submit/Cancel triggers.	Cubierto.
React Aria TextField	Label/Input/TextArea accesibles, pero no inline-edit compuesto.	Editable.Input puede renderizar textarea via child snippet; label externo queda en Field.

Referencias externas consultadas:

• Chakra UI Editable: https://chakra-ui.com/docs/components/editable
• Radix Vue Editable: https://www.radix-vue.com/components/editable
• Park UI / Ark Editable: https://park-ui.com/docs/components/editable
• React Aria TextField: https://react-aria.adobe.com/TextField

API Eidos

<Editable bind:value activationMode="click" submitMode="both" size="md" color="primary">
	<Editable.Area>
		<Editable.Preview />
		<Editable.Input />
	</Editable.Area>
	<Editable.Control>
		<Editable.EditTrigger>Edit</Editable.EditTrigger>
		<Editable.SubmitTrigger>Save</Editable.SubmitTrigger>
		<Editable.CancelTrigger>Cancel</Editable.CancelTrigger>
	</Editable.Control>
</Editable>

Decisiones

• No se crea Provider publico: el root visual es Editable.
• No se anade API flat con snippets.
• Editable.Control agrupa acciones; Soma expone estado en el control y en los triggers, y Eidos decide la visibilidad visual de Edit frente a Save/Cancel.
• size es responsive y se resuelve con ActiveEidos.
• variant controla el tratamiento del preview/input, pero el preview se mantiene como contenido inline: si se quiere una caja permanente se debe usar Field/Input, no Editable.
• color usa paletas canonicas de Eidos para foco y submit.
• El soporte textarea se mantiene en Soma mediante child.

Eventos

Morfo declara:

• shift-enter-mode: entrada en modo edición.
• commit-save: submit del draft.
• commit-cancel: cancelación/revert.

La escritura de estado queda en Soma; Sema sólo recibe señales agregadas y no observa cada pulsación dentro del input.

Comparativa

Capacidad	Bits UI	Ark UI	React Aria	shadcn-svelte	UIX
Surface compound (root + parts)	✓	✓	✓	✓	✓
ARIA semantics + keyboard nav	✓	✓	✓	parcial	✓ via morfo
Variantes visuales (size / variant)	parcial	parcial	n/a	tailwind	✓ recipe
Form integration	parcial	parcial	✓	parcial	✓ via Field
Eventos sema declarativos	n/a	n/a	n/a	n/a	✓

Gaps

Gap	Disposición	Detalle
API extendida sobre las referencias externas	diferir	Sólo si llega un caso de uso real. Mantener la superficie estable.
Cobertura adicional de variantes visuales	diferir	El recipe cubre sm/md/lg + solid/outline/ghost. Más variantes requieren caso concreto.
Documentación per-prop exhaustiva	implementar	Cuando se cierre el ciclo de remediación de cada componente.
Tests browser-level del flujo completo (Playwright)	implementar	Cobertura visual + interacciones. Se hace en una pasada conjunta de tests.