b88a2370b3
Removes `propsForNextShape` and replaces it with the new styles API. Changes in here: - New custom style example - `setProp` is now `setStyle` and takes a `StyleProp` instead of a string - `Editor.props` and `Editor.opacity` are now `Editor.sharedStyles` and `Editor.sharedOpacity` - They return an object that flags mixed vs shared types instead of using null to signal mixed types - `Editor.styles` returns a `SharedStyleMap` - keyed on `StyleProp` instead of `string` - `StateNode.shapeType` is now the shape util rather than just a string. This lets us pull the styles from the shape type directly. - `color` is no longer a core part of the editor set on the shape parent. Individual child shapes have to use color directly. - `propsForNextShape` is now `stylesForNextShape` - `InstanceRecordType` is created at runtime in the same way `ShapeRecordType` is. This is so it can pull style validators out of shape defs for `stylesForNextShape` - Shape type are now defined by their props rather than having separate validators & type defs ### Change Type - [x] `major` — Breaking change ### Test Plan 1. Big time regression testing around styles! 2. Check UI works as intended for all shape/style/tool combos - [x] Unit Tests - [ ] End to end tests ### Release Notes - --------- Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
24 lines
770 B
TypeScript
24 lines
770 B
TypeScript
import { defineMigrations } from '@tldraw/store'
|
|
import { T } from '@tldraw/validate'
|
|
import { DefaultColorStyle } from '../styles/TLColorStyle'
|
|
import { DefaultSizeStyle } from '../styles/TLSizeStyle'
|
|
import { ShapePropsType, TLBaseShape } from './TLBaseShape'
|
|
import { DrawShapeSegment } from './TLDrawShape'
|
|
|
|
/** @public */
|
|
export const highlightShapeProps = {
|
|
color: DefaultColorStyle,
|
|
size: DefaultSizeStyle,
|
|
segments: T.arrayOf(DrawShapeSegment),
|
|
isComplete: T.boolean,
|
|
isPen: T.boolean,
|
|
}
|
|
|
|
/** @public */
|
|
export type TLHighlightShapeProps = ShapePropsType<typeof highlightShapeProps>
|
|
|
|
/** @public */
|
|
export type TLHighlightShape = TLBaseShape<'highlight', TLHighlightShapeProps>
|
|
|
|
/** @internal */
|
|
export const highlightShapeMigrations = defineMigrations({})
|