PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Allows for additional properties

Browse source
This commit is contained in:
Steve Ruiz 2021-09-13 16:59:37 +01:00
parent 2f4a1f97a2
commit 22fbca58d3
7 changed files with 25 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/core/src/components/renderer/renderer.tsx
View file

@ -14,7 +14,7 @@ import { Inputs } from '../../inputs'
import { useTLTheme, TLContext, TLContextType } from '../../hooks'
import type { TLShapeUtil } from '+index'
export interface RendererProps<T extends TLShape, E extends Element, M = any>
export interface RendererProps<T extends TLShape, E extends Element = any, M = any>
extends Partial<TLCallbacks<T>> {
/**
* An object containing instances of your shape classes.

7
packages/core/src/shapes/createShape.spec.tsx
View file

@ -12,8 +12,9 @@ export interface BoxShape extends TLShape {
size: number[]
}
export const Box = new ShapeUtil<BoxShape, SVGSVGElement, null>(() => {
export const Box = new ShapeUtil<BoxShape, SVGSVGElement, null, { age: number }>(() => {
return {
age: 100,
type: 'box',
defaultProps: {
id: 'example1',
@ -90,6 +91,10 @@ describe('shape utils', () => {
expect(Box).toBeTruthy()
})
it('creates a shape utils with extended properties', () => {
expect(Box.age).toBe(100)
})
it('creates a shape', () => {
expect(Box.create({ id: 'box1' })).toStrictEqual({
...boxShape,

21
packages/core/src/shapes/createShape.tsx
View file

@ -5,13 +5,14 @@ import type { TLShape, TLShapeUtil } from '+types'
import Utils from '+utils'
import { intersectPolylineBounds, intersectRayBounds } from '@tldraw/intersect'
export const ShapeUtil = function <T extends TLShape, E extends Element, M = any>(
this: TLShapeUtil<T, E, M>,
export const ShapeUtil = function <T extends TLShape, E extends Element, M = any, K = unknown>(
this: TLShapeUtil<T, E, M> & K,
fn: (
this: TLShapeUtil<T, E, M>
this: TLShapeUtil<T, E, M> & K
) => Partial<TLShapeUtil<T, E, M>> &
Pick<TLShapeUtil<T, E, M>, 'type' | 'defaultProps' | 'Component' | 'Indicator' | 'getBounds'>
) {
Pick<TLShapeUtil<T, E, M>, 'type' | 'defaultProps' | 'Component' | 'Indicator' | 'getBounds'> &
K
): TLShapeUtil<T, E, M> & ReturnType<typeof fn> {
const defaults: Partial<TLShapeUtil<T, E, M>> = {
refMap: new Map(),
@ -211,10 +212,14 @@ export const ShapeUtil = function <T extends TLShape, E extends Element, M = any
return this
} as unknown as {
new <T extends TLShape, E extends Element, M = any>(
new <T extends TLShape, E extends Element, M = any, K = unknown>(
fn: (
this: TLShapeUtil<T, E, M>
) => Partial<TLShapeUtil<T, E, M>> &
Pick<TLShapeUtil<T, E, M>, 'type' | 'defaultProps' | 'Component' | 'Indicator' | 'getBounds'>
): TLShapeUtil<T, E, M>
Pick<
TLShapeUtil<T, E, M>,
'type' | 'defaultProps' | 'Component' | 'Indicator' | 'getBounds'
> &
K
): TLShapeUtil<T, E, M> & ReturnType<typeof fn>
}

4
packages/tldraw/src/shape/shape-utils.tsx
View file

@ -13,6 +13,6 @@ export const tldrawShapeUtils: Record<TLDrawShapeType, any> = {
[TLDrawShapeType.PostIt]: PostIt,
}
export function getShapeUtils<T extends TLDrawShape>(type: TLDrawShapeType) {
return tldrawShapeUtils[type] as TLDrawShapeUtil<T, any>
export function getShapeUtils<T extends TLDrawShape>(type: T['type']) {
return tldrawShapeUtils[type] as TLDrawShapeUtil<T>
}

1
packages/tldraw/src/state/session/sessions/brush/brush.session.ts
View file

@ -1,7 +1,6 @@
import { brushUpdater, Utils } from '@tldraw/core'
import { Vec } from '@tldraw/vec'
import { Data, Session, TLDrawPatch, TLDrawStatus } from '~types'
import { getShapeUtils } from '~shape'
import { TLDR } from '~state/tldr'
export class BrushSession implements Session {

4
packages/tldraw/src/state/tldr.ts
View file

@ -15,9 +15,9 @@ import { Vec } from '@tldraw/vec'
export class TLDR {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
static getShapeUtils<T extends TLDrawShape>(type: T['type']): TLDrawShapeUtil<T, any>
static getShapeUtils<T extends TLDrawShape>(type: T['type']): TLDrawShapeUtil<T>
// eslint-disable-next-line @typescript-eslint/no-explicit-any
static getShapeUtils<T extends TLDrawShape>(shape: T): TLDrawShapeUtil<T, any>
static getShapeUtils<T extends TLDrawShape>(shape: T): TLDrawShapeUtil<T>
static getShapeUtils<T extends TLDrawShape>(shape: T | T['type']) {
return getShapeUtils<T>(typeof shape === 'string' ? shape : shape.type)
}

3
packages/tldraw/src/types.ts
View file

@ -212,8 +212,7 @@ export type TLDrawShape =
| GroupShape
| PostItShape
export interface TLDrawShapeUtil<T extends TLDrawShape, E extends Element>
extends TLShapeUtil<T, E, TLDrawMeta> {
export type TLDrawShapeUtil<T extends TLDrawShape> = TLShapeUtil<T, any, TLDrawMeta> & {
toolType: TLDrawToolType
}