diff --git a/components/identifiers.js b/components/identifiers.js index bcb2046d..bf567bf1 100644 --- a/components/identifiers.js +++ b/components/identifiers.js @@ -22,3 +22,4 @@ export const SWITCH = 'RTSwitch'; export const TABLE = 'RTTable'; export const TABS = 'RTTabs'; export const TOOLTIP = 'RTTooltip'; +export const TIMEPICKER = 'RTTimePicker'; diff --git a/components/index.js b/components/index.js index fe4c29a3..4d83a958 100644 --- a/components/index.js +++ b/components/index.js @@ -13,27 +13,18 @@ export Dropdown from './dropdown'; export FontIcon from './font_icon'; export Form from './form'; export Input from './input'; -export { Layout, NavDrawer, Panel, Sidebar } from './layout'; +export * from './layout'; export Link from './link'; -export List from './list/List'; -export ListItem from './list/ListItem'; -export ListDivider from './list/ListDivider'; -export ListCheckbox from './list/ListCheckbox'; -export ListSubHeader from './list/ListSubHeader'; -export Menu from './menu/Menu'; -export MenuItem from './menu/MenuItem'; -export MenuDivider from './menu/MenuDivider'; -export IconMenu from './menu/IconMenu'; +export * from './list'; +export * from './menu'; export Navigation from './navigation'; export ProgressBar from './progress_bar'; -export RadioGroup from './radio/RadioGroup'; -export RadioButton from './radio/RadioButton'; +export * from './radio'; export Ripple from './ripple'; export Slider from './slider'; export Snackbar from './snackbar'; export Switch from './switch'; export Table from './table'; -export Tabs from './tabs/Tabs'; -export Tab from './tabs/Tab'; +export * from './tabs'; export Tooltip from './tooltip'; export TimePicker from './time_picker'; diff --git a/components/radio/index.js b/components/radio/index.js index b4d8aad1..62167cce 100644 --- a/components/radio/index.js +++ b/components/radio/index.js @@ -10,5 +10,6 @@ const ThemedRadio = radioFactory(themedRippleFactory({ centered: true, spread: 2 const ThemedRadioButton = themr(RADIO, theme)(radioButtonFactory(ThemedRadio)); const ThemedRadioGroup = themr(RADIO, theme)(radioGroupFactory(ThemedRadioButton)); +export default ThemedRadioButton; export { ThemedRadioButton as RadioButton }; export { ThemedRadioGroup as RadioGroup }; diff --git a/components/time_picker/Clock.js b/components/time_picker/Clock.js index ecc0fad1..13655af3 100644 --- a/components/time_picker/Clock.js +++ b/components/time_picker/Clock.js @@ -1,23 +1,23 @@ -import React from 'react'; +import React, { Component, PropTypes } from 'react'; import CssTransitionGroup from 'react-addons-css-transition-group'; import { ZoomIn, ZoomOut } from '../animations'; -import time from '../utils/time'; -import Hours from './ClockHours'; -import Minutes from './ClockMinutes'; +import time from '../utils/time.js'; +import Hours from './ClockHours.js'; +import Minutes from './ClockMinutes.js'; -class Clock extends React.Component { +class Clock extends Component { static propTypes = { - className: React.PropTypes.string, - display: React.PropTypes.oneOf(['hours', 'minutes']), - format: React.PropTypes.oneOf(['24hr', 'ampm']), - onChange: React.PropTypes.func, - onHandMoved: React.PropTypes.func, - theme: React.PropTypes.shape({ - clock: React.PropTypes.string.isRequired, - clockWrapper: React.PropTypes.string.isRequired, - placeholder: React.PropTypes.string.isRequired + className: PropTypes.string, + display: PropTypes.oneOf(['hours', 'minutes']), + format: PropTypes.oneOf(['24hr', 'ampm']), + onChange: PropTypes.func, + onHandMoved: PropTypes.func, + theme: PropTypes.shape({ + clock: PropTypes.string.isRequired, + clockWrapper: PropTypes.string.isRequired, + placeholder: PropTypes.string.isRequired }), - time: React.PropTypes.object + time: PropTypes.object }; static defaultProps = { diff --git a/components/time_picker/ClockFace.js b/components/time_picker/ClockFace.js index 58dffdc8..4061209b 100644 --- a/components/time_picker/ClockFace.js +++ b/components/time_picker/ClockFace.js @@ -1,18 +1,18 @@ -import React from 'react'; +import React, { Component, PropTypes } from 'react'; import classnames from 'classnames'; -class Face extends React.Component { +class Face extends Component { static propTypes = { - active: React.PropTypes.number, - numbers: React.PropTypes.array, - radius: React.PropTypes.number, - spacing: React.PropTypes.number, - theme: React.PropTypes.shape({ - active: React.PropTypes.string.isRequired, - face: React.PropTypes.string.isRequired, - number: React.PropTypes.string.isRequired + active: PropTypes.number, + numbers: PropTypes.array, + radius: PropTypes.number, + spacing: PropTypes.number, + theme: PropTypes.shape({ + active: PropTypes.string.isRequired, + face: PropTypes.string.isRequired, + number: PropTypes.string.isRequired }), - twoDigits: React.PropTypes.bool + twoDigits: PropTypes.bool }; static defaultProps = { diff --git a/components/time_picker/ClockHand.js b/components/time_picker/ClockHand.js index 8dbd0dd3..d50aa7e1 100644 --- a/components/time_picker/ClockHand.js +++ b/components/time_picker/ClockHand.js @@ -1,20 +1,20 @@ -import React from 'react'; -import events from '../utils/events'; -import prefixer from '../utils/prefixer'; -import utils from '../utils/utils'; +import React, { Component, PropTypes } from 'react'; +import events from '../utils/events.js'; +import prefixer from '../utils/prefixer.js'; +import utils from '../utils/utils.js'; -class Hand extends React.Component { +class Hand extends Component { static propTypes = { - angle: React.PropTypes.number, - className: React.PropTypes.string, - length: React.PropTypes.number, - onMove: React.PropTypes.func, - onMoved: React.PropTypes.func, - origin: React.PropTypes.object, - step: React.PropTypes.number, - theme: React.PropTypes.shape({ - hand: React.PropTypes.string.isRequired, - knob: React.PropTypes.string.isRequired + angle: PropTypes.number, + className: PropTypes.string, + length: PropTypes.number, + onMove: PropTypes.func, + onMoved: PropTypes.func, + origin: PropTypes.object, + step: PropTypes.number, + theme: PropTypes.shape({ + hand: PropTypes.string.isRequired, + knob: PropTypes.string.isRequired }) }; diff --git a/components/time_picker/ClockHours.js b/components/time_picker/ClockHours.js index 50a6a214..5e37cd2e 100644 --- a/components/time_picker/ClockHours.js +++ b/components/time_picker/ClockHours.js @@ -1,23 +1,23 @@ -import React from 'react'; -import utils from '../utils/utils'; -import Face from './ClockFace'; -import Hand from './ClockHand'; +import React, { Component, PropTypes } from 'react'; +import utils from '../utils/utils.js'; +import Hand from './ClockHand.js'; +import Face from './ClockFace.js'; const outerNumbers = [0, ...utils.range(13, 24)]; const innerNumbers = [12, ...utils.range(1, 12)]; const innerSpacing = 1.7; const step = 360 / 12; -class Hours extends React.Component { +class Hours extends Component { static propTypes = { - center: React.PropTypes.object, - format: React.PropTypes.oneOf(['24hr', 'ampm']), - onChange: React.PropTypes.func, - onHandMoved: React.PropTypes.func, - radius: React.PropTypes.number, - selected: React.PropTypes.number, - spacing: React.PropTypes.number, - theme: React.PropTypes.object + center: PropTypes.object, + format: PropTypes.oneOf(['24hr', 'ampm']), + onChange: PropTypes.func, + onHandMoved: PropTypes.func, + radius: PropTypes.number, + selected: PropTypes.number, + spacing: PropTypes.number, + theme: PropTypes.object }; state = { diff --git a/components/time_picker/ClockMinutes.js b/components/time_picker/ClockMinutes.js index 127fa882..2f3bb408 100644 --- a/components/time_picker/ClockMinutes.js +++ b/components/time_picker/ClockMinutes.js @@ -1,20 +1,20 @@ -import React from 'react'; -import utils from '../utils/utils'; -import Face from './ClockFace'; -import Hand from './ClockHand'; +import React, { Component, PropTypes } from 'react'; +import utils from '../utils/utils.js'; +import Hand from './ClockHand.js'; +import Face from './ClockFace.js'; const minutes = utils.range(0, 60, 5); const step = 360 / 60; -class Minutes extends React.Component { +class Minutes extends Component { static propTypes = { - center: React.PropTypes.object, - onChange: React.PropTypes.func, - radius: React.PropTypes.number, - selected: React.PropTypes.number, - spacing: React.PropTypes.number, - theme: React.PropTypes.shape({ - small: React.PropTypes.string.isRequired + center: PropTypes.object, + onChange: PropTypes.func, + radius: PropTypes.number, + selected: PropTypes.number, + spacing: PropTypes.number, + theme: PropTypes.shape({ + small: PropTypes.string.isRequired }) }; diff --git a/components/time_picker/TimePicker.js b/components/time_picker/TimePicker.js index 7ef8a6c3..9210870a 100644 --- a/components/time_picker/TimePicker.js +++ b/components/time_picker/TimePicker.js @@ -1,74 +1,84 @@ -import React from 'react'; +import React, { Component, PropTypes } from 'react'; import classnames from 'classnames'; import { themr } from 'react-css-themr'; -import events from '../utils/events'; -import time from '../utils/time'; -import Input from '../input'; -import TimePickerDialog from './TimePickerDialog'; +import { TIME_PICKER } from '../identifiers.js'; +import events from '../utils/events.js'; +import time from '../utils/time.js'; +import InjectDialog from '../dialog/Dialog.js'; +import InjectInput from '../input/Input.js'; +import timePickerDialogFactory from './TimePickerDialog.js'; -class TimePicker extends React.Component { - static propTypes = { - className: React.PropTypes.string, - error: React.PropTypes.string, - format: React.PropTypes.oneOf(['24hr', 'ampm']), - inputClassName: React.PropTypes.string, - label: React.PropTypes.string, - onChange: React.PropTypes.func, - theme: React.PropTypes.shape({ - input: React.PropTypes.string.isRequired - }), - value: React.PropTypes.object - }; +const factory = (TimePickerDialog, Input) => { + class TimePicker extends Component { + static propTypes = { + className: PropTypes.string, + error: PropTypes.string, + format: PropTypes.oneOf(['24hr', 'ampm']), + inputClassName: PropTypes.string, + label: PropTypes.string, + onChange: PropTypes.func, + theme: PropTypes.shape({ + input: PropTypes.string.isRequired + }), + value: PropTypes.object + }; - static defaultProps = { - className: '', - format: '24hr' - }; + static defaultProps = { + className: '', + format: '24hr' + }; - state = { - active: false - }; + state = { + active: false + }; - handleDismiss = () => { - this.setState({active: false}); - }; + handleDismiss = () => { + this.setState({active: false}); + }; - handleInputMouseDown = (event) => { - events.pauseEvent(event); - this.setState({active: true}); - }; + handleInputMouseDown = (event) => { + events.pauseEvent(event); + this.setState({active: true}); + }; - handleSelect = (value, event) => { - if (this.props.onChange) this.props.onChange(value, event); - this.setState({active: false}); - }; + handleSelect = (value, event) => { + if (this.props.onChange) this.props.onChange(value, event); + this.setState({active: false}); + }; - render () { - const { value, format, inputClassName, theme } = this.props; - const formattedTime = value ? time.formatTime(value, format) : ''; - return ( -