import React from 'react' import enhanceWithClickOutside from 'react-click-outside' import ThemeSelect from './ThemeSelect' import FontSelect from './FontSelect' import Slider from './Slider' import Toggle from './Toggle' import WindowPointer from './WindowPointer' import { COLORS } from '../lib/constants' import { toggle, formatCode } from '../lib/util' import SettingsIcon from './svg/Settings' import * as Arrows from './svg/Arrows' //import Remove from './svg/Remove' const WindowSettings = React.memo( ({ onChange, windowTheme, paddingHorizontal, paddingVertical, dropShadow, dropShadowBlurRadius, dropShadowOffsetY, windowControls, lineNumbers, widthAdjustment, watermark }) => { return (
{dropShadow && (
)}
) } ) const TypeSettings = React.memo(({ onChange, font, size, lineHeight }) => { return (
) }) const MiscSettings = React.memo(({ format, reset }) => { return (
) }) const MenuButton = React.memo(({ name, select, selected }) => { return ( ) }) /*const Presets = React.memo(({ show, presets, toggle, create, remove }) => { return (
Presets {show && }
{show && (
{presets.map(({ id, backgroundColor, userCreated }) => (
{ userCreated ? : null }
))}
)}
) })*/ class Settings extends React.PureComponent { state = { isVisible: false, selectedMenu: 'Window', showPresets: false } toggleVisible = () => this.setState(toggle('isVisible')) togglePresets = () => this.setState(toggle('showPresets')) handleClickOutside = () => this.setState({ isVisible: false }) format = () => formatCode(this.props.code) .then(this.props.onChange.bind(this, 'code')) .catch(() => { // create toast here in the future }) selectMenu = selectedMenu => () => this.setState({ selectedMenu }) renderContent = () => { switch (this.state.selectedMenu) { case 'Window': return ( ) case 'Type': return ( ) case 'Misc': return default: return null } } render() { const { isVisible, selectedMenu } = this.state return (
{this.renderContent()}
) } } export default enhanceWithClickOutside(Settings)