AuthLayoutBrand

Logo or wordmark pinned to the top corner on the art’s side: left in split and centered, right in split-reverse once the art sits beside the panel, so it never lands on the card.

Import

import { AuthLayoutBrand } from "@jcsoftdev/ui/auth";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/auth/auth-layout.

Usage

<AuthLayoutBrand layout="split" state="idle" progress={0} activeIndex={0}>
  <>
          <AuthLayout.Brand>EduModules</AuthLayout.Brand>
          <AuthLayout.Art />
          <AuthLayout.Panel>
            <PanelContent />
          </AuthLayout.Panel>
          <AuthLayout.Footer>Soporte: ayuda@edumodules.pe</AuthLayout.Footer>
        </>
</AuthLayoutBrand>

Props

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

Storybook stories

• Split
• Split Reverse
• Centered
• Typing
• Error State
• Success
• Container Widths
• Custom Illustration
• Brand Follows Art

Source

packages/ui/src/auth/auth-layout/auth-layout.tsx