@bigbluebutton/tlschema 2.0.0-alpha.19

package/src/shapes/TLFrameShape.ts

@@ -0,0 +1,18 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const frameShapeProps = {
+	w: T.nonZeroNumber,
+	h: T.nonZeroNumber,
+	name: T.string,
+}
+
+type TLFrameShapeProps = ShapePropsType<typeof frameShapeProps>
+
+/** @public */
+export type TLFrameShape = TLBaseShape<'frame', TLFrameShapeProps>
+
+/** @internal */
+export const frameShapeMigrations = defineMigrations({})

package/src/shapes/TLGeoShape.ts

@@ -0,0 +1,226 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { StyleProp } from '../styles/StyleProp'
+import { DefaultColorStyle, DefaultLabelColorStyle } from '../styles/TLColorStyle'
+import { DefaultDashStyle } from '../styles/TLDashStyle'
+import { DefaultFillStyle } from '../styles/TLFillStyle'
+import { DefaultFontStyle } from '../styles/TLFontStyle'
+import {
+	DefaultHorizontalAlignStyle,
+	TLDefaultHorizontalAlignStyle,
+} from '../styles/TLHorizontalAlignStyle'
+import { DefaultSizeStyle } from '../styles/TLSizeStyle'
+import { DefaultVerticalAlignStyle } from '../styles/TLVerticalAlignStyle'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const GeoShapeGeoStyle = StyleProp.defineEnum('tldraw:geo', {
+	defaultValue: 'rectangle',
+	values: [
+		'cloud',
+		'rectangle',
+		'ellipse',
+		'triangle',
+		'diamond',
+		'pentagon',
+		'hexagon',
+		'octagon',
+		'star',
+		'rhombus',
+		'rhombus-2',
+		'oval',
+		'trapezoid',
+		'arrow-right',
+		'arrow-left',
+		'arrow-up',
+		'arrow-down',
+		'x-box',
+		'check-box',
+	],
+})
+
+/** @public */
+export type TLGeoShapeGeoStyle = T.TypeOf<typeof GeoShapeGeoStyle>
+
+/** @public */
+export const geoShapeProps = {
+	geo: GeoShapeGeoStyle,
+	labelColor: DefaultLabelColorStyle,
+	color: DefaultColorStyle,
+	fill: DefaultFillStyle,
+	dash: DefaultDashStyle,
+	size: DefaultSizeStyle,
+	font: DefaultFontStyle,
+	align: DefaultHorizontalAlignStyle,
+	verticalAlign: DefaultVerticalAlignStyle,
+	url: T.string,
+	w: T.nonZeroNumber,
+	h: T.nonZeroNumber,
+	growY: T.positiveNumber,
+	text: T.string,
+}
+
+/** @public */
+export type TLGeoShapeProps = ShapePropsType<typeof geoShapeProps>
+
+/** @public */
+export type TLGeoShape = TLBaseShape<'geo', TLGeoShapeProps>
+
+const Versions = {
+	AddUrlProp: 1,
+	AddLabelColor: 2,
+	RemoveJustify: 3,
+	AddCheckBox: 4,
+	AddVerticalAlign: 5,
+	MigrateLegacyAlign: 6,
+	AddCloud: 7,
+} as const
+
+export { Versions as GeoShapeVersions }
+
+/** @internal */
+export const geoShapeMigrations = defineMigrations({
+	currentVersion: Versions.AddCloud,
+	migrators: {
+		[Versions.AddUrlProp]: {
+			up: (shape) => {
+				return { ...shape, props: { ...shape.props, url: '' } }
+			},
+			down: (shape) => {
+				const { url: _, ...props } = shape.props
+				return { ...shape, props }
+			},
+		},
+		[Versions.AddLabelColor]: {
+			up: (record) => {
+				return {
+					...record,
+					props: {
+						...record.props,
+						labelColor: 'black',
+					},
+				}
+			},
+			down: (record) => {
+				const { labelColor: _, ...props } = record.props
+				return {
+					...record,
+					props,
+				}
+			},
+		},
+		[Versions.RemoveJustify]: {
+			up: (shape) => {
+				let newAlign = shape.props.align
+				if (newAlign === 'justify') {
+					newAlign = 'start'
+				}
+
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: newAlign,
+					},
+				}
+			},
+			down: (shape) => {
+				return { ...shape }
+			},
+		},
+		[Versions.AddCheckBox]: {
+			up: (shape) => {
+				return { ...shape }
+			},
+			down: (shape) => {
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						geo: shape.props.geo === 'check-box' ? 'rectangle' : shape.props.geo,
+					},
+				}
+			},
+		},
+		[Versions.AddVerticalAlign]: {
+			up: (shape) => {
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						verticalAlign: 'middle',
+					},
+				}
+			},
+			down: (shape) => {
+				const { verticalAlign: _, ...props } = shape.props
+				return {
+					...shape,
+					props,
+				}
+			},
+		},
+		[Versions.MigrateLegacyAlign]: {
+			up: (shape) => {
+				let newAlign: TLDefaultHorizontalAlignStyle
+				switch (shape.props.align) {
+					case 'start':
+						newAlign = 'start-legacy'
+						break
+					case 'end':
+						newAlign = 'end-legacy'
+						break
+					default:
+						newAlign = 'middle-legacy'
+						break
+				}
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: newAlign,
+					},
+				}
+			},
+			down: (shape) => {
+				let oldAlign: TLDefaultHorizontalAlignStyle
+				switch (shape.props.align) {
+					case 'start-legacy':
+						oldAlign = 'start'
+						break
+					case 'end-legacy':
+						oldAlign = 'end'
+						break
+					case 'middle-legacy':
+						oldAlign = 'middle'
+						break
+					default:
+						oldAlign = shape.props.align
+				}
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: oldAlign,
+					},
+				}
+			},
+		},
+		[Versions.AddCloud]: {
+			up: (shape) => {
+				return shape
+			},
+			down: (shape) => {
+				if (shape.props.geo === 'cloud') {
+					return {
+						...shape,
+						props: {
+							...shape.props,
+							geo: 'rectangle',
+						},
+					}
+				}
+			},
+		},
+	},
+})

