@sui-angular/core

Sui Angular Wallet Kit

The first package, written in Angular, provides components for connecting to the SUI blockchain wallet. ⚠️ These packages are in the experimental stage and will undergo frequent changes during development. Please do not regard these APIs as stable.

Getting started

To begin with an Angular application, you can install the following package:

npm i @sui-angular/core

Add the following code snippets to angular.json.

"assets": [
              ...,
              {
                "glob": "**/*",
                "input": "node_modules/@sui-angular/core/assets",
                "output": "sui-angular"
              }
            ],

"styles": [
            ...,
            "node_modules/@sui-angular/core/styles/sui-angular.scss"
          ],

Next, you should import the CoreModule and specify either BrowserAnimationsModule or NoopAnimationsModule, just as you did.

import { SuiAngularCoreModule } from '@sui-angular/core';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
    ...,
    imports: [
        SuiAngularCoreModule,
        NoopAnimationsModule
    ],
    ...,
})

Add a connection button to your component

<div style="display: flex; justify-content: end; align-items: center;">
    <connect-button-container style="margin: 8px 16px;" (connected)="connected($event)"></connect-button-container>
</div>

import { AuthService, ConnectedWalletInterface } from '@sui-angular/core';

...
public connected(event: ConnectedWalletInterface): void {
    console.log(event, 'event');
}
...