0.0.2 • Published 4 years ago

@broadstone/modal v0.0.2

Weekly downloads
-
License
-
Repository
-
Last release
4 years ago

Modal

Angular version 8.2.14.

How to use

npm i @broadstone/modal

ADD to app.module.ts

import { ModalModule} from '@broadstone/modal';
@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
    ModalModule,
  ],
  providers: [],
  bootstrap: [ModalModule]
})

ADD in .html EXAMPLE HERE

    <lib-modal title='Assign Workers' sub_header='0/3 Shifts Assigned'
  body='Here you can assign workers to the shift. Workers will receive a message in the app asking them to accept or decline.'
  [close_icon]='true' [show_modal]="true" (closeModal)='close_modal($event)' btn_label_primary='Save'
  btn_label_secondary='Cancel'></lib-modal>

Inside Component

  @Input() generic_error: string;
  @Input() show_modal;
  @Input() title: string;
  @Input() body: string;
  @Input() sub_header: string;
  @Input() close_icon: boolean;
  @Input() footer: boolean;
  @Input() width: string = '680';

  //Buttons
  loading = { loading_link: false, loading_primary: false, loading_secondary: false };

  @Input() btn_label_primary: string;
  @Input() btn_label_secondary: string;
  @Input() btn_label_link: string;
  @Output() clickSecondary: EventEmitter<any> = new EventEmitter();
  @Output() clickPrimary: EventEmitter<any> = new EventEmitter();
  @Output() closeModal: EventEmitter<any> = new EventEmitter();
  @Output() clickLink: EventEmitter<any> = new EventEmitter();

Based on cornerstone input theme.

https://www.figma.com/file/hgsGs3Pj4jwZ1xNtGH0RL4/Broadstone-Component-Library?node-id=617%3A387

Depending on

@broadstone/clib-button ng-zorro-antd

0.0.2

4 years ago

0.0.1

4 years ago