Necessarily Precedes Mischief

    @cyber4all/clark-tooltip
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0-alpha.3 • Public • Published

    clark-tooltip

    Basic tooltip directive to be used in CLARK system.

    Installation

    To install this library, run:

    $ npm install @cyber4all/clark-tooltip --save

    Using

    From your Angular AppModule:

    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule } from '@angular/core';
     
    import { AppComponent } from './app.component';
     
    // Import module
    import { TooltipModule } from '@cyber4all/clark-tooltip';
     
    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        // Specify as an import
        TooltipModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

    These are all the directive options below:

    <!-- You can now use in any component like so -->
    <h1>
      Welcome to <span tip="This is the name of my site" tipLocation="above">{{strangeTitle}}</span>!
    </h1>
     
    <h6 tipTitle= "tip title" tip="tip text" tipDisabled="{{expression}}" tipTheme="good|bad|neutral|light|dark">Subtitle</h6>
     
    <p>Confusing sentence with <span tip="This is a word" tipLocation="left">words</span></p>
     
    <button tip="Click me!" tipLocation="right" tipDelay="1000">Mysterious Button with 1 second delay</button>
     

    Make sure to place within an inline element of some sort. Spans are your friend.

    Development

    To generate all *.js, *.d.ts and *.metadata.json files:

    $ npm run build

    License

    MIT © Tyler Howard

    Install

    npm i @cyber4all/clark-tooltip

    DownloadsWeekly Downloads

    2

    Version

    1.0.0-alpha.3

    License

    MIT

    Unpacked Size

    39 kB

    Total Files

    10

    Last publish

    Collaborators

    • donseannelly
    • gshaw1997
    • jewel7
    • nrwinner
    • tylernhoward