Bus UI Credential Login Card

A node-based auth form card for username and password sign-in.

Use the credential login card when a portal or admin screen needs a ready-made sign-in surface with username, password, optional request actions, and a POST form.

Component API

Function	Props type	Import path
`CredentialLoginCard`	`CredentialLoginCardProps`	`github.com/busdk/bus-ui/pkg/ui`

When to use it

Use the credential login card node API when the host module wants a full credential card rather than assembling the username, password, submit, and OTP request controls by hand. The public API is pkg/ui.

See also Form, Field, Input, and Reference.

Example

Loading CredentialLoginCard demo...

Go API

import (
  gx "github.com/busdk/bus-gx/pkg/gx"
  ui "github.com/busdk/bus-ui/pkg/ui"
)

node, err := ui.CredentialLoginCard(ui.CredentialLoginCardProps{
  ID:            "portal-login",
  Title:         "Sign in",
  FormMethod:    ui.FormMethodPost,
  FormAction:    "/auth/login",
  UsernameLabel: "Email",
  PasswordLabel: "Password",
  Submit: ui.ButtonProps{
    Label: "Sign in",
  },
})
if err != nil {
  return err
}

html, err := gx.RenderHTML(node)

.gx source

In .gx source, author the visible component state as GX markup. Keep the Go API block above for the package helper or render-boundary call.

package busuiexamples

import gx "github.com/busdk/bus-gx/pkg/gx"

func CredentialLoginCardExample() gx.Node {
  return <form class="credential-login-card" method="post">
  <input name="email" placeholder="you@example.com" type="email"></input>
  <input name="password" type="password"></input>
  <button type="submit"><Text value={"Sign in"}></Text></button>
</form>
}