@sankhyalabs/ezui-docs

ez-chip

CSS Variables

Variable	Description
--ez-label-chip--height	Define a altura do chip.
--ez-label-chip__label--font-size	Define o tamanho do label.
--ez-label-chip__label--font-family	Define a família da fonte do label.
--ez-label-chip__label--font-weight	Define o peso da fonte do label.
--ez-label-chip__label--space--medium	Define o espaçamento do label.
--ez-label-chip__label--title--primary	Define a cor do texto.
--ez-label-chip__label--text--primary	Define a cor do ícone.
--ez-label-chip__label__container--border-radius	Define o raio da borda do container do chip.
--ez-label-chip__label__container--border	Define o estilo da borda do container.
--ez-label-chip__label__container--border-color-strokes	Define a cor da borda do container.
--ez-label-chip__label__container--color-primary	Define a cor do texto, do ícone do label e do botão de remoção (quando o chip está ativo).
--ez-label-chip__label__container-color--disable-secondary	Define a cor da borda e do fundo quando o chip está desativado.
--ez-label-chip__label__container--background-color	Define a cor de fundo do container quando ativo.
--ez-label-chip__label__container--border-color	Define a cor da borda do container quando ativo.
--ez-label-chip__label__container--default--border-color--active	Define a cor da borda do container quando o cursor está sobre ele.
--ez-label-chip__label__container--default--background-color--hover	Define a cor do fundo do container quando o cursor está sobre ele.
--ez-label-chip__label__container--default--color--hover	Define a cor do texto quando o cursor está sobre ele.
--ez-label-chip__label__container--text--disabled	Define a cor do texto e do ícone quando o chip está desabilitado.
--ez-label-chip__label__container--default--border-color--active	Define a cor da borda quando o componente está ativo.

Properties

Property	Attribute	Description	Type	Default
enabled	enabled	Deixa o componente disponível ou não para seleção.	boolean	true
label	label	Título exibido no componente.	string	undefined
mode	mode	Define o modo de uso do cjip: label ou action	"action" | "label"	undefined
removePosition	remove-position	Indica se o componente terá a opção de ser removido e qual sua posição: left ou right.	"left" | "right"	undefined
value	value	Indica se o componente está ou não ativado.	boolean	false

Events

Event	Description	Type
actionClick	Evento disparado ao clicar no chip usando o modo "action" (onActionClick).	CustomEvent<void>
removeChip	Evento disparado ao clicar no botão de remoção (onRemoveChip).	CustomEvent<void>
valueChange	Evento disparado quando o estado do componente mudar (onValueChange).	CustomEvent<boolean>

Methods

setBlur() => Promise<void>

Remove o foco no componente de input

Returns

Type: Promise<void>

setFocus() => Promise<void>

Faz o foco no componente de input

Returns

Type: Promise<void>

Dependencies

Depends on

• ez-icon

Graph

graph TD;
  ez-chip --> ez-icon
  style ez-chip fill:#f9f,stroke:#333,stroke-width:4px

---