@xyd-js/plugin-docs 0.1.0-xyd.3 → 0.1.0-xyd.44

package/package.json

@@ -1,38 +1,49 @@
 {
   "name": "@xyd-js/plugin-docs",
-  "version": "0.1.0-xyd.3",
+  "version": "0.1.0-xyd.44",
   "description": "",
   "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": "./dist/index.js"
+  },
+  "files": [
+    "dist",
+    "src",
+    "package.json"
+  ],
   "dependencies": {
     "codehike": "^1.0.3",
     "@code-hike/lighter": "^1.0.3",
-    "@xyd-js/uniform": "0.1.0-xyd.17",
-    "@xyd-js/sources": "0.1.1-xyd.5",
-    "@xyd-js/gql": "0.1.0-xyd.15",
-    "@xyd-js/openapi": "0.1.0-xyd.13"
+    "@xyd-js/openapi": "0.1.0-xyd.52",
+    "@xyd-js/gql": "0.1.0-xyd.54",
+    "@xyd-js/uniform": "0.1.0-xyd.56",
+    "@xyd-js/sources": "0.1.1-xyd.44"
   },
   "peerDependencies": {
-    "@react-router/dev": "^7.5.0",
-    "@react-router/node": "^7.5.0",
-    "@react-router/serve": "^7.5.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "react-router": "^7.5.0",
-    "@xyd-js/framework": "0.1.0-xyd.34",
-    "@xyd-js/composer": "0.1.0-xyd.2",
-    "@xyd-js/themes": "0.1.1-xyd.5",
-    "@xyd-js/components": "0.1.0-xyd.13",
-    "@xyd-js/content": "0.1.0-xyd.16",
-    "@xyd-js/core": "0.1.0-xyd.15"
+    "@react-router/dev": "^7.6.2",
+    "@react-router/node": "^7.6.2",
+    "@react-router/serve": "^7.6.2",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-router": "^7.6.2",
+    "@xyd-js/framework": "0.1.0-xyd.73",
+    "@xyd-js/composer": "0.1.0-xyd.41",
+    "@xyd-js/themes": "0.1.1-xyd.44",
+    "@xyd-js/content": "0.1.0-xyd.55",
+    "@xyd-js/components": "0.1.0-xyd.52",
+    "@xyd-js/core": "0.1.0-xyd.54"
   },
   "devDependencies": {
-    "@types/react-dom": "^19.0.0",
-    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.1.0",
+    "@types/react": "^19.1.0",
     "@vitejs/plugin-react": "^4.3.2",
     "tsup": "^8.3.0",
     "typescript": "^5.6.2",
-    "vite": "^6.1.0",
-    "vite-tsconfig-paths": "^5.0.1",
+    "vite": "^7.0.0",
+    "vite-tsconfig-paths": "^5.1.4",
     "rimraf": "^3.0.2"
   },
   "scripts": {

package/src/declarations.d.ts

@@ -20,4 +20,10 @@ declare module 'virtual:xyd-theme' {
         constructor();
     }
     export default ConcreteTheme;
-}
+}
+declare module 'virtual:xyd-user-components' {
+    const components: any
+    export {
+        components
+    }
+}

package/src/pages/layout.tsx

