fumadocs-ui 16.15.18 → 16.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/generated/docs.css +1 -1
- package/css/generated/flux.css +1 -1
- package/css/generated/glass.css +1 -1
- package/css/generated/notebook.css +1 -1
- package/css/generated/shared.css +1 -1
- package/css/lib/base.css +13 -0
- package/dist/layouts/docs/client.d.ts +1 -0
- package/dist/layouts/docs/client.js +9 -3
- package/dist/layouts/docs/index.d.ts +2 -1
- package/dist/layouts/docs/page/slots/toc.js +2 -1
- package/dist/layouts/docs/slots/container.js +1 -8
- package/dist/layouts/glass/index.d.ts +11 -13
- package/dist/layouts/glass/index.js +11 -6
- package/dist/layouts/glass/page/slots/toc.js +3 -1
- package/dist/layouts/glass/slots/header.js +1 -1
- package/dist/layouts/notebook/client.d.ts +1 -0
- package/dist/layouts/notebook/client.js +9 -3
- package/dist/layouts/notebook/index.d.ts +2 -1
- package/dist/layouts/notebook/page/slots/toc.js +2 -1
- package/dist/layouts/notebook/slots/container.js +6 -12
- package/dist/layouts/shared/client.d.ts +1 -1
- package/dist/layouts/shared/client.js +17 -1
- package/dist/layouts/shared/index.d.ts +8 -0
- package/dist/style.css +139 -7
- package/package.json +10 -10
package/css/generated/docs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@source inline("!header !showItem *:col-start-1 *:my-auto *:pointer-events-auto *:rounded-md *:row-start-1 *:w-(--fd-sidebar-width) --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-width --fd-toc-popover-height --fd-toc-width -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] after aria-valuemax aria-valuemin aria-valuenow article
|
|
1
|
+
@source inline("!header !showItem *:col-start-1 *:my-auto *:pointer-events-auto *:rounded-md *:row-start-1 *:w-(--fd-sidebar-width) --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-width --fd-toc-popover-height --fd-toc-width -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] after aiChat aria-valuemax aria-valuemin aria-valuenow article available backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-s-2.5 before:inset-y-1 before:w-px bg-fd-background/80 border-b-2 border-e border-e-0 border-fd-primary border-y-0 breadcrumb breadcrumbEnabled circleProps circumference clerk click collapsing containerProps createLinkItemRenderer data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-s-2.5 data-[active=true]:before:inset-y-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-[state=closed]:animate-fd-sidebar-out data-[state=open]:animate-fd-sidebar-in data-[transparent=false]:bg-fd-background/80 data-full data-hovered data-layout-content data-layout-main data-sidebar-collapsed data-sidebar-panel data-sidebar-placeholder data-toc-popover data-toc-popover-content data-toc-popover-trigger data-transparent defaultSlots desktop duration-250 edit empty:mb-0 first:mt-0 flex-row-reverse font-semibold footer footerEnabled footerList fumadocs-core/breadcrumb gap-2.5 gap-6 getBreadcrumbItemsFromPath grid-cols-1 gridTemplate h-(--fd-header-height) h-(--fd-toc-popover-height) h-10 h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none iconLinks including inert information inset-e-0 inset-s-4 inset-y-2 isNavTransparent isTop items-end justify-items-center justify-self-end justify-start layout-level layoutTabs linkItems max max-h-[50vh] max-md:hidden max-md:layout:[--fd-header-height:--spacing(14)] max-w-[1168px] max-w-[380px] max-w-[900px] max-xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)] mb-4 mb-8 mb-auto md:in-data-[sidebar-collapsed=true]:pt-16 md:layout:[--fd-sidebar-width:268px] md:pt-8 md:px-6 min min-h-(--fd-docs-height) mt-6 mx-0.5 navEnabled navTransparentMode nd-docs-layout nd-page nd-subnav nd-toc nd-toc-placeholder no normalizedValue onClickItem onClickOutside overflow-x-clip p-0 pagination pb-1.5 pe-0 pe-2.5 pe-4 pointer-events-none popover progress progressbar provided pt-0.5 pt-12 pt-2 pt-3 px-6 py-0 py-6 radius restSvgProps rotate-180 rounded-none rtl:-translate-x-2 rtl:translate-x-full selectedIdx setDate showItem sidebarEnabled sidebarProps size-4.5 stroke-current/25 strokeDasharray strokeDashoffset tabMode tableOfContent tableOfContentPopover takes text-[1.75em] text-end text-fd-foreground timezone toc-popover toc-title tocEnabled tocPopover tocPopoverEnabled tocPopoverProps tocProps top-(--fd-docs-row-1) top-(--fd-docs-row-2) top-[calc(--spacing(4)+var(--fd-docs-row-3))] transition-[--fd-sidebar-col] transition-[opacity,translate,color] transition-[opacity,translate] transition-[opacity,visibility] transition-[width,inset-block,translate,background-color] translate-x-2 translate-y-full transparentMode typography under unlisted updated useBaseSlots useDocsLayout useDocsPage useFooterItems useIsScrollTop useTreeContext w-(--fd-sidebar-width) w-(--fd-toc-width) w-4 w-[85%] xl:border-s xl:h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] xl:hidden xl:in-data-[sidebar-collapsed=true]:pt-14 xl:layout:[--fd-toc-width:268px] xl:pt-14 xl:px-8 xl:sticky xl:top-(--fd-docs-row-1) z-10 z-20 z-30");
|
package/css/generated/flux.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@source inline("!enabled !header *:gap-0! *:rounded-lg
|
|
1
|
+
@source inline("!enabled !header *:gap-0! *:rounded-lg --removed-body-scroll-bar-size -mx-1 [&_svg]:shrink-0 [grid-area:main] after animate animate-fd-fade-in aria-valuemax aria-valuemin aria-valuenow article available backdrop-blur-md backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-y-1 before:start-2.5 before:w-px bg-fd-background/60 bg-fd-popover/80 border-x bottom-26 breadcrumb breadcrumbEnabled circleProps circumference clerk click containerProps createLinkItemRenderer createPortal data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-y-2.5 data-[active=true]:before:start-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-full data-layout-content data-layout-main data-toc-popover data-toc-popover-content data-toc-popover-trigger defaultChildren defaultSlots defaultTabs duration ease edit empty:mb-0 exit first:mt-0 flex-row-reverse flux-layout-slot font-semibold footer footerEnabled footerList fumadocs-core/breadcrumb gap-2.5 getBreadcrumbItemsFromPath grid-cols-1 h-8.5 h-9 head hide hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none including information initial justify-items-center layout-level lg:text-sm linkItems mask-[linear-gradient(to_bottom,transparent,white_--spacing(14),white_calc(100%---spacing(14)),transparent)] max max-h-[50vh] max-w-[1200px] max-w-[900px] max-w-svw mb-1.5 mb-4 mb-8 mb-auto md:pt-8 md:px-6 min min-h-11 motion motion/react ms-1 mt-6 nd-flux-layout nd-page no normalizedValue onAnimationComplete opacity overflow-x-clip overflow-y-hidden pagination pb-24 pointer-events-none popLayout pr-(--removed-body-scroll-bar-size,0) progress progressbar provided ps-2.5 py-10 py-16 py-6 radius react-remove-scroll renderNavigationPanel replace restSvgProps rotate-180 scale selectedIdx setBlockScroll setContainer setDate sidebarEnabled sidebarProps size-4.5 sm:border sm:bottom-6 sm:max-w-[380px] sm:max-w-[400px] sm:p-1 sm:rounded-2xl spanProps start stroke-current/25 strokeDasharray strokeDashoffset tabDropdown tableOfContent text-[1.75em] text-end timezone tocEnabled tocProps tool transition translate-x-[calc(-50%-var(--removed-body-scroll-bar-size,0px)/2)] translateY typography under updated useBaseSlots useDocsPage useFluxLayout useFooterItems w-[calc(100%-var(--removed-body-scroll-bar-size,0px))] wait xl:pt-14 xl:px-8 z-30");
|
package/css/generated/glass.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@source inline("!footer
|
|
1
|
+
@source inline("!footer --fd-header-height --fd-left-width --fd-main-width --fd-right-width --row --width -me-1.5 -mt-1.5 -mx-1 -translate-x-[280px] @default @sm:max-w-[200px] [--fd-left-width:0px] [--fd-main-width:900px] [--fd-right-width:0px] [--row:calc(3*var(--spacing))] [--row:calc(6*var(--spacing))] [grid-area:left-margin/left-margin/right/right] [grid-area:left] [grid-area:main] [grid-area:right/right-margin/right/right] [grid-area:right] [mask-image:linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent))] [mask-image:radial-gradient(circle_at_center_right,white,white_200px,transparent_500px)] after aiChat article autoScroll available backdrop-blur-sm base baseVariants before bg-fd-muted-foreground/50 bg-fd-popover/80 clientX collapse contentProps data-[active=false]:hover:text-fd-accent-foreground data-[state=closed]:animate-fd-sidebar-out data-[state=open]:animate-fd-sidebar-in data-fd-full defaultSlots defaultTabs desktop edit exitTimerRef fd-glass-layout first:mt-0 flex-row-reverse font-semibold footer footerList fumadocs-core/breadcrumb getBreadcrumbItemsFromPath grid-cols-1 gridTemplate gridTemplateRows h-0 h-6 h-8 h-[calc(100dvh---spacing(4))] handles hover hover:decoration-dashed hover:decoration-fd-muted-foreground hover:opacity-80 hover:underline hover:underline-offset-4 inAnimation including information innerWidth inset-e-0 isLayoutTabActive itemTriggerVariants items-start justify-end justify-self-end layout:[--fd-main-width:1200px] leaves left left-margin leftSpace lg linkItems longer max-md:bg-linear-to-t max-md:bottom-0 max-md:from-fd-background max-md:h-16 max-md:hidden max-md:mt-auto max-md:pb-4 max-md:ps-[calc(--spacing(1.5)-1px)] max-md:w-4 max-w-[calc(100vw-3rem)] max-xl:-translate-y-1/2 max-xl:bg-fd-popover max-xl:end-1 max-xl:grid-cols-[calc(240px---spacing(6))] max-xl:mask-none max-xl:max-h-[calc(100dvh---spacing(32))] max-xl:overflow-clip max-xl:p-3 max-xl:ps-[calc(--spacing(2.5)-1px)] max-xl:rounded-xl max-xl:shadow-md max-xl:text-fd-popover-foreground max-xl:top-1/2 max-xl:w-6 max-xl:w-[240px] mb-8 md:bg-linear-to-b md:from-fd-background md:h-(--fd-header-height) md:layout:[--fd-header-height:--spacing(12)] md:layout:[--fd-left-width:0px] md:layout:[--fd-left-width:280px] md:layout:[--fd-right-width:12px] md:pb-8 md:pt-16 md:pt-2 md:px-2 md:py-1.5 md:top-0 min-h-dvh mobile mt-2 mt-2.5 mt-4 mx-2 my-2 nd-toc nd-toc-title no onPointerDown opacity-100 overflow-x-clip overflow-y-hidden p-0 p-6 pagination pb-16 pb-4 pe-3 pe-3.5 pen pointer pointer-events-none prose-sm provided ps-2.5 ps-3 ps-4.5 pt-2 pt-4 reuse right right-margin rightIcon setDate setInAnimation setMobileOpen shadow-fd-background shouldOpen size-10 size-12 size-3.5! size-4! start text-[1.75em] text-end text-fd-foreground text-fd-primary/80 timeout timezone top-2 transition-[background-color,width,height] transition-[grid-template-rows] transition-[opacity,height] transition-[width,padding] transitionTimerRef typography under unlisted updated useBaseSlots useFooterItems useGlassLayout w-(--width) w-[360px] w-[calc(280px---spacing(2))] we well xl:[@media(hover:none)]:[--row:calc(6*var(--spacing))] xl:[@media(hover:none)]:h-6 xl:[@media(hover:none)]:h-px xl:[@media(hover:none)]:opacity-100 xl:[@media(hover:none)]:pointer-events-auto xl:[@media(hover:none)]:w-(--width) xl:bg-fd-popover xl:border xl:flex-row-reverse xl:h-[calc(100dvh---spacing(10))] xl:h-[calc(100dvh-var(--fd-header-height)---spacing(4))] xl:hidden xl:items-center xl:items-end xl:layout:[--fd-right-width:240px] xl:me-2 xl:pe-4 xl:rounded-2xl xl:shadow-sm xl:sticky xl:text-end xl:top-10 xl:top-[calc(var(--fd-header-height)+--spacing(2))] z-10 z-20 z-30");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@source inline("!footer !isSelected !showItem *:col-start-1 *:max-w-[1285px] *:max-w-[900px] *:my-auto *:pointer-events-auto *:row-start-1 *:w-(--fd-sidebar-width) --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-width --fd-toc-popover-height --fd-toc-width -me-1.5 -ms-1.5 -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] after aria-valuemax aria-valuemin aria-valuenow article
|
|
1
|
+
@source inline("!footer !isSelected !showItem *:col-start-1 *:max-w-[1285px] *:max-w-[900px] *:my-auto *:pointer-events-auto *:row-start-1 *:w-(--fd-sidebar-width) --fd-ai-chat-col --fd-ai-chat-col_300ms_ease-in-out --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-col_150ms --fd-sidebar-width --fd-toc-col --fd-toc-popover-height --fd-toc-width -me-1.5 -ms-1.5 -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-col:max(var(--fd-toc-width),var(--fd-ai-chat-col))] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] [transition:--fd-sidebar-col_150ms,--fd-ai-chat-col_300ms_ease-in-out] after aiChat aiChatOpen aria-valuemax aria-valuemin aria-valuenow article auto-cols-auto auto-rows-auto available backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-s-2.5 before:inset-y-1 before:w-px bg-fd-background/80 border-b-2 border-e border-fd-primary breadcrumb breadcrumbEnabled circleProps circumference clerk click collapseTrigger collapsing containerProps createLinkItemRenderer data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-s-2.5 data-[active=true]:before:inset-y-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-[collapsed=false]:hidden data-[state=closed]:animate-fd-sidebar-out data-[state=open]:animate-fd-sidebar-in data-[transparent=false]:bg-fd-background/80 data-full data-header-body data-header-tabs data-hovered data-layout-content data-layout-main data-sidebar-collapsed data-sidebar-placeholder data-toc-popover data-toc-popover-content data-toc-popover-trigger data-transparent defaultSlots delaySetOpen desktop duration-250 edit empty:mb-0 first:mt-0 flex-row-reverse font-semibold footer footerEnabled footerList freezeUntil fumadocs-core/breadcrumb gap-2.5 gap-6 getBreadcrumbItemsFromPath grid-cols-1 gridTemplate h-(--fd-toc-popover-height) h-10 h-14 h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-2))] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] has-data-[active=true]:text-fd-primary has-data-[collapsed=true]:md:flex hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none hoverDelay iconLinks including information inset-e-0 inset-y-2 isLayoutTabActive isNavTransparent isSelected isTop items-end justify-end justify-self-end layout-level layout:[--fd-header-height:--spacing(14)] lg:hidden lg:layout:[--fd-header-height:--spacing(24)] linkItems max max-h-[50vh] max-lg:flex max-lg:hidden max-md:flex max-md:hidden max-w-[240px] max-w-[380px] max-w-sm max-xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)] maxTouchPoints mb-1.5 mb-3 mb-8 mb-auto md:gap-2 md:layout:[--fd-sidebar-width:268px] md:pt-8 md:px-6 min min-h-(--fd-docs-height) mt-6 mt-px mx-0.5 navEnabled navMode navTransparentMode navbar nd-notebook-layout nd-page nd-subnav nd-toc nd-toc-placeholder no normalizedValue onClickItem onClickOutside ontouchstart overflow-x-clip pageCol pagination pb-1.5 pe-4 pointer-events-none popover progress progressbar provided ps-2.5 pt-0.5 pt-12 pt-2 px-6 py-6 radius resolvedTabs restSvgProps rotate-180 rtl:-translate-x-2 rtl:translate-x-full selectedIdx setDate showItem showLayoutTabs sidebarCollapsible sidebarProps size-4.5 stroke-current/25 strokeDasharray strokeDashoffset tabMode tableOfContent tableOfContentPopover takes text-[1.75em] text-end text-fd-foreground timeoutRef timezone toc-popover toc-title tocEnabled tocPopover tocPopoverEnabled tocPopoverProps tocProps top-(--fd-docs-row-1) top-(--fd-docs-row-2) top-(--fd-docs-row-3) transition-[opacity,translate,color] transition-[opacity,translate] transition-[opacity,visibility] transition-[width,inset-block,translate,background-color] translate-x-2 translate-y-full transparentMode typedTabs typography under unlisted updated useBaseSlots useDocsPage useFooterItems useIsScrollTop useNotebookLayout w-(--fd-sidebar-width) w-(--fd-toc-width) w-4 w-[85%] xl:[--fd-ai-chat-col:var(--fd-ai-chat-width)] xl:border-s xl:h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] xl:hidden xl:layout:[--fd-toc-width:268px] xl:max-w-full xl:pt-14 xl:px-8 xl:sticky xl:top-(--fd-docs-row-3) z-10 z-20");
|
package/css/generated/shared.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@source inline("!collapsed !isActive !items !nested !open !title *:border-b *:data-[empty=true]:border-b-0 *:flex *:flex! *:flex-col *:flex-col! *:gap-0.5! *:has-[+:last-child[data-empty=true]]:border-b-0 *:last:border-b-0 *:rounded-full --callout-color --color-fd- --color-fd-muted --fd-animated-height --fd-banner-height --offset-distance --opacity --padding-right --radix-navigation-menu-viewport-height --radix-popover-content-available-height --radix-popover-content-transform-origin --radix-popover-trigger-width --shiki-dark-bg --shiki-light-bg --spacing --track-bottom --track-top -mb-px -me-0.5 -me-2 -mx-px -rotate-90 -top-1.5 -translate-x-1/2 -translate-y-1/2 -z-1 @container @defaultValue @deprecated @fuma-translate/react @keyframes @max-lg:col-span-full @max-xl:hidden @param @radix-ui/react-accordion @radix-ui/react-collapsible @radix-ui/react-dialog @radix-ui/react-navigation-menu @radix-ui/react-popover @radix-ui/react-presence @radix-ui/react-scroll-area @radix-ui/react-tabs @ts-expect-error @typescript-eslint/no-namespace [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none [&_svg]:size-3.5 [&_svg]:size-4 [&_svg]:size-4.5 [&_svg]:size-5 [&_svg]:size-full [&_svg]:text-fd-muted-foreground [clip-path:inset(0_0_100%)] [offset-distance:var(--offset-distance,0)] [scrollbar-width:none] a abcdefghijklmnopqrstuvwxyz234567 about absolute accordion action actions active add advanced algoliaClient align align-text-bottom alignItems alignmentBaseline all allowClear allowCopy allowDangerousHtml allowedMode allows alphabet always an anchor and animate-pulse animation another application/json areaRef aria-activedescendant aria-autocomplete aria-controls aria-describedby aria-expanded aria-label aria-live aria-selected as aside ask assume assumes async at auto await backdrop-blur-lg backdrop-blur-xs background background-position backgroundColor backgroundImage backgroundSize backward banner basePath baseProps baseSlots baseUrl based became behaviour belongs between bg-(--callout-color)/50 bg-(--shiki-light-bg) bg-fd-accent bg-fd-background bg-fd-border bg-fd-card bg-fd-muted bg-fd-overlay bg-fd-popover bg-fd-popover/60 bg-fd-primary bg-fd-primary/10 bg-fd-secondary bg-fd-secondary/50 bg-transparent bind binded bitsLeft black block blockRef blocks boolean border border-b border-l border-none border-s border-t border-transparent borderBottom bottom bottom-0 bottom-1.5 boundary buffer bundle button buttonVariants by cache cached can canonical case center central change changeLayout changes child children chooseLanguage class-variance-authority className clear client client-side clientHeight clientWidth clipPath clone close closeOnRedirect closed cn code col-span-full collapsed collapsible collection color colors column com combobox compact compat compatible component components composedRef computed config const container containerRef containing content contents context controlled/uncontrolled copy core counterSet createContext createMarkdownRenderer createRelativeLink css ctx current currentColor custom customize cva cx cy d dangerouslySetInnerHTML dark dark:bg-(--shiki-dark-bg) dashed data data-[active=true]:text-fd-primary data-[motion=from-end]:animate-fd-enterFromRight data-[motion=from-start]:animate-fd-enterFromLeft data-[motion=to-end]:animate-fd-exitToRight data-[motion=to-start]:animate-fd-exitToLeft data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary data-[state=closed]:animate-fd-accordion-up data-[state=closed]:animate-fd-collapsible-up data-[state=closed]:animate-fd-dialog-out data-[state=closed]:animate-fd-fade-out data-[state=closed]:animate-fd-nav-menu-out data-[state=closed]:animate-fd-popover-out data-[state=hidden]:animate-fd-fade-out data-[state=inactive]:hidden data-[state=open]:animate-fd-accordion-down data-[state=open]:animate-fd-collapsible-down data-[state=open]:animate-fd-dialog-in data-[state=open]:animate-fd-fade-in data-[state=open]:animate-fd-nav-menu-in data-[state=open]:animate-fd-popover-in data-[state=open]:bg-fd-accent data-[state=open]:bg-fd-accent/50 data-[state=open]:text-fd-accent-foreground data-accordion-value data-active data-card data-checked data-checked:text-fd-accent-foreground data-collapsed data-empty data-icon data-line-numbers data-line-numbers-start data-search data-search-full data-state data-theme-toggle date debounced declare default defaultColor defaultFormatter defaultIndex defaultItems defaultLanguage defaultMdxComponents defaultOpen defaultOpenLevel defaultShikiFactory defaultTransform defaultUrl defaultValue defineI18nUI defined delay delayMs depends deprecated depth description detect dialog dir disabled disabled:bg-fd-secondary disabled:opacity-50 disabled:pointer-events-none disabled:text-fd-secondary-foreground display displayName displayed distance div divide-fd-border divide-x divide-y document documented dominantBaseline don drawer dropdown duration-100 duration-200 duration-300 duration-400 during each ease-out element else empty empty:hidden enabled encoded end-2 endIdx endpoint env environment equal error escape eslint-disable-next-line event export expose extends external extraProps false fd-moving-banner fd-scroll-container fd-search-list fd-step fd-steps fetch fetchClient fetchOptions field fieldVariants figure file fill fill-(--callout-color) fill-fd-muted fill-fd-muted-foreground fill-fd-primary fill-fd-primary-foreground filter filters finally fixed flex flex-1 flex-col flex-row flex-wrap flexDirection flushSync focus focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fd-ring focus-visible:ring-inset folder folders font-medium font-mono fontSize fontWeight for forceMount forks formatter formatterOptions found fragment free from full fumadocs-core/framework fumadocs-core/highlight fumadocs-core/i18n fumadocs-core/link fumadocs-core/page-tree fumadocs-core/search fumadocs-core/source fumadocs-core/toc function gap gap-0.5 gap-1 gap-1.5 gap-2 gap-3 gap-3.5 gap-4 gap-y-4 generated ghost github-dark github-light githubUrl given global globalKey grid grid-cols-2 grid-cols-[1fr_3fr] group group-data-[active=true]:bg-fd-primary group-data-[active=true]:text-fd-primary-foreground group-data-[state=active]:bg-fd-primary group-data-[state=open]:rotate-180 group-data-[state=open]:rotate-90 group-hover/heading:opacity-100 group/heading groupListeners groups guides h h-(--fd-animated-height) h-(--radix-navigation-menu-viewport-height) h-9.5 h-[calc(100%+--spacing(1.5))] h-full h-px h1 h2 h3 h4 h5 h6 hand handle handleThemeChange has-focus-visible:bg-fd-accent hash hashchange hast have header headers heading height here hidden hideLocale highlight highlighter hints hover:bg-fd-accent hover:bg-fd-accent/80 hover:bg-fd-primary/80 hover:text-fd-accent-foreground hovered href html hydration i i18n i18nProvider icon icon-sm icon-xs iconClass id idea idx if if-needed ignore img import in inPre inTab index infinite info inline inline-flex input inputType inset-0 inset-e-2 inset-s-0 inset-s-3 inset-s-6 inset-x-0 inset-x-2 inset-y-0 inside instanceof instead integration interface intersect invisible is isActive isComposing isFirst isLast isLoading isTabActive isUp it item itemLineLengths itemVariants items items-center its js justify-between justify-center keepBackground key keyCode keydown keys l l0 l1 l2 label lang language languageSelect last:rounded-b-xl layer layout leading-none leaving left-0 left-1/2 length let letting level light light-dark light-dark-system line line-through linear link links list list-none listbox listener listeners locale localeTranslations locales lower ltr lucide lucide-book lucide-book-icon lucide-react made main make mapped margin marginTop mark markdownUrl marked mask-[linear-gradient(to_bottom,transparent,white_12px,white_calc(100%-12px),transparent)] mask-[linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent)] mask-[linear-gradient(to_bottom,white,white_30px,transparent_80px)] maskComposite maskImage max-h-(--radix-popover-content-available-height) max-h-20 max-h-[460px] max-h-[600px] max-h-[80svh] max-md:bg-fd-secondary max-md:border max-md:p-1.5 max-md:rounded-md max-w-[1400px] max-w-[98vw] max-w-full max-w-screen-sm max-width maximumFractionDigits mb-1 mb-2 md:hidden md:mb-auto md:size-5 md:top-[calc(50%-250px)] mdComponents mdRenderer mdx/types.js me-1 me-1.5 me-2 me-auto measured menu menuItems mergeRefs message middle min-h-0 min-w-0 min-w-[240px] min-w-fit min-w-full mode module mounted mouse ms-2 ms-auto ms-px mt-1 must mx-auto my-0 my-0! my-0.5 my-4 my-6 my-auto n name names namespace nav navItems navTitle navigate navigation nd-copy-ignore nd-sidebar nd-sidebar-mobile nearest needed nested nested-url never new newTheme next next-themes next/og node nodes none noop noopener noreferrer normal normalize not not-last:mb-2 not-prose notation note now null number numbers object observer of offsetHeight offsetPath offsetTop on onChange onClick onCopy onKey onOpenChange onOpenChangeCallback onPointerEnter onPointerLeave onPointerMove onPrint onSearchChange onSearchChangeCallback onSelect onSelectCallback onTagChange onTagChangeCallback onValueChange once one only opacity-(--opacity,0) opacity-0 open openFromHash option optional options or oramaCloudClient order origin-(--radix-popover-content-transform-origin) origin-[top_center] origin-center original other out outline outline-none output overflow-auto overflow-hidden overflow-x-auto overflow-y-auto override overscroll-contain own owner oxlint-disable-next-line p p-0.5 p-1 p-1.5 p-2 p-3 p-4 padding paddingBottom paddingInlineStart page pageUrl pageUrlProp panel panels parameters params parentId pass passed path pathname paths pb-0 pb-2 pe-2 per performing persist persistent placeholder placeholder:text-fd-muted-foreground please pointerType points polite populated pos positions possible powered pre pre-rendering predate prefetch present prev previous previousRef primary primaryColor primaryTextColor production promises prompt prompts prop props prose prose-no-margin provide provider ps-1 ps-2 ps-4 ps-8 pt-0 pure px px-0.5 px-1 px-1.5 px-2 px-2.5 px-3 px-4 px-px py-0.5 py-1 py-1.5 py-12 py-2 py-2.5 py-3 py-3.5 q query querySelector questions rainbow rainbowColors raw re-create react react-dom react-hooks/exhaustive-deps react-hooks/rules-of-hooks react-medium-image-zoom read reader ref referenced region registering rehype-raw rehypeCustomElements rehypePlugins rehypeRaw rel relative remarkRehypeOptions remove render renderHighlights renderMarkdown repo repository required resize resolve resolved resolvedTheme response rest result results return revalidate right-2 role root rootRef round rounded-2xl rounded-[inherit] rounded-full rounded-lg rounded-md rounded-sm rounded-xl router row rtl:-scale-x-100 rtl:rotate-180 rtl:rotate-90 s same scroll scroll-into-view-if-needed scroll-m-20 scroll-m-24 scroll-m-28 scroll-m-4 scrollIntoView scrollMode search searchOptions searchToggle searchToggleEnabled searchTrigger secondary see select-none selected separate separator server set setActive setCollapsed setHover setLoading setMounted setOpen setOpenSearch setSvg setTag setValue shadow-2xl shadow-black/50 shadow-lg shadow-md shadow-sm shiki shikiOptions shortcuts should show showAlgolia showOrama shrink-0 side sideOffset sidebar signature simple since single site size size-1 size-3 size-3.5 size-4 size-5 size-6.5 size-9 size-full sizes slots sm so solid some source space span specific sr-only src stars startIdx state static status stay sticky still str string stroke stroke-fd-foreground/10 stroke-fd-primary strokeLinecap strokeLinejoin strokeWidth strong style styles success supported supposed sure svg switch switcher sync system t tab tabIndex table tabs tabsRef tag tagName tags target text text-(--callout-color) text-[0.8125rem] text-[0.8125rem]/5 text-[0.9375rem] text-[10px] text-center text-fd-accent-foreground text-fd-card text-fd-card-foreground text-fd-foreground/80 text-fd-muted-foreground text-fd-muted-foreground/50 text-fd-popover-foreground text-fd-popover-foreground/80 text-fd-primary text-fd-primary-foreground text-fd-primary/50 text-fd-secondary-foreground text-lg text-nowrap text-sm text-start text-xs text/plain textAnchor textContent that the their theme themeAriaLabels themeSwitch themeSwitchEnabled themes then this throw thumbBox tier timerRef tip title to toc tocInfo toolbar top top-0 top-1/2 top-2.5 top-3 top-4 touch transform transition-[clip-path] transition-[height] transition-[opacity,offset-distance] transition-[width,height] transition-all transition-colors transition-opacity transition-transform translationKeys translations translations/keys.json transparent tree trigger true truncate try type typeof types unchanged undefined underline underlying understand unified unist-util-visit unknown unnecessarily update updateAnchor updates upperX url urls us usage use useCopyButton useDocsSearch useI18n useId useIsDocsLayout useItems useMediaQuery useMemo useOnChange usePathname useProps useRef useRouter useSearchContext useSidebar useState useSyncExternalStore useTOCItems useTabsGroups useTheme useTranslations useTreePath useful users using usually v v17 value valueToIdMap values variables variant variants vertical viewBox viewRef viewport viewportProps visible visit vite void w w-(--radix-popover-trigger-width) w-0 w-0.5 w-1.5 w-1/4 w-[calc(100%-1rem)] w-fit w-full w-max w-px want warn warning what when where which while white whitespace-nowrap whitespaces width will window with without work wrap wrap-anywhere wrapElement wrapInSuspense wrapped x x1 x2 xmlns y y1 y2 you your z-2 z-40 z-50 zoom zoomImg zoomMargin");
|
|
1
|
+
@source inline("!collapsed !isActive !items !nested !open !title *:border-b *:data-[empty=true]:border-b-0 *:flex *:flex! *:flex-col *:flex-col! *:gap-0.5! *:has-[+:last-child[data-empty=true]]:border-b-0 *:last:border-b-0 *:rounded-full ---spacing --callout-color --color-fd- --color-fd-muted --fd-ai-chat-width --fd-animated-height --fd-banner-height --offset-distance --opacity --padding-right --radix-navigation-menu-viewport-height --radix-popover-content-available-height --radix-popover-content-transform-origin --radix-popover-trigger-width --shiki-dark-bg --shiki-light-bg --spacing --track-bottom --track-top -mb-px -me-0.5 -me-2 -mx-px -rotate-90 -top-1.5 -translate-x-1/2 -translate-y-1/2 -z-1 @container @defaultValue @deprecated @fuma-translate/react @keyframes @max-lg:col-span-full @max-xl:hidden @param @radix-ui/react-accordion @radix-ui/react-collapsible @radix-ui/react-dialog @radix-ui/react-navigation-menu @radix-ui/react-popover @radix-ui/react-presence @radix-ui/react-scroll-area @radix-ui/react-tabs @ts-expect-error @typescript-eslint/no-namespace [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none [&_svg]:size-3.5 [&_svg]:size-4 [&_svg]:size-4.5 [&_svg]:size-5 [&_svg]:size-full [&_svg]:text-fd-muted-foreground [clip-path:inset(0_0_100%)] [offset-distance:var(--offset-distance,0)] [scrollbar-width:none] a abcdefghijklmnopqrstuvwxyz234567 about absolute accordion action actions active add advanced algoliaClient align align-text-bottom alignItems alignmentBaseline all allowClear allowCopy allowDangerousHtml allowedMode allows alphabet always an anchor and animate-pulse animation another application/json areaRef aria-activedescendant aria-autocomplete aria-controls aria-describedby aria-expanded aria-label aria-live aria-selected as aside ask assume assumes async at auto await backdrop-blur-lg backdrop-blur-xs background background-position backgroundColor backgroundImage backgroundSize backward banner basePath baseProps baseSlots baseUrl based became behaviour belongs beside between bg-(--callout-color)/50 bg-(--shiki-light-bg) bg-fd-accent bg-fd-background bg-fd-border bg-fd-card bg-fd-muted bg-fd-overlay bg-fd-popover bg-fd-popover/60 bg-fd-primary bg-fd-primary/10 bg-fd-secondary bg-fd-secondary/50 bg-transparent bind binded bitsLeft black block blockRef blocks boolean border border-b border-l border-none border-s border-t border-transparent borderBottom bottom bottom-0 bottom-1.5 boundary buffer bundle button buttonVariants by cache cached can canonical case center central change changeLayout changes chat child children chooseLanguage class-variance-authority className clear client client-side clientHeight clientWidth clipPath clone close closeOnRedirect closed cn code col-span-full collapsed collapsible collection color colors column com combobox compact compat compatible component components composedRef computed config const container containerRef containing content contents context controlled/uncontrolled copy core counterSet createContext createMarkdownRenderer createRelativeLink css ctx current currentColor custom customize cva cx cy d dangerouslySetInnerHTML dark dark:bg-(--shiki-dark-bg) dashed data data-[active=true]:text-fd-primary data-[motion=from-end]:animate-fd-enterFromRight data-[motion=from-start]:animate-fd-enterFromLeft data-[motion=to-end]:animate-fd-exitToRight data-[motion=to-start]:animate-fd-exitToLeft data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary data-[state=closed]:animate-fd-accordion-up data-[state=closed]:animate-fd-collapsible-up data-[state=closed]:animate-fd-dialog-out data-[state=closed]:animate-fd-fade-out data-[state=closed]:animate-fd-nav-menu-out data-[state=closed]:animate-fd-popover-out data-[state=hidden]:animate-fd-fade-out data-[state=inactive]:hidden data-[state=open]:animate-fd-accordion-down data-[state=open]:animate-fd-collapsible-down data-[state=open]:animate-fd-dialog-in data-[state=open]:animate-fd-fade-in data-[state=open]:animate-fd-nav-menu-in data-[state=open]:animate-fd-popover-in data-[state=open]:bg-fd-accent data-[state=open]:bg-fd-accent/50 data-[state=open]:text-fd-accent-foreground data-accordion-value data-active data-card data-checked data-checked:text-fd-accent-foreground data-collapsed data-empty data-icon data-line-numbers data-line-numbers-start data-search data-search-full data-state data-theme-toggle date debounced declare default defaultColor defaultFormatter defaultIndex defaultItems defaultLanguage defaultMdxComponents defaultOpen defaultOpenLevel defaultShikiFactory defaultTransform defaultUrl defaultValue defineI18nUI defined delay delayMs depends deprecated depth description detect dialog dir disabled disabled:bg-fd-secondary disabled:opacity-50 disabled:pointer-events-none disabled:text-fd-secondary-foreground display displayName displayed distance div divide-fd-border divide-x divide-y docked document documented dominantBaseline don drawer dropdown duration-100 duration-200 duration-300 duration-400 during each ease-in-out ease-out element else empty empty:hidden enabled encoded end-2 endIdx endpoint env environment equal error escape eslint-disable-next-line event export expose extends external extraProps false fd-moving-banner fd-scroll-container fd-search-list fd-step fd-steps fetch fetchClient fetchOptions field fieldVariants figure file fill fill-(--callout-color) fill-fd-muted fill-fd-muted-foreground fill-fd-primary fill-fd-primary-foreground filter filters finally fixed flex flex-1 flex-col flex-row flex-wrap flexDirection floating flushSync focus focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fd-ring focus-visible:ring-inset folder folders font-medium font-mono fontSize fontWeight for forceMount forks formatter formatterOptions found fragment free from full fumadocs-core/framework fumadocs-core/highlight fumadocs-core/i18n fumadocs-core/link fumadocs-core/page-tree fumadocs-core/search fumadocs-core/source fumadocs-core/toc function gap gap-0.5 gap-1 gap-1.5 gap-2 gap-3 gap-3.5 gap-4 gap-y-4 generated ghost github-dark github-light githubUrl given global globalKey grid grid-cols-2 grid-cols-[1fr_3fr] group group-data-[active=true]:bg-fd-primary group-data-[active=true]:text-fd-primary-foreground group-data-[state=active]:bg-fd-primary group-data-[state=open]:rotate-180 group-data-[state=open]:rotate-90 group-hover/heading:opacity-100 group/heading groupListeners groups guides h h-(--fd-animated-height) h-(--radix-navigation-menu-viewport-height) h-9.5 h-[calc(100%+--spacing(1.5))] h-full h-px h1 h2 h3 h4 h5 h6 hand handle handleThemeChange has-focus-visible:bg-fd-accent hash hashchange hast have header headers heading height here hidden hideLocale highlight highlighter hints hover:bg-fd-accent hover:bg-fd-accent/80 hover:bg-fd-primary/80 hover:text-fd-accent-foreground hovered href html hydration i i18n i18nProvider icon icon-sm icon-xs iconClass id idea idx if if-needed ignore img import in inPre inTab index infinite info inline inline-flex input inputType inset-0 inset-e-2 inset-s-0 inset-s-3 inset-s-6 inset-x-0 inset-x-2 inset-y-0 inside instanceof instead integration interface intersect invisible is isActive isComposing isFirst isLast isLoading isTabActive isUp it item itemLineLengths itemVariants items items-center its js justify-between justify-center keepBackground key keyCode keydown keys l l0 l1 l2 label lang language languageSelect last:rounded-b-xl layer layout layout:[--fd-ai-chat-width:min(--spacing(100),100vw---spacing(4))] leading-none leaving left-0 left-1/2 length let letting level light light-dark light-dark-system line line-through linear link links list list-none listbox listener listeners locale localeTranslations locales lower ltr lucide lucide-book lucide-book-icon lucide-react made main make mapped margin marginTop mark markdownUrl marked mask-[linear-gradient(to_bottom,transparent,white_12px,white_calc(100%-12px),transparent)] mask-[linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent)] mask-[linear-gradient(to_bottom,white,white_30px,transparent_80px)] maskComposite maskImage max-h-(--radix-popover-content-available-height) max-h-20 max-h-[460px] max-h-[600px] max-h-[80svh] max-md:bg-fd-secondary max-md:border max-md:p-1.5 max-md:rounded-md max-w-[1400px] max-w-[98vw] max-w-full max-w-screen-sm max-width max-xl:border max-xl:end-2 max-xl:fixed max-xl:inset-y-2 max-xl:rounded-2xl max-xl:shadow-xl max-xl:translate-x-[calc(100%+--spacing(2))] max-xl:w-(--fd-ai-chat-width) maximumFractionDigits mb-1 mb-2 md:hidden md:mb-auto md:size-5 md:top-[calc(50%-250px)] mdComponents mdRenderer mdx/types.js me-1 me-1.5 me-2 me-auto measured menu menuItems mergeRefs message middle min-h-0 min-w-0 min-w-[240px] min-w-fit min-w-full mode module motion-reduce:transition-none mount mounted mouse ms-2 ms-auto ms-px mt-1 must mx-auto my-0 my-0! my-0.5 my-4 my-6 my-auto n name names namespace nav navItems navTitle navigate navigation nd-copy-ignore nd-sidebar nd-sidebar-mobile nearest needed nested nested-url never new newTheme next next-themes next/og node nodes none noop noopener noreferrer normal normalize not not-last:mb-2 not-prose notation note now null number numbers object observer of offsetHeight offsetPath offsetTop on onChange onClick onCopy onKey onOpenChange onOpenChangeCallback onPointerEnter onPointerLeave onPointerMove onPrint onSearchChange onSearchChangeCallback onSelect onSelectCallback onTagChange onTagChangeCallback onValueChange once one only opacity-(--opacity,0) opacity-0 open openFromHash opened option optional options or oramaCloudClient order origin-(--radix-popover-content-transform-origin) origin-[top_center] origin-center original other out outline outline-none output over overflow-auto overflow-clip overflow-hidden overflow-x-auto overflow-y-auto override overscroll-contain own owner oxlint-disable-next-line p p-0.5 p-1 p-1.5 p-2 p-3 p-4 padding paddingBottom paddingInlineStart page pageUrl pageUrlProp panel panels parameters params parentId pass passed path pathname paths pb-0 pb-2 pe-2 per performing persist persistent place placed placeholder placeholder:text-fd-muted-foreground please pointerType points polite populated pos positions possible powered pre pre-rendering predate prefetch present prev previous previousRef primary primaryColor primaryTextColor production promises prompt prompts prop props prose prose-no-margin provide provider ps-1 ps-2 ps-4 ps-8 pt-0 pure px px-0.5 px-1 px-1.5 px-2 px-2.5 px-3 px-4 px-px py-0.5 py-1 py-1.5 py-12 py-2 py-2.5 py-3 py-3.5 q query querySelector questions rainbow rainbowColors raw re-create react react-dom react-hooks/exhaustive-deps react-hooks/rules-of-hooks react-medium-image-zoom read reader ref referenced region registering rehype-raw rehypeCustomElements rehypePlugins rehypeRaw rel relative remarkRehypeOptions remove render renderHighlights renderMarkdown repo repository required resize resizing resolve resolved resolvedTheme response rest result results return revalidate right-2 role root rootRef round rounded-2xl rounded-[inherit] rounded-full rounded-lg rounded-md rounded-sm rounded-xl router row rtl:-scale-x-100 rtl:max-xl:-translate-x-[calc(100%+--spacing(2))] rtl:rotate-180 rtl:rotate-90 s same scroll scroll-into-view-if-needed scroll-m-20 scroll-m-24 scroll-m-28 scroll-m-4 scrollIntoView scrollMode search searchOptions searchToggle searchToggleEnabled searchTrigger secondary see select-none selected separate separator server set setActive setCollapsed setHover setLoading setMounted setOpen setOpenSearch setSvg setTag setValue shadow-2xl shadow-black/50 shadow-lg shadow-md shadow-sm shiki shikiOptions shortcuts should show showAlgolia showOrama shrink-0 side sideOffset sidebar signature simple since single site size size-1 size-3 size-3.5 size-4 size-5 size-6.5 size-9 size-full sizes slots sm smaller so solid some source space span specific sr-only src stars startIdx state static status stay sticky still str string stroke stroke-fd-foreground/10 stroke-fd-primary strokeLinecap strokeLinejoin strokeWidth strong style styles success supported supposed sure svg switch switcher sync system t tab tabIndex table tabs tabsRef tag tagName tags target text text-(--callout-color) text-[0.8125rem] text-[0.8125rem]/5 text-[0.9375rem] text-[10px] text-center text-fd-accent-foreground text-fd-card text-fd-card-foreground text-fd-foreground/80 text-fd-muted-foreground text-fd-muted-foreground/50 text-fd-popover-foreground text-fd-popover-foreground/80 text-fd-primary text-fd-primary-foreground text-fd-primary/50 text-fd-secondary-foreground text-lg text-nowrap text-sm text-start text-xs text/plain textAnchor textContent that the their theme themeAriaLabels themeSwitch themeSwitchEnabled themes then this throw thumbBox tier timerRef tip title to toc tocInfo toolbar top top-0 top-1/2 top-2.5 top-3 top-4 touch transform transition-[clip-path] transition-[height] transition-[opacity,offset-distance] transition-[width,height] transition-[width,margin,translate,visibility] transition-all transition-colors transition-opacity transition-transform translationKeys translations translations/keys.json transparent tree trigger true truncate try type typeof types unchanged undefined underline underlying understand unified unist-util-visit unknown unnecessarily update updateAnchor updates upperX url urls us usage use useCopyButton useDocsSearch useI18n useId useIsDocsLayout useItems useMediaQuery useMemo useOnChange usePathname useProps useRef useRouter useSearchContext useSidebar useState useSyncExternalStore useTOCItems useTabsGroups useTheme useTranslations useTreePath useful users using usually v v17 value valueToIdMap values variables variant variants vertical viewBox viewRef viewport viewportProps visible visit vite void w w-(--fd-ai-chat-width) w-(--radix-popover-trigger-width) w-0 w-0.5 w-1.5 w-1/4 w-[calc(100%-1rem)] w-fit w-full w-max w-px want warn warning what when where which while white whitespace-nowrap whitespaces wide width will window with without work wrap wrap-anywhere wrapElement wrapInSuspense wrapped x x1 x2 xl:w-(--fd-ai-chat-width) xmlns y y1 y2 you your z-2 z-40 z-50 zoom zoomImg zoomMargin");
|
package/css/lib/base.css
CHANGED
|
@@ -291,6 +291,19 @@
|
|
|
291
291
|
initial-value: 0px;
|
|
292
292
|
}
|
|
293
293
|
|
|
294
|
+
/* to transition the columns alone */
|
|
295
|
+
@property --fd-sidebar-col {
|
|
296
|
+
syntax: '<length>';
|
|
297
|
+
inherits: true;
|
|
298
|
+
initial-value: 0px;
|
|
299
|
+
}
|
|
300
|
+
|
|
301
|
+
@property --fd-ai-chat-col {
|
|
302
|
+
syntax: '<length>';
|
|
303
|
+
inherits: true;
|
|
304
|
+
initial-value: 0px;
|
|
305
|
+
}
|
|
306
|
+
|
|
294
307
|
.fd-page-tree-item-name {
|
|
295
308
|
@apply inline-flex items-center gap-1 w-full;
|
|
296
309
|
}
|
|
@@ -21,6 +21,7 @@ export interface DocsSlots extends BaseSlots {
|
|
|
21
21
|
interface SlotsProps extends BaseSlotsProps<DocsLayoutProps> {
|
|
22
22
|
tabs: LayoutTab[];
|
|
23
23
|
tabMode: NonNullable<DocsLayoutProps['tabMode']>;
|
|
24
|
+
aiChat?: DocsLayoutProps['aiChat'];
|
|
24
25
|
}
|
|
25
26
|
export declare function useDocsLayout(): {
|
|
26
27
|
props: SlotsProps;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../../utils/cn.js";
|
|
3
3
|
import { TreeContextProvider, useTabsGroups } from "../../contexts/tree.js";
|
|
4
|
-
import { baseSlots } from "../shared/client.js";
|
|
4
|
+
import { AIChatPanel, baseSlots } from "../shared/client.js";
|
|
5
5
|
import { isLayoutTabActive, useLinkItems } from "../shared/index.js";
|
|
6
6
|
import { useIsScrollTop } from "../../utils/use-is-scroll-top.js";
|
|
7
7
|
import { Sidebar, SidebarProvider, SidebarTrigger, useSidebar } from "./slots/sidebar.js";
|
|
@@ -25,7 +25,7 @@ function useDocsLayout() {
|
|
|
25
25
|
return context;
|
|
26
26
|
}
|
|
27
27
|
function LayoutBody(props) {
|
|
28
|
-
const { nav: { enabled: navEnabled = true, transparentMode: navTransparentMode = "none" } = {}, sidebar: { enabled: sidebarEnabled = true, defaultOpenLevel, prefetch, ...sidebarProps } = {}, slots: defaultSlots, tabs, tabMode = "auto", tree, containerProps, children } = props;
|
|
28
|
+
const { nav: { enabled: navEnabled = true, transparentMode: navTransparentMode = "none" } = {}, sidebar: { enabled: sidebarEnabled = true, defaultOpenLevel, prefetch, ...sidebarProps } = {}, slots: defaultSlots, tabs, tabMode = "auto", tree, containerProps, aiChat, children } = props;
|
|
29
29
|
const isTop = useIsScrollTop({ enabled: navTransparentMode === "top" }) ?? true;
|
|
30
30
|
const isNavTransparent = navTransparentMode === "top" ? isTop : navTransparentMode === "always";
|
|
31
31
|
const { baseSlots, baseProps } = useBaseSlots(props);
|
|
@@ -48,6 +48,7 @@ function LayoutBody(props) {
|
|
|
48
48
|
props: {
|
|
49
49
|
tabMode,
|
|
50
50
|
tabs,
|
|
51
|
+
aiChat,
|
|
51
52
|
...baseProps
|
|
52
53
|
},
|
|
53
54
|
isNavTransparent,
|
|
@@ -66,7 +67,12 @@ function LayoutBody(props) {
|
|
|
66
67
|
tabs,
|
|
67
68
|
className: "z-10 bg-fd-background border-b px-6 pt-3 xl:px-8 max-md:hidden"
|
|
68
69
|
}),
|
|
69
|
-
children
|
|
70
|
+
children,
|
|
71
|
+
aiChat?.panel && /* @__PURE__ */ jsx(AIChatPanel, {
|
|
72
|
+
open: aiChat.open,
|
|
73
|
+
className: "[grid-area:toc] justify-self-end xl:sticky xl:top-(--fd-docs-row-1) xl:h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] xl:border-s",
|
|
74
|
+
children: aiChat.panel
|
|
75
|
+
})
|
|
70
76
|
]
|
|
71
77
|
})
|
|
72
78
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { BaseLayoutProps, GetLayoutTabsOptions, LayoutTab } from "../shared/index.js";
|
|
1
|
+
import { AIChatOptions, BaseLayoutProps, GetLayoutTabsOptions, LayoutTab } from "../shared/index.js";
|
|
2
2
|
import { SidebarProps, SidebarProviderProps } from "./slots/sidebar.js";
|
|
3
3
|
import { DocsSlots, useDocsLayout } from "./client.js";
|
|
4
4
|
import { HTMLAttributes, ReactNode } from "react";
|
|
@@ -10,6 +10,7 @@ export interface DocsLayoutProps extends BaseLayoutProps {
|
|
|
10
10
|
tabMode?: 'top' | 'auto';
|
|
11
11
|
tabs?: LayoutTab[] | GetLayoutTabsOptions | false;
|
|
12
12
|
containerProps?: HTMLAttributes<HTMLDivElement>;
|
|
13
|
+
aiChat?: AIChatOptions;
|
|
13
14
|
slots?: Partial<DocsSlots>;
|
|
14
15
|
}
|
|
15
16
|
interface SidebarOptions extends SidebarProps, SidebarProviderProps {
|
|
@@ -24,6 +24,7 @@ function TOC({ container, header, footer, style = "normal", list }) {
|
|
|
24
24
|
const items = useTOCItems();
|
|
25
25
|
const t = useTranslations({ note: "table of contents" });
|
|
26
26
|
const { TOCItems, TOCEmpty, TOCItem } = variants[style];
|
|
27
|
+
const { props: { aiChat } } = useDocsLayout();
|
|
27
28
|
if (items.length === 0 && !header && !footer) return /* @__PURE__ */ jsx("div", {
|
|
28
29
|
id: "nd-toc-placeholder",
|
|
29
30
|
className: "hidden xl:layout:[--fd-toc-width:268px]"
|
|
@@ -31,7 +32,7 @@ function TOC({ container, header, footer, style = "normal", list }) {
|
|
|
31
32
|
return /* @__PURE__ */ jsxs("div", {
|
|
32
33
|
id: "nd-toc",
|
|
33
34
|
...container,
|
|
34
|
-
className: cn("sticky top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] flex flex-col [grid-area:toc] w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden", container?.className),
|
|
35
|
+
className: cn("sticky top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] flex flex-col [grid-area:toc] w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden", "transition-[opacity,visibility] duration-300", aiChat?.open && aiChat.panel && "invisible opacity-0", container?.className),
|
|
35
36
|
children: [
|
|
36
37
|
header,
|
|
37
38
|
/* @__PURE__ */ jsxs("h3", {
|
|
@@ -2,20 +2,13 @@
|
|
|
2
2
|
import { cn } from "../../../utils/cn.js";
|
|
3
3
|
import { useDocsLayout } from "../client.js";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
import { useEffect, useState } from "react";
|
|
6
5
|
//#region src/layouts/docs/slots/container.tsx
|
|
7
6
|
function Container(props) {
|
|
8
7
|
const { slots } = useDocsLayout();
|
|
9
8
|
const { collapsed } = slots.sidebar.useSidebar();
|
|
10
|
-
const [previousCollapsed, setPreviousCollapsed] = useState(collapsed);
|
|
11
|
-
const isCollapseChanged = previousCollapsed !== collapsed;
|
|
12
|
-
useEffect(() => {
|
|
13
|
-
if (isCollapseChanged) setPreviousCollapsed(collapsed);
|
|
14
|
-
}, [collapsed, isCollapseChanged]);
|
|
15
9
|
return /* @__PURE__ */ jsx("div", {
|
|
16
10
|
id: "nd-docs-layout",
|
|
17
11
|
"data-sidebar-collapsed": collapsed,
|
|
18
|
-
"data-column-changed": isCollapseChanged,
|
|
19
12
|
...props,
|
|
20
13
|
style: {
|
|
21
14
|
gridTemplate: `"sidebar sidebar header toc toc"
|
|
@@ -27,7 +20,7 @@ function Container(props) {
|
|
|
27
20
|
"--fd-sidebar-col": collapsed ? "0px" : "var(--fd-sidebar-width)",
|
|
28
21
|
...props.style
|
|
29
22
|
},
|
|
30
|
-
className: cn("grid overflow-x-clip min-h-(--fd-docs-height) [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]
|
|
23
|
+
className: cn("grid overflow-x-clip min-h-(--fd-docs-height) [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px] transition-[--fd-sidebar-col]", props.className),
|
|
31
24
|
children: props.children
|
|
32
25
|
});
|
|
33
26
|
}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { BaseSlots, BaseSlotsProps } from "../shared/client.js";
|
|
2
|
-
import { BaseLayoutProps, GetLayoutTabsOptions, LayoutTab, LinkItemType } from "../shared/index.js";
|
|
2
|
+
import { AIChatOptions, BaseLayoutProps, GetLayoutTabsOptions, LayoutTab, LinkItemType } from "../shared/index.js";
|
|
3
3
|
import { SidebarDrawerProps, SidebarProps, SidebarProviderProps, useSidebar } from "./slots/sidebar.js";
|
|
4
4
|
import { HeaderProps } from "./slots/header.js";
|
|
5
5
|
import { FC } from "react";
|
|
6
6
|
import * as PageTree from "fumadocs-core/page-tree";
|
|
7
7
|
//#region src/layouts/glass/index.d.ts
|
|
8
|
-
export interface
|
|
8
|
+
export interface DocsSlots extends BaseSlots {
|
|
9
9
|
header: FC<HeaderProps>;
|
|
10
10
|
sidebar: {
|
|
11
11
|
main: FC<SidebarProps>;
|
|
@@ -14,25 +14,23 @@ export interface GlassSlots extends BaseSlots {
|
|
|
14
14
|
drawer: FC<SidebarDrawerProps>;
|
|
15
15
|
};
|
|
16
16
|
}
|
|
17
|
-
export interface
|
|
17
|
+
export interface DocsLayoutProps extends BaseLayoutProps {
|
|
18
18
|
tree: PageTree.Root;
|
|
19
19
|
tabs?: LayoutTab[] | GetLayoutTabsOptions | false;
|
|
20
|
-
aiChat?:
|
|
21
|
-
|
|
22
|
-
onOpenChange: (v: boolean) => void;
|
|
23
|
-
};
|
|
24
|
-
slots?: Partial<GlassSlots>;
|
|
20
|
+
aiChat?: AIChatOptions;
|
|
21
|
+
slots?: Partial<DocsSlots>;
|
|
25
22
|
sidebar?: Omit<SidebarProviderProps, 'children'>;
|
|
26
23
|
}
|
|
27
|
-
interface SlotsProps extends BaseSlotsProps<
|
|
24
|
+
interface SlotsProps extends BaseSlotsProps<DocsLayoutProps> {
|
|
28
25
|
tabs: LayoutTab[];
|
|
29
|
-
aiChat?:
|
|
26
|
+
aiChat?: DocsLayoutProps['aiChat'];
|
|
30
27
|
}
|
|
31
28
|
export declare function useGlassLayout(): {
|
|
32
29
|
props: SlotsProps;
|
|
33
30
|
navItems: LinkItemType[];
|
|
34
31
|
menuItems: LinkItemType[];
|
|
35
|
-
slots:
|
|
32
|
+
slots: DocsSlots;
|
|
36
33
|
};
|
|
37
|
-
export declare function
|
|
38
|
-
//#endregion
|
|
34
|
+
export declare function DocsLayout(props: DocsLayoutProps): import("react").JSX.Element;
|
|
35
|
+
//#endregion
|
|
36
|
+
export { DocsLayout as GlassLayout, type DocsLayoutProps as GlassLayoutProps, type DocsSlots as GlassSlots };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { TreeContextProvider } from "../../contexts/tree.js";
|
|
3
|
-
import { baseSlots } from "../shared/client.js";
|
|
3
|
+
import { AIChatPanel, baseSlots } from "../shared/client.js";
|
|
4
4
|
import { getLayoutTabs, useLinkItems } from "../shared/index.js";
|
|
5
5
|
import { Sidebar, SidebarDrawer, SidebarProvider, useSidebar } from "./slots/sidebar.js";
|
|
6
6
|
import { Header } from "./slots/header.js";
|
|
@@ -10,13 +10,13 @@ import { createContext, use, useMemo } from "react";
|
|
|
10
10
|
const LayoutContext = createContext(null);
|
|
11
11
|
function useGlassLayout() {
|
|
12
12
|
const context = use(LayoutContext);
|
|
13
|
-
if (!context) throw new Error("Please use Glass layout components under <
|
|
13
|
+
if (!context) throw new Error("Please use Glass layout components under <DocsLayout /> (`fumadocs-ui/layouts/glass`).");
|
|
14
14
|
return context;
|
|
15
15
|
}
|
|
16
16
|
const { useBaseSlots } = baseSlots({ useProps() {
|
|
17
17
|
return useGlassLayout().props;
|
|
18
18
|
} });
|
|
19
|
-
function
|
|
19
|
+
function DocsLayout(props) {
|
|
20
20
|
const { tree, tabs: defaultTabs, aiChat, children, slots: defaultSlots = {} } = props;
|
|
21
21
|
const linkItems = useLinkItems(props);
|
|
22
22
|
const { baseSlots, baseProps } = useBaseSlots(props);
|
|
@@ -54,12 +54,17 @@ function GlassLayout(props) {
|
|
|
54
54
|
children: /* @__PURE__ */ jsxs("div", {
|
|
55
55
|
id: "fd-glass-layout",
|
|
56
56
|
className: "grid overflow-x-clip min-h-dvh [--fd-main-width:900px] [--fd-left-width:0px] [--fd-right-width:0px]",
|
|
57
|
-
style: { gridTemplate: `"left left-margin main right-margin right" 1fr / var(--fd-left-width) ${leftSpace} 1fr calc(50% - var(--fd-main-width)/2 - var(--fd-right-width) + min(${leftSpace}, 0px)) var(--fd-right-width)` },
|
|
57
|
+
style: { gridTemplate: `"left left-margin main right-margin right" 1fr / var(--fd-left-width) ${leftSpace} 1fr minmax(calc(50% - var(--fd-main-width)/2 - var(--fd-right-width) + min(${leftSpace}, 0px)), auto) var(--fd-right-width)` },
|
|
58
58
|
children: [
|
|
59
59
|
/* @__PURE__ */ jsx(slots.sidebar.drawer, {}),
|
|
60
60
|
/* @__PURE__ */ jsx(slots.sidebar.main, {}),
|
|
61
61
|
/* @__PURE__ */ jsx(slots.header, {}),
|
|
62
|
-
children
|
|
62
|
+
children,
|
|
63
|
+
aiChat?.panel && /* @__PURE__ */ jsx(AIChatPanel, {
|
|
64
|
+
open: aiChat.open,
|
|
65
|
+
className: "[grid-area:right/right-margin/right/right] justify-self-end xl:sticky xl:top-[calc(var(--fd-header-height)+--spacing(2))] xl:h-[calc(100dvh-var(--fd-header-height)---spacing(4))] xl:me-2 xl:rounded-2xl xl:border xl:bg-fd-popover xl:shadow-sm",
|
|
66
|
+
children: aiChat.panel
|
|
67
|
+
})
|
|
63
68
|
]
|
|
64
69
|
})
|
|
65
70
|
})
|
|
@@ -67,4 +72,4 @@ function GlassLayout(props) {
|
|
|
67
72
|
});
|
|
68
73
|
}
|
|
69
74
|
//#endregion
|
|
70
|
-
export { GlassLayout, useGlassLayout };
|
|
75
|
+
export { DocsLayout, DocsLayout as GlassLayout, useGlassLayout };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../../../../utils/cn.js";
|
|
3
3
|
import { TOCProvider as TOCProvider$1, TOCScrollArea, useTOCItems } from "../../../../components/toc/index.js";
|
|
4
|
+
import { useGlassLayout } from "../../index.js";
|
|
4
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
6
|
import { Text } from "lucide-react";
|
|
6
7
|
import { createContext, use, useMemo, useRef, useState } from "react";
|
|
@@ -18,6 +19,7 @@ function useContext$1() {
|
|
|
18
19
|
function TOC({ container, header, footer }) {
|
|
19
20
|
const t = useTranslations({ note: "table of contents" });
|
|
20
21
|
const items = useTOCItems();
|
|
22
|
+
const { props: { aiChat } } = useGlassLayout();
|
|
21
23
|
const [hover, setHover] = useState(false);
|
|
22
24
|
const [mobileOpen, setMobileOpen] = useState(false);
|
|
23
25
|
const [inAnimation, setInAnimation] = useState(false);
|
|
@@ -45,7 +47,7 @@ function TOC({ container, header, footer }) {
|
|
|
45
47
|
}), /* @__PURE__ */ jsx(TOCScrollArea, {
|
|
46
48
|
id: "nd-toc",
|
|
47
49
|
...container,
|
|
48
|
-
className: cn("z-10 grid transition-[width,padding] duration-300 [grid-area:right]", "xl:sticky xl:top-10 xl:h-[calc(100dvh---spacing(10))] md:layout:[--fd-right-width:12px] xl:layout:[--fd-right-width:240px] xl:items-center xl:pe-4", "max-xl:fixed max-xl:top-1/2 max-xl:-translate-y-1/2 max-xl:end-1 max-xl:bg-fd-popover max-xl:text-fd-popover-foreground max-xl:border max-xl:rounded-xl max-xl:shadow-md max-xl:mask-none max-xl:max-h-[calc(100dvh---spacing(32))] max-xl:grid-cols-[calc(240px---spacing(6))]", inAnimation && "overflow-y-hidden", open ? "max-xl:w-[240px] max-xl:p-3" : "max-md:w-4 max-md:ps-[calc(--spacing(1.5)-1px)] max-xl:w-6 max-xl:ps-[calc(--spacing(2.5)-1px)] max-xl:overflow-clip", container?.className),
|
|
50
|
+
className: cn("z-10 grid transition-[width,padding] duration-300 [grid-area:right]", aiChat?.open && aiChat.panel && "invisible", "xl:sticky xl:top-10 xl:h-[calc(100dvh---spacing(10))] md:layout:[--fd-right-width:12px] xl:layout:[--fd-right-width:240px] xl:items-center xl:pe-4", "max-xl:fixed max-xl:top-1/2 max-xl:-translate-y-1/2 max-xl:end-1 max-xl:bg-fd-popover max-xl:text-fd-popover-foreground max-xl:border max-xl:rounded-xl max-xl:shadow-md max-xl:mask-none max-xl:max-h-[calc(100dvh---spacing(32))] max-xl:grid-cols-[calc(240px---spacing(6))]", inAnimation && "overflow-y-hidden", open ? "max-xl:w-[240px] max-xl:p-3" : "max-md:w-4 max-md:ps-[calc(--spacing(1.5)-1px)] max-xl:w-6 max-xl:ps-[calc(--spacing(2.5)-1px)] max-xl:overflow-clip", container?.className),
|
|
49
51
|
onPointerDown: (e) => {
|
|
50
52
|
if (!mobileOpen && (e.pointerType === "touch" || e.pointerType === "pen")) setMobileOpen(true);
|
|
51
53
|
},
|
|
@@ -14,7 +14,7 @@ function Header({ className, ...props }) {
|
|
|
14
14
|
const t = useTranslations();
|
|
15
15
|
const sidebar = slots.sidebar.use();
|
|
16
16
|
return /* @__PURE__ */ jsxs("div", {
|
|
17
|
-
className: cn("sticky flex flex-row justify-end gap-2 [grid-area:left-margin/left-margin/right/right] z-20 px-4 md:top-0 md:pt-2 md:px-2 md:h-12 md:bg-linear-to-b md:from-fd-background max-md:bottom-0 max-md:mt-auto max-md:h-16 max-md:pb-4 max-md:bg-linear-to-t max-md:from-fd-background", className),
|
|
17
|
+
className: cn("sticky flex flex-row justify-end gap-2 [grid-area:left-margin/left-margin/right/right] z-20 px-4 md:top-0 md:pt-2 md:px-2 md:h-(--fd-header-height) md:layout:[--fd-header-height:--spacing(12)] md:bg-linear-to-b md:from-fd-background max-md:bottom-0 max-md:mt-auto max-md:h-16 max-md:pb-4 max-md:bg-linear-to-t max-md:from-fd-background", className),
|
|
18
18
|
...props,
|
|
19
19
|
children: [
|
|
20
20
|
sidebar.collapsible && sidebar.collapsed && /* @__PURE__ */ jsx("button", {
|
|
@@ -23,6 +23,7 @@ interface SlotsProps extends BaseSlotsProps<DocsLayoutProps> {
|
|
|
23
23
|
sidebar: SidebarProps;
|
|
24
24
|
tabMode: NonNullable<DocsLayoutProps['tabMode']>;
|
|
25
25
|
tabs: LayoutTab[];
|
|
26
|
+
aiChat?: DocsLayoutProps['aiChat'];
|
|
26
27
|
}
|
|
27
28
|
export declare function useNotebookLayout(): {
|
|
28
29
|
props: SlotsProps;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { TreeContextProvider } from "../../contexts/tree.js";
|
|
3
|
-
import { baseSlots } from "../shared/client.js";
|
|
3
|
+
import { AIChatPanel, baseSlots } from "../shared/client.js";
|
|
4
4
|
import { useLinkItems } from "../shared/index.js";
|
|
5
5
|
import { useIsScrollTop } from "../../utils/use-is-scroll-top.js";
|
|
6
6
|
import { Container } from "./slots/container.js";
|
|
@@ -19,7 +19,7 @@ function useNotebookLayout() {
|
|
|
19
19
|
return context;
|
|
20
20
|
}
|
|
21
21
|
function LayoutBody(props) {
|
|
22
|
-
const { nav: { enabled: navEnabled = true, transparentMode: navTransparentMode = "none" } = {}, sidebar: { defaultOpenLevel, prefetch, ...sidebarProps } = {}, slots: defaultSlots, tabMode = "sidebar", tabs, tree, containerProps, children } = props;
|
|
22
|
+
const { nav: { enabled: navEnabled = true, transparentMode: navTransparentMode = "none" } = {}, sidebar: { defaultOpenLevel, prefetch, ...sidebarProps } = {}, slots: defaultSlots, tabMode = "sidebar", tabs, tree, containerProps, aiChat, children } = props;
|
|
23
23
|
const isTop = useIsScrollTop({ enabled: navTransparentMode === "top" }) ?? true;
|
|
24
24
|
const isNavTransparent = navTransparentMode === "top" ? isTop : navTransparentMode === "always";
|
|
25
25
|
const { baseSlots, baseProps } = useBaseSlots(props);
|
|
@@ -44,6 +44,7 @@ function LayoutBody(props) {
|
|
|
44
44
|
tabs,
|
|
45
45
|
tabMode,
|
|
46
46
|
sidebar: sidebarProps,
|
|
47
|
+
aiChat,
|
|
47
48
|
...baseProps
|
|
48
49
|
},
|
|
49
50
|
isNavTransparent,
|
|
@@ -58,7 +59,12 @@ function LayoutBody(props) {
|
|
|
58
59
|
children: [
|
|
59
60
|
navEnabled && /* @__PURE__ */ jsx(slots.header, {}),
|
|
60
61
|
/* @__PURE__ */ jsx(slots.sidebar.root, { ...sidebarProps }),
|
|
61
|
-
children
|
|
62
|
+
children,
|
|
63
|
+
aiChat?.panel && /* @__PURE__ */ jsx(AIChatPanel, {
|
|
64
|
+
open: aiChat.open,
|
|
65
|
+
className: "[grid-area:toc] justify-self-end xl:sticky xl:max-w-full xl:top-(--fd-docs-row-3) xl:h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] xl:border-s",
|
|
66
|
+
children: aiChat.panel
|
|
67
|
+
})
|
|
62
68
|
]
|
|
63
69
|
})
|
|
64
70
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { BaseLayoutProps, GetLayoutTabsOptions, LayoutTab, NavOptions } from "../shared/index.js";
|
|
1
|
+
import { AIChatOptions, BaseLayoutProps, GetLayoutTabsOptions, LayoutTab, NavOptions } from "../shared/index.js";
|
|
2
2
|
import { SidebarProps, SidebarProviderProps } from "./slots/sidebar.js";
|
|
3
3
|
import { DocsSlots, useNotebookLayout } from "./client.js";
|
|
4
4
|
import { HTMLAttributes } from "react";
|
|
@@ -13,6 +13,7 @@ export interface DocsLayoutProps extends Omit<BaseLayoutProps, 'nav'> {
|
|
|
13
13
|
mode?: 'top' | 'auto';
|
|
14
14
|
};
|
|
15
15
|
containerProps?: HTMLAttributes<HTMLDivElement>;
|
|
16
|
+
aiChat?: AIChatOptions;
|
|
16
17
|
slots?: Partial<DocsSlots>;
|
|
17
18
|
}
|
|
18
19
|
export interface SidebarOptions extends SidebarProps, SidebarProviderProps {
|
|
@@ -24,6 +24,7 @@ function TOC({ container, header, footer, style = "normal", list }) {
|
|
|
24
24
|
const items = useTOCItems();
|
|
25
25
|
const t = useTranslations({ note: "table of contents" });
|
|
26
26
|
const { TOCItems, TOCEmpty, TOCItem } = variants[style];
|
|
27
|
+
const { props: { aiChat } } = useNotebookLayout();
|
|
27
28
|
if (items.length === 0 && !footer && !header) return /* @__PURE__ */ jsx("div", {
|
|
28
29
|
id: "nd-toc-placeholder",
|
|
29
30
|
className: "hidden xl:layout:[--fd-toc-width:268px]"
|
|
@@ -31,7 +32,7 @@ function TOC({ container, header, footer, style = "normal", list }) {
|
|
|
31
32
|
return /* @__PURE__ */ jsxs("div", {
|
|
32
33
|
id: "nd-toc",
|
|
33
34
|
...container,
|
|
34
|
-
className: cn("sticky top-(--fd-docs-row-3) [grid-area:toc] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] flex flex-col w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden", container?.className),
|
|
35
|
+
className: cn("sticky top-(--fd-docs-row-3) [grid-area:toc] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] flex flex-col w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden", "transition-[opacity,visibility] duration-300", aiChat?.open && aiChat.panel && "invisible opacity-0", container?.className),
|
|
35
36
|
children: [
|
|
36
37
|
header,
|
|
37
38
|
/* @__PURE__ */ jsxs("h3", {
|
|
@@ -2,35 +2,29 @@
|
|
|
2
2
|
import { cn } from "../../../utils/cn.js";
|
|
3
3
|
import { useNotebookLayout } from "../client.js";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
import { useEffect, useState } from "react";
|
|
6
5
|
//#region src/layouts/notebook/slots/container.tsx
|
|
7
6
|
function Container(props) {
|
|
8
|
-
const { props: { nav }, slots } = useNotebookLayout();
|
|
9
|
-
const pageCol = "calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-col) - var(--fd-toc-
|
|
7
|
+
const { props: { nav, aiChat }, slots } = useNotebookLayout();
|
|
8
|
+
const pageCol = "calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-col) - var(--fd-toc-col))";
|
|
10
9
|
const { collapsed } = slots.sidebar?.useSidebar?.() ?? {};
|
|
11
|
-
const
|
|
12
|
-
const isCollapseChanged = previousCollapsed !== collapsed;
|
|
13
|
-
useEffect(() => {
|
|
14
|
-
if (isCollapseChanged) setPreviousCollapsed(collapsed);
|
|
15
|
-
}, [collapsed, isCollapseChanged]);
|
|
10
|
+
const aiChatOpen = Boolean(aiChat?.open && aiChat.panel);
|
|
16
11
|
return /* @__PURE__ */ jsx("div", {
|
|
17
12
|
id: "nd-notebook-layout",
|
|
18
13
|
"data-sidebar-collapsed": collapsed,
|
|
19
|
-
"data-column-changed": isCollapseChanged,
|
|
20
14
|
...props,
|
|
21
15
|
style: {
|
|
22
16
|
gridTemplate: nav?.mode === "top" ? `". header header header ."
|
|
23
17
|
"sidebar sidebar toc-popover toc-popover ."
|
|
24
|
-
"sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-
|
|
18
|
+
"sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-col) minmax(min-content, 1fr)` : `"sidebar sidebar header header ."
|
|
25
19
|
"sidebar sidebar toc-popover toc-popover ."
|
|
26
|
-
"sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-
|
|
20
|
+
"sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-col) minmax(min-content, 1fr)`,
|
|
27
21
|
"--fd-docs-row-1": "var(--fd-banner-height, 0px)",
|
|
28
22
|
"--fd-docs-row-2": "calc(var(--fd-docs-row-1) + var(--fd-header-height))",
|
|
29
23
|
"--fd-docs-row-3": "calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))",
|
|
30
24
|
"--fd-sidebar-col": collapsed ? "0px" : "var(--fd-sidebar-width)",
|
|
31
25
|
...props.style
|
|
32
26
|
},
|
|
33
|
-
className: cn("grid overflow-x-clip min-h-(--fd-docs-height) auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]
|
|
27
|
+
className: cn("grid overflow-x-clip min-h-(--fd-docs-height) auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px] [--fd-toc-col:max(var(--fd-toc-width),var(--fd-ai-chat-col))] [transition:--fd-sidebar-col_150ms,--fd-ai-chat-col_300ms_ease-in-out]", aiChatOpen && "xl:[--fd-ai-chat-col:var(--fd-ai-chat-width)]", props.className),
|
|
34
28
|
children: props.children
|
|
35
29
|
});
|
|
36
30
|
}
|
|
@@ -2,7 +2,7 @@ import { LanguageSelectProps, LanguageSelectTextProps } from "./slots/language-s
|
|
|
2
2
|
import { FullSearchTriggerProps, SearchTriggerProps } from "./slots/search-trigger.js";
|
|
3
3
|
import { ThemeSwitchProps } from "./slots/theme-switch.js";
|
|
4
4
|
import { BaseLayoutProps, LinkItemType } from "./index.js";
|
|
5
|
-
import { ComponentProps, FC } from "react";
|
|
5
|
+
import { ComponentProps, FC, ReactNode } from "react";
|
|
6
6
|
//#region src/layouts/shared/client.d.ts
|
|
7
7
|
export declare function LinkItem({ ref, item, ...props }: Omit<ComponentProps<'a'>, 'href'> & {
|
|
8
8
|
item: Extract<LinkItemType, {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import { cn } from "../../utils/cn.js";
|
|
2
3
|
import { useI18n } from "../../contexts/i18n.js";
|
|
3
4
|
import { LanguageSelect, LanguageSelectText } from "./slots/language-select.js";
|
|
4
5
|
import { FullSearchTrigger, SearchTrigger } from "./slots/search-trigger.js";
|
|
@@ -7,6 +8,7 @@ import { isLinkItemActive } from "./index.js";
|
|
|
7
8
|
import Link from "fumadocs-core/link";
|
|
8
9
|
import { usePathname } from "fumadocs-core/framework";
|
|
9
10
|
import { jsx } from "react/jsx-runtime";
|
|
11
|
+
import { useState } from "react";
|
|
10
12
|
//#region src/layouts/shared/client.tsx
|
|
11
13
|
function LinkItem({ ref, item, ...props }) {
|
|
12
14
|
const pathname = usePathname();
|
|
@@ -20,6 +22,20 @@ function LinkItem({ ref, item, ...props }) {
|
|
|
20
22
|
children: props.children
|
|
21
23
|
});
|
|
22
24
|
}
|
|
25
|
+
/**
|
|
26
|
+
* The place of AI chat, docked by the layout on wide viewports, and floating on smaller ones.
|
|
27
|
+
*/
|
|
28
|
+
function AIChatPanel({ open, className, children }) {
|
|
29
|
+
const [mounted, setMounted] = useState(open);
|
|
30
|
+
if (open && !mounted) setMounted(true);
|
|
31
|
+
return /* @__PURE__ */ jsx("aside", {
|
|
32
|
+
className: cn("z-40 overflow-clip bg-fd-card text-fd-card-foreground layout:[--fd-ai-chat-width:min(--spacing(100),100vw---spacing(4))] transition-[width,margin,translate,visibility] duration-300 ease-in-out motion-reduce:transition-none max-xl:fixed max-xl:inset-y-2 max-xl:end-2 max-xl:w-(--fd-ai-chat-width) max-xl:rounded-2xl max-xl:border max-xl:shadow-xl", open ? "w-(--fd-ai-chat-width)" : "invisible w-0 max-xl:translate-x-[calc(100%+--spacing(2))] rtl:max-xl:-translate-x-[calc(100%+--spacing(2))]", className),
|
|
33
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
34
|
+
className: "flex flex-col size-full xl:w-(--fd-ai-chat-width)",
|
|
35
|
+
children: mounted && children
|
|
36
|
+
})
|
|
37
|
+
});
|
|
38
|
+
}
|
|
23
39
|
function baseSlots({ useProps }) {
|
|
24
40
|
function InlineThemeSwitch(props) {
|
|
25
41
|
const { themeSwitch } = useProps();
|
|
@@ -82,4 +98,4 @@ function baseSlots({ useProps }) {
|
|
|
82
98
|
} };
|
|
83
99
|
}
|
|
84
100
|
//#endregion
|
|
85
|
-
export { LinkItem, baseSlots };
|
|
101
|
+
export { AIChatPanel, LinkItem, baseSlots };
|
|
@@ -59,6 +59,14 @@ interface ThemeSwitchOptions extends ThemeSwitchProps {
|
|
|
59
59
|
/** @deprecated use `slots.themeSwitch` instead */
|
|
60
60
|
component?: ReactNode;
|
|
61
61
|
}
|
|
62
|
+
export interface AIChatOptions {
|
|
63
|
+
open: boolean;
|
|
64
|
+
onOpenChange: (open: boolean) => void;
|
|
65
|
+
/**
|
|
66
|
+
* The chat panel, placed beside the page on wide viewports, and floating over it on smaller ones.
|
|
67
|
+
*/
|
|
68
|
+
panel?: ReactNode;
|
|
69
|
+
}
|
|
62
70
|
export interface LayoutTab {
|
|
63
71
|
/**
|
|
64
72
|
* Redirect URL of the folder, usually the index page
|
package/dist/style.css
CHANGED
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
--radius-xl: 0.75rem;
|
|
36
36
|
--radius-2xl: 1rem;
|
|
37
37
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
38
|
+
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
|
|
38
39
|
--animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
39
40
|
--blur-xs: 4px;
|
|
40
41
|
--blur-sm: 8px;
|
|
@@ -1107,6 +1108,9 @@
|
|
|
1107
1108
|
.min-h-dvh {
|
|
1108
1109
|
min-height: 100dvh;
|
|
1109
1110
|
}
|
|
1111
|
+
.w-\(--fd-ai-chat-width\) {
|
|
1112
|
+
width: var(--fd-ai-chat-width);
|
|
1113
|
+
}
|
|
1110
1114
|
.w-\(--fd-sidebar-width\) {
|
|
1111
1115
|
width: var(--fd-sidebar-width);
|
|
1112
1116
|
}
|
|
@@ -1395,6 +1399,9 @@
|
|
|
1395
1399
|
:where(.divide-fd-border > :not(:last-child)) {
|
|
1396
1400
|
border-color: var(--color-fd-border);
|
|
1397
1401
|
}
|
|
1402
|
+
.justify-self-end {
|
|
1403
|
+
justify-self: flex-end;
|
|
1404
|
+
}
|
|
1398
1405
|
.truncate {
|
|
1399
1406
|
overflow: hidden;
|
|
1400
1407
|
text-overflow: ellipsis;
|
|
@@ -1403,6 +1410,9 @@
|
|
|
1403
1410
|
.overflow-auto {
|
|
1404
1411
|
overflow: auto;
|
|
1405
1412
|
}
|
|
1413
|
+
.overflow-clip {
|
|
1414
|
+
overflow: clip;
|
|
1415
|
+
}
|
|
1406
1416
|
.overflow-hidden {
|
|
1407
1417
|
overflow: hidden;
|
|
1408
1418
|
}
|
|
@@ -2013,6 +2023,11 @@
|
|
|
2013
2023
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2014
2024
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2015
2025
|
}
|
|
2026
|
+
.transition-\[--fd-sidebar-col\] {
|
|
2027
|
+
transition-property: --fd-sidebar-col;
|
|
2028
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2029
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2030
|
+
}
|
|
2016
2031
|
.transition-\[background-color\,width\,height\] {
|
|
2017
2032
|
transition-property: background-color,width,height;
|
|
2018
2033
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
@@ -2053,6 +2068,11 @@
|
|
|
2053
2068
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2054
2069
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2055
2070
|
}
|
|
2071
|
+
.transition-\[opacity\,visibility\] {
|
|
2072
|
+
transition-property: opacity,visibility;
|
|
2073
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2074
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2075
|
+
}
|
|
2056
2076
|
.transition-\[width\,height\] {
|
|
2057
2077
|
transition-property: width,height;
|
|
2058
2078
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
@@ -2063,6 +2083,11 @@
|
|
|
2063
2083
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2064
2084
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2065
2085
|
}
|
|
2086
|
+
.transition-\[width\,margin\,translate\,visibility\] {
|
|
2087
|
+
transition-property: width,margin,translate,visibility;
|
|
2088
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2089
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2090
|
+
}
|
|
2066
2091
|
.transition-\[width\,padding\] {
|
|
2067
2092
|
transition-property: width,padding;
|
|
2068
2093
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
@@ -2108,6 +2133,10 @@
|
|
|
2108
2133
|
--tw-duration: 400ms;
|
|
2109
2134
|
transition-duration: 400ms;
|
|
2110
2135
|
}
|
|
2136
|
+
.ease-in-out {
|
|
2137
|
+
--tw-ease: var(--ease-in-out);
|
|
2138
|
+
transition-timing-function: var(--ease-in-out);
|
|
2139
|
+
}
|
|
2111
2140
|
.ease-out {
|
|
2112
2141
|
--tw-ease: var(--ease-out);
|
|
2113
2142
|
transition-timing-function: var(--ease-out);
|
|
@@ -2141,6 +2170,9 @@
|
|
|
2141
2170
|
.\[--fd-sidebar-width\:0px\] {
|
|
2142
2171
|
--fd-sidebar-width: 0px;
|
|
2143
2172
|
}
|
|
2173
|
+
.\[--fd-toc-col\:max\(var\(--fd-toc-width\)\,var\(--fd-ai-chat-col\)\)\] {
|
|
2174
|
+
--fd-toc-col: max(var(--fd-toc-width), var(--fd-ai-chat-col));
|
|
2175
|
+
}
|
|
2144
2176
|
.\[--fd-toc-popover-height\:0px\] {
|
|
2145
2177
|
--fd-toc-popover-height: 0px;
|
|
2146
2178
|
}
|
|
@@ -2168,6 +2200,9 @@
|
|
|
2168
2200
|
.\[grid-area\:main\] {
|
|
2169
2201
|
grid-area: main;
|
|
2170
2202
|
}
|
|
2203
|
+
.\[grid-area\:right\/right-margin\/right\/right\] {
|
|
2204
|
+
grid-area: right/right-margin/right/right;
|
|
2205
|
+
}
|
|
2171
2206
|
.\[grid-area\:right\] {
|
|
2172
2207
|
grid-area: right;
|
|
2173
2208
|
}
|
|
@@ -2183,6 +2218,9 @@
|
|
|
2183
2218
|
.\[offset-distance\:var\(--offset-distance\,0\)\] {
|
|
2184
2219
|
offset-distance: var(--offset-distance,0);
|
|
2185
2220
|
}
|
|
2221
|
+
.\[transition\:--fd-sidebar-col_150ms\,--fd-ai-chat-col_300ms_ease-in-out\] {
|
|
2222
|
+
transition: --fd-sidebar-col 150ms,--fd-ai-chat-col 300ms ease-in-out;
|
|
2223
|
+
}
|
|
2186
2224
|
:is(.\*\:pointer-events-auto > *) {
|
|
2187
2225
|
pointer-events: auto;
|
|
2188
2226
|
}
|
|
@@ -2479,11 +2517,6 @@
|
|
|
2479
2517
|
.data-\[collapsed\=false\]\:hidden[data-collapsed="false"] {
|
|
2480
2518
|
display: none;
|
|
2481
2519
|
}
|
|
2482
|
-
.data-\[column-changed\=true\]\:transition-\[grid-template-columns\][data-column-changed="true"] {
|
|
2483
|
-
transition-property: grid-template-columns;
|
|
2484
|
-
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
2485
|
-
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
2486
|
-
}
|
|
2487
2520
|
:is(.\*\:data-\[empty\=true\]\:border-b-0 > *)[data-empty="true"] {
|
|
2488
2521
|
border-bottom-style: var(--tw-border-style);
|
|
2489
2522
|
border-bottom-width: 0px;
|
|
@@ -2572,13 +2605,24 @@
|
|
|
2572
2605
|
background-color: color-mix(in oklab, var(--color-fd-background) 80%, transparent);
|
|
2573
2606
|
}
|
|
2574
2607
|
}
|
|
2608
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2609
|
+
.motion-reduce\:transition-none {
|
|
2610
|
+
transition-property: none;
|
|
2611
|
+
}
|
|
2612
|
+
}
|
|
2575
2613
|
@media (width < 80rem) {
|
|
2576
2614
|
.max-xl\:fixed {
|
|
2577
2615
|
position: fixed;
|
|
2578
2616
|
}
|
|
2617
|
+
.max-xl\:inset-y-2 {
|
|
2618
|
+
inset-block: calc(var(--spacing) * 2);
|
|
2619
|
+
}
|
|
2579
2620
|
.max-xl\:end-1 {
|
|
2580
2621
|
inset-inline-end: calc(var(--spacing) * 1);
|
|
2581
2622
|
}
|
|
2623
|
+
.max-xl\:end-2 {
|
|
2624
|
+
inset-inline-end: calc(var(--spacing) * 2);
|
|
2625
|
+
}
|
|
2582
2626
|
.max-xl\:top-1\/2 {
|
|
2583
2627
|
top: calc(1 / 2 * 100%);
|
|
2584
2628
|
}
|
|
@@ -2588,12 +2632,19 @@
|
|
|
2588
2632
|
.max-xl\:max-h-\[calc\(100dvh---spacing\(32\)\)\] {
|
|
2589
2633
|
max-height: calc(100dvh - calc(var(--spacing) * 32));
|
|
2590
2634
|
}
|
|
2635
|
+
.max-xl\:w-\(--fd-ai-chat-width\) {
|
|
2636
|
+
width: var(--fd-ai-chat-width);
|
|
2637
|
+
}
|
|
2591
2638
|
.max-xl\:w-6 {
|
|
2592
2639
|
width: calc(var(--spacing) * 6);
|
|
2593
2640
|
}
|
|
2594
2641
|
.max-xl\:w-\[240px\] {
|
|
2595
2642
|
width: 240px;
|
|
2596
2643
|
}
|
|
2644
|
+
.max-xl\:translate-x-\[calc\(100\%\+--spacing\(2\)\)\] {
|
|
2645
|
+
--tw-translate-x: calc(100% + calc(var(--spacing) * 2));
|
|
2646
|
+
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
2647
|
+
}
|
|
2597
2648
|
.max-xl\:-translate-y-1\/2 {
|
|
2598
2649
|
--tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
|
|
2599
2650
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
@@ -2604,6 +2655,9 @@
|
|
|
2604
2655
|
.max-xl\:overflow-clip {
|
|
2605
2656
|
overflow: clip;
|
|
2606
2657
|
}
|
|
2658
|
+
.max-xl\:rounded-2xl {
|
|
2659
|
+
border-radius: var(--radius-2xl);
|
|
2660
|
+
}
|
|
2607
2661
|
.max-xl\:rounded-xl {
|
|
2608
2662
|
border-radius: var(--radius-xl);
|
|
2609
2663
|
}
|
|
@@ -2630,6 +2684,10 @@
|
|
|
2630
2684
|
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
2631
2685
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2632
2686
|
}
|
|
2687
|
+
.max-xl\:shadow-xl {
|
|
2688
|
+
--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
2689
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2690
|
+
}
|
|
2633
2691
|
}
|
|
2634
2692
|
@media (width < 64rem) {
|
|
2635
2693
|
.max-lg\:flex {
|
|
@@ -2759,8 +2817,8 @@
|
|
|
2759
2817
|
width: calc(var(--spacing) * 5);
|
|
2760
2818
|
height: calc(var(--spacing) * 5);
|
|
2761
2819
|
}
|
|
2762
|
-
.md\:h-
|
|
2763
|
-
height:
|
|
2820
|
+
.md\:h-\(--fd-header-height\) {
|
|
2821
|
+
height: var(--fd-header-height);
|
|
2764
2822
|
}
|
|
2765
2823
|
.md\:grid-cols-2 {
|
|
2766
2824
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
@@ -2827,15 +2885,42 @@
|
|
|
2827
2885
|
.xl\:sticky {
|
|
2828
2886
|
position: sticky;
|
|
2829
2887
|
}
|
|
2888
|
+
.xl\:top-\(--fd-docs-row-1\) {
|
|
2889
|
+
top: var(--fd-docs-row-1);
|
|
2890
|
+
}
|
|
2891
|
+
.xl\:top-\(--fd-docs-row-3\) {
|
|
2892
|
+
top: var(--fd-docs-row-3);
|
|
2893
|
+
}
|
|
2830
2894
|
.xl\:top-10 {
|
|
2831
2895
|
top: calc(var(--spacing) * 10);
|
|
2832
2896
|
}
|
|
2897
|
+
.xl\:top-\[calc\(var\(--fd-header-height\)\+--spacing\(2\)\)\] {
|
|
2898
|
+
top: calc(var(--fd-header-height) + calc(var(--spacing) * 2));
|
|
2899
|
+
}
|
|
2900
|
+
.xl\:me-2 {
|
|
2901
|
+
margin-inline-end: calc(var(--spacing) * 2);
|
|
2902
|
+
}
|
|
2833
2903
|
.xl\:hidden {
|
|
2834
2904
|
display: none;
|
|
2835
2905
|
}
|
|
2836
2906
|
.xl\:h-\[calc\(100dvh---spacing\(10\)\)\] {
|
|
2837
2907
|
height: calc(100dvh - calc(var(--spacing) * 10));
|
|
2838
2908
|
}
|
|
2909
|
+
.xl\:h-\[calc\(100dvh-var\(--fd-header-height\)---spacing\(4\)\)\] {
|
|
2910
|
+
height: calc(100dvh - var(--fd-header-height) - calc(var(--spacing) * 4));
|
|
2911
|
+
}
|
|
2912
|
+
.xl\:h-\[calc\(var\(--fd-docs-height\)-var\(--fd-docs-row-1\)\)\] {
|
|
2913
|
+
height: calc(var(--fd-docs-height) - var(--fd-docs-row-1));
|
|
2914
|
+
}
|
|
2915
|
+
.xl\:h-\[calc\(var\(--fd-docs-height\)-var\(--fd-docs-row-3\)\)\] {
|
|
2916
|
+
height: calc(var(--fd-docs-height) - var(--fd-docs-row-3));
|
|
2917
|
+
}
|
|
2918
|
+
.xl\:w-\(--fd-ai-chat-width\) {
|
|
2919
|
+
width: var(--fd-ai-chat-width);
|
|
2920
|
+
}
|
|
2921
|
+
.xl\:max-w-full {
|
|
2922
|
+
max-width: 100%;
|
|
2923
|
+
}
|
|
2839
2924
|
.xl\:flex-row-reverse {
|
|
2840
2925
|
flex-direction: row-reverse;
|
|
2841
2926
|
}
|
|
@@ -2845,6 +2930,20 @@
|
|
|
2845
2930
|
.xl\:items-end {
|
|
2846
2931
|
align-items: flex-end;
|
|
2847
2932
|
}
|
|
2933
|
+
.xl\:rounded-2xl {
|
|
2934
|
+
border-radius: var(--radius-2xl);
|
|
2935
|
+
}
|
|
2936
|
+
.xl\:border {
|
|
2937
|
+
border-style: var(--tw-border-style);
|
|
2938
|
+
border-width: 1px;
|
|
2939
|
+
}
|
|
2940
|
+
.xl\:border-s {
|
|
2941
|
+
border-inline-start-style: var(--tw-border-style);
|
|
2942
|
+
border-inline-start-width: 1px;
|
|
2943
|
+
}
|
|
2944
|
+
.xl\:bg-fd-popover {
|
|
2945
|
+
background-color: var(--color-fd-popover);
|
|
2946
|
+
}
|
|
2848
2947
|
.xl\:px-8 {
|
|
2849
2948
|
padding-inline: calc(var(--spacing) * 8);
|
|
2850
2949
|
}
|
|
@@ -2857,6 +2956,13 @@
|
|
|
2857
2956
|
.xl\:text-end {
|
|
2858
2957
|
text-align: end;
|
|
2859
2958
|
}
|
|
2959
|
+
.xl\:shadow-sm {
|
|
2960
|
+
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
2961
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2962
|
+
}
|
|
2963
|
+
.xl\:\[--fd-ai-chat-col\:var\(--fd-ai-chat-width\)\] {
|
|
2964
|
+
--fd-ai-chat-col: var(--fd-ai-chat-width);
|
|
2965
|
+
}
|
|
2860
2966
|
:where([data-sidebar-collapsed="true"]) .xl\:in-data-\[sidebar-collapsed\=true\]\:pt-14 {
|
|
2861
2967
|
padding-top: calc(var(--spacing) * 14);
|
|
2862
2968
|
}
|
|
@@ -2894,9 +3000,18 @@
|
|
|
2894
3000
|
.rtl\:rotate-180:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
|
|
2895
3001
|
rotate: 180deg;
|
|
2896
3002
|
}
|
|
3003
|
+
@media (width < 80rem) {
|
|
3004
|
+
.rtl\:max-xl\:-translate-x-\[calc\(100\%\+--spacing\(2\)\)\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
|
|
3005
|
+
--tw-translate-x: calc(calc(100% + calc(var(--spacing) * 2)) * -1);
|
|
3006
|
+
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
3007
|
+
}
|
|
3008
|
+
}
|
|
2897
3009
|
.dark\:bg-\(--shiki-dark-bg\):where(.dark, .dark *) {
|
|
2898
3010
|
background-color: var(--shiki-dark-bg);
|
|
2899
3011
|
}
|
|
3012
|
+
#nd-docs-layout:has(.layout\:\[--fd-ai-chat-width\:min\(--spacing\(100\)\,100vw---spacing\(4\)\)\]), #nd-notebook-layout:has(.layout\:\[--fd-ai-chat-width\:min\(--spacing\(100\)\,100vw---spacing\(4\)\)\]), #nd-home-layout:has(.layout\:\[--fd-ai-chat-width\:min\(--spacing\(100\)\,100vw---spacing\(4\)\)\]), #nd-flux-layout:has(.layout\:\[--fd-ai-chat-width\:min\(--spacing\(100\)\,100vw---spacing\(4\)\)\]), #fd-glass-layout:has(.layout\:\[--fd-ai-chat-width\:min\(--spacing\(100\)\,100vw---spacing\(4\)\)\]) {
|
|
3013
|
+
--fd-ai-chat-width: min(calc(var(--spacing) * 100), 100vw - calc(var(--spacing) * 4));
|
|
3014
|
+
}
|
|
2900
3015
|
#nd-docs-layout:has(.layout\:\[--fd-header-height\:--spacing\(14\)\]), #nd-notebook-layout:has(.layout\:\[--fd-header-height\:--spacing\(14\)\]), #nd-home-layout:has(.layout\:\[--fd-header-height\:--spacing\(14\)\]), #nd-flux-layout:has(.layout\:\[--fd-header-height\:--spacing\(14\)\]), #fd-glass-layout:has(.layout\:\[--fd-header-height\:--spacing\(14\)\]) {
|
|
2901
3016
|
--fd-header-height: calc(var(--spacing) * 14);
|
|
2902
3017
|
}
|
|
@@ -2914,6 +3029,9 @@
|
|
|
2914
3029
|
}
|
|
2915
3030
|
}
|
|
2916
3031
|
@media (width >= 48rem) {
|
|
3032
|
+
#nd-docs-layout:has(.md\:layout\:\[--fd-header-height\:--spacing\(12\)\]), #nd-notebook-layout:has(.md\:layout\:\[--fd-header-height\:--spacing\(12\)\]), #nd-home-layout:has(.md\:layout\:\[--fd-header-height\:--spacing\(12\)\]), #nd-flux-layout:has(.md\:layout\:\[--fd-header-height\:--spacing\(12\)\]), #fd-glass-layout:has(.md\:layout\:\[--fd-header-height\:--spacing\(12\)\]) {
|
|
3033
|
+
--fd-header-height: calc(var(--spacing) * 12);
|
|
3034
|
+
}
|
|
2917
3035
|
#nd-docs-layout:has(.md\:layout\:\[--fd-left-width\:0px\]), #nd-notebook-layout:has(.md\:layout\:\[--fd-left-width\:0px\]), #nd-home-layout:has(.md\:layout\:\[--fd-left-width\:0px\]), #nd-flux-layout:has(.md\:layout\:\[--fd-left-width\:0px\]), #fd-glass-layout:has(.md\:layout\:\[--fd-left-width\:0px\]) {
|
|
2918
3036
|
--fd-left-width: 0px;
|
|
2919
3037
|
}
|
|
@@ -3044,6 +3162,16 @@
|
|
|
3044
3162
|
inherits: false;
|
|
3045
3163
|
initial-value: 0px;
|
|
3046
3164
|
}
|
|
3165
|
+
@property --fd-sidebar-col {
|
|
3166
|
+
syntax: '<length>';
|
|
3167
|
+
inherits: true;
|
|
3168
|
+
initial-value: 0px;
|
|
3169
|
+
}
|
|
3170
|
+
@property --fd-ai-chat-col {
|
|
3171
|
+
syntax: '<length>';
|
|
3172
|
+
inherits: true;
|
|
3173
|
+
initial-value: 0px;
|
|
3174
|
+
}
|
|
3047
3175
|
.fd-page-tree-item-name {
|
|
3048
3176
|
display: inline-flex;
|
|
3049
3177
|
width: 100%;
|
|
@@ -3614,6 +3742,10 @@ code.shiki:not(.not-fumadocs-code *) span {
|
|
|
3614
3742
|
}
|
|
3615
3743
|
@layer properties {
|
|
3616
3744
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
3745
|
+
:root, :host {
|
|
3746
|
+
--fd-sidebar-col: 0px;
|
|
3747
|
+
--fd-ai-chat-col: 0px;
|
|
3748
|
+
}
|
|
3617
3749
|
*, ::before, ::after, ::backdrop {
|
|
3618
3750
|
--tw-border-style: solid;
|
|
3619
3751
|
--tw-translate-x: 0;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fumadocs-ui",
|
|
3
|
-
"version": "16.
|
|
3
|
+
"version": "16.16.1",
|
|
4
4
|
"description": "The Radix UI version of Fumadocs UI",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Docs",
|
|
@@ -151,29 +151,29 @@
|
|
|
151
151
|
"@radix-ui/react-slot": "^1.3.3",
|
|
152
152
|
"@radix-ui/react-tabs": "^1.1.21",
|
|
153
153
|
"class-variance-authority": "^0.7.1",
|
|
154
|
-
"cn": "^0.
|
|
155
|
-
"lucide-react": "^1.
|
|
156
|
-
"motion": "^
|
|
154
|
+
"cn": "^0.4.0",
|
|
155
|
+
"lucide-react": "^1.50.0",
|
|
156
|
+
"motion": "^14.0.0",
|
|
157
157
|
"next-themes": "^0.4.6",
|
|
158
158
|
"react-remove-scroll": "^2.7.2",
|
|
159
159
|
"rehype-raw": "^7.0.0",
|
|
160
160
|
"scroll-into-view-if-needed": "^3.1.0",
|
|
161
|
-
"shiki": "^4.
|
|
161
|
+
"shiki": "^4.5.0",
|
|
162
162
|
"unist-util-visit": "^5.1.0"
|
|
163
163
|
},
|
|
164
164
|
"devDependencies": {
|
|
165
|
-
"@fumadocs/base-ui": "16.
|
|
166
|
-
"@fumadocs/cli": "1.7.
|
|
165
|
+
"@fumadocs/base-ui": "16.16.1",
|
|
166
|
+
"@fumadocs/cli": "1.7.2",
|
|
167
167
|
"@tailwindcss/cli": "^4.3.3",
|
|
168
168
|
"@tailwindcss/oxide": "^4.3.3",
|
|
169
169
|
"@tsdown/css": "^0.23.0",
|
|
170
170
|
"@types/hast": "^3.0.5",
|
|
171
171
|
"@types/mdx": "^2.0.14",
|
|
172
|
-
"@types/node": "^26.6.
|
|
172
|
+
"@types/node": "^26.6.4",
|
|
173
173
|
"@types/react": "^19.3.0",
|
|
174
174
|
"@types/react-dom": "^19.3.0",
|
|
175
175
|
"fuma-cli": "^0.3.1",
|
|
176
|
-
"fumadocs-core": "16.
|
|
176
|
+
"fumadocs-core": "16.16.1",
|
|
177
177
|
"react-medium-image-zoom": "^5.4.9",
|
|
178
178
|
"tailwindcss": "^4.3.3",
|
|
179
179
|
"tsconfig": "0.0.0",
|
|
@@ -183,7 +183,7 @@
|
|
|
183
183
|
"peerDependencies": {
|
|
184
184
|
"@types/mdx": "*",
|
|
185
185
|
"@types/react": "*",
|
|
186
|
-
"fumadocs-core": "16.
|
|
186
|
+
"fumadocs-core": "16.16.1",
|
|
187
187
|
"next": "16.x.x",
|
|
188
188
|
"react": "^19.2.0",
|
|
189
189
|
"react-dom": "^19.2.0",
|