How do I learn more about the framework?

Besides the articles on this site, you can also take a look at the Component Examples respository on Github, where we have published a number of example implementations that are also available on the Marketplace.

My nested component doesn't work

The Component SDK builders don't support embedded components. This means you can't use a Svelte child component in your top-level Svelte (IXON) component or a Vue child component in your top-level Vue (IXON) component.
If you require nesting for your development or depend on a third-party library, that does not work in a web component, please use an [Iframe]

My component looks odd on some screen sizes

The pages and cards will be automatically resized on the user's screen size. You'll have to take this into account when designing your component. You can resize your browser window to test this for yourself.

How can I match the company branding in my component?

Using company branding colors is possible via CSS variables. Variable values are automatically set when loading the component. Some variable values can be changed in Admin > Company > Identity > Company Branding or via API calls.

You can see all the available variables using the browser inspection tools. Please note that these variables are not part of the Component SDK API and may change at any time.

The following is a map of the most relevant branding elements:

accentColor: --accent-color
headerColor: --header-color
headerLineColor: --header-line-border-color
menuColor: --menu-color
pageColor: --page-color
primary: --primary
primaryColor: --primary-color