@@ -1,4 +1,4 @@
-import { useMemo } from "react";
+import {useMemo} from "react";
 import {
     Outlet,
     useLoaderData,
@@ -8,41 +8,50 @@ import {
     useMatches
 } from "react-router";
 
-import { mapSettingsToProps } from "@xyd-js/framework/hydration";
+import {mapSettingsToProps} from "@xyd-js/framework/hydration";
 
-import type { Metadata, MetadataMap, Theme as ThemeSettings } from "@xyd-js/core";
-import type { INavLinks, IBreadcrumb } from "@xyd-js/ui";
-import { Framework, FwLink, useSettings, type FwSidebarGroupProps } from "@xyd-js/framework/react";
-import { ReactContent } from "@xyd-js/components/content";
-import { Atlas, AtlasContext, type VariantToggleConfig } from "@xyd-js/atlas";
+import type {Metadata, MetadataMap, Theme as ThemeSettings} from "@xyd-js/core";
+import type {INavLinks, IBreadcrumb} from "@xyd-js/ui";
+import {Framework, FwLink, useSettings, type FwSidebarGroupProps} from "@xyd-js/framework/react";
+import {ReactContent} from "@xyd-js/components/content";
+import {Atlas, AtlasContext, type VariantToggleConfig} from "@xyd-js/atlas";
 import AtlasXydPlugin from "@xyd-js/atlas/xydPlugin";
 
-import { Surfaces } from "@xyd-js/framework/react";
-import { Composer } from "@xyd-js/composer";
+import {Surfaces} from "@xyd-js/framework";
+import {Composer} from "@xyd-js/composer";
+import {XYDAnalytics} from "@xyd-js/analytics";
 // @ts-ignore
-import { iconSet } from 'virtual:xyd-icon-set';
+import {iconSet} from 'virtual:xyd-icon-set';
 
 // @ts-ignore
 import virtualSettings from "virtual:xyd-settings";
-// @ts-ignore
-const { settings: getSettings } = virtualSettings
+// @ts-ignores
+const {settings: getSettings} = virtualSettings
 // const settings = globalThis.__xydSettings
 import Theme from "virtual:xyd-theme";
+// @ts-ignore
+import {loadProvider} from 'virtual:xyd-analytics-providers'
 
 // @ts-ignore
 import "virtual:xyd-theme/index.css"
 import "virtual:xyd-theme-override/index.css"
 
-import { PageContext } from "./context";
+// @ts-ignore
+import {components as userComponents} from 'virtual:xyd-user-components';
+
+import {PageContext} from "./context";
 import React from "react";
-import { markdownPlugins } from "@xyd-js/content/md";
-import { ContentFS } from "@xyd-js/content";
-import { IconProvider } from "@xyd-js/components/writer";
-import { CoderProvider } from "@xyd-js/components/coder";
+
+import {markdownPlugins} from "@xyd-js/content/md";
+import {ContentFS} from "@xyd-js/content";
+import {IconProvider} from "@xyd-js/components/writer";
+import {CoderProvider} from "@xyd-js/components/coder";
+import {SearchButton} from "@xyd-js/components/system"
 
 globalThis.__xydSettings = getSettings
+globalThis.__xydUserComponents = userComponents // Add user components to global scope TODO: problematic
 
-new Composer() // TODO: better API
+new Composer() // TODO: better API TODO: problematic
 const settings = globalThis.__xydSettings
 
 const surfaces = new Surfaces()
@@ -71,7 +80,8 @@ globalThis.__xydSurfaces = surfaces
 
 const theme = new Theme()
 
-const { Layout: BaseThemeLayout } = theme
+const {Layout: BaseThemeLayout} = theme
+
 
 interface LoaderData {
     sidebarGroups: FwSidebarGroupProps[]
@@ -83,7 +93,7 @@ interface LoaderData {
     bannerContentCode?: string
 }
 
-export async function loader({ request }: { request: any }) {
+export async function loader({request}: { request: any }) {
     const slug = getPathname(request.url || "index") || "index"
 
     const {
@@ -131,12 +141,12 @@ export default function Layout() {
     // TODO: BETTER HANDLE THAT
     if (loaderData.metadata?.openapi) {
         atlasVariantToggles = [
-            { key: "status", defaultValue: "200" },
-            { key: "contentType", defaultValue: "application/json" }
+            {key: "status", defaultValue: "200"},
+            {key: "contentType", defaultValue: "application/json"}
         ];
     } else {
         atlasVariantToggles = [
-            { key: "symbolName", defaultValue: "" }
+            {key: "symbolName", defaultValue: ""}
         ];
     }
 
@@ -147,38 +157,49 @@ export default function Layout() {
         const BannerContent = MemoMDXComponent(content.component)
 
         bannerContent = function () {
-            return <BannerContent components={theme.reactContentComponents()} />
+            return <BannerContent components={theme.reactContentComponents()}/>
         }
     }
 
+    const userComponents = (globalThis.__xydUserComponents || []).reduce((acc, component) => {
+        acc[component.name] = component.component;
+        return acc;
+    }, {});
+
     return <>
-        <IconProvider value={{
-            iconSet: iconSet
-        }}>
-            <Framework
-                settings={settings || globalThis.__xydSettings}
-                sidebarGroups={loaderData.sidebarGroups || []}
-                metadata={loaderData.metadata || {}}
-                surfaces={surfaces}
-                BannerContent={bannerContent}
-            >
-                <AtlasContext
-                    value={{
-                        syntaxHighlight: settings?.theme?.coder?.syntaxHighlight || null,
-                        baseMatch: lastMatchId || "",
-                        variantToggles: atlasVariantToggles
+        <XYDAnalytics settings={settings} loader={loadProvider}>
+            <IconProvider value={{
+                iconSet: iconSet
+            }}>
+                <Framework
+                    settings={settings || globalThis.__xydSettings}
+                    sidebarGroups={loaderData.sidebarGroups || []}
+                    metadata={loaderData.metadata || {}}
+                    surfaces={surfaces}
+                    BannerContent={bannerContent}
+                    components={{
+                        Search: SearchButton,
+                        ...userComponents
                     }}
                 >
-                    <CoderProvider lines={settings?.theme?.coder?.lines} scroll={settings?.theme?.coder?.scroll}>
-                        <BaseThemeLayout>
-                            <PageContext value={{ theme }}>
-                                <Outlet />
-                            </PageContext>
-                        </BaseThemeLayout>
-                    </CoderProvider>
-                </AtlasContext>
-            </Framework>
-        </IconProvider>
+                    <AtlasContext
+                        value={{
+                            syntaxHighlight: settings?.theme?.coder?.syntaxHighlight || null,
+                            baseMatch: lastMatchId || "",
+                            variantToggles: atlasVariantToggles
+                        }}
+                    >
+                        <CoderProvider lines={settings?.theme?.coder?.lines} scroll={settings?.theme?.coder?.scroll}>
+                            <BaseThemeLayout>
+                                <PageContext value={{theme}}>
+                                    <Outlet/>
+                                </PageContext>
+                            </BaseThemeLayout>
+                        </CoderProvider>
+                    </AtlasContext>
+                </Framework>
+            </IconProvider>
+        </XYDAnalytics>
     </>
 }
 
@@ -221,7 +242,7 @@ const createElementWithKeys = (type: any, props: any) => {
         return childrenArray.map((child, index) => {
             // If the child is a React element and doesn't have a key, add one
             if (React.isValidElement(child) && !child.key) {
-                return React.cloneElement(child, { key: `mdx-${index}` });
+                return React.cloneElement(child, {key: `mdx-${index}`});
             }
             // If the child is an array, process it recursively
             if (Array.isArray(child)) {
@@ -239,7 +260,7 @@ const createElementWithKeys = (type: any, props: any) => {
             processedChildren = processChildren(props.children);
         } else if (React.isValidElement(props.children) && !props.children.key) {
             // Single child without key
-            processedChildren = React.cloneElement(props.children, { key: 'mdx-child' });
+            processedChildren = React.cloneElement(props.children, {key: 'mdx-child'});
         } else {
             // Single child with key or non-React element
             processedChildren = props.children;

package/src/pages/page.tsx

@@ -360,4 +360,3 @@ export default function DocsPage({ loaderData }: { loaderData: loaderData }) {
     </FrameworkPage>
 }
 
-

package/src/presets/docs/index.ts

@@ -43,7 +43,7 @@ function preinstall() {
                 name: DEFAULT_THEME
             }
         }
-        
+
         let themeRoutesExists = false
         try {
             await fs.access(path.join(root, THEME_CONFIG_FOLDER, "./routes.ts"))
@@ -68,30 +68,85 @@ function preinstall() {
 }
 
 // TODO: maybe later as a separate plugin?
+// function vitePluginSettings() {
+//     return async function ({ preinstall }): Promise<VitePlugin> {
+//         return {
+//             name: 'virtual:xyd-settings',
+//             resolveId(id) {
+//                 if (id === 'virtual:xyd-settings') {
+//                     return id + '.jsx'; // Return the module with .jsx extension
+//                 }
+//                 return null;
+//             },
+//             async load(id) { // TODO: better cuz we probably dont neeed `get settings()`
+//                 if (id === 'virtual:xyd-settings.jsx') {
+//                     return `
+//                         export default {
+//                             get settings() {
+//                                 return globalThis.__xydSettings || ${typeof preinstall.settings === "string" ? preinstall.settings : JSON.stringify(preinstall.settings)}
+//                             }
+//                         }
+//                     `
+//                 }
+//                 return null;
+//             },
+//         };
+//     }
+// }
+
+
 function vitePluginSettings() {
     return async function ({ preinstall }): Promise<VitePlugin> {
+        const virtualId = 'virtual:xyd-settings';
+        const resolvedId = virtualId + '.jsx';
+
+        let currentSettings = globalThis.__xydSettings
+        if (!currentSettings && preinstall?.settings) {
+            currentSettings = typeof preinstall?.settings === "string" ? preinstall?.settings : JSON.stringify(preinstall?.settings || {})
+        }
+
         return {
-            name: 'virtual:xyd-settings',
+            name: 'xyd:virtual-settings',
+
             resolveId(id) {
-                if (id === 'virtual:xyd-settings') {
-                    return id + '.jsx'; // Return the module with .jsx extension
+                if (id === virtualId) {
+                    return resolvedId;
                 }
                 return null;
             },
+
+
             async load(id) { // TODO: better cuz we probably dont neeed `get settings()`
                 if (id === 'virtual:xyd-settings.jsx') {
                     return `
-                        export default {
-                            get settings() {
-                                return globalThis.__xydSettings || ${typeof preinstall.settings === "string" ? preinstall.settings : JSON.stringify(preinstall.settings)}
+                    export default {
+                        get settings() {
+                             return globalThis.__xydSettings || ${typeof preinstall.settings === "string" ? preinstall.settings : JSON.stringify(preinstall.settings)}
                             }
                         }
                     `
                 }
                 return null;
             },
+
+            async hotUpdate(ctx) {
+                const isPageFileChanged = ctx.file.includes('xyd-plugin-docs/src/pages/layout.tsx')
+                 || ctx.file.includes('xyd-plugin-docs/src/pages/page.tsx')
+
+                if (!isPageFileChanged) {
+                    return
+                }
+
+                const newSettings = await readSettings();
+                if (!newSettings) {
+                    return
+                }
+
+                globalThis.__xydSettings = newSettings;
+            },
         };
     }
+
 }
 
 

package/src/presets/docs/settings.ts

@@ -67,7 +67,7 @@ export async function readSettings() {
 
             return json
         } catch (e) {
-            console.error(e)
+            console.error("⚠️ Error parsing settings file")
 
             return null
         }

package/CHANGELOG.md

@@ -1,41 +0,0 @@
-# @xyd-js/plugin-docs
-
-## 0.1.0-xyd.3
-
-### Patch Changes
-
-- documan + plugin-docs
-
-## 0.1.0-xyd.2
-
-### Patch Changes
-
-- test
-- Updated dependencies
-  - @xyd-js/components@0.1.0-xyd.13
-  - @xyd-js/composer@0.1.0-xyd.2
-  - @xyd-js/content@0.1.0-xyd.16
-  - @xyd-js/core@0.1.0-xyd.15
-  - @xyd-js/framework@0.1.0-xyd.34
-  - @xyd-js/gql@0.1.0-xyd.15
-  - @xyd-js/openapi@0.1.0-xyd.13
-  - @xyd-js/sources@0.1.1-xyd.5
-  - @xyd-js/themes@0.1.1-xyd.5
-  - @xyd-js/uniform@0.1.0-xyd.17
-
-## 0.1.0-xyd.1
-
-### Patch Changes
-
-- update packages
-- Updated dependencies
-  - @xyd-js/components@0.1.0-xyd.12
-  - @xyd-js/composer@0.1.0-xyd.1
-  - @xyd-js/content@0.1.0-xyd.15
-  - @xyd-js/core@0.1.0-xyd.14
-  - @xyd-js/framework@0.1.0-xyd.33
-  - @xyd-js/gql@0.1.0-xyd.14
-  - @xyd-js/openapi@0.1.0-xyd.12
-  - @xyd-js/sources@0.1.1-xyd.4
-  - @xyd-js/themes@0.1.1-xyd.4
-  - @xyd-js/uniform@0.1.0-xyd.16

package/TODO.md

@@ -1 +0,0 @@
-1. better API

package/tsconfig.json

@@ -1,51 +0,0 @@
-{
-  "compilerOptions": {
-    "paths": {
-      "@xyd-js/atlas": [
-        "../xyd-atlas"
-      ],
-      "@xyd-js/core": [
-        "../xyd-core/index.ts"
-      ],
-      "@xyd-js/themes": [
-        "../xyd-themes/src/index.ts"
-      ],
-      "@xyd-js/components/content": [
-        "../xyd-components/content.ts"
-      ],
-      "@xyd-js/framework/react": [
-        "../xyd-framework/packages/react/index.ts"
-      ]
-    },
-    "types": [
-      "unplugin-icons/types/react"
-    ],
-    "module": "esnext",
-    "esModuleInterop": true,
-    "moduleResolution": "bundler",
-    "target": "esnext",
-    "baseUrl": ".",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": false,
-    "noEmit": true,
-    "incremental": false,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve",
-    "plugins": [],
-    "strictNullChecks": true
-  },
-  "include": [
-    "src/**/*.ts",
-    "src/**/*.tsx"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
-}

package/tsup.config.ts

@@ -1,74 +0,0 @@
-import {defineConfig, Options} from 'tsup';
-
-import pkg from './package.json';
-
-const deps = [
-    ...Object.keys(pkg.dependencies || {}),
-    ...Object.keys(pkg.devDependencies || {}),
-].filter((dep) => [
-   
-].indexOf(dep) === -1)
-
-const config: Options = {
-    entry: {
-        index: 'src/index.ts',
-    },
-    dts: {
-        entry: {
-            index: 'src/index.ts',
-        },
-        resolve: true, // Resolve external types
-    },
-    format: ['esm'],
-    platform: 'node',
-    shims: false,
-    splitting: false,
-    sourcemap: true,
-    clean: true,
-    external: [
-        ...deps,
-
-    //     "@graphql-markdown/core": "^1.12.0",
-    // "@graphql-markdown/graphql": "^1.1.4",
-    // "@graphql-markdown/types": "^1.4.0",
-    // "graphql-config": "^5.1.2",
-    // "gray-matter": "^4.0.3",
-    // "json-to-graphql-query": "^2.3.0"
-
-        // Externalize gql modules
-        // '@graphql-markdown/core',
-        // '@graphql-markdown/graphql',
-        // '@graphql-markdown/types',
-        // 'graphql-config',
-        // 'gray-matter',
-        // 'json-to-graphql-query',
-
-        // Externalize Node.js built-in modules
-        /^node:.*/,
-        'fs',
-        'path',
-        'url',
-        'os',
-        'http',
-        'https',
-        'stream',
-        'zlib',
-        'util',
-        'crypto',
-        'tty',
-        // Add other built-in modules as needed
-    ],
-    esbuildPlugins: [
-        {
-            name: 'external-node-builtins',
-            setup(build) {
-                const filter = /^node:/;
-                build.onResolve({filter}, args => {
-                    return {path: args.path, external: true};
-                });
-            },
-        },
-    ],
-}
-
-export default defineConfig(config);