# Bluesky Post

## Example

```svelte
<script lang="ts">
	import { Box } from '@foxui/all';
	import { BlueskyPost } from '@foxui/all';
	import { onMount } from 'svelte';

	let feed: any[] = $state([]);

	onMount(async () => {
		const res = await fetch(
			'https://public.api.bsky.app/xrpc/app.bsky.feed.getAuthorFeed?actor=did:plc:257wekqxg4hyapkq6k47igmp&limit=20'
		);
		const data = await res.json();
		feed = data.feed ?? [];
	});
</script>

<Box
	class="not-prose divide-base-200/50 dark:divide-base-800/70 relative flex h-96 max-w-lg flex-col divide-y overflow-y-scroll"
>
	{#each feed as item (item.post.uri)}
		<div class="py-4 first:pt-0 last:pb-0">
			<BlueskyPost data={item.post} reason={item.reason} reply={item.reply} showLogo />
		</div>
	{/each}

	{#if feed.length === 0}
		<div class="text-base-500 text-sm">Loading posts...</div>
	{/if}
</Box>
```

## Documentation

The `BlueskyPost` component renders a Bluesky post directly from the raw API response (`PostView`). It handles converting the data, rich text facets, embeds, and NSFW labels automatically.

Fetch posts using the [Bluesky API](https://docs.bsky.app/docs/api/app-bsky-feed-get-author-feed) and pass each post's `post` and `reason` fields directly to the component.

Use `blueskyPostToPostData` if you need to convert the data yourself for use with the generic `Post` component.

## API Reference

### BlueskyPost
Renders a Bluesky post from raw API data (PostView).

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| data | `PostView` | `-` | The raw Bluesky PostView data from the API. (required) |
| reason | `any` | `-` | The feed reason (e.g. repost info) from the API response. |
| reply | `any` | `-` | The feed reply context (parent/root) from the API response. Used to show "replying to" banner. |
| baseUrl | `string` | `'https://bsky.app'` | Base URL for all generated links. Change this to point to a custom client. |
| hrefs | `{ profile?: (handle, did?) => string; post?: (handle, postId) => string; hashtag?: (tag) => string }` | `-` | Override individual URL builders. Each function overrides the default baseUrl-based pattern. |
| target | `string` | `'_blank'` | The target attribute for all links. |
| showLogo | `boolean` | `false` | Whether to show the Bluesky butterfly logo in the header. |
| showAvatar | `boolean` | `true` | Whether to show the author avatar. |
| compact | `boolean` | `false` | Whether to use a compact layout. |
| actions | `ActionButtonsProps` | `-` | Override the default action buttons. By default, shows reply/repost/like counts linking to the post. |
| embeds | `Embed[]` | `-` | Override the automatically extracted embeds. |
| showSensitive | `boolean` | `true` | Whether to show the sensitive content overlay on flagged embeds. |