@cyber-harbour/ui 1.0.74 → 1.0.76

package/README.md

@@ -66,3 +66,79 @@ The project uses various optimizations for efficient building:
 - Inline source maps for easier debugging
 - No minification for faster builds
 - No type generation for speed
+
+## UI Library Switch Tool
+
+Цей інструмент дозволяє легко перемикатися між локальною версією UI бібліотеки та версією з NPM.
+
+### Використання
+
+#### Варіант 1: Через npx (рекомендований)
+
+```bash
+npx @cyber-harbour/ui switch-ui-lib
+```
+
+#### Варіант 2: Через npm скрипт
+
+Додайте скрипт в package.json вашого проекту:
+
+```json
+{
+  "scripts": {
+    "switch-ui": "npx @cyber-harbour/ui switch-ui-lib"
+  }
+}
+```
+
+Потім запускайте:
+
+```bash
+npm run switch-ui
+```
+
+### Налаштування
+
+#### Змінні середовища
+
+Створіть файл `.env` або `.env.local` в корені вашого проекту:
+
+```bash
+UI_LIBRARY_PATH=/path/to/your/ui-kit
+```
+
+Якщо змінна не встановлена, скрипт спробує знайти UI бібліотеку в папці `ui-kit` поруч з вашим проектом.
+
+#### Структура проектів
+
+Рекомендована структура:
+
+```
+projects/
+├── ui-kit/          # UI бібліотека
+├── my-app/          # Ваш проект
+└── another-app/     # Інший проект
+```
+
+### Що робить скрипт
+
+#### Локальна версія
+
+- Видаляє NPM версію пакету
+- Створює npm link для React та React DOM
+- Створює глобальний link для UI бібліотеки
+- Підключає локальну версію через npm link
+
+#### NPM версія
+
+- Видаляє всі npm links
+- Встановлює останню версію з NPM
+
+### Залежності
+
+Скрипт потребує:
+
+- `prompts` - для інтерактивного вибору
+- `dotenv` - для читання змінних середовища (опційно)
+
+Ці пакети автоматично встановлюються разом з UI бібліотекою.

package/bin/switch-ui-lib.js

