talenra – Inbox library for Angular

The talenra Inbox library for Angular offers the possibility to create customizable inbox components with different requirements.

Setup and Installation

Make sure you have node >= 16 and npm >= 8 installed.

# Check node version
node --version
# Check npm version
npm --version

Install the library

1. The package @talenra/ngx-base is served via the Talenra artifactory. Access to the artifactory requires the TC user provided in the Talenra onboarding process.

2. Install the package and @talenra/ngx-base which we will use for the layout (<talenra-app-frame>).

npm add @talenra/ngx-base @talenra/ngx-inbox

3. Add the talenra icons to your stylesheet. Now also add the Angular Material base stylesheet.

// src/styles.scss
@use '@talenra/icons/styles';
@use '@angular/material/prebuilt-themes/indigo-pink';

4. Add the angular2-draggable stylesheet to the use styles in the main angular.json of the application. To use the resizing feature of the detail-view.

// src/angular.json
"styles": [
...
+   "node_modules/angular2-draggable/css/resizable.min.css"
]

5. Import the module into your app and co-dependencies:

// src/app/app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import { talenraBaseModule } from '@talenra/ngx-base'; // <-- required
import { talenraInboxModule } from '@talenra/ngx-inbox'; // <-- required

@NgModule({
  declarations: [AppComponent],
  imports: [
    AppRoutingModule,
    BrowserModule,
    BrowserAnimationsModule, // <-- required
    talenraBaseModule, // <-- required
    talenraInboxModule, // <-- required
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {
}

How to get started

The tutorial "build a inbox" is a good starting point if you're using the library for the first time.

API Documentation

The API documentation is available in the documentation of the library.

Bug reports

Please open a new issue to report bugs. The better your report, the faster we can solve the issue. Information required to address the issue include:

• Environment (versions involved)
• Step-by-step guide on how to reproduce the bug
• Description of the current behaviour
• Description of the expected behaviour
• If the issue affects rendering, a screenshot might help

Resources

• Documentation (this document)