@moser-inc/moser-labs-custom-elements 2.5.8 → 3.0.1

package/README.md

@@ -5,7 +5,7 @@ This package contains a collection of custom elements that can be used in any we
 ## Installation
 
 ```bash
-npm i @moser-inc/moser-labs-custom-elements
+npm i @moser-inc/moser-labs-custom-elements @moser-inc/moser-labs-themes
 ```
 
 ## Usage
@@ -13,6 +13,7 @@ npm i @moser-inc/moser-labs-custom-elements
 For these custom elements to function properly, you must first authenticate the user with Keycloak before calling the provided `registerCustomElements` function, passing the Keycloak instance to it.
 
 ```ts
+import Labs from '@moser-inc/moser-labs-themes/labs';
 import Keycloak from 'keycloak-js';
 import { registerCustomElements } from '@moser-inc/moser-labs-custom-elements';
 
@@ -21,7 +22,10 @@ const keycloak = new Keycloak('/keycloak.json');
 keycloak.init({ onLoad: 'login-required' }).then((isAuthenticated) => {
   if (!isAuthenticated) return;
 
-  registerCustomElements({ keycloak });
+  registerCustomElements({
+    preset: Labs,
+    keycloak,
+  });
 });
 ```
 
@@ -30,7 +34,11 @@ keycloak.init({ onLoad: 'login-required' }).then((isAuthenticated) => {
 In order for the custom elements to use the correct instance for calling API endpoints and getting profile pictures, pass the `apiUri` option to `registerCustomElements`, using an environment variable for it to be dynamic between staging and production. It defaults to using `window.location.origin`.
 
 ```ts
-registerCustomElements({ keycloak, apiUri: import.meta.env.VITE_API_URI });
+registerCustomElements({
+  preset: Labs,
+  keycloak,
+  apiUri: import.meta.env.VITE_API_URI,
+});
 ```
 
 ## External