todovue-label

2.3.0 • Public • Published

TODOvue logo

TODOvue Label

TvLabel is a custom label component for web applications.

npm Netlify Status Pipeline npm npm GitHub GitHub Release Date

TODOvue Label Vue TODOvue Label Html TODOvue Label edit TODOvue Label remove

Table of Contents

Installation

Install with npm or yarn

npm install todovue-label
yarn add todovue-label

Import

import { TvLabel } from 'todovue-label'

You can also import it directly in the main.js file, so you don't have to import it in the pages

import { createApp } from "vue";
import App from "./App.vue";
import TvLabel from "todovue-label";

const app = createApp(App);
app.component("TvLabel", TvLabel);
app.mount("#app");

Usage

<template>
  <tv-label @click-label="clickHandler" color="#4FC08D">
    Vue
  </tv-label>
</template>

<script>
  import TvLabel from "todovue-label"; // Only if you have not imported it from main
  export default {
    components: {
      TvLabel // Only if you have not imported it from main
    },
    setup() {
      const clickHandler = () => {
        console.log("clicked");
      }

      return {
        clickHandler
      }
    }
  }
</script>

Props

Name Type Default Description
color String '' label color in hexadecimal
textLabel String '' If you don't want to send the name by slot you can send it by property
isEdit Boolean false If you want to show the edit icon
isRemove Boolean false If you want to show the remove icon
iconPosition String right If you want to show the icons on the left or right side of the label

Events

Name Description
click-label Event that is triggered when the label is clicked

Development

Clone the repository and install the dependencies

git https://github.com/TODOvue/todovue-label.git
cd todovue-label

Install the dependencies

yarn install

Run the project

yarn demo

Run the tests

yarn test:unit

Run the linter

yarn lint

Run the build It is not necessary to generate build, since it is generated when you do PR to the master branch

yarn build

License

MIT

Package Sidebar

Install

npm i todovue-label

Weekly Downloads

2

Version

2.3.0

License

MIT

Unpacked Size

424 kB

Total Files

14

Last publish

Collaborators

  • cristhiandaza