ng-fy-sidebar
TypeScript icon, indicating that this package has built-in type declarations

0.0.11 • Public • Published

ng-fy-tabs

Hey. It's an Angular 8 module for Material Admin Panel Bar Theme. Have Funn.

Click for demo

Install

npm install ng-fy-sidebar

Usage

import { NgFySidebarModule } from 'ng-fy-sidebar';

add to module imports

NgModule({
...
imports: [
	...
	NgFySidebarModule
	...
]
...
})

add to html file

<ng-fy-sidebar [data]="sidebarData"></ng-fy-sidebar>

If u don't use RouterModule u need to add

import { RouterModule } from  '@angular/router';
@NgModule({
...
imports:[
	...
	RouterModule.forRoot([])
	...
]
...
})

Page Html

Page html as ng-content

<ng-fy-sidebar [data]="sidebarData">
	Here
</ng-fy-sidebar>

Inputs

Name Type Default Description
data NgFySidebarData[] null All data

Interfaces

export  interface  NgFySidebarData {
	topbarDataRight?:  NgFySidebarTopbarItemData[],
	topbarDataLeft?:  NgFySidebarTopbarItemData[],
	logo?:  string,
	mobileLogo?:  string,
	sidebarData:  NgFySidebarItemData[],
	sidebarClosed?:  boolean,
	mobileRightSidebarClosed?:  boolean,
	mobileRightSidebar:NgFySidebarItemData[]
}

export  interface  NgFySidebarTopbarItemData {
	title:  string,
	icon?:  string,
	link?:  string,
	onClick?:  Function,
	children?:  NgFySidebarTopbarItemChildData[],
	open?:  boolean,
}

Cant set link, onClick and children sametime, children > onClick > link link is use Router.NavigateByUrl

export  interface  NgFySidebarTopbarItemChildData {
	title:  string,
	icon?:  string,
	link?:  string,
	onClick?:  Function,
}

export  interface  NgFySidebarItemData {
	title:  string,
	icon?:  string,
	onClick?:  Function,
	children?:  NgFySidebarItemData[],
	link?:  string,
	open?:  boolean,
	childHeigth?:  number
}

For Feedbacks or Problems

Package Sidebar

Install

npm i ng-fy-sidebar

Weekly Downloads

1

Version

0.0.11

License

MIT

Unpacked Size

339 kB

Total Files

32

Last publish

Collaborators

  • fyrok1