hanzoai/docs
2
0
Fork 0
mirror of https://github.com/hanzo-docs/docs.git synced 2026-10-25 04:20:02 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UI & Twoslash: Move Twoslash UI components to fumadocs-twoslash

Browse Source
This commit is contained in:
fuma-nama
2024-09-12 20:06:00 +08:00
parent d9e908e1cd
commit 9a10262769
16 changed files with 148 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/red-queens-bake.md
+28
View File
@@ -0,0 +1,28 @@
---
'fumadocs-twoslash': major
'fumadocs-ui': major
---
**Move Twoslash UI components to `fumadocs-twoslash`**
**why:** Isolate logic from Fumadocs UI
**migrate:**
Before:
```ts
import "fumadocs-ui/twoslash.css"
import { Popup } from "fumadocs-ui/twoslash/popup"
```
After:
```ts
import "fumadocs-twoslash/twoslash.css"
import { Popup } from "fumadocs-twoslash/ui"
```
**Tailwind CSS is now required for Twoslash integration.**
apps/docs/app/docs/[...slug]/page.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ import {
import { notFound } from 'next/navigation';
import { type ComponentProps, type FC, Fragment } from 'react';
import defaultComponents from 'fumadocs-ui/mdx';
import { Popup, PopupContent, PopupTrigger } from 'fumadocs-ui/twoslash/popup';
import { Popup, PopupContent, PopupTrigger } from 'fumadocs-twoslash/ui';
import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
import { Callout } from 'fumadocs-ui/components/callout';
import { TypeTable } from 'fumadocs-ui/components/type-table';
apps/docs/app/docs/layout.tsx
+1 -1
View File
@@ -1,7 +1,7 @@
import { DocsLayout } from 'fumadocs-ui/layouts/docs';
import type { ReactNode } from 'react';
import { docsOptions } from '@/app/layout.config';
import 'fumadocs-ui/twoslash.css';
import 'fumadocs-twoslash/twoslash.css';
export default function Layout({
children,
apps/docs/content/docs/ui/(integrations)/twoslash.mdx
+2 -2
View File
@@ -40,11 +40,11 @@ export default withMDX(config);
Add stylings and components.
```ts title="layout.tsx"
import 'fumadocs-ui/twoslash.css';
import 'fumadocs-twoslash/twoslash.css';
```
```ts
import { Popup, PopupContent, PopupTrigger } from 'fumadocs-ui/twoslash/popup';
import { Popup, PopupContent, PopupTrigger } from 'fumadocs-twoslash/ui';
const mdxComponents = {
Popup,
packages/twoslash/package.json
+20 -1
View File
@@ -12,6 +12,17 @@
"license": "MIT",
"author": "Fuma Nama",
"type": "module",
"exports": {
"./twoslash.css": "./dist/twoslash.css",
".": {
"import": "./dist/index.js",
"types": "./dist/index.d.ts"
},
"./ui": {
"import": "./dist/ui/index.js",
"types": "./dist/ui/index.d.ts"
}
},
"main": "./dist/index.js",
"types": "./dist/index.d.ts",
"files": [
@@ -25,21 +36,29 @@
"types:check": "tsc --noEmit"
},
"dependencies": {
"@radix-ui/react-popover": "^1.1.1",
"@shikijs/twoslash": "^1.16.2",
"mdast-util-from-markdown": "^2.0.1",
"mdast-util-gfm": "^3.0.0",
"mdast-util-to-hast": "^13.2.0"
"mdast-util-to-hast": "^13.2.0",
"tailwind-merge": "^2.5.2"
},
"devDependencies": {
"@types/hast": "^3.0.4",
"@types/mdast": "^4.0.3",
"@types/node": "22.5.4",
"@types/react": "^18.3.5",
"eslint-config-custom": "workspace:*",
"fumadocs-ui": "workspace:*",
"postcss": "^8.4.45",
"postcss-lightningcss": "^1.0.1",
"shiki": "^1.16.2",
"tailwindcss": "^3.4.10",
"tsconfig": "workspace:*"
},
"peerDependencies": {
"fumadocs-ui": "13.x.x",
"react": ">= 18",
"shiki": "1.x.x"
},
"publishConfig": {
packages/twoslash/postcss.config.js
+8
View File
@@ -0,0 +1,8 @@
export default {
plugins: {
tailwindcss: {},
'postcss-lightningcss': {
browsers: '>= .25%',
},
},
};
packages/twoslash/src/ui/cn.ts
+1
View File
@@ -0,0 +1 @@
export { twMerge as cn } from 'tailwind-merge';
packages/twoslash/src/ui/index.ts
+2
View File
@@ -0,0 +1,2 @@
'use client';
export * from './popup';
packages/twoslash/src/ui/popover.tsx
+31
View File
@@ -0,0 +1,31 @@
import * as PopoverPrimitive from '@radix-ui/react-popover';
import * as React from 'react';
import { cn } from './cn';
const Popover = PopoverPrimitive.Root;
const PopoverTrigger = PopoverPrimitive.Trigger;
const PopoverContent = React.forwardRef<
React.ElementRef<typeof PopoverPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
>(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
ref={ref}
align={align}
sideOffset={sideOffset}
side="bottom"
className={cn(
'z-50 min-w-[220px] max-w-[98vw] rounded-lg border bg-fd-popover p-2 text-sm text-fd-popover-foreground shadow-md data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in',
className,
)}
{...props}
/>
</PopoverPrimitive.Portal>
));
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
const PopoverClose = PopoverPrimitive.PopoverClose;
export { Popover, PopoverTrigger, PopoverContent, PopoverClose };
packages/ui/src/twoslash/popup.tsx → packages/twoslash/src/ui/popup.tsx
+2 -8
View File
@@ -1,12 +1,6 @@
'use client';
import * as React from 'react';
import {
Popover,
PopoverContent,
PopoverTrigger,
} from '@/components/ui/popover';
import { cn } from '@/utils/cn';
import { Popover, PopoverContent, PopoverTrigger } from './popover';
import { cn } from './cn';
interface PopupContextObject {
open: boolean;
packages/ui/css/twoslash.css → packages/twoslash/styles/twoslash.css
View File
packages/twoslash/tailwind.config.js
+7
View File
@@ -0,0 +1,7 @@
import { createPreset } from 'fumadocs-ui/tailwind-plugin';
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{ts,tsx}'],
presets: [createPreset()],
};
packages/twoslash/tsup.config.ts
+5 -1
View File
@@ -1,8 +1,12 @@
import * as fs from 'node:fs';
import { defineConfig } from 'tsup';
fs.mkdirSync('./dist');
fs.copyFileSync('./styles/twoslash.css', './dist/twoslash.css');
export default defineConfig({
dts: true,
target: 'es6',
format: 'esm',
entry: ['src/index.ts'],
entry: ['src/index.ts', 'src/ui/index.ts'],
});
packages/ui/package.json
-36
View File
@@ -13,7 +13,6 @@
"type": "module",
"exports": {
"./style.css": "./dist/style.css",
"./twoslash.css": "./dist/twoslash.css",
"./image-zoom.css": "./dist/image-zoom.css",
"./tailwind-plugin": {
"import": "./dist/tailwind-plugin.js",
@@ -24,10 +23,6 @@
"import": "./dist/components/*.js",
"types": "./dist/components/*.d.ts"
},
"./twoslash/*": {
"import": "./dist/twoslash/*.js",
"types": "./dist/twoslash/*.d.ts"
},
"./i18n": {
"import": "./dist/i18n.js",
"types": "./dist/i18n.d.ts"
@@ -53,37 +48,6 @@
"types": "./dist/og.d.ts"
}
},
"typesVersions": {
"*": {
"tailwind-plugin": [
"./dist/tailwind-plugin.d.ts"
],
"components/*": [
"./dist/components/*.d.ts"
],
"twoslash/*": [
"./dist/twoslash/*.d.ts"
],
"i18n": [
"./dist/i18n.d.ts"
],
"layouts/*": [
"./dist/layouts/*.d.ts"
],
"page": [
"./dist/page.d.ts"
],
"provider": [
"./dist/provider.d.ts"
],
"mdx": [
"./dist/mdx.d.ts"
],
"og": [
"./dist/og.d.ts"
]
}
},
"files": [
"dist/*"
],
packages/ui/tsup.config.ts
-1
View File
@@ -35,7 +35,6 @@ export default defineConfig({
`./src/components/{${exportedComponents.join(',')}}.tsx`,
'./src/layouts/{docs,shared,home}.tsx',
'./src/{i18n,home-layout,layout,page,provider,mdx,tailwind-plugin,og}.{ts,tsx}',
'./src/twoslash/popup.tsx',
'./src/**/*.client.tsx',
],
external: ['server-only', '../../dist/image-zoom.css', 'tailwindcss'],
pnpm-lock.yaml
Generated
+40 -17
View File
@@ -37,7 +37,7 @@ importers:
version: 6.0.1
tsup:
specifier: 8.2.4
version: 8.2.4(@swc/[email protected](@swc/[email protected]))([email protected])([email protected])([email protected])([email protected])([email protected])
version: 8.2.4(@swc/[email protected])([email protected])([email protected])([email protected])([email protected])([email protected])
turbo:
specifier: 2.1.1
version: 2.1.1
@@ -185,7 +185,7 @@ importers:
version: 5.5.4
webpack:
specifier: ^5.90.3
version: 5.90.3(@swc/[email protected](@swc/[email protected]))([email protected])
version: 5.90.3(@swc/[email protected])([email protected])
examples/content-collections:
dependencies:
@@ -749,7 +749,7 @@ importers:
version: 11.0.5
webpack:
specifier: ^5.90.3
version: 5.90.3(@swc/[email protected](@swc/[email protected]))([email protected])
version: 5.90.3(@swc/[email protected])([email protected])
packages/mdx-remote:
dependencies:
@@ -910,6 +910,9 @@ importers:
packages/twoslash:
dependencies:
'@radix-ui/react-popover':
specifier: ^1.1.1
version: 1.1.1(@types/[email protected])(@types/[email protected])([email protected]([email protected]))([email protected])
'@shikijs/twoslash':
specifier: ^1.16.2
version: 1.16.2([email protected])
@@ -922,6 +925,12 @@ importers:
mdast-util-to-hast:
specifier: ^13.2.0
version: 13.2.0
react:
specifier: '>= 18'
version: 18.3.1
tailwind-merge:
specifier: ^2.5.2
version: 2.5.2
devDependencies:
'@types/hast':
specifier: ^3.0.4
@@ -929,15 +938,30 @@ importers:
'@types/mdast':
specifier: ^4.0.3
version: 4.0.4
'@types/node':
specifier: 22.5.4
version: 22.5.4
'@types/react':
specifier: ^18.3.5
version: 18.3.5
eslint-config-custom:
specifier: workspace:*
version: link:../eslint-config-custom
fumadocs-ui:
specifier: workspace:*
version: link:../ui
postcss:
specifier: ^8.4.45
version: 8.4.45
postcss-lightningcss:
specifier: ^1.0.1
version: 1.0.1([email protected])
shiki:
specifier: ^1.16.2
version: 1.16.2
tailwindcss:
specifier: ^3.4.10
version: 3.4.10
tsconfig:
specifier: workspace:*
version: link:../tsconfig
@@ -9231,7 +9255,7 @@ snapshots:
'@swc/core-win32-x64-msvc': 1.7.22
'@swc/helpers': 0.5.12
'@swc/[email protected](@swc/[email protected])':
'@swc/[email protected]':
dependencies:
'@swc/counter': 0.1.3
'@swc/types': 0.1.12
@@ -9246,7 +9270,6 @@ snapshots:
'@swc/core-win32-arm64-msvc': 1.7.23
'@swc/core-win32-ia32-msvc': 1.7.23
'@swc/core-win32-x64-msvc': 1.7.23
'@swc/helpers': 0.5.12
optional: true
'@swc/[email protected]': {}
@@ -13599,28 +13622,28 @@ snapshots:
[email protected]: {}
[email protected](@swc/[email protected](@swc/[email protected]))([email protected])([email protected](@swc/[email protected](@swc/[email protected]))([email protected])):
[email protected](@swc/[email protected])([email protected])([email protected](@swc/[email protected])([email protected])):
dependencies:
'@jridgewell/trace-mapping': 0.3.25
jest-worker: 27.5.1
schema-utils: 3.3.0
serialize-javascript: 6.0.2
terser: 5.31.1
webpack: 5.90.3(@swc/[email protected](@swc/[email protected]))([email protected])
webpack: 5.90.3(@swc/[email protected])([email protected])
optionalDependencies:
'@swc/core': 1.7.23(@swc/[email protected])
'@swc/core': 1.7.23
esbuild: 0.23.0
[email protected](@swc/[email protected](@swc/[email protected]))([email protected])([email protected](@swc/[email protected](@swc/[email protected]))([email protected])):
[email protected](@swc/[email protected])([email protected])([email protected](@swc/[email protected])([email protected])):
dependencies:
'@jridgewell/trace-mapping': 0.3.25
jest-worker: 27.5.1
schema-utils: 3.3.0
serialize-javascript: 6.0.2
terser: 5.31.1
webpack: 5.90.3(@swc/[email protected](@swc/[email protected]))([email protected])
webpack: 5.90.3(@swc/[email protected])([email protected])
optionalDependencies:
'@swc/core': 1.7.23(@swc/[email protected])
'@swc/core': 1.7.23
esbuild: 0.23.1
[email protected]:
@@ -13723,7 +13746,7 @@ snapshots:
[email protected]: {}
[email protected](@swc/[email protected](@swc/[email protected]))([email protected])([email protected])([email protected])([email protected])([email protected]):
[email protected](@swc/[email protected])([email protected])([email protected])([email protected])([email protected])([email protected]):
dependencies:
bundle-require: 5.0.0([email protected])
cac: 6.7.14
@@ -13742,7 +13765,7 @@ snapshots:
sucrase: 3.35.0
tree-kill: 1.2.2
optionalDependencies:
'@swc/core': 1.7.23(@swc/[email protected])
'@swc/core': 1.7.23
postcss: 8.4.45
typescript: 5.5.4
transitivePeerDependencies:
@@ -14068,7 +14091,7 @@ snapshots:
[email protected]: {}
[email protected](@swc/[email protected](@swc/[email protected]))([email protected]):
[email protected](@swc/[email protected])([email protected]):
dependencies:
'@types/eslint-scope': 3.7.6
'@types/estree': 1.0.5
@@ -14091,7 +14114,7 @@ snapshots:
neo-async: 2.6.2
schema-utils: 3.3.0
tapable: 2.2.1
terser-webpack-plugin: 5.3.10(@swc/[email protected](@swc/[email protected]))([email protected])([email protected](@swc/[email protected](@swc/[email protected]))([email protected]))
terser-webpack-plugin: 5.3.10(@swc/[email protected])([email protected])([email protected](@swc/[email protected])([email protected]))
watchpack: 2.4.0
webpack-sources: 3.2.3
transitivePeerDependencies:
@@ -14099,7 +14122,7 @@ snapshots:
- esbuild
- uglify-js
[email protected](@swc/[email protected](@swc/[email protected]))([email protected]):
[email protected](@swc/[email protected])([email protected]):
dependencies:
'@types/eslint-scope': 3.7.6
'@types/estree': 1.0.5
@@ -14122,7 +14145,7 @@ snapshots:
neo-async: 2.6.2
schema-utils: 3.3.0
tapable: 2.2.1
terser-webpack-plugin: 5.3.10(@swc/[email protected](@swc/[email protected]))([email protected])([email protected](@swc/[email protected](@swc/[email protected]))([email protected]))
terser-webpack-plugin: 5.3.10(@swc/[email protected])([email protected])([email protected](@swc/[email protected])([email protected]))
watchpack: 2.4.0
webpack-sources: 3.2.3
transitivePeerDependencies: