Init

Preview: http://dashboards.webkom.co/react/airframe

app/components/ExtendedDropdown/ExtendedDropdown.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { DropdownMenu } from 'reactstrap';
+
+export const ExtendedDropdown = ({ className, ...otherProps }) => {
+    const classes = classNames(
+        className,
+        'extended-dropdown'
+    );
+    return (
+        <DropdownMenu className={ classes } { ...otherProps } />
+    );
+}
+ExtendedDropdown.propTypes = {
+    className: PropTypes.string,
+};

app/components/ExtendedDropdown/ExtendedDropdownLink.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { DropdownContext } from 'reactstrap/es/DropdownContext';
+
+const ExtendedDropdownLink = (props) => {
+    const { children, ...otherProps } = props;
+
+    return (
+        <DropdownContext.Consumer>
+        {
+            ({ toggle }) => (
+                <Link { ...otherProps } onClick={ () => { toggle(); } }>
+                    { children }
+                </Link>
+            )
+        }
+        </DropdownContext.Consumer>        
+    );
+};
+ExtendedDropdownLink.propTypes = { ...Link.propTypes };
+ExtendedDropdownLink.defaultProps = { ...Link.defaultProps };
+
+export { ExtendedDropdownLink };

app/components/ExtendedDropdown/ExtendedDropdownSection.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+
+const ExtendedDropdownSection = (props) => {
+    const { children, list, className, tag, ...otherProps } = props;
+    const sectionClass = classNames(
+        "extended-dropdown__section", className, {
+            "extended-dropdown__section--list": list
+        }
+    );
+    const Tag = tag;
+
+    return (
+        <Tag className={ sectionClass } { ...otherProps }>
+            { children }
+        </Tag>
+    );
+};
+ExtendedDropdownSection.propTypes = {
+    children: PropTypes.node,
+    list: PropTypes.bool,
+    className: PropTypes.string,
+    tag: PropTypes.oneOfType([PropTypes.string, PropTypes.func])
+};
+ExtendedDropdownSection.defaultProps = {
+    tag: "div"
+};
+
+export { ExtendedDropdownSection };

app/components/ExtendedDropdown/index.js

@@ -0,0 +1,8 @@
+import { ExtendedDropdown } from './ExtendedDropdown';
+import { ExtendedDropdownSection } from './ExtendedDropdownSection';
+import { ExtendedDropdownLink } from './ExtendedDropdownLink';
+
+ExtendedDropdown.Section = ExtendedDropdownSection;
+ExtendedDropdown.Link = ExtendedDropdownLink;
+
+export default ExtendedDropdown;