Angularangular anchor link

For general installation and configuration take a look at the ngx-core-components package.

Generalgeneral anchor link

If you use width !== full you are able to overwrite the max-width with --db-drawer-max-width: CSS variable.

Load componentload-component anchor link

// app.component.ts
import { DBDrawer } from '@db-ux/ngx-core-components';

@Component({
  // ...
  standalone: true,
  imports: [..., DBDrawer],
  // ...
})

Use componentuse-component anchor link

<!-- app.component.html -->

<db-button (click)="toggleDrawer(true)"> Open me </db-button>
<db-drawer [open]="openDrawer" (onClose)="toggleDrawer(false)">
	<header drawer-header>Optional drawer header</header>
	My Drawer content
</db-drawer>

// app.component.ts
export class AppComponent {
	openDrawer: boolean = false;
	toggleDrawer = (open: boolean) => {
		this.openDrawer = open;
	};
}