package/src/shapes/TLGroupShape.ts

@@ -0,0 +1,14 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { ShapeProps, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export type TLGroupShapeProps = { [key in never]: undefined }
+
+/** @public */
+export type TLGroupShape = TLBaseShape<'group', TLGroupShapeProps>
+
+/** @internal */
+export const groupShapeProps: ShapeProps<TLGroupShape> = {}
+
+/** @internal */
+export const groupShapeMigrations = defineMigrations({})

package/src/shapes/TLHighlightShape.ts

@@ -0,0 +1,24 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/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({})

package/src/shapes/TLImageShape.ts

@@ -0,0 +1,59 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { assetIdValidator } from '../assets/TLBaseAsset'
+import { vec2dModelValidator } from '../misc/geometry-types'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const ImageShapeCrop = T.object({
+	topLeft: vec2dModelValidator,
+	bottomRight: vec2dModelValidator,
+})
+/** @public */
+export type TLImageShapeCrop = T.TypeOf<typeof ImageShapeCrop>
+
+/** @public */
+export const imageShapeProps = {
+	w: T.nonZeroNumber,
+	h: T.nonZeroNumber,
+	playing: T.boolean,
+	url: T.string,
+	assetId: assetIdValidator.nullable(),
+	crop: ImageShapeCrop.nullable(),
+}
+
+/** @public */
+export type TLImageShapeProps = ShapePropsType<typeof imageShapeProps>
+
+/** @public */
+export type TLImageShape = TLBaseShape<'image', TLImageShapeProps>
+
+const Versions = {
+	AddUrlProp: 1,
+	AddCropProp: 2,
+} as const
+
+/** @internal */
+export const imageShapeMigrations = defineMigrations({
+	currentVersion: Versions.AddCropProp,
+	migrators: {
+		[Versions.AddUrlProp]: {
+			up: (shape) => {
+				return { ...shape, props: { ...shape.props, url: '' } }
+			},
+			down: (shape) => {
+				const { url: _, ...props } = shape.props
+				return { ...shape, props }
+			},
+		},
+		[Versions.AddCropProp]: {
+			up: (shape) => {
+				return { ...shape, props: { ...shape.props, crop: null } }
+			},
+			down: (shape) => {
+				const { crop: _, ...props } = shape.props
+				return { ...shape, props }
+			},
+		},
+	},
+})

package/src/shapes/TLLineShape.ts

@@ -0,0 +1,61 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { deepCopy } from '@bigbluebutton/utils'
+import { T } from '@bigbluebutton/validate'
+import { handleValidator } from '../misc/TLHandle'
+import { StyleProp } from '../styles/StyleProp'
+import { DefaultColorStyle } from '../styles/TLColorStyle'
+import { DefaultDashStyle } from '../styles/TLDashStyle'
+import { DefaultSizeStyle } from '../styles/TLSizeStyle'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const LineShapeSplineStyle = StyleProp.defineEnum('tldraw:spline', {
+	defaultValue: 'line',
+	values: ['cubic', 'line'],
+})
+
+/** @public */
+export type TLLineShapeSplineStyle = T.TypeOf<typeof LineShapeSplineStyle>
+
+/** @public */
+export const lineShapeProps = {
+	color: DefaultColorStyle,
+	dash: DefaultDashStyle,
+	size: DefaultSizeStyle,
+	spline: LineShapeSplineStyle,
+	handles: T.dict(T.string, handleValidator),
+}
+
+/** @public */
+export type TLLineShapeProps = ShapePropsType<typeof lineShapeProps>
+
+/** @public */
+export type TLLineShape = TLBaseShape<'line', TLLineShapeProps>
+
+/** @internal */
+export const lineShapeVersions = {
+	AddSnapHandles: 1,
+} as const
+
+/** @internal */
+export const lineShapeMigrations = defineMigrations({
+	currentVersion: lineShapeVersions.AddSnapHandles,
+	migrators: {
+		[lineShapeVersions.AddSnapHandles]: {
+			up: (record: any) => {
+				const handles = deepCopy(record.props.handles as Record<string, any>)
+				for (const id in handles) {
+					handles[id].canSnap = true
+				}
+				return { ...record, props: { ...record.props, handles } }
+			},
+			down: (record: any) => {
+				const handles = deepCopy(record.props.handles as Record<string, any>)
+				for (const id in handles) {
+					delete handles[id].canSnap
+				}
+				return { ...record, props: { ...record.props, handles } }
+			},
+		},
+	},
+})

package/src/shapes/TLNoteShape.ts

@@ -0,0 +1,137 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { DefaultColorStyle } from '../styles/TLColorStyle'
+import { DefaultFontStyle } from '../styles/TLFontStyle'
+import {
+	DefaultHorizontalAlignStyle,
+	TLDefaultHorizontalAlignStyle,
+} from '../styles/TLHorizontalAlignStyle'
+import { DefaultSizeStyle } from '../styles/TLSizeStyle'
+import { DefaultVerticalAlignStyle } from '../styles/TLVerticalAlignStyle'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const noteShapeProps = {
+	color: DefaultColorStyle,
+	size: DefaultSizeStyle,
+	font: DefaultFontStyle,
+	align: DefaultHorizontalAlignStyle,
+	verticalAlign: DefaultVerticalAlignStyle,
+	growY: T.positiveNumber,
+	url: T.string,
+	text: T.string,
+}
+
+/** @public */
+export type TLNoteShapeProps = ShapePropsType<typeof noteShapeProps>
+
+/** @public */
+export type TLNoteShape = TLBaseShape<'note', TLNoteShapeProps>
+
+const Versions = {
+	AddUrlProp: 1,
+	RemoveJustify: 2,
+	MigrateLegacyAlign: 3,
+	AddVerticalAlign: 4,
+} as const
+
+/** @internal */
+export const noteShapeMigrations = defineMigrations({
+	currentVersion: Versions.AddVerticalAlign,
+	migrators: {
+		[Versions.AddUrlProp]: {
+			up: (shape) => {
+				return { ...shape, props: { ...shape.props, url: '' } }
+			},
+			down: (shape) => {
+				const { url: _, ...props } = shape.props
+				return { ...shape, props }
+			},
+		},
+		[Versions.RemoveJustify]: {
+			up: (shape) => {
+				let newAlign = shape.props.align
+				if (newAlign === 'justify') {
+					newAlign = 'start'
+				}
+
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: newAlign,
+					},
+				}
+			},
+			down: (shape) => {
+				return { ...shape }
+			},
+		},
+
+		[Versions.MigrateLegacyAlign]: {
+			up: (shape) => {
+				let newAlign: TLDefaultHorizontalAlignStyle
+				switch (shape.props.align) {
+					case 'start':
+						newAlign = 'start-legacy'
+						break
+					case 'end':
+						newAlign = 'end-legacy'
+						break
+					default:
+						newAlign = 'middle-legacy'
+						break
+				}
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: newAlign,
+					},
+				}
+			},
+			down: (shape) => {
+				let oldAlign: TLDefaultHorizontalAlignStyle
+				switch (shape.props.align) {
+					case 'start-legacy':
+						oldAlign = 'start'
+						break
+					case 'end-legacy':
+						oldAlign = 'end'
+						break
+					case 'middle-legacy':
+						oldAlign = 'middle'
+						break
+					default:
+						oldAlign = shape.props.align
+				}
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: oldAlign,
+					},
+				}
+			},
+		},
+		[Versions.AddVerticalAlign]: {
+			up: (shape) => {
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						verticalAlign: 'middle',
+					},
+				}
+			},
+			down: (shape) => {
+				const { verticalAlign: _, ...props } = shape.props
+
+				return {
+					...shape,
+					props,
+				}
+			},
+		},
+	},
+})

