{"_id":"@amin-karimi/ng2-tooltip-directive","_rev":"14-1638cc9acf3027d9d2ea8a8c2eb8ff21","name":"@amin-karimi/ng2-tooltip-directive","dist-tags":{"latest":"19.0.0"},"versions":{"1.0.0":{"name":"@amin-karimi/ng2-tooltip-directive","version":"1.0.0","_id":"@amin-karimi/ng2-tooltip-directive@1.0.0","maintainers":[{"name":"amin-karimi","email":"amin.karimi.sisakht@gmail.com"}],"dist":{"shasum":"b865a59852caa1d2345a90f067de929f53fbffa0","tarball":"https://registry.npmjs.org/@amin-karimi/ng2-tooltip-directive/-/ng2-tooltip-directive-1.0.0.tgz","fileCount":27,"integrity":"sha512-iBh7ndbw0adFrJjUm8q+Dzoa8mCHXGswziuJnmXGBPn8nGXw7LgGf267K+4m+hX/LonzOiSxWioTE6TBvAe1jw==","signatures":[{"sig":"MEUCIG1DtvTaVJJnD3k81NMUlrr2jSGKJQa7ApvU3GqhLHklAiEAskpvK7xDhdx1GDor7s6rKDNA4272yV/S61w7+D0WYM4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":445505,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjmBwNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrQhw//cjw9xeJqFxrMpbKLKYKtX0edEWsPekPF5KnWf9xsE+YeroFX\r\ngKSZ7sio7FjMhT2nk07otHqTy7tPtlyo6EET2P+wwZ7deC83g3h12Sh5zcVE\r\nuiFM7jG1WoX6nJLlSVYWkixOkgPpSdoY85GU47rjFd+DF3ulST8ZaWVwbtd6\r\ndTJNddiD26T/JjKgwM/fr+mrh9nUKutw/905PNSJ+2/Bo2WuLX1vcnh5Um4L\r\nYEvtMPE6MHkdk/eJSQtLU6x01vrhThxHOKlS9VNJ1WBDFkqkHVV363OBEgb/\r\nh/oL4gWXXLlZ78gv67sKYvHAoU+RkRkcN616Xu8tUbh3pFc+4soheCkRYrJG\r\ncWmonjRbzssddDkigrBYMd45nPF2AhsRw7DzcYuDO6Jvp0XT593NjtXptS8w\r\nL67aAciH+B8OArnsCc1K62mDicRVg8Wy6bD4oSqWsYQE4a1hUwn4QIm8ZVA/\r\nLRo0LG6I1X3Ed9Xh710luQbXuV+7edhEp2+xJfelkNNLJHKJuK3ksB1wQLZH\r\n1Orio1yoZP5Tr6RZHjuDY+mE/mIkGPu5PAXKfOnbfAqcY1vU+VyawvaUOGkl\r\nkC7en4cfMpZCgBA2SxQfR7HTY+qpvXjz/bInfeQCVJZgGUOWqkXpISj+g3q7\r\nYEusEbS1IFVODzoQQ4Rscjb2R6u7BFlV9A4=\r\n=XJhk\r\n-----END PGP SIGNATURE-----\r\n"},"es2020":"fesm2020/amin-karimi-ng2-tooltip-directive.mjs","module":"fesm2015/amin-karimi-ng2-tooltip-directive.mjs","esm2020":"esm2020/amin-karimi-ng2-tooltip-directive.mjs","exports":{".":{"node":"./fesm2015/amin-karimi-ng2-tooltip-directive.mjs","types":"./index.d.ts","es2015":"./fesm2015/amin-karimi-ng2-tooltip-directive.mjs","es2020":"./fesm2020/amin-karimi-ng2-tooltip-directive.mjs","default":"./fesm2020/amin-karimi-ng2-tooltip-directive.mjs","esm2020":"./esm2020/amin-karimi-ng2-tooltip-directive.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"956a187cb05cd3e6c7b1399363ac215b309bfdc0","typings":"index.d.ts","_npmUser":{"name":"amin-karimi","email":"amin.karimi.sisakht@gmail.com"},"fesm2015":"fesm2015/amin-karimi-ng2-tooltip-directive.mjs","fesm2020":"fesm2020/amin-karimi-ng2-tooltip-directive.mjs","_npmVersion":"8.19.2","description":"This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.2.0.","directories":{},"sideEffects":false,"_nodeVersion":"18.12.1","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^14.2.0","@angular/common":"^14.2.0"},"_npmOperationalInternal":{"tmp":"tmp/ng2-tooltip-directive_1.0.0_1670913037355_0.08050193943262363","host":"s3://npm-registry-packages"}},"1.0.1":{"name":"@amin-karimi/ng2-tooltip-directive","version":"1.0.1","_id":"@amin-karimi/ng2-tooltip-directive@1.0.1","maintainers":[{"name":"amin-karimi","email":"amin.karimi.sisakht@gmail.com"}],"dist":{"shasum":"d346ae838a06edd40283129ce7eb7071af21eeae","tarball":"https://registry.npmjs.org/@amin-karimi/ng2-tooltip-directive/-/ng2-tooltip-directive-1.0.1.tgz","fileCount":27,"integrity":"sha512-QkVEHnr7XEeyTs+kFwz/f3GNympAwXYR/NlbT4oZMmEC9K9FnRZAdI3++WCw8AeTGEBT4iwVK0E28pfxukrjjA==","signatures":[{"sig":"MEUCIQDh7NEJGsS7XaMmal/3FVuJbPQoYPilWtPe4RZFOgw9KAIgVE2EU89hQsnBDI3Y19S2Din2+aHq1KerQkzzkCZHNdM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":451399,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjmB9fACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpN3xAAjyonFE0TRnauKaAHSPPGeYIocHdqEVhxw7nfuQMagz9Zma7M\r\nwiJ5EBqylTreF6meZXrSgKFUFwjkolv4iE4JjZLJO2PWdjQmHS61j1ABP7JM\r\nFdZkJQUo8ufxlTBEebQNA/AXRn0khTnn11W0WoBzRYqn4IJGBFh8CUnI/mj5\r\nTuErtxC+KKWIYWpsPbNwiLiFyZkd60HM2k31ZXb9uaONX7UJQ1J3uNGSG/Il\r\nBB6eY/kF/r6an1mXDrbiA1k457XVzrJzQIXU8J2aGRN7j4GuzpAvsO21oqJ0\r\n48NzgWiFrWVdl+LEb/GgUy/sY0nm0bdnTnZ/QZcbnGCm6l7BYnB/OZ3XUprK\r\nPyepkRrIlhgJvZ2ruSiOpNWCbT6cloECY5/4ay0GnoHinedRmyKjcDFjtaRD\r\n5PYvA+KapzXbhKDLMmyRW8RHz5k5eNyOKqavUsbwedBluSfCXBdgvAUbaj6p\r\nAvCPaYf3FKs74Hq+EXZtJAbBWlM/9H4f5wPisyD+jb1XSPEKeT4EMg8QoXzE\r\nNfCsy5TZXNK93mA4TJqGGNqTGEbiKuMK6YGZRZ7H0Qqi5Z1ShSnPuTQinLJ2\r\nT7EEYmmKVaxgo47I/0b3TW6veWqVDYAglgOdLPGWBdxqrNk3Zl9O205ebMGQ\r\n1pDFd6Z/4q8Qto7yHIJ7JedvtsMHlO7o6Os=\r\n=KLyS\r\n-----END PGP SIGNATURE-----\r\n"},"es2020":"fesm2020/amin-karimi-ng2-tooltip-directive.mjs","module":"fesm2015/amin-karimi-ng2-tooltip-directive.mjs","esm2020":"esm2020/amin-karimi-ng2-tooltip-directive.mjs","exports":{".":{"node":"./fesm2015/amin-karimi-ng2-tooltip-directive.mjs","types":"./index.d.ts","es2015":"./fesm2015/amin-karimi-ng2-tooltip-directive.mjs","es2020":"./fesm2020/amin-karimi-ng2-tooltip-directive.mjs","default":"./fesm2020/amin-karimi-ng2-tooltip-directive.mjs","esm2020":"./esm2020/amin-karimi-ng2-tooltip-directive.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"956a187cb05cd3e6c7b1399363ac215b309bfdc0","typings":"index.d.ts","_npmUser":{"name":"amin-karimi","email":"amin.karimi.sisakht@gmail.com"},"fesm2015":"fesm2015/amin-karimi-ng2-tooltip-directive.mjs","fesm2020":"fesm2020/amin-karimi-ng2-tooltip-directive.mjs","_npmVersion":"8.19.2","description":"This library was generated with Angular CLI version 14.2.0.\r [![Build Status](https://travis-ci.org/drozhzhin-n-e/ng2-tooltip-directive.svg?branch=master)](https://travis-ci.org/drozhzhin-n-e/ng2-tooltip-directive) \r\n\r\nThe tooltip is a pop-up tip that appears when you hover over an item or click on it.\r\n\r\n🔬️ Help make Tooltips better by [answering a few questions](https://docs.google.com/forms/d/e/1FAIpQLSfuDYQLyGWLApEtnQH5wD2_HNjEM7lV_XJAhrQZEPm14mBZ-A/viewform).\r\n\r\n## Demo\r\nhttp://ivylab.space/tooltip\r\n\r\n## Installation\r\n\r\nInstall the npm package.\r\n\r\n // npm i ng2-tooltip-directive\r\n\r\n\r\n npm i @amin-karimi/ng2-tooltip-directive\r\n\r\nImport `standalone`:\r\n\r\n```ts\r\n\r\nimport { TooltipDirective } from '@amin-karimi/ng2-tooltip-directive';\r\n \r\n@Component({\r\n imports: [ TooltipDirective ]\r\n}) \r\n```\r\n \r\nImport `Ng2Module`:\r\n\r\n```ts\r\n\r\nimport { TooltipModule } from '@amin-karimi/ng2-tooltip-directive';\r\n \r\n@NgModule({\r\n imports: [ TooltipModule ]\r\n}) \r\n```\r\n\r\n## Usage\r\n \r\nOptions can be set in the directive tag, so they have the highest priority.\r\n\r\n```html\r\nTooltip on top\r\n```\r\n\r\nYou may pass as an object:\r\n\r\n```html\r\nTooltip on left\r\n```\r\n```ts\r\nmyOptions = {\r\n 'placement': 'left',\r\n 'showDelay': 500\r\n}\r\n```\r\n\r\nYou can pass HTML as content :\r\n\r\n```html\r\nHello i'm a bold text!

\">\r\n Tooltip with HTML content\r\n\r\n```\r\n\r\n```html\r\n\r\n

Hello i'm a bold text!

\r\n\r\n\r\n\r\n Tooltip with template content\r\n\r\n```\r\n\r\n## Set default values\r\n\r\nCreate a file with your settings, for example:\r\n```ts\r\nimport { TooltipOptions } from 'ng2-tooltip-directive';\r\n\r\nexport const MyDefaultTooltipOptions: TooltipOptions = {\r\n 'show-delay': 500\r\n}\r\n```\r\n \r\nAnd pass your parameters when importing the module:\r\n```ts \r\n//import { TooltipModule, TooltipOptions } from 'ng2-tooltip-directive';\r\nimport { TooltipModule, TooltipOptions } from '@amin-karimi/ng2-tooltip-directive';\r\nimport { MyDefaultTooltipOptions } from './my-default-options';\r\n \r\n@NgModule({\r\n imports: [ \r\n TooltipModule.forRoot(MyDefaultTooltipOptions as TooltipOptions)\r\n ]\r\n})\r\n```\r\n\r\n## Properties\r\n\r\n| name | type | default | description |\r\n|------------------|-------------------------------------|---------|---------------------------------------------|\r\n| placement | \"top\", \"bottom\", \"left\", \"right\" | \"top\" | The position of the tooltip. |\r\n| autoPlacement | boolean | true | Place the tooltip so that it does not go beyond the borders of the browser window. |\r\n| showDelay | number | 0 | The delay in ms before showing the tooltip. |\r\n| hideDelay | number | 300 | The delay in ms before removing the tooltip. |\r\n| hideDelayTouchscreen | number | 0 | Delay in milliseconds before hiding the tooltip (for mobile devices). |\r\n| display | boolean | true | Tooltip availability for display. |\r\n| displayTouchscreen | boolean | true | Display the tooltip on mobile devices. |\r\n| zIndex | number | 0 | Z-index of the tooltip. |\r\n| trigger | \"hover\", \"click\" | \"hover\" | Specifies how the tooltip is triggered. Control the closing time with \"hide-delay\". |\r\n| tooltipClass | string | | Classes to be passed to the tooltip. |\r\n| animationDuration | number | 300 | The duration controls how long the animation takes to run from start to finish. |\r\n| theme | \"dark\", \"light\" | \"dark\" | Theme of tooltip background and text. |\r\n| shadow | boolean | true | Shadow of the tooltip. |\r\n| offset | number | 8 | Offset the tooltip relative to the item. |\r\n| width | number | undefined | Width of the tooltip. |\r\n| maxWidth | number | 200 | Maximum width of the tooltip. |\r\n| contentType | \"string\", \"html', \"template\" | \"string\" | The content type passed to the tooltip. |\r\n| hideDelayAfterClick | number | 2000 | Tooltip hiding delay for \"click\" trigger. |\r\n| pointerEvents | \"auto\", \"none\" | \"none\" | Defines whether or not an element reacts to pointer events. |\r\n| position | {top: number, left: number} | undefined | The tooltip coordinates relative to the browser window. |\r\n\r\n## Events\r\n\r\nWhen you call events, the delays that are specified in the options in the directive are taken into account. Default delay before tooltip hiding is 300 milliseconds.\r\n\r\n| Event | Description |\r\n|------------------|---------------------------------------------------------------------------------------------|\r\n| {type: \"show\", position: DOMRect} | The event is called before the tooltip appears. |\r\n| {type: \"shown\", position: DOMRect} | The event is called after the animation of the appearance of the tooltip. |\r\n| {type: \"hide\", position: DOMRect} | The event is called before the tooltip is hidden. |\r\n| {type: \"hidden\", position: DOMRect} | The event is called after the animation of the tooltip is hidden. |\r\n\r\n## Methods\r\n\r\nIf you specified the directive options, they will be taken into account when calling methods. Including the delay before the appearance and hiding of the tooltip.\r\n\r\n| Method | Description |\r\n|------------------|---------------------------------------------------------------------------------------------|\r\n| show() | Shows the tooltip |\r\n| hide() | Hides the tooltip |\r\n\r\n## Author services\r\n\r\nAre you interested in this library but lacks features? [Write to the author](https://github.com/drozhzhin-n-e),(https://github.com/Amin-Karimi), he can do it for you.\r\n\r\n## Sponsors\r\n\r\nWe use Browserstack for cross-browser testing.\r\n\r\n[![Browserstack](http://ivylab.space/assets/img/browserstack-logo.png)](http://browserstack.com/)\r\n","readmeFilename":"README.md"}