/
githubmirror
/
tldraw
Обзор
Документация
Войти
/
githubmirror
/
tldraw
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
templates/shader/src/shadow/ShadowControlPanel.tsx
52 строки
1 KB
Lu Wilson
Shader starter kit (#6847)
04 окт 2025, 23:17
Не верифицирован
04 окт 2025, 23:17
24319e4
Код
Авторство
О чём код?
import { useCallback } from 'react' import { useValue } from 'tldraw' import { ConfigPanel } from '../config-panel/ConfigPanel' import { ConfigPanelBooleanControl } from '../config-panel/ConfigPanelBooleanControl' import { ConfigPanelSlider } from '../config-panel/ConfigPanelSlider' import { resetShaderConfig, shaderConfig } from './config' const SLIDER_CONFIGS: Record<string, { min: number; max: number }> = { quality: { min: 0.1, max: 1 }, shadowContrast: { min: 0, max: 1 }, } export function ShadowControlPanel() { const config = useValue('config', () => shaderConfig.get(), []) const handleChange = useCallback((prop: string, value: number | boolean) => { shaderConfig.update((prev) => ({ ...prev, [prop]: value })) }, []) return ( <ConfigPanel onReset={resetShaderConfig}> {Object.entries(config).map(([prop, value], i) => { if (typeof value === 'number') { const sliderConfig = SLIDER_CONFIGS[prop] || { min: 0, max: 1 } return ( <ConfigPanelSlider key={i} prop={prop} label={prop} min={sliderConfig.min} max={sliderConfig.max} value={value} type="float" onChange={handleChange} /> ) } else if (typeof value === 'boolean') { return ( <ConfigPanelBooleanControl key={i} prop={prop} label={prop} value={value} onChange={handleChange} /> ) } return null })} </ConfigPanel> ) }