ngx-cursor-hover - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

lib/ngx-cursor-hover.module.d.ts

 import * as i0 from "@angular/core";
-import * as i1 from "./ngx-cursor-hover.component";
+import * as i1 from "./ngx-cursor-hover.directive";
 export declare class NgxCursorHoverModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxCursorHoverModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<NgxCursorHoverModule, [typeof i1.NgxCursorHoverComponent], never, [typeof i1.NgxCursorHoverComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NgxCursorHoverModule, [typeof i1.NgxCursorHoverDirective], never, [typeof i1.NgxCursorHoverDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<NgxCursorHoverModule>;
 }

package.json

 {
   "name": "ngx-cursor-hover",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "peerDependencies": {
@@ -11,3 +11,28 @@ "@angular/common": "^15.2.0",
   },
+  "author": {
+    "name": "Manojkumar Muthukumar",
+    "email": "[e-mail]"
+  },
+  "icon": "https://raw.githubusercontent.com/manoj10101996/resources/5d05c67fd08ed980e80f3c95363caf5fbdd75a7f/ngx-cursor-hover.svg",
+  "description": "The CSS cursor property specifies the mouse cursor to be displayed when pointing over an element. It can be used to change the cursor to a variety of different shapes, such as a hand, a crosshair, or an arrow.",
   "sideEffects": false,
+  "homepage": "https://www.beforepost.com/package/ngx/ngx-cursor-hover",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/manoj10101996/ngx-packages.git"
+  },
+  "keywords": [
+    "angular",
+    "ngx",
+    "ng",
+    "cursor",
+    "ngx-cursor-hover",
+    "manoj1010196",
+    "uiconfig",
+    "cursor-hover",
+    "hover",
+    "pointer",
+    "npm"
+  ],
+  "license": "MIT",
   "module": "fesm2015/ngx-cursor-hover.mjs",
@@ -14,0 +39,0 @@ "es2020": "fesm2020/ngx-cursor-hover.mjs",

public-api.d.ts

@@ -1,3 +0,2 @@
-export * from './lib/ngx-cursor-hover.service';
-export * from './lib/ngx-cursor-hover.component';
 export * from './lib/ngx-cursor-hover.module';
+export * from './lib/ngx-cursor-hover.directive';

README.md

@@ -1,24 +0,126 @@
-# NgxCursorHover
+<img width="256px" alt="ngx-cursor-hover" src="https://raw.githubusercontent.com/manoj10101996/resources/5d05c67fd08ed980e80f3c95363caf5fbdd75a7f/ngx-cursor-hover.svg"/>
 
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.2.0.
+# ngx-cursor-hover (latest)
 
-## Code scaffolding
+[![ngx-cursor-hover](https://img.shields.io/npm/dm/ngx-cursor-hover.svg)](https://npmjs.org/package/ngx-cursor-hover)
+[![npm version](https://badge.fury.io/js/ngx-cursor-hover.svg)](https://badge.fury.io/js/ngx-cursor-hover)  
+[![](https://data.jsdelivr.com/v1/package/npm/ngx-cursor-hover/badge)](https://www.jsdelivr.com/package/npm/ngx-cursor-hover)
 
-Run `ng generate component component-name --project ngx-cursor-hover` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ngx-cursor-hover`.
-> Note: Don't forget to add `--project ngx-cursor-hover` or else it will be added to the default project in your `angular.json` file. 
+The CSS cursor property specifies the mouse cursor to be displayed when pointing over an element. It can be used to change the cursor to a variety of different shapes, such as a hand, a crosshair, or an arrow. 
 
-## Build
+The cursor property is used to improve the user experience by providing visual cues about the actions that can be performed on an element. For example, a hand cursor is typically used to indicate that an element can be clicked, while a crosshair cursor is typically used to indicate that an element can be resized.
 
-Run `ng build ngx-cursor-hover` to build the project. The build artifacts will be stored in the `dist/` directory.
 
-## Publishing
 
-After building your library with `ng build ngx-cursor-hover`, go to the dist folder `cd dist/ngx-cursor-hover` and run `npm publish`.
 
-## Running unit tests
+[<img src="https://github.com/manoj10101996/resources/blob/main/ngx-cursor-hover-poster.png?raw=true" width="100%" >](https://www.beforepost.com/package/ngx/ngx-cursor-hover)
 
-Run `ng test ngx-cursor-hover` to execute the unit tests via [Karma](https://karma-runner.github.io).
 
-## Further help
+- `ngxCursor` Add directive to any HTML block element in order to enable cursor.
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+# Import Style
+
+- [x] Import using CSS CDN and Add it to your application
+
+```HTML
+<link rel="stylesheet" href="https://cdn.beforepost.com/neptune/ngx-cursor-hover-minified.css">
+```
+
+Add `crossorigin` attribute as (use-credentials or anonymous) to link element if required.
+
+- [x] Directly add it to your Css / Scss file.
+
+```CSS
+@import url("https://cdn.beforepost.com/neptune/ngx-cursor-hover-minified.css");
+```
+
+[<img src="https://github.com/manoj10101996/resources/blob/main/ngx-cursor-hover-advertise.png?raw=true" width="100%" >](https://www.beforepost.com/package/ngx/ngx-cursor-hover)
+
+---
+
+### Import
+
+Import the module on your `app.module.ts` file as follow.
+
+> import { NgxCursorHoverModule} from "ngx-cursor-hover";
+
+### Add to imports
+
+```
+imports: [
+  ...
+  NgxCursorHoverModule
+  ...
+],
+```
+
+### Core function
+
+```
+<div class="card-body" ngxCursor
+  [cursor]="'cursor-name-from-below-table'">
+
+    <!-- Content goes here... -->
+
+</div>
+```
+
+| Name             | Category             | class                                |
+| ---------------- | -------------------- | ------------------------------------ |
+| alias            | drag-and-drop        | .ngx-cursor-pointer-alias            |
+| all-scroll       | resize-and-scrolling | .ngx-cursor-pointer-all-scroll       |
+| auto             | general              | .ngx-cursor-pointer-auto             |
+| cell             | selection            | .ngx-cursor-pointer-cell             |
+| col-resize       | resize-and-scrolling | .ngx-cursor-pointer-col-resize       |
+| context-menu     | links-and-status     | .ngx-cursor-pointer-context-menu     |
+| copy             | drag-and-drop        | .ngx-cursor-pointer-copy             |
+| crosshair        | selection            | .ngx-cursor-pointer-crosshair        |
+| default          | general              | .ngx-cursor-pointer-default          |
+| e-resize         | resize-and-scrolling | .ngx-cursor-pointer-e-resize         |
+| ew-resize        | resize-and-scrolling | .ngx-cursor-pointer-ew-resize        |
+| grab             | grab                 | .ngx-cursor-pointer-grab             |
+| grabbing         | grab                 | .ngx-cursor-pointer-grabbing         |
+| help             | links-and-status     | .ngx-cursor-pointer-help             |
+| inherit          | general              | .ngx-cursor-pointer-inherit          |
+| initial          | general              | .ngx-cursor-pointer-initial          |
+| move             | drag-and-drop        | .ngx-cursor-pointer-move             |
+| n-resize         | resize-and-scrolling | .ngx-cursor-pointer-n-resize         |
+| ne-resize        | resize-and-scrolling | .ngx-cursor-pointer-ne-resize        |
+| nesw-resize      | resize-and-scrolling | .ngx-cursor-pointer-nesw-resize      |
+| no-drop          | drag-and-drop        | .ngx-cursor-pointer-no-drop          |
+| none             | general              | .ngx-cursor-pointer-none             |
+| not-allowed      | drag-and-drop        | .ngx-cursor-pointer-not-allowed      |
+| ns-resize        | resize-and-scrolling | .ngx-cursor-pointer-ns-resize        |
+| nw-resize        | resize-and-scrolling | .ngx-cursor-pointer-nw-resize        |
+| nwse-resize      | resize-and-scrolling | .ngx-cursor-pointer-nwse-resize      |
+| pointer          | links-and-status     | .ngx-cursor-pointer-pointer          |
+| progress         | links-and-status     | .ngx-cursor-pointer-progress         |
+| row-resize       | resize-and-scrolling | .ngx-cursor-pointer-row-resize       |
+| s-resize         | resize-and-scrolling | .ngx-cursor-pointer-s-resize         |
+| se-resize        | resize-and-scrolling | .ngx-cursor-pointer-se-resize        |
+| sw-resize        | resize-and-scrolling | .ngx-cursor-pointer-sw-resize        |
+| text             | selection            | .ngx-cursor-pointer-text             |
+| unset            | general              | .ngx-cursor-pointer-unset            |
+| vertical-text    | selection            | .ngx-cursor-pointer-vertical-text    |
+| w-resize         | resize-and-scrolling | .ngx-cursor-pointer-w-resize         |
+| wait             | links-and-status     | .ngx-cursor-pointer-wait             |
+| zoom-in          | zoom                 | .ngx-cursor-pointer-zoom-in          |
+| zoom-out         | zoom                 | .ngx-cursor-pointer-zoom-out         |
+| -webkit-grab     | grab                 | .ngx-cursor-pointer--webkit-grab     |
+| -webkit-grabbing | grab                 | .ngx-cursor-pointer--webkit-grabbing |
+| -webkit-zoom-in  | zoom                 | .ngx-cursor-pointer--webkit-zoom-in  |
+| -webkit-zoom-out | zoom                 | .ngx-cursor-pointer--webkit-zoom-out |
+
+---
+
+### Code integration
+
+To use this package as a service `npm i ngx-cursor-hover` install this on the root angular project .
+
+> Note: Don't forget to run this commend `npm i ngx-cursor-hover` on root folder or else it will throw error.
+
+Then import the module as follow on imports array
+
+> NgxResizeElementModule
+
+[<img src="https://github.com/manoj10101996/resources/blob/main/ngx-cursor-hover-advertise.png?raw=true" width="100%" >](https://www.beforepost.com/package/ngx/ngx-cursor-hover)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No contributors or author data

Maintenance

Package does not specify a list of contributors or an author in package.json.

Found 1 instance in 1 package

No License Found

License

(Experimental) License information could not be found.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

25675

increased by19.1%

Number of low license alerts

0

decreased by-100%

Number of low maintenance alerts

1

decreased by-50%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

127

increased by408%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Number of package files

14

decreased by-12.5%

Lines of code

170

decreased by-12.82%

No dependency changes