Extract admin dashboard from ghabilee-frontend2 into a dedicated Next.js app for backoffice.ghabilee.ir (no SEO indexing / Clarity).
52 lines
1.6 KiB
TypeScript
52 lines
1.6 KiB
TypeScript
import type { CSSProperties, ReactNode } from 'react'
|
|
|
|
/** Figma fill: #F68B1F | #1C2473 | #ED1C24 | #007839 | #F5F5F5 | transparent */
|
|
export type ConsumerButtonFill = 'orange' | 'navy' | 'fourth' | 'fifth' | 'gray' | 'none'
|
|
|
|
/** Figma radius: pill or 10px control */
|
|
export type ConsumerButtonRadius = 'full' | 'control'
|
|
|
|
/** Button height tokens — see `consumer-ui-guidelines.md` (scale differs from ConsumerInput). */
|
|
export type ConsumerButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'
|
|
|
|
/** Content alignment inside the button (RTL: `start` = right) */
|
|
export type ConsumerButtonAlign = 'center' | 'start'
|
|
|
|
export type ConsumerButtonIconPosition = 'start' | 'end'
|
|
|
|
export interface ConsumerButtonProps {
|
|
'aria-controls'?: string
|
|
'aria-expanded'?: boolean | 'true' | 'false'
|
|
'aria-label'?: string
|
|
'aria-pressed'?: boolean | 'true' | 'false'
|
|
'aria-checked'?: boolean | 'true' | 'false'
|
|
'aria-selected'?: boolean | 'true' | 'false'
|
|
align?: ConsumerButtonAlign
|
|
children?: ReactNode
|
|
className?: string
|
|
radius?: ConsumerButtonRadius
|
|
disabled?: boolean
|
|
fill?: ConsumerButtonFill
|
|
fontSize?: number
|
|
fullWidth?: boolean
|
|
icon?: ReactNode
|
|
iconEnd?: ReactNode
|
|
iconOnly?: boolean
|
|
iconPosition?: ConsumerButtonIconPosition
|
|
iconStart?: ReactNode
|
|
isLoading?: boolean
|
|
role?: React.AriaRole
|
|
size?: ConsumerButtonSize
|
|
target?: '_blank' | '_self'
|
|
/** Preset white, Tailwind class (e.g. `text-primary`), or hex (e.g. `#333A44`). */
|
|
textColor?: 'white' | (string & {})
|
|
to?: string
|
|
type?: 'button' | 'submit' | 'reset'
|
|
onClick?: () => void
|
|
}
|
|
|
|
export interface ResolvedConsumerButtonStyle {
|
|
className: string
|
|
style: CSSProperties
|
|
}
|