Installation
npx sdaia-ui@latest add footer
Usage
import { Footer } from "@/components/ui/footer"<Footer type="large-1" />Examples
Large
Footer in the large layout with full navigation and content sections.
Loading demo: footer-large-1
Medium
Footer in the medium layout.
Loading demo: footer-medium
Small
Compact footer in the small layout.
Loading demo: footer-small
API Reference
FooterProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
dir | 'ltr' | 'rtl' | - | optional |
rtl | boolean | false (deprecated) | optional |
compact | boolean | false | optional |
children | ReactNode | - | optional |
FooterLinkColumnsProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
children | ReactNode | - | optional |
FooterNewsletterProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
heading | ReactNode | - | optional |
description | ReactNode | - | optional |
inputPlaceholder | string | 'name@example.com' | optional |
submitLabel | ReactNode | 'Subscribe' | optional |
inputLabel | string | 'Email address' | optional |
inputName | string | 'email' | optional |
onSubmit | (value: string, event: React.FormEvent<HTMLFormElement>) => void | - | optional |
dir | 'ltr' | 'rtl' | - | optional |
FooterAppStoresProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
children | ReactNode | - | optional |
FooterSocialLinksProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
children | ReactNode | - | optional |
FooterBottomBarProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
logo | ReactNode | - | optional |
copyright | ReactNode | - | optional |
extraLinks | FooterBottomBarExtraLink[] | - | optional |
divider | boolean | true | optional |
dir | 'ltr' | 'rtl' | - | optional |
FooterInlineBarProps
Props for the Footer component.
Prop | Type | Default | Required |
|---|---|---|---|
logo | ReactNode | - | optional |
links | FooterBottomBarExtraLink[] | - | optional |
extraLinks | FooterBottomBarExtraLink[] | - | optional |
copyright | ReactNode | - | optional |
dir | 'ltr' | 'rtl' | - | optional |