Pages and Components
For the distinction between Pages and Components, the Widget Settings panel, and the Designer UI walkthrough, see Portal Pages and Portal Components in the User Guide.
Portal Pages and Portal Components are built with the same AI Designer and follow the same development workflow. The only difference is how they are used: a Page is linked from Navigation and serves as a full screen, while a Component is embedded inside a Page or another Component. From a development perspective, the approach is identical.
Currently, AI mode is the only available mode for building pages and components. Design mode and Code mode are planned for a future release.
Providing context
Section titled “Providing context”The AI Designer does not auto-discover your data model. Before prompting, add the entities, views, and functions the AI should work with via the Context picker (the + button in the Designer header). Without context, the AI cannot generate forms that save to the right entity, lists that read from the correct view, or actions that call a specific function.
Add context items that are directly relevant to what you are building - the more focused the context, the more accurate the output. Added items appear as chips and can be removed individually or cleared all at once.
You can also attach files alongside your prompt using the paperclip icon: HTML examples, layout screenshots, or written instructions. This is useful for matching an existing design or following specific conventions.
The Anybuild UI library
Section titled “The Anybuild UI library”Pages and components are built on a rich Anybuild UI component library, alongside standard HTML. The AI is aware of the full library and will use the appropriate components when generating output - you do not need to reference them explicitly in your prompts.
The Component Library section documents each component: when to use them, their props, events, and methods. Use it when you want to be more specific in your prompts - for example, referencing a particular prop name or event to guide the AI toward the exact behaviour you need.
Working with AI output
Section titled “Working with AI output”Describe what you want the page or component to do in the chat input. The AI generates or updates the UI and the preview on the left reflects the result immediately.
Iterate by sending follow-up messages: request changes, add new sections, adjust layout, or refine behaviour. The AI maintains the full context of the conversation, so you can build incrementally rather than starting from scratch each time.
Changes are reflected in the preview but are not saved until you explicitly save, and not live until you publish.