0.0.14 • Published 2 months ago

@hotmart/hot-login v0.0.14

Weekly downloads
-
License
MIT
Repository
-
Last release
2 months ago

Build Status npm version Built With Stencil

hot-login

Este package tem como finalidade auxiliar a integração com o SSO da Hotmart.

Como instalar

Você pode consumir o package via CDN (direto no HTML, sem a necessidade de baixar no projeto) ou adicionando no seu bundle JS, instalando via NPM

CDN (unpkg)

Basta inserir a tag script com o source do package no seu arquivo HTML e os componentes customizados já estarão disponíveis para uso

<script src="https://unpkg.com/@hotmart/hot-login/dist/hot-login/hot-login.esm.js" type="module"></script>

NPM

Instale o package executando:

npm install @hotmart/hot-login

Em seguida, faça a importação do package na raiz da sua aplicação Javascript

import '@hotmart/hot-login/dist/hot-login/hot-login.esm';

Como usar os componentes

Hot Login Button

Este componente de botão tem a única finalidade de redirecionar o usuário para a tela de SSO da Hotmart. Basta chamar o elemento hot-login-button com os seguintes atributos:

<hot-login-button client-id="" redirect-uri="" scopes="" state="" code-challenge=""></hot-login-button>
  • client-id: ClientId disponível na sessão de credenciais da plataforma Hotmart após a criação do service de autenticação. Para solicitar a criação de um service basta preencher o seguinte formulário;
  • redirect-uri: URI de callback cadastrada no service de autenticação. Para consulta-la, acesse as credenciais da plataforma Hotmart;
  • scopes: Escopos de acesso desejados. Ex: developers club sales subscriptions;
  • state: Hash MD5 criado na aplicação back-end responsável por implementar o Hotmart Autenticação. Guia de implementação;
  • code-challenge: Hash SHA256 criado na aplicação back-end responsável por implementar o Hotmart Autenticação. Guia de implementação;

Propriedades

PropertyAttributeDescriptionTypeDefault
clientIdclient-idstringundefined
redirectUriredirect-uristringundefined
scopesscopesstringundefined
statestatestringundefined
codeChallengecode-challengestringundefined
fullfullbooleanfalse
roundedroundedbooleanfalse
sizesize"large" \| "medium" \| "small"'medium'
tabtabstring'0'
<hot-login-button
  client-id=""
  redirect-uri=""
  scopes=""
  state=""
  code-challenge=""
  full="true"
  rounded="true"
  size="large"
  tab="-1"
></hot-login-button>

Como NÃO usar

Por uma questões de branding e tom de voz, não permitimos a alteração do texto do botão. Sendo assim, as assinaturas a seguir não irá renderizar com sucesso

<hot-login-button>Login com a Hotmart</hot-login-button>
<hot-login-button>
  <span>Login com a Hotmart</span>
</hot-login-button>
0.0.14

2 months ago

0.0.11

2 years ago

0.0.12

2 years ago

0.0.13

2 years ago

0.0.10

2 years ago

0.0.9

2 years ago

0.0.8

2 years ago

0.0.7

2 years ago

0.0.6

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.2

2 years ago