@terrafirmagreg-team/kit 0.1.0 → 1.2.1

package/package.json

@@ -1,47 +1,38 @@
 {
   "name": "@terrafirmagreg-team/kit",
-  "version": "0.1.0",
+  "version": "1.2.1",
   "type": "module",
+  "description": "Fumadocs content engine",
+  "license": "LGPL-3.0-only",
   "exports": {
     "./lib/*": [
       "./src/lib/*.ts",
-      "./src/lib/*.tsx",
-      "./src/lib/*/index.ts",
-      "./src/lib/*/index.tsx"
+      "./src/lib/*/index.ts"
     ],
     "./types/*": "./src/types/*.ts",
     "./hooks/*": [
       "./src/hooks/*.ts",
-      "./src/hooks/*.tsx",
-      "./src/hooks/*/index.ts",
-      "./src/hooks/*/index.tsx"
+      "./src/hooks/*/index.ts"
     ],
     "./types": "./src/types/index.ts",
     "./components/*": [
-      "./src/components/*.ts",
       "./src/components/*.tsx",
-      "./src/components/*/index.ts",
-      "./src/components/*/index.tsx"
+      "./src/components/*/index.tsx",
+      "./src/components/*/index.ts"
     ],
     "./locales": "./src/locales.ts"
   },
   "dependencies": {
     "@base-ui/react": "^1.9.0",
     "@icons-pack/react-simple-icons": "13.15.1",
-    "@terrafirmagreg-team/translate": "0.1.0",
-    "@terrafirmagreg-team/ui": "0.1.0",
+    "@terrafirmagreg-team/data": "1.2.1",
+    "@terrafirmagreg-team/mdx": "1.2.1",
+    "@terrafirmagreg-team/sites": "1.2.1",
+    "@terrafirmagreg-team/translate": "1.2.1",
+    "@terrafirmagreg-team/ui": "1.2.1",
     "fumadocs-core": "16.17.8",
-    "fumadocs-mdx": "15.4.10",
-    "fumadocs-twoslash": "^4.0.4",
-    "lucide-react": "^1.63.0",
-    "remark-directive": "^4.0.0",
-    "remark-gfm": "^4.0.1",
-    "remark-math": "^6.0.0",
-    "remark-parse": "^11.0.0",
+    "lucide-react": "^0.577.0",
     "server-only": "^0.0.1",
-    "turndown": "^7.2.4",
-    "turndown-plugin-gfm": "^1.0.2",
-    "unified": "^11.0.5",
     "zod": "4.6.7"
   },
   "peerDependencies": {
@@ -52,8 +43,7 @@
     "@types/mdx": "^2.0.14",
     "@types/node": "^26.6.5",
     "@types/react": "^19.3.0",
-    "@types/react-dom": "^19.3.0",
-    "@types/turndown": "^5.0.6"
+    "@types/react-dom": "^19.3.0"
   },
   "repository": {
     "type": "git",
@@ -64,8 +54,6 @@
     "access": "public"
   },
   "files": [
-    "src",
-    "styles",
-    "styles.css"
+    "src"
   ]
 }

package/src/components/blocks/nav-title.tsx

