nad-lib-tags v0.0.2

Tags

Tags Types values

  FILLED = 'filled',
  FILTER = 'filter',
  OUTLINED = 'outlined',
  PROJECT = 'project',
  SKILL = 'skill'

Tags Sub-Types Values

  OVAL = 'oval',
  SEMI_OVAL = 'semi-oval',
  CROSS_FILTER = 'cross-filter',
  DROP_DOWN_FILTER = 'drop-down-filter',
  ORANGE_FILLED_OUTLINE = 'orange-filled-outline',
  PURPLE_OUTLINE = 'purple-outline',
  BLACK_OUTLINE = 'black-outline',
  BLUE_OUTLINE = 'blue-outline',
  PURPLE_FILLED_PROJECT = 'purple-filled-project',
  SKILL_LEVEL_FULL = 'skill-level-full',
  SKILL_LEVEL_SHORT = 'skill-level-short'

Usage

In TS:

tag = {
    // will be the unique key in case of modification or deletion
    id: '12',
    text: 'Project',
    type: 'outlined',
    subType: 'purple-outline',
    skill: {
      name: 'Oracle',
      level: 1,
      icon: './assets/library-icons/ru-tags/mongo.svg'
    }
  };

In HTML:

<lib-nad-tags [tag]="tag" (dropDownStateChange)="dropDownStateChange($event)"></lib-nad-tags>

Demo Link : "DEMO LINK PLACEHOLDER"