@cimpress/react-components
Version:
React components to support the MCP styleguide
82 lines • 3.24 kB
JavaScript
import React from 'react';
import { CodeExample } from '@cimpress/react-components';
import DropdownCode from '!raw-loader!./dropdown.jsx';
import DropdownDemo from './dropdown.jsx';
import ComponentDoc from '../../shared/TabbedComponentDoc';
const DropdownDocs = () => {
const propInfos = [
{
name: 'style',
type: 'object',
default: '',
description: 'Inline styles to be applied to the root dropdown div.',
},
{
name: 'className',
type: 'string',
default: '',
description: 'Additional class names to be applied to the dropdown btn-group.',
},
{
name: 'variant',
type: 'string',
default: 'default',
description: (React.createElement("div", null,
"The variant of dropdown you are creating, providing one of the following values:",
React.createElement("ul", null,
React.createElement("li", null, "default"),
React.createElement("li", null, "simple"),
React.createElement("li", null, "navtab")),
"If ",
React.createElement("code", null, "navtab"),
" is used, the ",
React.createElement("code", null, "as"),
" prop will be overridden to be a",
' ',
React.createElement("code", null, '<li> </li>'),
" tag and the",
React.createElement("code", null, "innerAs"),
" prop will be overridden to be a ",
React.createElement("code", null, '<a> </a>'),
" tag.")),
},
{
name: 'title',
type: 'node',
default: '',
description: 'Title for the dropdown button.',
},
{
name: 'disabled',
type: 'boolean',
default: 'false',
description: 'Whether or not to disable the dropdown button. If there are no children, the dropdown will be disabled by default.',
},
{
name: 'children',
type: 'node',
default: '',
description: (React.createElement("span", null,
"Items to display in the dropdown. These should probably be ",
React.createElement("code", null, "<a>"),
" or",
' ',
React.createElement("code", null, "<button>"),
" elements. An ",
React.createElement("code", null, "<hr/>"),
" can be used to create a divider.")),
},
{
name: 'as',
type: 'string',
default: 'div',
description: `What html tag to use as the root containing dom element.
Will be set to a list item tag (<li> </li>) if using navtab type.`,
},
];
return (React.createElement(ComponentDoc, { name: "Dropdown", propInfos: propInfos },
React.createElement(DropdownDemo, null),
React.createElement(CodeExample, { code: DropdownCode })));
};
export default DropdownDocs;
//# sourceMappingURL=index.js.map