@@ -8,34 +8,34 @@ import { SiteTitle } from '@terrafirmagreg-team/ui/components/blocks/nav/site-ti
 import { useAsyncValue } from '@terrafirmagreg-team/ui/hooks/use-async-value';
 import { clientDumpLoader } from '@terrafirmagreg-team/kit/lib/config';
 import {
-  datasetRef,
   isDumpSection,
-  parseDatasetRef,
   parseSectionLocation,
-} from '@terrafirmagreg-team/kit/lib/location';
-import {
-  setVersionPreference,
-  useVersionPreference,
-} from '@terrafirmagreg-team/kit/hooks/use-version-pref';
+} from '@terrafirmagreg-team/sites/location';
+import { setVersionPreference } from '@terrafirmagreg-team/kit/hooks/use-version-pref';
+import { useVersionedDataset } from '@terrafirmagreg-team/kit/hooks/use-versioned-dataset';
 import { VersionMenu } from '@terrafirmagreg-team/kit/components/version-menu';
 
 export function NavTitle({ className, ...props }: ComponentProps<'a'>) {
   const { section, dataset } = parseSectionLocation(usePathname());
-  const datasetId = dataset ? parseDatasetRef(dataset).id : undefined;
-  const gameData = isDumpSection(section);
-  const pref = useVersionPreference(datasetId);
+  const datasetId = dataset;
+
+  const gameData = isDumpSection(section) && datasetId;
+  const versions = useAsyncValue(
+    gameData ? () => clientDumpLoader().loadVersions(datasetId) : false,
+    [datasetId],
+  );
+  const ref = useVersionedDataset(
+    gameData ? datasetId : undefined,
+    versions ?? undefined,
+  );
   const version = useAsyncValue(
-    dataset
+    ref
       ? () =>
           clientDumpLoader()
-            .loadDump(dataset)
+            .loadDump(ref)
             .then((dump) => dump?.manifest.pack?.version ?? undefined)
       : false,
-    [dataset],
-  );
-  const versions = useAsyncValue(
-    datasetId ? () => clientDumpLoader().loadVersions(datasetId) : false,
-    [datasetId],
+    [ref],
   );
   return (
     <SiteTitle
@@ -43,18 +43,14 @@ export function NavTitle({ className, ...props }: ComponentProps<'a'>) {
       icon={uiConfig().brand?.icon ?? ''}
       name={uiConfig().brand?.name ?? ''}
       subtitle={
-        dataset && datasetId ? (
+        dataset && datasetId && gameData ? (
           <VersionMenu
             section={section}
             datasetId={datasetId}
-            currentRef={gameData ? dataset : datasetRef(datasetId, pref)}
-            label={gameData ? version : (pref ?? version)}
+            currentRef={ref ?? { id: datasetId }}
+            label={version}
             versions={versions}
-            onSelect={
-              gameData || !datasetId
-                ? undefined
-                : (next) => setVersionPreference(datasetId, next)
-            }
+            onSelect={(next) => setVersionPreference(datasetId, next)}
           />
         ) : undefined
       }
@@ -63,3 +59,4 @@ export function NavTitle({ className, ...props }: ComponentProps<'a'>) {
     />
   );
 }
+

package/src/components/outline/dropdown.tsx

@@ -5,7 +5,7 @@ import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-transl
 import { ChevronDownIcon } from 'lucide-react';
 import { useState } from 'react';
 import { OutlineActiveHeading, OutlineList, OutlineProgress } from './list';
-import type { WorkspaceOutlineDropdownProps } from './types';
+import type { WorkspaceOutlineDropdownProps } from '@terrafirmagreg-team/kit/types/outline';
 
 export function WorkspaceOutlineDropdown({
   trigger,
@@ -31,7 +31,7 @@ export function WorkspaceOutlineDropdown({
       >
         <OutlineProgress className="shrink-0" />
         <OutlineActiveHeading
-          fallback={t('ui.on_this_page')}
+          fallback={t('On this page', { note: 'ui.on_this_page' })}
           activeClassName="text-foreground"
         />
         <ChevronDownIcon
@@ -65,3 +65,4 @@ export function WorkspaceOutlineDropdown({
     </Popover.Root>
   );
 }
+

package/src/components/outline/index.ts

@@ -4,7 +4,8 @@ export type {
   OutlineProps,
   WorkspaceOutlineDropdownProps,
   WorkspaceOutlinePopoverProps,
-} from './types';
+} from '@terrafirmagreg-team/kit/types/outline';
 export { Outline, RightSidebarOutline } from './outline';
 export { WorkspaceOutlinePopover } from './popover';
 export { WorkspaceOutlineDropdown } from './dropdown';
+

package/src/components/outline/list.tsx

@@ -1,6 +1,6 @@
 'use client';
 import { type TOCItemInfo, useTOCSelector } from '@terrafirmagreg-team/kit/components/toc/base';
-import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/toc';
+import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/use-toc';
 import * as Base from '@terrafirmagreg-team/kit/components/toc/base';
 import * as OutlineDefault from '@terrafirmagreg-team/kit/components/toc/default';
 import * as OutlineClerk from '@terrafirmagreg-team/kit/components/toc/clerk';
@@ -12,7 +12,7 @@ import {
   type ReactNode,
   useState,
 } from 'react';
-import type { OutlineStyle } from './types';
+import type { OutlineStyle } from '@terrafirmagreg-team/kit/types/outline';
 
 const variants = {
   normal: OutlineDefault,
@@ -118,3 +118,4 @@ export function OutlineProgress({
     </svg>
   );
 }
+

package/src/components/outline/outline.tsx

@@ -1,5 +1,5 @@
 'use client';
-import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/toc';
+import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/use-toc';
 import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
 import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
 import { TextIcon } from 'lucide-react';
@@ -8,7 +8,7 @@ import {
   RightSidebarPortal,
 } from '@terrafirmagreg-team/ui/components/layouts/right-sidebar';
 import { OutlineList } from './list';
-import type { OutlineProps } from './types';
+import type { OutlineProps } from '@terrafirmagreg-team/kit/types/outline';
 
 export function Outline({ container, header, footer, ...props }: OutlineProps) {
   const t = useTranslations();
@@ -24,7 +24,7 @@ export function Outline({ container, header, footer, ...props }: OutlineProps) {
       {header}
       <h3 className="inline-flex items-center gap-1.5 text-sm text-muted-foreground">
         <TextIcon className="size-4" />
-        {t('ui.on_this_page')}
+        {t('On this page', { note: 'ui.on_this_page' })}
       </h3>
       <OutlineList {...props} />
       {footer}
@@ -47,3 +47,4 @@ export function RightSidebarOutline({ container, ...props }: OutlineProps) {
     </RightSidebarPortal>
   );
 }
+

package/src/components/outline/popover.tsx

@@ -10,7 +10,7 @@ import { ChevronDownIcon } from 'lucide-react';
 import { useEffect, useRef, useState } from 'react';
 import { useTreePath } from '@terrafirmagreg-team/ui/hooks/use-tree';
 import { OutlineActiveHeading, OutlineList, OutlineProgress } from './list';
-import type { WorkspaceOutlinePopoverProps } from './types';
+import type { WorkspaceOutlinePopoverProps } from '@terrafirmagreg-team/kit/types/outline';
 
 export function WorkspaceOutlinePopover({
   container,
@@ -56,7 +56,7 @@ export function WorkspaceOutlinePopover({
             className={cn('shrink-0', open && 'text-primary')}
           />
           <OutlineActiveHeading
-            fallback={page?.name ?? t('ui.on_this_page')}
+            fallback={page?.name ?? t('On this page', { note: 'ui.on_this_page' })}
             className={cn('flex-1 transition-colors', open && 'text-foreground')}
           />
           <ChevronDownIcon
@@ -74,3 +74,4 @@ export function WorkspaceOutlinePopover({
     </Collapsible>
   );
 }
+

package/src/components/page-actions.tsx

@@ -17,13 +17,13 @@ import {
   PopoverContent,
 } from '@terrafirmagreg-team/ui/components/ui/popover';
 import { ItemRow } from '@terrafirmagreg-team/ui/components/blocks/list/row';
-import { useUntranslated } from '@terrafirmagreg-team/ui/hooks/lang';
+import { useUntranslated } from '@terrafirmagreg-team/ui/hooks/use-lang';
 import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
 import { useCopyButton } from '@terrafirmagreg-team/ui/hooks/use-copy-button';
 import {
   openPageMarkdown,
   pageMarkdown,
-} from '@terrafirmagreg-team/kit/lib/markdown';
+} from '@terrafirmagreg-team/mdx/lib/markdown';
 import type { TranslationState } from '@terrafirmagreg-team/translate/server';
 
 function ActionButton({
@@ -62,10 +62,10 @@ export function MarkdownCopyButton({
       {checked ? <Check /> : <Copy />}
       {props.children ??
         (error
-          ? t('ui.copy_error')
+          ? t('Failed to copy', { note: 'ui.copy_error' })
           : checked
-            ? t('ui.copied_markdown')
-            : t('ui.copy_markdown'))}
+            ? t('Copied Markdown', { note: 'ui.copied_markdown' })
+            : t('Copy Markdown', { note: 'ui.copy_markdown' }))}
     </ActionButton>
   );
 }
@@ -88,7 +88,7 @@ export function CrowdinButton({ url }: { url: string }) {
       render={<a href={url} target="_blank" rel="noreferrer" />}
     >
       <Languages />
-      {t('untranslated.translate')}
+      {t('Translate on Crowdin', { note: 'untranslated.translate' })}
     </ActionButton>
   );
 }
@@ -118,12 +118,12 @@ export function ViewOptionsPopover({
   const t = useTranslations();
   const items = [
     githubUrl && {
-      title: t('ui.open_github'),
+      title: t('Open in GitHub', { note: 'ui.open_github' }),
       href: githubUrl,
       icon: <SiGithub color="currentColor" className="size-4" />,
     },
     (mdUrl || title !== undefined) && {
-      title: t('ui.view_markdown'),
+      title: t('View as Markdown', { note: 'ui.view_markdown' }),
       ...(mdUrl
         ? { href: mdUrl }
         : {
@@ -156,7 +156,7 @@ export function ViewOptionsPopover({
           )
         }
       >
-        {props.children ?? t('ui.open')}
+        {props.children ?? t('Open', { note: 'ui.open' })}
         <ChevronDown className="size-3.5 text-muted-foreground" />
       </PopoverTrigger>
       <PopoverContent className="flex flex-col">
@@ -199,3 +199,4 @@ export function PageActions({
     </>
   );
 }
+

package/src/components/relative-link.tsx

@@ -16,3 +16,4 @@ export function createRelativeLink<C extends LoaderConfig>(
     );
   };
 }
+

package/src/components/toc/base.tsx

@@ -5,7 +5,7 @@ import {
   type AnchorProviderProps,
 } from 'fumadocs-core/toc';
 import { useRef, type ComponentProps } from 'react';
-import { TOCContext } from '@terrafirmagreg-team/kit/hooks/toc';
+import { TOCContext } from '@terrafirmagreg-team/kit/hooks/use-toc';
 import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
 import { mergeRefs } from '@terrafirmagreg-team/ui/lib/utils/merge-refs';
 
@@ -63,3 +63,4 @@ export function TOCScrollArea({
     </div>
   );
 }
+

package/src/components/toc/block.tsx

@@ -109,3 +109,4 @@ export function TOCItem({
     </Primitive.TOCItem>
   );
 }
+

package/src/components/toc/clerk.tsx

@@ -12,7 +12,7 @@ import {
 import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
 import { mergeRefs } from '@terrafirmagreg-team/ui/lib/utils/merge-refs';
 import * as Primitive from './base';
-import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/toc';
+import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/use-toc';
 import { TOCEmpty } from './default';
 
 export { TOCEmpty };
@@ -263,3 +263,4 @@ export function TOCItem({
     </Primitive.TOCItem>
   );
 }
+

package/src/components/toc/default.tsx

@@ -13,7 +13,7 @@ import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
 import { mergeRefs } from '@terrafirmagreg-team/ui/lib/utils/merge-refs';
 import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
 import * as Primitive from './base';
-import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/toc';
+import { useTOCItems } from '@terrafirmagreg-team/kit/hooks/use-toc';
 
 interface SvgResult {
   content: ReactNode;
@@ -144,7 +144,7 @@ export function TOCEmpty() {
   const t = useTranslations();
   return (
     <div className="rounded-lg border bg-card p-3 text-xs text-muted-foreground">
-      {t('ui.no_headings')}
+      {t('No Headings', { note: 'ui.no_headings' })}
     </div>
   );
 }
@@ -331,3 +331,4 @@ export function TOCItem({
     </Primitive.TOCItem>
   );
 }
+

package/src/components/version-menu.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { CheckIcon, ChevronDown } from 'lucide-react';
-import { useSearchParams } from 'next/navigation';
+import { useLocationSearchParams } from '@terrafirmagreg-team/ui/hooks/page/use-location-search';
 import { useState } from 'react';
 import {
   DropdownMenu,
@@ -11,7 +11,7 @@ import {
 } from '@terrafirmagreg-team/ui/components/ui/dropdown-menu';
 import { useUiComponents } from '@terrafirmagreg-team/ui/provider';
 import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
-import { datasetRef, sectionUrl } from '@terrafirmagreg-team/kit/lib/location';
+import { type DatasetRef, sectionUrl } from '@terrafirmagreg-team/sites/location';
 
 import type { SectionKey } from '@terrafirmagreg-team/kit/types';
 
@@ -26,7 +26,7 @@ export function VersionMenu({
   section?: SectionKey;
   datasetId: string;
 
-  currentRef: string;
+  currentRef: DatasetRef;
 
   label?: string;
   versions: { versions: string[]; latest?: string } | null | undefined;
@@ -34,10 +34,7 @@ export function VersionMenu({
   onSelect?: (version: string | undefined) => void;
 }) {
   const [open, setOpen] = useState(false);
-  const pinned =
-    currentRef !== datasetId
-      ? currentRef.slice(datasetId.length + 1)
-      : undefined;
+  const pinned = currentRef.version;
   const shown = label ?? pinned;
   const text = shown ? `v${shown}` : datasetId;
   if (!versions || versions.versions.length < 2 || (!section && !onSelect)) {
@@ -52,7 +49,7 @@ export function VersionMenu({
   }
   return (
     <DropdownMenu open={open} onOpenChange={setOpen} modal={false}>
-      <DropdownMenuTrigger className="inline-flex items-center gap-0.5 outline-none hover:text-foreground">
+      <DropdownMenuTrigger className="inline-flex items-center gap-0.5 rounded-sm outline-none hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring">
         {text}
         <ChevronDown className="size-3" />
       </DropdownMenuTrigger>
@@ -61,7 +58,6 @@ export function VersionMenu({
         align="start"
         className="max-h-36 min-w-32"
       >
-        {}
         <VersionMenuItems
           ordered={ordered}
           latest={versions.latest}
@@ -86,27 +82,32 @@ function VersionMenuItems({
   ordered: string[];
   latest: string | undefined;
   datasetId: string;
-  currentRef: string;
+  currentRef: DatasetRef;
   section?: SectionKey;
   onSelect?: (version: string | undefined) => void;
 }) {
   const { Link } = useUiComponents();
   const t = useTranslations();
 
-  const search = useSearchParams().toString();
+  const current = useLocationSearchParams();
   return ordered.map((version) => {
     const isLatest = version === latest;
-    const ref = isLatest ? datasetId : datasetRef(datasetId, version);
+    const selected = currentRef.id === datasetId &&
+      currentRef.version === (isLatest ? undefined : version);
+    const params = new URLSearchParams(current);
+    if (isLatest) params.delete('version');
+    else params.set('version', version);
+    const q = params.toString();
     return (
       <DropdownMenuItem
         key={version}
         closeOnClick
         render={
-          onSelect ? undefined : (
+          section ? (
             <Link
-              href={`${sectionUrl(section!, ref)}${search ? `?${search}` : ''}`}
+              href={`${sectionUrl(section, datasetId)}${q ? `?${q}` : ''}`}
             />
-          )
+          ) : undefined
         }
         onClick={
           onSelect ? () => onSelect(isLatest ? undefined : version) : undefined
@@ -117,12 +118,13 @@ function VersionMenuItems({
           <span className="font-medium">v{version}</span>
           {isLatest && (
             <span className="text-2xs text-muted-foreground">
-              {t('ui.version_latest')}
+              {t('latest', { note: 'ui.version_latest' })}
             </span>
           )}
         </span>
-        {ref === currentRef && <CheckIcon className="size-3.5 text-primary" />}
+        {selected && <CheckIcon className="size-3.5 text-primary" />}
       </DropdownMenuItem>
     );
   });
 }
+

package/src/components/views/dataset.tsx

@@ -8,13 +8,15 @@ import {
   resolveDatasetLanding,
 } from '@terrafirmagreg-team/kit/lib/landing';
 import { sectionDatasets } from '@terrafirmagreg-team/kit/lib/datasets';
-import { sectionUrl } from '@terrafirmagreg-team/kit/lib/location';
+import { sectionUrl } from '@terrafirmagreg-team/sites/location';
 import { canonicalUrl } from '@terrafirmagreg-team/kit/lib/urls';
 import type { DatasetLanding, SectionKey } from '@terrafirmagreg-team/kit/types';
+import { localeLoader } from '@terrafirmagreg-team/kit/lib/locale/renderer';
 import { langContent } from '@terrafirmagreg-team/translate/server';
 
 interface DatasetPageParams {
   params: Promise<{ slug?: string[] }>;
+  searchParams: Promise<Record<string, string | string[] | undefined>>;
 }
 
 export function createDatasetLandingPage<S extends SectionKey>(
@@ -30,7 +32,13 @@ export function createDatasetLandingPage<S extends SectionKey>(
       render,
     );
     if (!content) notFound();
-    return <LangContentSwitch content={content} />;
+    return (
+      <LangContentSwitch
+        key={[section, ...(slug ?? [])].join('/')}
+        content={content}
+        loadLang={localeLoader()?.bind(null, { section, slug })}
+      />
+    );
   }
 
   function generateStaticParams() {
@@ -61,3 +69,4 @@ export function createDatasetLandingPage<S extends SectionKey>(
 
   return { Page, generateStaticParams, generateMetadata };
 }
+