package/src/shapes/TLTextShape.ts

@@ -0,0 +1,55 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { DefaultColorStyle } from '../styles/TLColorStyle'
+import { DefaultFontStyle } from '../styles/TLFontStyle'
+import { DefaultHorizontalAlignStyle } from '../styles/TLHorizontalAlignStyle'
+import { DefaultSizeStyle } from '../styles/TLSizeStyle'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const textShapeProps = {
+	color: DefaultColorStyle,
+	size: DefaultSizeStyle,
+	font: DefaultFontStyle,
+	align: DefaultHorizontalAlignStyle,
+	w: T.nonZeroNumber,
+	text: T.string,
+	scale: T.nonZeroNumber,
+	autoSize: T.boolean,
+}
+
+/** @public */
+export type TLTextShapeProps = ShapePropsType<typeof textShapeProps>
+
+/** @public */
+export type TLTextShape = TLBaseShape<'text', TLTextShapeProps>
+
+const Versions = {
+	RemoveJustify: 1,
+} as const
+
+/** @internal */
+export const textShapeMigrations = defineMigrations({
+	currentVersion: Versions.RemoveJustify,
+	migrators: {
+		[Versions.RemoveJustify]: {
+			up: (shape) => {
+				let newAlign = shape.props.align
+				if (newAlign === 'justify') {
+					newAlign = 'start'
+				}
+
+				return {
+					...shape,
+					props: {
+						...shape.props,
+						align: newAlign,
+					},
+				}
+			},
+			down: (shape) => {
+				return { ...shape }
+			},
+		},
+	},
+})

