Initialize Lapikit application context

Lapikit provides a global application context that can be accessed by all components across your Svelte or SvelteKit application. To initialize this context, wrap your application in the <kit:app> component:

+layout.svelte

The <kit:app> component sets up the necessary context for Lapikit components to function properly. It also provides default styles and structure for your application, which you can customize as needed.

<kit:app> centralizes the global configuration used by Lapikit.

Once added at the root of your application, all components automatically inherit:

  • themes
  • global styles
  • hooks
  • shared application behavior

This keeps your project structure cleaner and avoids repetitive setup across pages and layouts.

In SvelteKit projects, <kit:app> is added inside +layout.svelte.

Why use <kit:app>?

Using <kit:app> ensures that all Lapikit components have access to the required context and styles.

It also provides a consistent structure for your application, making it easier to manage and maintain.

Additionally, <kit:app> can be customized with props to control the look and behavior of your application, allowing you to create a unique user experience while still benefiting from Lapikit’s features.

Customizing <kit:app>

You can customize the <kit:app> component using various props to control its appearance and behavior. For example, you can use the theme prop to apply a custom theme to your application.

Visit the component documentation application section to learn more about the available props and how to use them effectively.