litruv
0da4f0d6cb
Support app.relay.emoji_confetti on jumbo emoji clicks with canvas physics, per-emoji particle profiles, and a fixed overlay that does not affect scroll. Also add a Vite playground for live component previews and theme hover preview.
44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
/**
|
|
* Live preview harness — edit freely. Nothing is saved.
|
|
*
|
|
* - Import any Cinny module via `@cinny/...`
|
|
* - Use mocks / PlaygroundProviders from `@playground/mocks`
|
|
* - `export default` the component to render in the stage
|
|
*/
|
|
import { Message } from '@cinny/app/features/room/message';
|
|
import { MessageLayout } from '@cinny/app/state/settings';
|
|
import { Box, Text } from 'folds';
|
|
import { mocks } from '@playground/mocks';
|
|
|
|
export default function Preview() {
|
|
const room = mocks.room;
|
|
const mEvent = mocks.event;
|
|
|
|
return (
|
|
<Box direction="Column" gap="200" style={{ width: '100%', maxWidth: 520 }}>
|
|
<Text size="T200" priority="300">
|
|
Preview harness — swap imports to any `@cinny/...` export
|
|
</Text>
|
|
<Message
|
|
room={room}
|
|
mEvent={mEvent}
|
|
collapse={false}
|
|
highlight={false}
|
|
messageLayout={MessageLayout.Modern}
|
|
messageSpacing="400"
|
|
canDelete
|
|
canSendReaction
|
|
canPinEvent
|
|
hour24Clock={false}
|
|
dateFormatString="D MMM YYYY"
|
|
onUserClick={() => undefined}
|
|
onUsernameClick={() => undefined}
|
|
onReplyClick={() => undefined}
|
|
onReactionToggle={() => undefined}
|
|
>
|
|
<Text style={{ margin: 0 }}>{mEvent.getContent().body}</Text>
|
|
</Message>
|
|
</Box>
|
|
);
|
|
}
|