@@ -0,0 +1,196 @@
+#!/usr/bin/env node
+
+const prompts = require('prompts');
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+
+// Load .env and .env.local files from current working directory
+try {
+  require('dotenv').config({ path: path.join(process.cwd(), '.env') });
+  require('dotenv').config({ path: path.join(process.cwd(), '.env.local'), override: true });
+} catch (error) {
+  // dotenv might not be available in the consuming project
+  console.log('💡 Для кращої роботи встановіть dotenv: npm install --save-dev dotenv');
+}
+
+const packageName = '@cyber-harbour/ui';
+
+function findProjectRoot() {
+  let currentDir = process.cwd();
+
+  while (currentDir !== path.dirname(currentDir)) {
+    const packageJsonPath = path.join(currentDir, 'package.json');
+    if (fs.existsSync(packageJsonPath)) {
+      return currentDir;
+    }
+    currentDir = path.dirname(currentDir);
+  }
+
+  return process.cwd();
+}
+
+function getLocalPath() {
+  // Спочатку перевіряємо змінну середовища
+  if (process.env.UI_LIBRARY_PATH) {
+    return process.env.UI_LIBRARY_PATH;
+  }
+
+  // Якщо змінної немає, пропонуємо стандартний шлях
+  const projectRoot = findProjectRoot();
+  const parentDir = path.dirname(projectRoot);
+  const defaultPath = path.join(parentDir, 'ui-kit');
+
+  return defaultPath;
+}
+
+const projectRoot = findProjectRoot();
+const localPath = getLocalPath();
+const pkgPath = path.resolve(projectRoot, `node_modules/${packageName}/package.json`);
+
+function isUsingLocalVersion() {
+  try {
+    const realPath = fs.realpathSync(pkgPath);
+    return realPath.startsWith(path.resolve(localPath));
+  } catch {
+    return false;
+  }
+}
+
+function isUsingNpmVersion() {
+  try {
+    const realPath = fs.realpathSync(pkgPath);
+    return !realPath.includes('..') && realPath.includes('node_modules');
+  } catch {
+    return false;
+  }
+}
+
+function checkLocalPathExists() {
+  if (!fs.existsSync(localPath)) {
+    console.log(`⚠️  Локальний шлях не знайдено: ${localPath}`);
+    console.log('💡 Встановіть змінну середовища UI_LIBRARY_PATH або перевірте шлях');
+    return false;
+  }
+
+  const localPackageJson = path.join(localPath, 'package.json');
+  if (!fs.existsSync(localPackageJson)) {
+    console.log(`⚠️  package.json не знайдено в: ${localPath}`);
+    return false;
+  }
+
+  return true;
+}
+
+async function main() {
+  console.log(`🏠 Проект: ${projectRoot}`);
+  console.log(`📦 Пакет: ${packageName}`);
+  console.log(`🔧 Локальний шлях: ${localPath}`);
+  console.log('');
+
+  const response = await prompts({
+    type: 'select',
+    name: 'mode',
+    message: 'Що підключити?',
+    choices: [
+      { title: `Локальну бібліотеку (${localPath})`, value: 'local' },
+      { title: 'Публічну версію з NPM', value: 'npm' },
+    ],
+  });
+
+  const { mode } = response;
+
+  if (mode === 'local') {
+    if (!checkLocalPathExists()) {
+      return;
+    }
+
+    if (isUsingLocalVersion()) {
+      console.log('✅ Вже підключено локально.');
+      return;
+    }
+
+    try {
+      // Спочатку видаляємо існуючий пакет
+      console.log('🔄 Видаляємо існуючий пакет...');
+      try {
+        execSync(`npm uninstall ${packageName}`, { stdio: 'inherit', cwd: projectRoot });
+      } catch {
+        // Ігноруємо помилку якщо пакет не встановлений
+      }
+
+      // Копіюємо React і React DOM з основного проекту в UI бібліотеку
+      console.log('🔄 Копіюємо React в UI бібліотеку...');
+      try {
+        execSync('npm link react react-dom', {
+          stdio: 'inherit',
+          cwd: localPath,
+        });
+      } catch (error) {
+        console.log("⚠️  Не вдалося зв'язати React (це може бути нормально)");
+      }
+
+      // Створюємо глобальний лінк в локальній бібліотеці
+      console.log('🔄 Створюємо глобальний лінк...');
+      execSync('npm link', {
+        stdio: 'inherit',
+        cwd: localPath,
+      });
+
+      // Лінкуємо локальну бібліотеку до проекту
+      console.log('🔄 Підключаємо локальну версію...');
+      execSync(`npm link ${packageName}`, { stdio: 'inherit', cwd: projectRoot });
+
+      console.log('✅ Успішно підключено локальну версію через npm link.');
+    } catch (error) {
+      console.error('❌ Помилка при підключенні локальної версії:', error.message);
+    }
+  }
+
+  if (mode === 'npm') {
+    if (isUsingNpmVersion()) {
+      console.log('✅ Вже використовується версія з NPM.');
+      return;
+    }
+
+    try {
+      // Видаляємо лінк якщо він існує
+      console.log('🔄 Видаляємо лінки...');
+      try {
+        execSync(`npm unlink ${packageName}`, { stdio: 'inherit', cwd: projectRoot });
+      } catch {
+        // Ігноруємо помилку якщо лінк не існує
+      }
+
+      // Видаляємо лінк React з UI бібліотеки
+      if (checkLocalPathExists()) {
+        console.log('🔄 Видаляємо React лінки з UI бібліотеки...');
+        try {
+          execSync('npm unlink react react-dom', {
+            stdio: 'inherit',
+            cwd: localPath,
+          });
+        } catch {
+          // Ігноруємо помилку якщо лінк не існує
+        }
+      }
+
+      // Встановлюємо пакет з NPM
+      console.log('🔄 Встановлюємо версію з NPM...');
+      execSync(`npm install ${packageName}`, { stdio: 'inherit', cwd: projectRoot });
+      console.log('✅ Успішно підключено версію з NPM.');
+    } catch (error) {
+      console.error('❌ Помилка при підключенні версії з NPM:', error.message);
+    }
+  }
+}
+
+// Перевіряємо чи prompts доступний
+try {
+  require.resolve('prompts');
+  main().catch(console.error);
+} catch (error) {
+  console.error('❌ Помилка: пакет "prompts" не знайдено.');
+  console.log('💡 Встановіть prompts: npm install --save-dev prompts');
+  process.exit(1);
+}

package/dist/index.d.mts

@@ -2,6 +2,7 @@ import * as react from 'react';
 import react__default, { SVGProps, CSSProperties as CSSProperties$1, ElementType, InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
 import * as styled_components from 'styled-components';
 import { CSSProperties, DefaultTheme } from 'styled-components';
+export { ServerStyleSheet, StyleSheetManager } from 'styled-components';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import { DefaultTheme as DefaultTheme$1 } from 'styled-components/dist/types';
 import * as react_jsx_runtime from 'react/jsx-runtime';

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import * as react from 'react';
 import react__default, { SVGProps, CSSProperties as CSSProperties$1, ElementType, InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
 import * as styled_components from 'styled-components';
 import { CSSProperties, DefaultTheme } from 'styled-components';
+export { ServerStyleSheet, StyleSheetManager } from 'styled-components';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import { DefaultTheme as DefaultTheme$1 } from 'styled-components/dist/types';
 import * as react_jsx_runtime from 'react/jsx-runtime';