Skip to content

Customization

Ybyra's Svelte integration ships with ready-to-use components via @ybyra/sveltekit. Forms, tables, field renderers, and action buttons all work out of the box — no customization required to get a fully functional CRUD.

When to Customize

You might want to customize when:

  • Branding — your design system has specific input styles, spacing, or color tokens
  • Specialized inputs — a rich text editor, color picker, or map widget that isn't built in
  • Different UI library — you prefer Skeleton, Flowbite, or Melt UI
  • Custom layout — you need a multi-step wizard, tabs, or a non-standard form layout
  • Business logic in the UI — conditional rendering that goes beyond hidden() and disabled()

Extension Points

Ybyra provides three main extension points, each covered in its own page:

ExtensionPurpose
useDataFormAccess the full form state — fields, values, errors, actions, groups, and sections — to build your own form component from scratch
useDataTableAccess table state — columns, rows, pagination, and actions — to build a custom table component
Renderer RegistryReplace or add field renderers so each field type maps to your own component

All three compose with the built-in behavior. You can override a single field renderer while keeping the rest, or build an entirely custom form layout while still using the same schema, events, and validation.

Next Steps

If you're just getting started, the built-in components are the fastest path. Come back here when you need to go beyond what they offer.

Released under the MIT License.