mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 05:06:55 +04:00
29 lines
1.0 KiB
Plaintext
29 lines
1.0 KiB
Plaintext
---
|
|
import type { HTMLTag } from 'astro/types'
|
|
|
|
// List group container (.list-group).
|
|
|
|
type PolymorphicProps = { as?: HTMLTag }
|
|
|
|
/** core/scss/ui/_lists.scss `.list-group-{size}` density modifiers */
|
|
type ListGroupSize = 'sm' | 'lg'
|
|
|
|
interface Props extends PolymorphicProps {
|
|
size?: ListGroupSize | undefined
|
|
flush?: boolean
|
|
hoverable?: boolean
|
|
/** list-group-selectable: an item with a checked .list-group-selectable-check input gets the active look */
|
|
selectable?: boolean
|
|
transparent?: boolean
|
|
class?: string
|
|
/** remaining attributes (data-sortable, style, …) are forwarded to the element */
|
|
[key: string]: unknown
|
|
}
|
|
|
|
const { as: Element = 'div', size, flush, hoverable, selectable, transparent, class: className, ...rest }: Props = Astro.props
|
|
---
|
|
|
|
<Element class:list={['list-group', size && `list-group-${size}`, flush && 'list-group-flush', hoverable && 'list-group-hoverable', selectable && 'list-group-selectable', transparent && 'list-group-transparent', className]} {...rest}>
|
|
<slot />
|
|
</Element>
|