From a038e7eaae5d917c0591339032293741dfb3f2b6 Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 18:09:47 +0300 Subject: [PATCH 1/7] =?UTF-8?q?docusaurus/config:=20=D0=B4=D0=BE=D0=B1?= =?UTF-8?q?=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=B7=D0=BD=D0=B0?= =?UTF-8?q?=D1=87=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BF=D0=BE=20=D1=83=D0=BC?= =?UTF-8?q?=D0=BE=D0=BB=D1=87=D0=B0=D0=BD=D0=B8=D1=8E=20=D0=B4=D0=BB=D1=8F?= =?UTF-8?q?=20url?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docusaurus.config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 79ae98c..1069810 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -16,7 +16,7 @@ const docsConfig = yaml.load(fs.readFileSync('./.docuservix.yml', 'utf8')) as Do const { title } = docsConfig; -const url = process.env.DOCUSERVIX_URL; +const url = process.env.DOCUSERVIX_URL || 'http://example.com'; const { org, repo } = docsConfig.project; -- 2.52.0 From e3a2734f03bcc23afa7e0a5c66887f325179c5ff Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 18:10:08 +0300 Subject: [PATCH 2/7] =?UTF-8?q?claude:=20=D0=B8=D0=BD=D0=B8=D1=86=D0=B8?= =?UTF-8?q?=D0=B0=D0=BB=D0=B8=D0=B7=D0=B0=D1=86=D0=B8=D1=8F=20Claude?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CLAUDE.md | 47 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 47 insertions(+) create mode 100644 CLAUDE.md diff --git a/CLAUDE.md b/CLAUDE.md new file mode 100644 index 0000000..2f77550 --- /dev/null +++ b/CLAUDE.md @@ -0,0 +1,47 @@ +# CLAUDE.md + +This file provides guidance to Claude Code (claude.ai/code) when working with code in this +repository. + +## Project Overview + +Docuservix docs — шаблон документационного сайта на Docusaurus 3.10 (React 19, TypeScript 6). +Конфигурация сайта читается из `.docuservix.yml` (title, project.org, project.repo, dirs). Локаль — +русский (`ru`). + +## Commands + +Используется **yarn**. + +- `yarn start` — dev-сервер +- `yarn build` — production-сборка в `build/` +- `yarn typecheck` — проверка типов (tsc) +- `yarn prettier:check` — проверка форматирования +- `yarn prettier:fix` — автоформатирование + +## Architecture + +- `docusaurus.config.ts` — главный конфиг; читает `.docuservix.yml` через `js-yaml` +- `src/pages/` — кастомные страницы (index.tsx — главная) +- `src/css/custom.css` — глобальные CSS-переменные (`--ifm-*`) +- `docs/` — Markdown/MDX-документация +- `blog/` — блог (опционально, включается через `dirs.blog` в `.docuservix.yml`) +- Mermaid-диаграммы включены (`@docusaurus/theme-mermaid`) +- Docusaurus future v4 compatibility flag включён + +## Code Style + +- Prettier: 4 пробела, single quotes, trailing commas, `printWidth: 100`, + `singleAttributePerLine: true` +- JSON: `printWidth: 10` (каждое свойство на отдельной строке) +- Markdown/MDX: `proseWrap: always` +- Husky + lint-staged: prettier запускается автоматически на pre-commit +- CSS Modules (`*.module.css`) с camelCase именами классов +- **Без default export** в shared/UI компонентах; default export допустим только для Docusaurus + route-компонентов (page components) + +## Environment + +- Node >= 20 +- Env vars: `DOCUSERVIX_URL` (production URL), `DOCUSERVIX_ON_BROKEN_LINKS` (override onBrokenLinks) +- Gitea instance: `git.jt4d.ru` -- 2.52.0 From 987415eafdf1fd2169be2c8a5920f506069e5f71 Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 18:49:00 +0300 Subject: [PATCH 3/7] package.json: add bem-css-modules --- package.json | 1 + yarn.lock | 5 +++++ 2 files changed, 6 insertions(+) diff --git a/package.json b/package.json index 7709f6f..23618f2 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "@docusaurus/preset-classic": "3.10.1", "@docusaurus/theme-mermaid": "3.10.1", "@mdx-js/react": "^3.0.0", + "bem-css-modules": "^1.4.3", "clsx": "^2.0.0", "js-yaml": "^4.2.0", "prism-react-renderer": "^2.3.0", diff --git a/yarn.lock b/yarn.lock index 333ae1f..0fb0dd0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4505,6 +4505,11 @@ batch@0.6.1: resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16" integrity sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw== +bem-css-modules@^1.4.3: + version "1.4.3" + resolved "https://registry.yarnpkg.com/bem-css-modules/-/bem-css-modules-1.4.3.tgz#b5a55bf5275c958b26691cea3d5afba77e888239" + integrity sha512-oB+hoRw5+M6Tt8N/DY5IpVYQEWbxd9UoGZeFJiMdpaO676zTuQhHJns9d+tfJw3yAIvg9oCf/7QlffT+vPGgEA== + big.js@^5.2.2: version "5.2.2" resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328" -- 2.52.0 From 08642e46d46216ed2a5dad5d7fd0109cd3289912 Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 18:23:19 +0300 Subject: [PATCH 4/7] =?UTF-8?q?docuservix/pages:=20=D0=B4=D0=BE=D0=B1?= =?UTF-8?q?=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=BF=D1=83=D1=81?= =?UTF-8?q?=D1=82=D0=BE=D0=B9=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86?= =?UTF-8?q?=D1=8B=20=D1=87=D0=B0=D1=82=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docusaurus.config.ts | 3 +++ plugins/docuservix/index.ts | 31 ++++++++++++++++++++++ plugins/docuservix/pages/chat/ChatPage.tsx | 10 +++++++ plugins/docuservix/pages/chat/index.ts | 3 +++ tsconfig.json | 5 ++++ 5 files changed, 52 insertions(+) create mode 100644 plugins/docuservix/index.ts create mode 100644 plugins/docuservix/pages/chat/ChatPage.tsx create mode 100644 plugins/docuservix/pages/chat/index.ts diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 1069810..4e46379 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -6,6 +6,8 @@ import type { Config } from '@docusaurus/types'; import yaml from 'js-yaml'; import { themes as prismThemes } from 'prism-react-renderer'; +import docuservix from './plugins/docuservix'; + interface DocsConfig { title: string; project: { org: string; repo: string }; @@ -33,6 +35,7 @@ const config: Config = { markdown: { mermaid: true, }, + plugins: [docuservix()], themes: ['@docusaurus/theme-mermaid'], // Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future diff --git a/plugins/docuservix/index.ts b/plugins/docuservix/index.ts new file mode 100644 index 0000000..50dbf9c --- /dev/null +++ b/plugins/docuservix/index.ts @@ -0,0 +1,31 @@ +import path from 'path'; + +import type { LoadContext, Plugin } from '@docusaurus/types'; + +export default function docuservix() { + return function pluginDocuservix(_context: LoadContext): Plugin { + return { + name: 'docuservix', + + configureWebpack() { + return { + resolve: { + alias: { + '@docuservix': path.resolve(__dirname), + }, + }, + }; + }, + + async contentLoaded({ actions }) { + const { addRoute } = actions; + + addRoute({ + path: '/chat', + component: '@docuservix/pages/chat', + exact: true, + }); + }, + }; + }; +} diff --git a/plugins/docuservix/pages/chat/ChatPage.tsx b/plugins/docuservix/pages/chat/ChatPage.tsx new file mode 100644 index 0000000..3bd719b --- /dev/null +++ b/plugins/docuservix/pages/chat/ChatPage.tsx @@ -0,0 +1,10 @@ +import Layout from '@theme/Layout'; +import { ReactNode } from 'react'; + +export function ChatPage(): ReactNode { + return ( + +
Hello world!
+ + ); +} diff --git a/plugins/docuservix/pages/chat/index.ts b/plugins/docuservix/pages/chat/index.ts new file mode 100644 index 0000000..74f3d81 --- /dev/null +++ b/plugins/docuservix/pages/chat/index.ts @@ -0,0 +1,3 @@ +import { ChatPage } from './ChatPage'; + +export default ChatPage; diff --git a/tsconfig.json b/tsconfig.json index 3035635..aee51ac 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,6 +5,11 @@ "extends": "@docusaurus/tsconfig", "compilerOptions": { "baseUrl": ".", + "paths": { + "@docuservix/*": [ + "plugins/docuservix/*" + ] + }, "ignoreDeprecations": "6.0", "strict": true }, -- 2.52.0 From c7c353db0a321a41e29888e465b8026d95f939ab Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 18:27:36 +0300 Subject: [PATCH 5/7] =?UTF-8?q?docuservix/models/chat:=20=D0=B4=D0=BE?= =?UTF-8?q?=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D1=8B=20=D1=82=D0=B8=D0=BF?= =?UTF-8?q?=D1=8B=20=D0=B4=D0=BB=D1=8F=20=D1=87=D0=B0=D1=82=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- plugins/docuservix/models/chat.ts | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 plugins/docuservix/models/chat.ts diff --git a/plugins/docuservix/models/chat.ts b/plugins/docuservix/models/chat.ts new file mode 100644 index 0000000..bdc8330 --- /dev/null +++ b/plugins/docuservix/models/chat.ts @@ -0,0 +1,8 @@ +export interface IChat { + messages: IChatMessage[]; +} + +export interface IChatMessage { + role: 'user' | 'assistant'; + content: string; +} -- 2.52.0 From f023496040c1587f7d9b4fbd01d4ab0a84ba0eec Mon Sep 17 00:00:00 2001 From: Arswarog Date: Wed, 17 Jun 2026 19:47:26 +0300 Subject: [PATCH 6/7] =?UTF-8?q?docuservix/widgets/chat:=20=D0=B4=D0=BE?= =?UTF-8?q?=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=20=D0=BA=D0=BE=D0=BC=D0=BF?= =?UTF-8?q?=D0=BE=D0=BD=D0=B5=D0=BD=D1=82=20=D1=87=D0=B0=D1=82=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- plugins/docuservix/pages/chat/ChatPage.tsx | 24 ++++++- .../docuservix/widgets/chat/Chat.module.css | 24 +++++++ plugins/docuservix/widgets/chat/Chat.tsx | 37 +++++++++++ .../docuservix/widgets/chat/Header.module.css | 32 +++++++++ plugins/docuservix/widgets/chat/Header.tsx | 21 ++++++ .../docuservix/widgets/chat/Input.module.css | 58 +++++++++++++++++ plugins/docuservix/widgets/chat/Input.tsx | 55 ++++++++++++++++ .../widgets/chat/Message.module.css | 41 ++++++++++++ plugins/docuservix/widgets/chat/Message.tsx | 19 ++++++ .../widgets/chat/Messages.module.css | 65 +++++++++++++++++++ plugins/docuservix/widgets/chat/Messages.tsx | 38 +++++++++++ plugins/docuservix/widgets/chat/icons.tsx | 30 +++++++++ plugins/docuservix/widgets/chat/index.ts | 1 + 13 files changed, 444 insertions(+), 1 deletion(-) create mode 100644 plugins/docuservix/widgets/chat/Chat.module.css create mode 100644 plugins/docuservix/widgets/chat/Chat.tsx create mode 100644 plugins/docuservix/widgets/chat/Header.module.css create mode 100644 plugins/docuservix/widgets/chat/Header.tsx create mode 100644 plugins/docuservix/widgets/chat/Input.module.css create mode 100644 plugins/docuservix/widgets/chat/Input.tsx create mode 100644 plugins/docuservix/widgets/chat/Message.module.css create mode 100644 plugins/docuservix/widgets/chat/Message.tsx create mode 100644 plugins/docuservix/widgets/chat/Messages.module.css create mode 100644 plugins/docuservix/widgets/chat/Messages.tsx create mode 100644 plugins/docuservix/widgets/chat/icons.tsx create mode 100644 plugins/docuservix/widgets/chat/index.ts diff --git a/plugins/docuservix/pages/chat/ChatPage.tsx b/plugins/docuservix/pages/chat/ChatPage.tsx index 3bd719b..9f9131c 100644 --- a/plugins/docuservix/pages/chat/ChatPage.tsx +++ b/plugins/docuservix/pages/chat/ChatPage.tsx @@ -1,10 +1,32 @@ import Layout from '@theme/Layout'; import { ReactNode } from 'react'; +import { IChat } from '@docuservix/models/chat'; +import { Chat } from '@docuservix/widgets/chat'; + +const dialog: IChat = { + messages: [ + { + role: 'user', + content: 'Can you show me some CSS animations? It can be simple tools like chatbots...', + }, + { + role: 'assistant', + content: "Hello! I'm your AI assistant. How can I help you today?", + }, + ], +}; + export function ChatPage(): ReactNode { return ( -
Hello world!
+
+ +
); } diff --git a/plugins/docuservix/widgets/chat/Chat.module.css b/plugins/docuservix/widgets/chat/Chat.module.css new file mode 100644 index 0000000..1ff1edd --- /dev/null +++ b/plugins/docuservix/widgets/chat/Chat.module.css @@ -0,0 +1,24 @@ +.Chat { + display: flex; + flex-direction: column; + width: 100%; + background: var(--ifm-background-color); + border: 1px solid var(--ifm-color-emphasis-200); + border-radius: var(--ifm-global-radius); + overflow: hidden; +} + +.Chat__statusMessage { + font-size: .65rem; + color: #666; + bottom: 0; + left: 0; + right: 0; + padding: .75rem 2.5rem; + background: #eee; +} + +.Chat__statusMessage i { + margin-right: .25rem; + color: #667eea; +} diff --git a/plugins/docuservix/widgets/chat/Chat.tsx b/plugins/docuservix/widgets/chat/Chat.tsx new file mode 100644 index 0000000..01d377d --- /dev/null +++ b/plugins/docuservix/widgets/chat/Chat.tsx @@ -0,0 +1,37 @@ +import block from 'bem-css-modules'; +import React, { ReactNode } from 'react'; + +import { IChat } from '@docuservix/models/chat'; + +import styles from './Chat.module.css'; +import { Header } from './Header'; +import { Input } from './Input'; +import { Messages } from './Messages'; + +const b = block(styles, 'Chat'); + +interface ChatProps { + dialog: IChat; + typing?: boolean; + statusMessage?: string; + onSend?: (text: string) => void; +} + +export function Chat({ dialog, typing, statusMessage, onSend }: ChatProps): ReactNode { + const { messages } = dialog; + + return ( +
+
+ + {statusMessage &&
{statusMessage}
} + +
+ ); +} diff --git a/plugins/docuservix/widgets/chat/Header.module.css b/plugins/docuservix/widgets/chat/Header.module.css new file mode 100644 index 0000000..e48bbde --- /dev/null +++ b/plugins/docuservix/widgets/chat/Header.module.css @@ -0,0 +1,32 @@ +.Header { + display: flex; + align-items: center; + gap: 1rem; + padding: 1rem 1.25rem; + border-bottom: 1px solid var(--ifm-color-emphasis-200); +} + +.Header__avatar { + width: 50px; + height: 50px; + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + color: white; + font-size: 1.5rem; + flex-shrink: 0; +} + +.Header__info h3 { + margin: 0 0 0.25rem; + color: var(--ifm-font-color-base); + font-size: 1.125rem; +} + +.Header__info p { + margin: 0; + color: var(--ifm-color-emphasis-600); + font-size: 0.85rem; +} diff --git a/plugins/docuservix/widgets/chat/Header.tsx b/plugins/docuservix/widgets/chat/Header.tsx new file mode 100644 index 0000000..b438758 --- /dev/null +++ b/plugins/docuservix/widgets/chat/Header.tsx @@ -0,0 +1,21 @@ +import block from 'bem-css-modules'; +import React, { ReactNode } from 'react'; + +import styles from './Header.module.css'; +import { RobotIcon } from './icons'; + +const b = block(styles, 'Header'); + +export function Header(): ReactNode { + return ( +
+
+ +
+
+

AI Assistant

+

Ready to help

+
+
+ ); +} diff --git a/plugins/docuservix/widgets/chat/Input.module.css b/plugins/docuservix/widgets/chat/Input.module.css new file mode 100644 index 0000000..2ab1f43 --- /dev/null +++ b/plugins/docuservix/widgets/chat/Input.module.css @@ -0,0 +1,58 @@ +.Input { + display: flex; + align-items: flex-end; + gap: 0.75rem; + padding: 1rem 1.25rem; + border-top: 1px solid var(--ifm-color-emphasis-200); +} + +.Input__field { + flex: 1; + padding: 0.75rem 1rem; + border: 2px solid var(--ifm-color-emphasis-200); + border-radius: 1.5rem; + font-size: 1rem; + font-family: inherit; + color: var(--ifm-font-color-base); + background: var(--ifm-background-surface-color); + outline: none; + transition: border-color 0.3s; + resize: none; + min-height: 3.25rem; + max-height: 8rem; + field-sizing: content; +} + +.Input__field:focus { + border-color: #667eea; +} + +.Input__field:disabled { + opacity: 0.6; + cursor: not-allowed; +} + +.Input__send { + display: flex; + justify-content: center; + align-items: center; + width: 3.25rem; + height: 3.25rem; + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + border: none; + border-radius: 50%; + color: white; + font-size: 1.125rem; + cursor: pointer; + flex-shrink: 0; + transition: transform 0.3s; +} + +.Input__send:hover:not(:disabled) { + transform: scale(1.1); +} + +.Input__send:disabled { + opacity: 0.5; + cursor: not-allowed; +} diff --git a/plugins/docuservix/widgets/chat/Input.tsx b/plugins/docuservix/widgets/chat/Input.tsx new file mode 100644 index 0000000..d61777d --- /dev/null +++ b/plugins/docuservix/widgets/chat/Input.tsx @@ -0,0 +1,55 @@ +import block from 'bem-css-modules'; +import React, { ReactNode, useState } from 'react'; + +import { PaperPlaneIcon } from './icons'; +import styles from './Input.module.css'; + +const b = block(styles, 'Input'); + +interface InputProps { + disabled?: boolean; + onSend?: (text: string) => void; +} + +export function Input({ disabled, onSend }: InputProps): ReactNode { + const [input, setInput] = useState(''); + + const handleSend = () => { + const text = input.trim(); + + if (!text || disabled) { + return; + } + + setInput(''); + onSend?.(text); + }; + + const handleKeyDown = (e: React.KeyboardEvent) => { + if (e.key === 'Enter' && !e.shiftKey) { + e.preventDefault(); + handleSend(); + } + }; + + return ( +
+