nuǝW pǝuoᴉʇᴉsoԀ ʎlǝʌᴉʇɐƃǝN
Unleash awesomeness. Private packages, team management tools, and powerful integrations. Get started with npm Orgs »

ngresizable

1.0.1 • Public • Published

Build Status

Angular Resizable

Simple, tree-shakable, AoT, Universal and Web Worker friendly resizable component for Angular (4 and beyond).

For version compatible with Angular 2 install 0.1.2.

Supports the following values of the position CSS property:

  • absolute.
  • relative.

How to use?

$ npm i ngresizable --save

API

Outputs

  • resizeStart: EventEmitter<IResizeEvent> - Resize start event.
  • resizing: EventEmitter<IResizeEvent> - Resizing event.
  • resizeEnd: EventEmitter<IResizeEvent> - Resize end event.

Inputs

  • width - Width of the element number.
  • height: number - Height of the element.
  • x: number - x coordinate of the element.
  • y: number - y coordinate of the element.
  • maxWidth: number - Maximum width. Default Infinity.
  • minWidth: number - Minimum width. Default 0.
  • maxHeight: number - Maximum height. Default Infinity.
  • minHeight: number - Minimum height. Default 0.
  • disableResize: boolean = false - Disable the resize.
  • directions: string[] - An array which contains the resize directions. Default ['bottom', 'right'].
  • grid: ISize - Resize in a grid. Default { width: 1, height: 1 }.
  • bound: IRectangle - Bound the resize.
  • ratio: number - Resize ratio.

Integration

Should work out of the box with webpack, respectively angular-cli. All you need to do is to include NgResizableModule:

import { NgResizableModule } from 'ngresizable';
 
@NgModule({
  imports: [NgResizableModule],
  ...
})
class AppModule {}

Angular Seed

// tools/config/project.ts
 
...
// Add packages (e.g. ngresizable)
let additionalPackages: ExtendPackages[] = [{
  name: 'ngresizable',
  path: 'node_modules/ngresizable/ngresizable.bundle.js'
}];
 
this.addPackagesBundles(additionalPackages);
...

License

MIT

install

npm i ngresizable

Downloadsweekly downloads

66

version

1.0.1

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability