More style tweaks
This commit is contained in:
parent
541b6287e2
commit
85e468b597
7 changed files with 22 additions and 14 deletions
|
@ -4,8 +4,9 @@ import React, {useCallback} from 'react'
|
|||
import {useEditingToolsForPrimitiveProp} from './utils/useEditingToolsForPrimitiveProp'
|
||||
import {SingleRowPropEditor} from './utils/SingleRowPropEditor'
|
||||
import styled from 'styled-components'
|
||||
import BasicCheckbox from '@theatre/studio/uiComponents/form/BasicCheckbox'
|
||||
|
||||
const Input = styled.input`
|
||||
const Input = styled(BasicCheckbox)`
|
||||
margin-left: 6px;
|
||||
`
|
||||
|
||||
|
@ -25,7 +26,7 @@ const BooleanPropEditor: React.FC<{
|
|||
|
||||
return (
|
||||
<SingleRowPropEditor {...{stuff, propConfig, pointerToProp}}>
|
||||
<Input type="checkbox" checked={stuff.value} onChange={onChange} />
|
||||
<Input checked={stuff.value} onChange={onChange} />
|
||||
</SingleRowPropEditor>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import type {PropTypeConfig_Number} from '@theatre/core/propTypes'
|
||||
import type SheetObject from '@theatre/core/sheetObjects/SheetObject'
|
||||
import BasicNumberEditor from '@theatre/studio/uiComponents/form/BasicNumberEditor'
|
||||
import BasicNumberInput from '@theatre/studio/uiComponents/form/BasicNumberInput'
|
||||
import React from 'react'
|
||||
import {useEditingToolsForPrimitiveProp} from './utils/useEditingToolsForPrimitiveProp'
|
||||
import {SingleRowPropEditor} from './utils/SingleRowPropEditor'
|
||||
|
@ -14,7 +14,7 @@ const NumberPropEditor: React.FC<{
|
|||
|
||||
return (
|
||||
<SingleRowPropEditor {...{stuff, propConfig, pointerToProp}}>
|
||||
<BasicNumberEditor
|
||||
<BasicNumberInput
|
||||
value={stuff.value}
|
||||
temporarilySetValue={stuff.temporarilySetValue}
|
||||
discardTemporaryValue={stuff.discardTemporaryValue}
|
||||
|
|
|
@ -3,8 +3,8 @@ import type SheetObject from '@theatre/core/sheetObjects/SheetObject'
|
|||
import React, {useCallback} from 'react'
|
||||
import {useEditingToolsForPrimitiveProp} from './utils/useEditingToolsForPrimitiveProp'
|
||||
import type {$IntentionalAny} from '@theatre/shared/utils/types'
|
||||
import BasicSwitchEditor from '@theatre/studio/uiComponents/form/BasicSwitchEditor'
|
||||
import BasicSelectEditor from '@theatre/studio/uiComponents/form/BasicSelectEditor'
|
||||
import BasicSwitch from '@theatre/studio/uiComponents/form/BasicSwitch'
|
||||
import BasicSelect from '@theatre/studio/uiComponents/form/BasicSelect'
|
||||
import {SingleRowPropEditor} from './utils/SingleRowPropEditor'
|
||||
|
||||
const StringLiteralPropEditor: React.FC<{
|
||||
|
@ -24,13 +24,13 @@ const StringLiteralPropEditor: React.FC<{
|
|||
return (
|
||||
<SingleRowPropEditor {...{stuff, propConfig, pointerToProp}}>
|
||||
{propConfig.as === 'menu' ? (
|
||||
<BasicSelectEditor
|
||||
<BasicSelect
|
||||
value={stuff.value}
|
||||
onChange={onChange}
|
||||
options={propConfig.options}
|
||||
/>
|
||||
) : (
|
||||
<BasicSwitchEditor
|
||||
<BasicSwitch
|
||||
value={stuff.value}
|
||||
onChange={onChange}
|
||||
options={propConfig.options}
|
||||
|
|
7
theatre/studio/src/uiComponents/form/BasicCheckbox.tsx
Normal file
7
theatre/studio/src/uiComponents/form/BasicCheckbox.tsx
Normal file
|
@ -0,0 +1,7 @@
|
|||
import styled from 'styled-components'
|
||||
|
||||
const BasicCheckbox = styled.input.attrs({type: 'checkbox'})`
|
||||
outline: none;
|
||||
`
|
||||
|
||||
export default BasicCheckbox
|
|
@ -59,7 +59,7 @@ type IState_Dragging = {
|
|||
|
||||
type IState = IState_NoFocus | IState_EditingViaKeyboard | IState_Dragging
|
||||
|
||||
const BasicNumberEditor: React.FC<{
|
||||
const BasicNumberInput: React.FC<{
|
||||
value: number
|
||||
temporarilySetValue: (v: number) => void
|
||||
discardTemporaryValue: () => void
|
||||
|
@ -257,4 +257,4 @@ function format(v: number): string {
|
|||
return isNaN(v) ? 'NaN' : isInteger(v) ? v.toFixed(0) : round(v, 3).toString()
|
||||
}
|
||||
|
||||
export default BasicNumberEditor
|
||||
export default BasicNumberInput
|
|
@ -31,7 +31,7 @@ const Select = styled.select`
|
|||
}
|
||||
`
|
||||
|
||||
const BasicSelectEditor: React.FC<{
|
||||
const BasicSelect: React.FC<{
|
||||
value: string
|
||||
onChange: (val: string) => void
|
||||
options: Record<string, string>
|
||||
|
@ -54,4 +54,4 @@ const BasicSelectEditor: React.FC<{
|
|||
)
|
||||
}
|
||||
|
||||
export default BasicSelectEditor
|
||||
export default BasicSelect
|
|
@ -47,7 +47,7 @@ const Input = styled.input`
|
|||
height: 0;
|
||||
`
|
||||
|
||||
const BasicSwitchEditor: React.FC<{
|
||||
const BasicSwitch: React.FC<{
|
||||
value: string
|
||||
onChange: (val: string) => void
|
||||
options: Record<string, string>
|
||||
|
@ -76,4 +76,4 @@ const BasicSwitchEditor: React.FC<{
|
|||
)
|
||||
}
|
||||
|
||||
export default BasicSwitchEditor
|
||||
export default BasicSwitch
|
Loading…
Reference in a new issue