diff --git a/leaf/ts/components.ts b/leaf/ts/components.ts index 9ce3ca78..61d3a8e2 100644 --- a/leaf/ts/components.ts +++ b/leaf/ts/components.ts @@ -1,5 +1,5 @@ import { BorshSchema } from 'borsher'; -import { Component, LinkSchema, type Link } from './index'; +import { Component, LinkSchema, type Link, type LeafBlob, LeafBlobSchema } from './index'; export class Utf8 extends Component { value: string = ''; @@ -179,23 +179,52 @@ Embed could be useful for: } } -/* +export type ImageSize = { + width: number; + height: number; +}; +export const ImageSizeSchema = BorshSchema.Struct({ + width: BorshSchema.u32, + height: BorshSchema.u32 +}); + +export class Image extends Component { + mimeType: string; + size: ImageSize; + data: LeafBlob; + + constructor(mimeType: string, size: ImageSize, data: LeafBlob) { + super(); + this.mimeType = mimeType; + this.size = size; + this.data = data; + } + static componentName(): string { + return 'Image'; + } + static borshSchema(): BorshSchema { + return BorshSchema.Struct({ + mimeType: BorshSchema.String, + size: ImageSizeSchema, + data: LeafBlobSchema + }); + } + static specification(): Component[] { + return [ + new CommonMark(`An image associated with the entity. -Components to port from Rust. +The \`Image\` component usually represents the "feature image", icon, avatar, or other primary image +associated to the entity. This image would often be displayed in link previews. -#[derive(BorshDeserialize, BorshSerialize, HasBorshSchema, Component, Debug)] -#[component( - specification = "leaf-schemas/Image", - schema_id = "b7yadsp7e2lt6swf7d6lc6e4244h2xk327k3aekzafcp4jnxi2jq" -)] -pub struct Image { - mime_type: String, - size: ImageSize, - data: Blob, -} -#[derive(BorshDeserialize, BorshSerialize, HasBorshSchema, Debug)] -pub struct ImageSize { - width: u32, - height: u32, +The \`Image\` component might also be used for an entity that is primarily an image, such as an image +file in an image in an image gallery. + +Multiple \`Image\` components may be added to an entity when there are multiple formats or sizes +available for the same image. This can be useful, for example, to allow using a smaller image for a +link preview than you would use when displaying a full-sized feature image on a blog post. + +In most cases, multiple distinct images should be stored in separate entities or a different +component.`) + ]; + } } -*/ diff --git a/leaf/ts/index.ts b/leaf/ts/index.ts index a1d77a86..ae6be1f8 100644 --- a/leaf/ts/index.ts +++ b/leaf/ts/index.ts @@ -221,6 +221,9 @@ export const LinkSchema = BorshSchema.Struct({ snapshot: BorshSchema.Option(DigestSchema) }); +export type LeafBlob = Digest; +export const LeafBlobSchema = DigestSchema; + export type LeafBorshFormat = { Null: Unit; Bool: boolean;