Sha256: caa2cae7698e2805d0bb55f7571f8484bc794cfd09c8ed03a928b7b6219c981c
Contents?: true
Size: 1.75 KB
Versions: 37
Compression:
Stored size: 1.75 KB
Contents
/* @flow */
import React, { type Node } from 'react'
import classnames from 'classnames'
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
import { globalProps } from '../utilities/globalProps.js'
type ListProps = {
aria?: object,
borderless: boolean,
className?: string,
children: array<Node> | Node,
dark: boolean,
data?: object,
id?: string,
layout: "" | "left" | "right",
ordered: boolean,
role?: string,
tabIndex?: string,
size?: string,
xpadding: boolean,
}
const List = (props: ListProps) => {
const {
aria = {},
borderless = false,
children,
className,
dark = false,
data = {},
id,
layout = '',
ordered = false,
role,
size = '',
tabIndex,
xpadding = false,
} = props
const layoutClass = {
left: 'layout_left',
right: 'layout_right',
default: '',
}
const ariaProps = buildAriaProps(aria)
const dataProps = buildDataProps(data)
const classes = classnames(
buildCss('pb_list_kit', layoutClass[layout], size, {
dark: dark,
borderless: borderless,
ordered: ordered,
xpadding: xpadding,
}), className,
globalProps(props)
)
return (
<div
className={classes}
>
<If condition={ordered}>
<ol
{...ariaProps}
{...dataProps}
className={className}
id={id}
role={role}
tabIndex={tabIndex}
>
{children}
</ol>
<Else />
<ul
{...ariaProps}
{...dataProps}
className={className}
id={id}
role={role}
tabIndex={tabIndex}
>
{children}
</ul>
</If>
</div>
)
}
export default List
Version data entries
37 entries across 37 versions & 1 rubygems