html is resizeable

This commit is contained in:
Orion Reed 2024-03-25 00:29:01 -07:00
parent 366cba1ec1
commit 3423aeeeb6
2 changed files with 11 additions and 2 deletions

View File

@ -11,7 +11,7 @@ export const SimController = ({ shapes }: { shapes: TLUnknownShape[] }) => {
}, []);
const { addShapes } = usePhysicsSimulation(editor, true);
const { addShapes } = usePhysicsSimulation(editor, false);
return (<></>);
};

View File

@ -1,10 +1,14 @@
import { Rectangle2d, TLBaseShape } from '@tldraw/tldraw';
import { Rectangle2d, resizeBox, TLBaseShape, TLOnResizeHandler } from '@tldraw/tldraw';
import { HTMLContainer, ShapeUtil } from 'tldraw'
export type HTMLShape = TLBaseShape<'html', { w: number; h: number, html: string }>
export class HTMLShapeUtil extends ShapeUtil<HTMLShape> {
static override type = 'html' as const
override canBind = () => true
override canEdit = () => false
override canResize = () => true
override isAspectRatioLocked = () => false
getDefaultProps(): HTMLShape['props'] {
return {
@ -14,6 +18,10 @@ export class HTMLShapeUtil extends ShapeUtil<HTMLShape> {
}
}
override onResize: TLOnResizeHandler<any> = (shape, info) => {
return resizeBox(shape, info)
}
getGeometry(shape: IHTMLShape) {
return new Rectangle2d({
width: shape.props.w,
@ -24,6 +32,7 @@ export class HTMLShapeUtil extends ShapeUtil<HTMLShape> {
component(shape: HTMLShape) {
return <div dangerouslySetInnerHTML={{ __html: shape.props.html }}></div>
}
indicator(shape: HTMLShape) {