@zeedhi/zd-rating

1.2.1 • Public • Published

Componente Rating para Zeedhi

O component zd-rating foi criado para ser utilizado como uma barra de avaliação

ZdRating Light Example ZdRating Dark Example

Instalação

Para instalar o pacote do componente, basta rodar o comando:
npm i @zeedhi/zd-rating
Com isso, dois pacotes serão instalados: o @zeedhi/zd-rating-common e o @zeedhi/zd-rating-vue.
Após a instalação, é necessário que você importe o pacote @zeedhi/zd-rating-vue dentro de seu arquivo de configuração zeedhi.ts

import { ZdRating } from '@zeedhi/zd-rating-vue';

Vue.component('ZdRating', ZdRating);

Já o pacote @zeedhi/zd-rating-common deve ser importado no arquivo controller do componente.

Uso Básico

Para usar, defina a propriedade component como 'ZdRating'.

{
  "name": "rating-example",
  "component": "ZdRating"
}

Propriedades

Nome Tipo Default Descrição
value number 0 Armazena o valor do ZdRating
backgroundColor string 'var(--zd-font-color)' A cor usada nos ícones vazios
color string 'primary' Aplica a cor especificada aos itens
clearable boolean false Os ícones têm um tamanho menor
emptyIcon string 'star-outline' O ícone exibido quando estiver vazio
fullIcon string 'star' O ícone exibido quando estiver preenchido
halfIcon string 'mdi-star-half-full' O ícone exibido quando estiver pela metade
halfIncrements boolean false Permite a seleção de meio incrementos
hover boolean false Fornece feedback visual ao passar o mouse sobre os ícones
length number | string 5 A quantidade de itens a ser exibido
readonly boolean false Remove todos os efeitos de foco e eventos de ponteiro
size number | string '' Define a altura e a largura do componente.

Eventos

Nome Parametros Descrição
onChange value: number diparado quando o valor do componente é alterado ao click

Readme

Keywords

none

Package Sidebar

Install

npm i @zeedhi/zd-rating

Weekly Downloads

0

Version

1.2.1

License

none

Unpacked Size

3.87 kB

Total Files

3

Last publish

Collaborators

  • zeedhi