How to use the react-md/lib/NavigationDrawers.DrawerType function in react-md

To help you get started, we’ve selected a few react-md examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github mlaursen / react-md / docs / src / app / components / NavigationDrawers / NavigationDrawerExamples.jsx View on Github external
import React, { Component, PropTypes } from 'react';
import ReactDOM from 'react-dom';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import { Link } from 'react-router';

import { RadioGroup, Radio } from 'react-md/lib/SelectionControls';
import FontIcon from 'react-md/lib/FontIcons';
import NavigationDrawer from 'react-md/lib/NavigationDrawers';
const { FULL_HEIGHT, CLIPPED, FLOATING, PERSISTENT, PERSISTENT_MINI, TEMPORARY, TEMPORARY_MINI } = NavigationDrawer.DrawerType;

// amazing way to keep state between routes
let state = {
  isOpen: false,
  drawerType: FULL_HEIGHT,
};

const LOCATION = '/components/navigation-drawers';

export default class NavigationDrawerExamples extends Component {
  constructor(props) {
    super(props);

    this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
    this.state = state;
  }
github mlaursen / react-md / docs / src / examples / navigation-drawers / NewPageDemo.jsx View on Github external
tileClassName: classnames({ active: page === 2 }),
      leftIcon: avatars[1],
    }, {
      primaryText: 'Page 3',
      onClick: this._fakeChangePage.bind(this, 3),
      tileClassName: classnames({ active: page === 3 }),
      leftIcon: avatars[2],
    }];

    return (
      
        
              close
            
          }
        >
          <section>
            <h1>On Page {page}</h1>
            </section>
github mlaursen / react-md / docs / src / examples / navigation-drawers / NavigationDrawerDemo.jsx View on Github external
import React, { PureComponent, PropTypes } from 'react';
import NavigationDrawer from 'react-md/lib/NavigationDrawers';
import SelectField from 'react-md/lib/SelectFields';
import { connect } from 'react-redux';

import { updateDrawerType } from 'actions/ui';

const DrawerType = NavigationDrawer.DrawerType;

const menuItems = [{
  label: 'Full Height',
  value: DrawerType.FULL_HEIGHT,
}, {
  label: 'Clipped',
  value: DrawerType.CLIPPED,
}, {
  label: 'Floating',
  value: DrawerType.FLOATING,
}, {
  label: 'Persistent',
  value: DrawerType.PERSISTENT,
}, {
  label: 'Persistent Mini',
  value: DrawerType.PERSISTENT_MINI,
github mlaursen / react-md / docs / src / examples / navigation-drawers / NewPageDemo.jsx View on Github external
onClick: this._fakeChangePage.bind(this, 2),
      tileClassName: classnames({ active: page === 2 }),
      leftIcon: avatars[1],
    }, {
      primaryText: 'Page 3',
      onClick: this._fakeChangePage.bind(this, 3),
      tileClassName: classnames({ active: page === 3 }),
      leftIcon: avatars[2],
    }];

    return (
      
        
              close
            
          }
        &gt;
          <section>
            <h1>On Page {page}</h1></section>