refactor: заменить shiki на самописный highlighter и обновить архитектуру

- Удалён shiki (9.5→0 МБ), создан regex-токенизатор для html/css/xml
- CLI переведён с аргументов на конфиг-файл svg-sprites.config.ts
- Превью переработано: React-приложение вместо инлайн HTML
- Добавлен футер с названием пакета и ссылкой на репозиторий
- Исправлена загрузка dev-data.js для Vite 8
- Футер прижат к низу, содержимое центрировано

preview/.templates/business/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}}Business } from './{{name.kebabCase}}.business'

preview/.templates/business/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/business/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры бизнес-модуля {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}BusinessParams = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}BusinessProps = RootAttrs & {{name.pascalCase}}BusinessParams

preview/.templates/business/{{name.kebabCase}}/{{name.kebabCase}}.business.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}BusinessProps } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение бизнес-модуля {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}}Business = (props: {{name.pascalCase}}BusinessProps) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/infrastructure/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}}Infra } from './{{name.kebabCase}}.infra'

preview/.templates/infrastructure/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/infrastructure/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры инфраструктурного модуля {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}InfraParams = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}InfraProps = RootAttrs & {{name.pascalCase}}InfraParams

preview/.templates/infrastructure/{{name.kebabCase}}/{{name.kebabCase}}.infra.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}InfraProps } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение инфраструктурного модуля {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}}Infra = (props: {{name.pascalCase}}InfraProps) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/layout/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}}Layout } from './{{name.kebabCase}}.layout'

preview/.templates/layout/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/layout/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры {{name.pascalCase}}Layout.
+ */
+export type {{name.pascalCase}}LayoutParams = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}LayoutProps = RootAttrs & {{name.pascalCase}}LayoutParams

preview/.templates/layout/{{name.kebabCase}}/{{name.kebabCase}}.layout.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}LayoutProps } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение layout {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}}Layout = (props: {{name.pascalCase}}LayoutProps) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/module/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}} } from './{{name.kebabCase}}'

preview/.templates/module/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/module/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}Params = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}Props = RootAttrs & {{name.pascalCase}}Params

preview/.templates/module/{{name.kebabCase}}/{{name.kebabCase}}.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}Props } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение компонента {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}} = (props: {{name.pascalCase}}Props) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/screen/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}}Screen } from './{{name.kebabCase}}.screen'

preview/.templates/screen/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/screen/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры экрана {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}ScreenParams = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}ScreenProps = RootAttrs & {{name.pascalCase}}ScreenParams

preview/.templates/screen/{{name.kebabCase}}/{{name.kebabCase}}.screen.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}ScreenProps } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение экрана {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}}Screen = (props: {{name.pascalCase}}ScreenProps) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/store/{{name.kebabCase}}/index.ts

@@ -0,0 +1,2 @@
+export { use{{name.pascalCase}}Store } from './{{name.kebabCase}}.store'
+export type { {{name.pascalCase}}State } from './{{name.kebabCase}}.type'

preview/.templates/store/{{name.kebabCase}}/{{name.kebabCase}}.store.ts

@@ -0,0 +1,9 @@
+import { create } from 'zustand'
+import type { {{name.pascalCase}}State } from './{{name.kebabCase}}.type'
+
+/**
+ * Стор {{name.pascalCase}}.
+ */
+export const use{{name.pascalCase}}Store = create<{{name.pascalCase}}State>()(() => ({
+
+}))

preview/.templates/store/{{name.kebabCase}}/{{name.kebabCase}}.type.ts

@@ -0,0 +1,6 @@
+/**
+ * Состояние {{name.pascalCase}}.
+ */
+export interface {{name.pascalCase}}State {
+
+}

preview/.templates/ui/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}} } from './{{name.kebabCase}}.ui'

preview/.templates/ui/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/ui/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}Params = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}Props = RootAttrs & {{name.pascalCase}}Params

preview/.templates/ui/{{name.kebabCase}}/{{name.kebabCase}}.ui.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}Props } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение компонента {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}} = (props: {{name.pascalCase}}Props) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}

preview/.templates/widget/{{name.kebabCase}}/index.ts

@@ -0,0 +1 @@
+export { {{name.pascalCase}}Widget } from './{{name.kebabCase}}.widget'

preview/.templates/widget/{{name.kebabCase}}/styles/{{name.kebabCase}}.module.css

@@ -0,0 +1,2 @@
+.root {
+}

preview/.templates/widget/{{name.kebabCase}}/types/{{name.kebabCase}}.type.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react'
+
+/**
+ * Параметры виджета {{name.pascalCase}}.
+ */
+export type {{name.pascalCase}}WidgetParams = {}
+
+/** HTML-атрибуты корневого элемента. */
+type RootAttrs = HTMLAttributes<HTMLDivElement>
+
+export type {{name.pascalCase}}WidgetProps = RootAttrs & {{name.pascalCase}}WidgetParams

preview/.templates/widget/{{name.kebabCase}}/{{name.kebabCase}}.widget.tsx

@@ -0,0 +1,20 @@
+import cl from 'clsx'
+import type { {{name.pascalCase}}WidgetProps } from './types/{{name.kebabCase}}.type'
+import styles from './styles/{{name.kebabCase}}.module.css'
+
+/**
+ * <Назначение виджета {{name.pascalCase}} в 1 строке>.
+ *
+ * Используется для:
+ *  - <сценарий 1>
+ *  - <сценарий 2>
+ */
+export const {{name.pascalCase}}Widget = (props: {{name.pascalCase}}WidgetProps) => {
+  const { children, className, ...htmlAttr } = props
+
+  return (
+    <div {...htmlAttr} className={cl(styles.root, className)}>
+      {children}
+    </div>
+  )
+}