package/src/shapes/TLVideoShape.ts

@@ -0,0 +1,40 @@
+import { defineMigrations } from '@bigbluebutton/store'
+import { T } from '@bigbluebutton/validate'
+import { assetIdValidator } from '../assets/TLBaseAsset'
+import { ShapePropsType, TLBaseShape } from './TLBaseShape'
+
+/** @public */
+export const videoShapeProps = {
+	w: T.nonZeroNumber,
+	h: T.nonZeroNumber,
+	time: T.number,
+	playing: T.boolean,
+	url: T.string,
+	assetId: assetIdValidator.nullable(),
+}
+
+/** @public */
+export type TLVideoShapeProps = ShapePropsType<typeof videoShapeProps>
+
+/** @public */
+export type TLVideoShape = TLBaseShape<'video', TLVideoShapeProps>
+
+const Versions = {
+	AddUrlProp: 1,
+} as const
+
+/** @internal */
+export const videoShapeMigrations = defineMigrations({
+	currentVersion: Versions.AddUrlProp,
+	migrators: {
+		[Versions.AddUrlProp]: {
+			up: (shape) => {
+				return { ...shape, props: { ...shape.props, url: '' } }
+			},
+			down: (shape) => {
+				const { url: _, ...props } = shape.props
+				return { ...shape, props }
+			},
+		},
+	},
+})

package/src/store-migrations.ts

@@ -0,0 +1,63 @@
+import { defineMigrations, SerializedStore } from '@bigbluebutton/store'
+import { TLRecord } from './records/TLRecord'
+
+const Versions = {
+	RemoveCodeAndIconShapeTypes: 1,
+	AddInstancePresenceType: 2,
+	RemoveTLUserAndPresenceAndAddPointer: 3,
+	RemoveUserDocument: 4,
+} as const
+
+export { Versions as storeVersions }
+
+/** @public */
+export const storeMigrations = defineMigrations({
+	currentVersion: Versions.RemoveUserDocument,
+	migrators: {
+		[Versions.RemoveCodeAndIconShapeTypes]: {
+			up: (store: SerializedStore<TLRecord>) => {
+				return Object.fromEntries(
+					Object.entries(store).filter(
+						([_, v]) => v.typeName !== 'shape' || (v.type !== 'icon' && v.type !== 'code')
+					)
+				)
+			},
+			down: (store: SerializedStore<TLRecord>) => {
+				// noop
+				return store
+			},
+		},
+		[Versions.AddInstancePresenceType]: {
+			up: (store: SerializedStore<TLRecord>) => {
+				return store
+			},
+			down: (store: SerializedStore<TLRecord>) => {
+				return Object.fromEntries(
+					Object.entries(store).filter(([_, v]) => v.typeName !== 'instance_presence')
+				)
+			},
+		},
+		[Versions.RemoveTLUserAndPresenceAndAddPointer]: {
+			up: (store: SerializedStore<TLRecord>) => {
+				return Object.fromEntries(
+					Object.entries(store).filter(([_, v]) => !v.typeName.match(/^(user|user_presence)$/))
+				)
+			},
+			down: (store: SerializedStore<TLRecord>) => {
+				return Object.fromEntries(
+					Object.entries(store).filter(([_, v]) => v.typeName !== 'pointer')
+				)
+			},
+		},
+		[Versions.RemoveUserDocument]: {
+			up: (store: SerializedStore<TLRecord>) => {
+				return Object.fromEntries(
+					Object.entries(store).filter(([_, v]) => !v.typeName.match('user_document'))
+				)
+			},
+			down: (store: SerializedStore<TLRecord>) => {
+				return store
+			},
+		},
+	},
+})