···

       
6
       
 
       
yarn-error.log*

     

       
7
       
 
       
pnpm-debug.log*

     

       
8
       
 
       
lerna-debug.log*

     

       
9
       
-
       


     

       
10
       
 
       
node_modules

     

       
11
       
 
       
dist

     

       
12
       
 
       
lib-dist

     
···

       
25
       
 
       
*.sln

     

       
26
       
 
       
*.sw?

     

       
27
       
 
       


     

       
28
       
-
       
*.tsbuildinfo
     

···

       
6
       
 
       
yarn-error.log*

     

       
7
       
 
       
pnpm-debug.log*

     

       
8
       
 
       
lerna-debug.log*

     

       
9
       
+
       
demo

     

       
10
       
 
       
node_modules

     

       
11
       
 
       
dist

     

       
12
       
 
       
lib-dist

     
···

       
25
       
 
       
*.sln

     

       
26
       
 
       
*.sw?

     

       
27
       
 
       


     

       
28
       
+
       
*.tsbuildinfo

     

···

       
25
       
 
       


     

       
26
       
 
       
```tsx

     

       
27
       
 
       
import { AtProtoProvider, BlueskyPost, LeafletDocument } from "atproto-ui";

     

       
0
       
 
       

     

       
28
       
 
       


     

       
29
       
 
       
export function App() {

     

       
30
       
 
       
	return (

     

···

       
25
       
 
       


     

       
26
       
 
       
```tsx

     

       
27
       
 
       
import { AtProtoProvider, BlueskyPost, LeafletDocument } from "atproto-ui";

     

       
28
       
+
       
import "atproto-ui/styles.css";

     

       
29
       
 
       


     

       
30
       
 
       
export function App() {

     

       
31
       
 
       
	return (

     

···

       
1
       
 
       
// Master exporter for the AT React component library.

     

       
2
       
 
       


     

       
3
       
-
       
// Global styles - import this in your app root

     

       
4
       
 
       
import "./styles.css";

     

       
5
       
 
       


     

       
6
       
 
       
// Providers & core primitives

     
···

       
35
       
 
       
// Types

     

       
36
       
 
       
export * from "./types/bluesky";

     

       
37
       
 
       
export * from "./types/leaflet";

     

       
0
       
 
       

     

       
38
       
 
       


     

       
39
       
 
       
// Utilities

     

       
40
       
 
       
export * from "./utils/at-uri";

     

···

       
1
       
 
       
// Master exporter for the AT React component library.

     

       
2
       
 
       


     

       
0
       
 
       

     

       
3
       
 
       
import "./styles.css";

     

       
4
       
 
       


     

       
5
       
 
       
// Providers & core primitives

     
···

       
34
       
 
       
// Types

     

       
35
       
 
       
export * from "./types/bluesky";

     

       
36
       
 
       
export * from "./types/leaflet";

     

       
37
       
+
       
export * from "./types/theme";

     

       
38
       
 
       


     

       
39
       
 
       
// Utilities

     

       
40
       
 
       
export * from "./utils/at-uri";

     

···

       
24
       
 
       
	"scripts": {

     

       
25
       
 
       
		"dev": "vite",

     

       
26
       
 
       
		"build": "vite build && tsc -b",

     

       
0
       
 
       

     

       
0
       
 
       

     

       
27
       
 
       
		"lint": "eslint .",

     

       
28
       
 
       
		"preview": "vite preview",

     

       
29
       
 
       
		"prepublishOnly": "npm run build"

     

···

       
24
       
 
       
	"scripts": {

     

       
25
       
 
       
		"dev": "vite",

     

       
26
       
 
       
		"build": "vite build && tsc -b",

     

       
27
       
+
       
		"build:demo": "BUILD_TARGET=demo vite build",

     

       
28
       
+
       
		"build:all": "npm run build && npm run build:demo",

     

       
29
       
 
       
		"lint": "eslint .",

     

       
30
       
 
       
		"preview": "vite preview",

     

       
31
       
 
       
		"prepublishOnly": "npm run build"

     

···

       
1
       
 
       
import React, { useState, useCallback, useRef } from "react";

     

       
2
       
 
       
import { AtProtoProvider } from "../lib";

     

       
0
       
 
       

     

       
3
       
 
       
import "./App.css";

     

       
4
       
 
       


     

       
5
       
 
       
import { TangledString } from "../lib/components/TangledString";

     

···

       
1
       
 
       
import React, { useState, useCallback, useRef } from "react";

     

       
2
       
 
       
import { AtProtoProvider } from "../lib";

     

       
3
       
+
       
import "../lib/styles.css"

     

       
4
       
 
       
import "./App.css";

     

       
5
       
 
       


     

       
6
       
 
       
import { TangledString } from "../lib/components/TangledString";

     

···

       
18
       
 
       
    };

     

       
19
       
 
       
}

     

       
20
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
21
       
 
       
// https://vite.dev/config/

     

       
22
       
 
       
export default defineConfig({

     

       
23
       
-
       
    plugins: [react(), dts({ tsconfigPath: './tsconfig.lib.json' }), injectCssImport()],

     

       
24
       
-
       
    build: {

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
25
       
 
       
        lib: {

     

       
26
       
 
       
            entry: resolve(__dirname, 'lib/index.ts'),

     

       
27
       
 
       
            name: 'atproto-ui',

     

···

       
18
       
 
       
    };

     

       
19
       
 
       
}

     

       
20
       
 
       


     

       
21
       
+
       
const buildDemo = process.env.BUILD_TARGET === 'demo';

     

       
22
       
+
       


     

       
23
       
 
       
// https://vite.dev/config/

     

       
24
       
 
       
export default defineConfig({

     

       
25
       
+
       
    plugins: buildDemo

     

       
26
       
+
       
        ? [react()]

     

       
27
       
+
       
        : [react(), dts({ tsconfigPath: './tsconfig.lib.json' }), injectCssImport()],

     

       
28
       
+
       


     

       
29
       
+
       
    // Demo app needs to resolve from src

     

       
30
       
+
       
    root: buildDemo ? '.' : undefined,

     

       
31
       
+
       


     

       
32
       
+
       
    build: buildDemo ? {

     

       
33
       
+
       
        // Demo app build configuration

     

       
34
       
+
       
        outDir: 'demo',

     

       
35
       
+
       
        rollupOptions: {

     

       
36
       
+
       
            input: resolve(__dirname, 'index.html')

     

       
37
       
+
       
        },

     

       
38
       
+
       
        sourcemap: true

     

       
39
       
+
       
    } : {

     

       
40
       
+
       
        // Library build configuration

     

       
41
       
 
       
        lib: {

     

       
42
       
 
       
            entry: resolve(__dirname, 'lib/index.ts'),

     

       
43
       
 
       
            name: 'atproto-ui',